aiot-app/pages/home/pages/manage/components/purchaseScreen.vue

<template>
	<view>
		<u-popup :show="show" closeOnClickOverlay mode="top" @close="closePopup">
			<view class="search_list">
				<u-form labelPosition="left" :model="form" labelWidth="180" labelAlign="left" class="baseForm">
					<u-form-item label="创建时间:" class="required-form" borderBottom prop="rangeDate">
						<uni-datetime-picker v-model="rangeDate" :border="true" :icon="false" type="daterange" />
					</u-form-item>
					<u-form-item label="订单类型:" class="required-form" borderBottom prop="sourceType">
						<zxz-uni-data-select :localdata="requirementSourceType" v-model="form.sourceType" dataValue='value'
							dataKey="text" filterable format='{text}'></zxz-uni-data-select>
					</u-form-item>
					<u-form-item label="订单进度:" class="required-form" borderBottom prop="progress">
						<zxz-uni-data-select :localdata="purchaseOrderProgressStatusEnum" v-model="form.progress" dataValue='value'
							dataKey="label" filterable format='{label}'></zxz-uni-data-select>
					</u-form-item>
					<u-form-item label="审核状态:" class="required-form" borderBottom prop="orderStatus">
						<zxz-uni-data-select :localdata="reviewStatusEnum" v-model="form.orderStatus" dataValue='value'
							dataKey="label" filterable format='{label}'></zxz-uni-data-select>
					</u-form-item>
				</u-form>
			</view>
			<view class="operate_box rx-bc">
				<u-button size="small" class="u-reset-button" @click="reset">
					重置
				</u-button>
				<u-button type="success" size="small" class="u-reset-button" @click="submit">
					确定
				</u-button>
			</view>
		</u-popup>
	</view>
</template>

<script>
	import {
		getWarehouseList,
		getProduceTreeByPid
	} from '@/api/warehouseManagement'
	import {
		post,
		get
	} from '@/utils/api.js'
	import DictSelection from "@/components/Dict/DictSelection.vue";
	import dictMxins from "@/mixins/dictMixins";
	import { requirementSourceType, purchaseOrderProgressStatusEnum, reviewStatusEnum } from '@/enum/dict.js'
	export default {
		mixins: [dictMxins],
		components: {
			DictSelection
		},
		props: ['type', 'createTimeStart', 'createTimeEnd', 'sourceType',  'progress', 'orderStatus'],

		data() {
			return {
				show: false,
				rangeDate: [],
				form: {
					createTimeStart: '',
					createTimeEnd: '',
					sourceType: '',
					progress: '',
					orderStatus: ''
				},
				requirementSourceType,
				purchaseOrderProgressStatusEnum,
				reviewStatusEnum
			}
		},
		created() {
	
		},
		methods: {
			open() {
				this.show = true
				for (let key of Object.keys(this.form)) {
					this.form[key] = this[key]
				}

				// if(this.createTimeStart && this.createTimeEnd) {
				this.rangeDate = [this.createTimeStart, this.createTimeEnd]
				// } else {
				// 	this.setDefaultRangeDate()
				// }
			},
			setDefaultRangeDate() {
				const now = new Date()
				const year = now.getFullYear()
				const month = String(now.getMonth() + 1).padStart(2, '0')
				const day = String(now.getDate()).padStart(2, '0')
				const today = `${year}-${month}-${day}`
				if (this.type === 'year') {
					this.rangeDate = [`${year}-01-01`, today]
				} else if (this.type === 'month') {
					this.rangeDate = [`${year}-${month}-01`, today]
				}
			},
			closePopup() {
				this.show = false
			},
			reset() {
				this.form = {
					createTimeStart: '',
					createTimeEnd: '',
					sourceType: '',
					progress: '',
					orderStatus: ''
				}
				this.rangeDate = [],
				this.$emit('succeed', this.form)
				this.closePopup()
			},
			submit() {
				if(this.rangeDate.length) {
					this.form.createTimeStart = this.rangeDate[0]
					this.form.createTimeEnd = this.rangeDate[1]
				}
				this.$emit('succeed', this.form)
				this.closePopup()
			},
		}
	}
</script>

<style lang="scss" scoped>
	.search_list {
		min-height: 100rpx;

		/deep/ .baseForm {
			padding: 0 20rpx;
		}
	}

	.operate_box {
		padding: 10rpx 32rpx;

		/deep/ .u-button {
			width: 40%;
		}
	}
</style>