<template>
  <BasicModal
    v-bind="$attrs"
    @register="register"
    :centered="true"
    title="流程审批"
    destroyOnClose 
    width="50%"
    @cancel="handleCancel"
    :helpMessage="['帮助']"
    @ok="saveApprove"
  >
    <BasicForm @register="registerForm" style="margin: 0px 0px 0 0px" />
  </BasicModal>
</template>
<script lang="ts" setup>
  import { ref, reactive,nextTick } from 'vue'
  import { useForm, BasicForm, FormSchema } from '/@/components/Form'
  import { BasicModal, useModalInner } from '/@/components/Modal'
  import { complete, getNextFlowNode,getNextFlowNodeType} from "/@/components/Process/api/todo"
  const taskId = ref();
  const flowTodoTask = ref({})
  const isFixed = ref(true)
  const [register, { closeModal, setModalProps }] = useModalInner(async (data) => {
    taskId.value = data.data.taskId
    const params = { taskId: taskId.value }
    flowTodoTask.value = data.data
    await removeApprovl();
    //await setNextNode(params)
  });


  const formSchemas: FormSchema[] = [
    {
      label: '审批意见',
      field: 'comment',
      component:'InputTextArea',
      required:true,
      componentProps:{
        allowClear: true,
        showCount: true,
        autoSize:{
          minRows: 4,
          maxRows: 10
        },
      }
    },
    {
      label: '接收人',
      field: 'approval',
      component: 'JSelectUser',
      required:true,
      componentProps: {
        allowClear: true,
        rowKey: 'username',
        labelKey: 'realname',
        showButton: false,
        modalTitle: '用户',
      },
    },
    {
        label: '接收角色',
        field: 'approval',
        component: 'RoleSelect',
        required:true,
        componentProps: {
          allowClear: true,
          maxSelectCount: 3,
          isRadioSelection: false
        },
      }
  ];

  const [registerForm, { setProps, validate,removeSchemaByFiled,updateSchema,appendSchemaByField }] = useForm({
    schemas: formSchemas,
    showActionButtonGroup: false,
    baseColProps: { span: 24 },
  });

  const handleCancel = ()=> {
    closeModal();
  }


  const setNextNode = async (params) => {
    getNextFlowNode(params).then(async (res) => {
      const data = res
      if (data) {
        if (data.dataType === 'dynamic') {
          if (data.type === 'assignee') {
            removeSchemaByFiled("checkSendRole")
          } else if (data.type === 'candidateUsers') {

          } else if (data.type === 'candidateGroups') {
            removeSchemaByFiled("checkSendUser")
          } else {
           
          }
        } else {
          //removeSchemaByFiled(["checkSendRole","checkSendUser"])
          saveApprove();
        }
      } else {
        alert("没有下一个节点")
      }
    })
  }


  const saveApprove = async () => {

      const formDataTmp = await validate();
      formDataTmp["instanceId"] = flowTodoTask.value.procInsId
      formDataTmp["deployId"] = flowTodoTask.value.deployId
      formDataTmp["taskId"] = flowTodoTask.value.taskId

      await complete(formDataTmp).then(res => {
        closeModal()
      });
      
  }

  async function addRoleField() {
    await appendSchemaByField(
      {
        label: '接收角色',
        field: 'checkSendRole',
        component: 'RoleSelect',
        required:true,
        componentProps: {
          allowClear: true,
          maxSelectCount: 3,
          isRadioSelection: false
        },
      },'');
  }

  async function addUserField() {
    await appendSchemaByField({
      label: '接收人',
      field: 'checkSendUser',
      component: 'JSelectUser',
      required:false,
      componentProps: {
        allowClear: true,
        rowKey: 'username',
        labelKey: 'realname',
        showButton: false,
        modalTitle: '用户',
      },
    }, '');
  }

  const removeApprovl = async ()=> {
    const isApproval = await getNextFlowNodeType({
      taskId:taskId.value
    })
    if(!isApproval) {
      removeSchemaByFiled("comment")
    }
  }


</script>

<style scoped>
</style>
