<template>
	<view class="container">
		<view class="card">
			<app-hidden-view :hidden-id="hiddenId" />
			<view class="card">
				<u-form
					ref="formRef"
					label-position="left"
					:model="form"
					:rules="rules"
					label-width="auto"
				>
					<app-time
					:model-value="form.DELAY_TIME"
						label="延期时间"
						prop="DELAY_TIME"
						:min-date="new Date().getTime()"
						@fn-confirm-emit="fnConfirmEmit"
					/>
					<u-form-item
						label="处置方案"
						label-position="top"
						prop="disposalPlan"
						required
					>
						<u-textarea
							v-model="form.disposalPlan"
							placeholder="请输入处置方案"
							border="none"
							auto-height
						/>
					</u-form-item>
					<u-line />
					<view class="mt-10">
						<u-button
							type="primary"
							shape="circle"
							text="提交"
							:throttle-time="1000"
							@click="fnSubmit"
						/>
					</view>
				</u-form>
			</view>
		</view>
	</view>
</template>

<script>
import dayjs from "dayjs";
import AppHiddenView from "@/components/hiddenView/index.vue";
import AppTime from "@/components/time/index.vue";
import useFormValidate from "@/utils/useFormValidate";

export default {
	components: { AppHiddenView, AppTime },

	onLoad(query) {
		this.hiddenId = query.HIDDEN_ID;
	},

	data() {
		return {
			store: this.$store.state,
			hiddenId: "",
			form: {
				DELAY_TIME: "",
				disposalPlan: "",
			},
			rules: {
				DELAY_TIME: {
					type: "string",
					required: true,
					message: "请选择延期时间",
					trigger: ["blur", "change"],
				},
				disposalPlan: {
					type: "string",
					required: true,
					message: "请输入处置方案",
					trigger: ["blur", "change"],
				},
			},
		};
	},

	methods: {
		/** 提交按钮点击事件 */
		async fnSubmit() {
			await useFormValidate(this.$refs.formRef);
			// await setHiddenDelaySubmit({
			// 	loginUserId: userInfo.USER_ID,
			// 	USERNAME: userInfo.NAME,
			// 	HIDDEN_ID: hiddenId.value,
			// 	...form.value,
			// });
			// uni.showToast({
			// 	icon: "none",
			// 	title: "提交成功",
			// });
			// setTimeout(() => {
			// 	uni.navigateBack();
			// }, 1000);
		},
		fnConfirmEmit({ mode, value }) {
			if (mode === "datetime") {
				this.form = {
					...this.form,
					DELAY_TIME: dayjs(value).format("YYYY-MM-DD HH:mm"),
				};
			} else if (mode === "date") {
				this.form = {
					...this.form,
					DELAY_TIME: dayjs(value).format("YYYY-MM-DD"),
				};
			} else if (mode === "year-month") {
				this.form = {
					...this.form,
					DELAY_TIME: dayjs(value).format("YYYY-MM"),
				};
			}
		},
	},
};
</script>
