<template>
  <layout-card>
    <layout-hidden-view :hidden-id="HIDDEN_ID" />
    <el-divider content-position="left">隐患验收</el-divider>
    <el-form
      ref="formRef"
      :model="data.form"
      :rules="rules"
      label-width="100px"
    >
      <el-row>
        <el-col :span="24">
          <el-form-item label="是否合格" prop="ISQUALIFIED">
            <el-radio-group :model-value="data.form.ISQUALIFIED">
              <el-radio label="1">是</el-radio>
              <el-radio label="2">否</el-radio>
            </el-radio-group>
          </el-form-item>
        </el-col>
        <template v-if="data.form.ISQUALIFIED === '1'">
          <el-col :span="24">
            <el-form-item prop="CHECKDESCR" label="验收描述">
              <el-input
                v-model="data.form.CHECKDESCR"
                type="textarea"
                :autosize="{ minRows: 3 }"
              />
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item prop="CHECK_TIME" label="验收时间">
              <el-date-picker
                v-model="data.form.CHECK_TIME"
                type="date"
                value-format="YYYY-MM-DD"
                format="YYYY-MM-DD"
                placeholder="选择日期"
              />
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="验收图片" prop="acceptFile">
              <layout-upload
                v-model:file-list="data.form.acceptFile"
                :limit="4"
                accept=".jpg,.jpeg,.png"
                list-type="picture-card"
              />
            </el-form-item>
          </el-col>
        </template>
      </el-row>
    </el-form>
    <div class="tc mt">
      <el-button type="primary" @click="fnSubmit">提交</el-button>
    </div>
  </layout-card>
</template>

<script setup>
import LayoutHiddenView from "@/components/hidden_view/index.vue";
import { useRoute, useRouter } from "vue-router";
import { reactive, ref } from "vue";
import { debounce } from "throttle-debounce";
import useFormValidate from "@/assets/js/useFormValidate.js";
import { ElMessage } from "element-plus";
import LayoutUpload from "@/components/upload/index.vue";
import { setHiddenDangerAcceptSubmit } from "@/request/hidden_danger_government.js";
import { setUploadImg } from "@/request/api.js";

const route = useRoute();
const router = useRouter();
const { HIDDEN_ID } = route.query;
const formRef = ref(null);
const rules = {
  ISQUALIFIED: [
    { required: true, message: "请选择是否合格", trigger: "change" },
  ],
  CHECKDESCR: [{ required: true, message: "请输入验收描述", trigger: "blur" }],
  CHECK_TIME: [
    { required: true, message: "请选择验收时间", trigger: "change" },
  ],
  acceptFile: [
    { required: true, message: "请上传验收图片", trigger: "change" },
  ],
};
const data = reactive({
  form: {
    ISQUALIFIED: "1",
    CHECKDESCR: "",
    CHECK_TIME: "",
    acceptFile: [],
  },
});
const fnSubmit = debounce(
  1000,
  async () => {
    await useFormValidate(formRef);
    const resData = await setHiddenDangerAcceptSubmit({
      HIDDEN_ID,
      ...data.form,
    });
    for (let i = 0; i < data.form.acceptFile.length; i++) {
      if (data.form.acceptFile[i].raw)
        await fnUploadImage(
          resData.check.HIDDENCHECK_ID,
          data.form.acceptFile[i].raw,
          5
        );
    }
    ElMessage.success("保存成功");
    router.back();
  },
  { atBegin: true }
);
const fnUploadImage = async (HIDDENCHECK_ID, FFILE, TYPE) => {
  const formData = new FormData();
  formData.append("FOREIGN_KEY", HIDDENCHECK_ID);
  formData.append("TYPE", TYPE);
  formData.append("FFILE", FFILE);
  await setUploadImg(formData);
};
</script>

<style scoped lang="scss"></style>
