<template>
  <BasicModal v-if="!confirmFlag" v-bind="$attrs" @register="registerModal" destroyOnClose :title="title" :width="800" @ok="handleSubmit">
      <!--<BasicForm @register="registerForm"/>-->
      <template #default>
      <a-form
      ref="formRef"
      name="advanced_search"
      class="ant-advanced-search-form"
      :labelCol="{xs: {span: 24},sm: {span: 3},}"
      :wrapperCol="{xs: {span: 24},sm: {span: 21},}"
      :model="formModal"
      :rules="rules"
    >
      <a-row :gutter="24">
        <a-col>
          <a-form-item label="控制活动" name="caName">
            <a-input v-model:value="formModal.caName" :disabled="true" />
          </a-form-item>
        </a-col>
      </a-row>
      <a-row :gutter="24">
        <a-col>
          <a-form-item label="检查内容" name="checkCountent">
            <a-textarea v-model:value="formModal.checkCountent" :disabled="true" />
          </a-form-item>
        </a-col>
      </a-row>
      <a-row :gutter="24">
        <a-col>
          <a-form-item label="检查依据" name="">
            <template v-for="item in formModal.stComplianeInfos">
            <JEllipsisFormat :isLink="true"  :value="item.fileName" :length="60" @click="goToFile(item.fileUploadPath)"/>
            </template>
          </a-form-item>
        </a-col>
      </a-row>
      <a-row :gutter="24">
        <a-col>
          <a-form-item label="现状描述" name="execContent"  >
            <a-textarea v-model:value="formModal.execContent" :disabled="true"/>
          </a-form-item>
        </a-col>
      </a-row>
      <a-row :gutter="24">
        <a-col >
          <a-form-item label="问题项" name="problemItem"  >
            <a-textarea v-model:value="formModal.problemItem" :disabled="true"/>
          </a-form-item>
        </a-col>

      </a-row>
      <a-row :gutter="24">
        <a-col>
          <a-form-item label="问题描述" name="problemExample"  >
            <a-textarea v-model:value="formModal.problemExample" :disabled="true"/>
          </a-form-item>
        </a-col>
      </a-row>
      
      <a-row :gutter="24">
        <a-col :span="12">
          <a-form-item label="问题严重程度" name="severity"         
          :labelCol="{xs: {span: 24},sm: {span: 6},}"
           :wrapperCol="{xs: {span: 24},sm: {span: 18},}"  
          :rules="[{ required: isUpdate, message: '请选择问题严重程度!' }]" >
            <a-select placeholder="请选择" v-model:value="formModal.severity" :disabled="!isUpdate">
              <a-select-option value="非常严重">非常严重</a-select-option>
              <a-select-option value="严重">严重</a-select-option>
              <a-select-option value="一般">一般</a-select-option>
              <a-select-option value="不严重">不严重</a-select-option>
            </a-select>
          </a-form-item>
        </a-col>
        <a-col :span="12">
          <a-form-item label="整改优先级" name="adviceLevel"          
          :labelCol="{xs: {span: 24},sm: {span: 6},}"
           :wrapperCol="{xs: {span: 24},sm: {span: 18},}"  
          :rules="[{ required: isUpdate, message: '请选择整改优先级!' }]" >
            <a-select placeholder="请选择" v-model:value="formModal.adviceLevel" :disabled="!isUpdate">
              <a-select-option value="低">低</a-select-option>
              <a-select-option value="中">中</a-select-option>
              <a-select-option value="高">高</a-select-option>
            </a-select>
          </a-form-item>
        </a-col>
      </a-row>
      <a-row :gutter="24">
        <a-col>
      <a-form-item label="整改建议" name="adviceAdvice" :rules="[{ required: isUpdate, message: '请选择整改建议!' }]">
            <a-textarea v-model:value="formModal.adviceAdvice" :disabled="!isUpdate" />
          </a-form-item>
        </a-col>
      </a-row>
    </a-form>
    </template>
  </BasicModal>
</template>

<script lang="ts" setup>
    import { message, type FormInstance } from 'ant-design-vue';
import type { Rule } from 'ant-design-vue/es/form';
import { computed, inject, ref, unref } from 'vue';
import { saveOrUpdate,list} from '../StProjectExecFive.api';
import { JSearchSelect, JSearchSelectDuty, JSelectDept } from '/@/components/Form';
import JUpload from '/@/components/Form/src/jeecg/components/JUpload/JUpload.vue';
import { BasicModal, useModal, useModalInner } from '/@/components/Modal';
import {defHttp} from '/@/utils/http/axios';
import JEllipsisFormat from './JEllipsisFormat.vue';
import { downloadFile } from '/@/utils/common/renderUtils';
const dayjs = inject('$dayjs')
const isDetail = ref(false)

function goToFile(fileUploadPath){
  if(fileUploadPath){
    downloadFile(fileUploadPath);
  }else{
    message.warning("无附件");
  }
}
const formRef = ref<FormInstance>();
const formModal = ref({
  caName: null,
  checkCountent: null,
  checkDoc: null,
  execContent: null,
  problemTitle: null,
  problemContent: null,
  damageLevel: null,
  damageScore: null,
  confirmDepCode: null,
  confirmUser: null,
  trueStatus: null,
  execContentDes: null,
  fileUploadPathDes: null,
  severity: null,
  adviceLevel: null,
  adviceAdvice: null,
  id:null
})
const rules: Record<string, Rule[]> = {
  confirmDepCode: [{ required: true, message: '请选择', trigger: 'blur' },],
  confirmUser: [{ required: true, message: '请选择', trigger: 'blur' },],
}
    // Emits声明
    const emit = defineEmits(['register','success']);
    const isUpdate = ref(true);
    const confirmFlag = ref(false);
    const adviceFlag = ref(false);
    const editFlag = ref(false);
    function confirmDepCodeChange(data){
      if(!data || data.length==0){
        formModal.value.confirmDepCode = ''
      }
      if(formModal.value.confirmDepCode!=confirmDepCodeRecord.value){
        confirmDepCodeRecord.value = data[0]
        formModal.value.approveUser = ''
      }
    }
    function jSearchSelectDutyClick(v){
      if(v == 'confirmDepCode' && !formModal.value.confirmDepCode){
        formModal.value.confirmDepCode = ''
        message.warning("请先选择确认部门")
        return
      }
    }
    const confirmDepCodeRecord = ref('')
    //表单赋值
    const [registerModal, {setModalProps, closeModal}] = useModalInner(async (data) => {
        //重置表单
        //await resetFields();
        setModalProps({confirmLoading: false,showCancelBtn:!!data?.showFooter,showOkBtn:!!data?.showFooter});
        isUpdate.value = !!data?.isUpdate;
        isDetail.value = !data?.showFooter;
        confirmFlag.value=data?.confirmFlag;
        adviceFlag.value=data?.adviceFlag;
        editFlag.value=data?.editFlag;
                    confirmDepCodeRecord.value = data.record.confirmDepCode

        initFormModal("1")
        formModal.value = Object.assign(formModal.value,data.record)
    });
    async function handleSuccess(){
      let values = Object.assign({id:formModal.value.id});
      const formData = await list(values);
      console.log(formData);
      const data = {...formData.records}
      formModal.value=data[0];
    }
    function initFormModal(creType){
      for(let k in formModal.value){
        formModal.value[k] = null
      }
      formModal.value['creType'] = creType
      formModal.value['approveFlag'] = '0'
    }
    function creTypeChange(e){
      if(e.target.value == "0"){
        initFormModal(e.target.value);
      }
    }
    //设置标题
    const title = computed(() => 
    (unref(isUpdate) ? '整改建议': '查看建议'));
    //表单提交事件
    async function handleSubmit(v) {
        try {
            let values = await formRef.value.validate();
            setModalProps({confirmLoading: true});
            values = Object.assign(values,formModal.value)
            //提交表单
            await saveOrUpdate(values, isUpdate.value);
            //关闭弹窗
            closeModal();
            //刷新列表
            emit('success');
        } finally {
            setModalProps({confirmLoading: false});
        }
    }
</script>

<style lang="less" scoped>
	/** 时间和数字输入框样式 */
  :deep(.ant-input-number){
		width: 100%
	}

	:deep(.ant-calendar-picker){
		width: 100%
	}
</style>