<template>
	<app-search-popup @reset="fnReset" @search="fnSearch">
		<u-form label-position="top" label-width="auto" :model="form">
			<u-form-item label="隐患级别" prop="HIDDENLEVEL">
				<view class="flex-start">
					<u-radio-group v-model="form.HIDDENLEVEL">
						<u-radio
							v-for="(item, index) in hiddenLevelList"
							:key="index"
							:label="item.name"
							:name="item.id"
						>
						</u-radio>
					</u-radio-group>
				</view>
			</u-form-item>
			<u-line />
			<app-time
				:model-value="form.STARTTIME"
				label="开始时间"
				prop="STARTTIME"
				mode="date"
				:required="false"
				@fn-confirm-emit="fnConfirmEmit('STARTTIME', $event)"
			/>
			<app-time
				:model-value="form.ENDTIME"
				label="结束时间"
				prop="ENDTIME"
				:required="false"
				mode="date"
				@fn-confirm-emit="fnConfirmEmit('ENDTIME', $event)"
			/>
			<u-form-item label="隐患状态" prop="STATE">
				<view class="flex-start">
					<u-radio-group v-model="form.STATE">
						<u-radio
							v-for="(item, index) in hiddenStateList"
							:key="index"
							:label="item.name"
							:name="item.id"
						>
						</u-radio>
					</u-radio-group>
				</view>
			</u-form-item>
			<u-line />
		</u-form>
	</app-search-popup>
</template>

<script>
import AppTime from "@/components/time/index.vue";
import dayjs from "dayjs";
import AppSearchPopup from "@/components/searchPopup/index.vue";

export default {
	components: { AppTime, AppSearchPopup },

	props: {
		form: {
			type: Object,
			required: true,
		},
	},

	data() {
		return {
			hiddenLevelList: [
				{ id: "hiddenLevel0001", name: "一般隐患" },
				{ id: "hiddenLevel0002", name: "重大隐患" },
			],
			hiddenStateList: [
				{ id: "1", name: "未整改" },
				{ id: "3", name: "已整改" },
				{ id: "4", name: "已验收" },
				{ id: "-1", name: "已过期" },
			],
		};
	},

	methods: {
		fnReset() {
			for (let valueKey in this.form) {
				this.form[valueKey] = "";
			}
		},
		fnSearch() {
			this.$emit("search", this.form);
		},
		fnConfirmEmit(field, { mode, value }) {
			let formattedValue;
			if (mode === "datetime") {
				formattedValue = dayjs(value).format("YYYY-MM-DD HH:mm");
			} else if (mode === "date") {
				formattedValue = dayjs(value).format("YYYY-MM-DD");
			} else if (mode === "year-month") {
				formattedValue = dayjs(value).format("YYYY-MM");
			}
			this.$emit("update-time", { field, value: formattedValue });
		},
	},
};
</script>

<style lang="scss" scoped>
.u-radio {
	margin: 10rpx 0 10rpx 0;
}

.u-radio-group--row {
	flex-flow: row wrap;
}
</style>
