<script name="implementPlanDialog" setup>
import { getCurrentInstance, nextTick, ref, watch } from 'vue'
import { operationDetail, pushOperation } from '@/http/apis/declareMange/purchaseResults'
import { projectDetail } from '@/http/apis/projectStoreManage/projectStore'

const { proxy } = getCurrentInstance(),
  props = defineProps({
    visible: {
      type: Boolean,
      default: false
    },
    data: {
      type: Object,
      default: () => {}
    }
  }),
  emits = defineEmits(['close']),
  formData = ref({}),
  formRef = ref(),
  validatorTime1 = (rule, value, callback) => {
    if (new Date(value).getTime() >= new Date(formData.value.finalInspectionDate).getTime()) {
      return callback(new Error('项目开工时间必须在项目终验时间之前'))
    } else if (new Date(value).getTime() >= new Date(formData.value.initialInspectionDate).getTime()) {
      return callback(new Error('项目开工时间必须在项目初验时间之前'))
    } else if (new Date(value).getTime() >= new Date(formData.value.startTrialOperationDate).getTime()) {
      return callback(new Error('项目开工时间必须在项目试运行开始时间之前'))
    } else {
      return callback()
    }
  },
  validatorTime2 = (rule, value, callback) => {
    if (new Date(value).getTime() <= new Date(formData.value.projectStartDate).getTime()) {
      return callback(new Error('项目初验时间必须在项目开工时间之后'))
    } else if (new Date(value).getTime() >= new Date(formData.value.startTrialOperationDate).getTime()) {
      return callback(new Error('项目初验时间必须在项目试运行开始时间之前'))
    } else if (new Date(value).getTime() >= new Date(formData.value.finalInspectionDate).getTime()) {
      return callback(new Error('项目初验时间必须在项目终验时间之前'))
    } else {
      return callback()
    }
  },
  validatorTime3 = (rule, value, callback) => {
    if (new Date(value).getTime() <= new Date(formData.value.projectStartDate).getTime()) {
      return callback(new Error('项目试运行开始时间必须在项目开工时间之后'))
    } else if (new Date(value).getTime() <= new Date(formData.value.initialInspectionDate).getTime()) {
      return callback(new Error('项目试运行开始时间必须在项目初验时间之后'))
    } else if (new Date(value).getTime() >= new Date(formData.value.finalInspectionDate).getTime()) {
      return callback(new Error('项目初验时间必须在项目终验时间之前'))
    } else {
      return callback()
    }
  },
  rules = {
    projectStartDate: [{ required: true, message: '请输入' }, { validator: validatorTime1 }],
    initialInspectionDate: [{ required: true, message: '请选择' }, { validator: validatorTime2 }],
    startTrialOperationDate: [{ required: true, message: '请选择' }, { validator: validatorTime3 }],
    finalInspectionDate: [{ required: true, message: '请选择' }]
  },
  loading = ref(false),
  submit = async (formEl) => {
    if (!formEl) return
    await formEl.validate(async valid => {
      if (valid) {
        loading.value = true
        try {
          const postData = {
            ...formData.value,
            projectId: props.data.id
          }
          await pushOperation(postData)
          proxy.$message.success('提交成功！')
          loading.value = false
          emits('close', true)
        } catch (e) {
          loading.value = false
        }
      }
    })
  }
watch(
  () => props.visible,
  async val => {
    if (val) {
      await nextTick()
      formRef.value.clearValidate()
      const detail = await projectDetail(props.data.id)
      const res = await operationDetail(props.data.id)
      formData.value = res?.data ? {
        ...res.data,
        finalInspectionDate: detail.data.planAcceptanceTime
      } : {
        finalInspectionDate: detail.data.planAcceptanceTime
      }
    }
  }
)
defineExpose({ formRef })
</script>

<template>
  <el-dialog :model-value="visible" title="填写实施计划" @close="emits('close')">
    <el-form
      ref="formRef"
      :model="formData"
      :rules="rules"
      label-suffix="："
      label-width="140"
    >
      <el-form-item label="项目开工时间" prop="projectStartDate">
        <el-date-picker
          v-model="formData.projectStartDate"
          type="date"
          format="YYYY-MM-DD"
          value-format="YYYY-MM-DD HH:mm:ss"
          placeholder="请选择"
        />
      </el-form-item>
      <el-form-item label="项目初验时间" prop="initialInspectionDate">
        <el-date-picker
          v-model="formData.initialInspectionDate"
          type="date"
          format="YYYY-MM-DD"
          value-format="YYYY-MM-DD HH:mm:ss"
          placeholder="请选择"
        />
      </el-form-item>
      <el-form-item label="试运行开始时间" prop="startTrialOperationDate">
        <el-date-picker
          v-model="formData.startTrialOperationDate"
          type="date"
          format="YYYY-MM-DD"
          value-format="YYYY-MM-DD HH:mm:ss"
          placeholder="请选择"
        />
      </el-form-item>
      <el-form-item label="项目终验时间" prop="finalInspectionDate">
        <el-date-picker
          v-model="formData.finalInspectionDate"
          type="date"
          format="YYYY-MM-DD"
          value-format="YYYY-MM-DD HH:mm:ss"
          placeholder="请选择"
          disabled
        />
      </el-form-item>
    </el-form>
    <template #footer>
      <span class="dialog-footer">
        <el-button type="primary" :loading="loading" @click="submit(formRef)">提交</el-button>
        <el-button @click="emits('close')">关闭</el-button>
      </span>
    </template>
  </el-dialog>
</template>
