<template>
  <BasicModal  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 :span="12">
          <a-form-item label="确认部门" name="confirmDepCode" 
          :labelCol="{xs: {span: 24},sm: {span: 6},}"
           :wrapperCol="{xs: {span: 24},sm: {span: 18},}"    
           :rules="[{ required: true, message: '请选择确认部门!' }]" >
            <JSelectDept  placeholder="请选择" v-model:value="formModal.confirmDepCode" :multiple="false" @change="approveDepCodeChange"></JSelectDept>
          </a-form-item>
        </a-col>
        <a-col :span="12">
          <a-form-item label="确认人" name="confirmUser"  
           :labelCol="{xs: {span: 24},sm: {span: 6},}"
           :wrapperCol="{xs: {span: 24},sm: {span: 18},}"    
           :rules="[{ required: true, message: '请选择确认人!' }]">
          <JSearchSelectDuty v-model:value="formModal.confirmUser" dict="listDuty" :dep-code="formModal.confirmDepCode||'nodepCode'" :disabled="isDetail" @click="jSearchSelectDutyClick('confirmDepCode')"/>
          </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 '../StProjectExecFour.api';
import { confirmBatch} from '../StProjectExec.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';

const dayjs = inject('$dayjs')
const isDetail = ref(false)


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,
  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);
     const batchFlag = 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;
        batchFlag.value=data?.batchFlag;
        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(confirmFlag) ? '选择确认人':(unref(editFlag) ?'修改实施发现':(unref(adviceFlag) ?'实施确认' : '查看详情'))));
    //表单提交事件
    async function handleSubmit(v) {
        try {
            let values = await formRef.value.validate();
            setModalProps({confirmLoading: true});
            if(editFlag.value){
                formModal.value.trueStatus=null;
            }
            values = Object.assign(values,formModal.value)
            //提交表单
            if(batchFlag.value){
              await confirmBatch(values);
            }else{
              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>