<!-- 标题与字段布局 -->
<template>
   <a-card  size="small" style="width: 100%; height:100%; font-size: 14px;">
    <BasicForm @register="registerForm" @submit="handleSubmit" style="margin: 10px;width:100%"  />
   </a-card>

</template>

<script lang="ts" setup>
  //引入依赖
  import { getAllActDatas } from '../components/api/AuditAct.api';
  import { getAllProblems,} from '../components/api/AuditProblem.api';
  import { queryAllChecks,} from '../components/api/AuditCheckMethod.api';
  import { useForm, BasicForm, FormSchema } from '/@/components/Form';
  import { VXETable } from 'vxe-table';
  const emit = defineEmits(['query']);

  //自定义表单字段
  const formSchemas: FormSchema[] = [
    {
      label: '标签',
      field: 'labelCodes',
      component: 'StSelectLable',
    },
    {
      label: '领域',
      field: 'domainCodes',
      component: 'JTreeSelect',
      componentProps: {
        dict: "st_domain,domain_name,domain_code",
        pidField: "upper_domain_code",
        pidValue:"0",
        hasChildField:"has_child",
        maxHeight: '165px'
      },
    },
    {
      label: '控制活动',
      field: 'actIds',
      component: 'ApiSelect',
      componentProps: {
        mode: 'multiple',
        api: getAllActDatas,
        labelField: 'caName',
        valueField: 'id',
      },
    },
    {
      label: '问题',
      field: 'problemIds',
      component: 'ApiSelect',
      componentProps: {
        mode: 'multiple',
        api: getAllProblems,
        labelField: 'pbItem',
        valueField: 'id',
      },
    },

    {
      label: '检查点',
      field: 'checkIds',
      component: 'ApiSelect',
      componentProps: {
        mode: 'multiple',
        api: queryAllChecks,
        labelField: 'content',
        valueField: 'id',
      },
    },
   
  ];

  /**
   * BasicForm绑定注册;
   */
  const [registerForm,{setProps,resetFields, setFieldsValue, validate}] = useForm({
    //注册表单列
    schemas: formSchemas,
    showActionButtonGroup: true,
    actionColOptions: { span: 24 },
    layout:'vertical',
    autoSubmitOnEnter: true,
    submitButtonOptions: { text: '提交', preIcon: '' },
    showResetButton: true,
    
  });


  async function handleSubmit() {
    let values = await validate();
    let newData = {}
    let isExist = 0
    if(values["actIds"]) {
      let tmpAry = values["actIds"].split(",")
      newData["actIds"] = tmpAry.map(Number); 
      isExist++;
    }
    if(values["problemIds"]) {
      let tmpAry = values["problemIds"].split(",")
      newData["problemIds"] = tmpAry.map(Number); 
      isExist++;
    }

    if(values["checkIds"]) {
      let tmpAry = values["checkIds"].split(",")
      newData["checkIds"] =tmpAry.map(Number); 
      isExist++;
    }


    if(isExist>0) {
      emit("query",newData);
    } else {
      VXETable.modal.message({ content: '请选择待条件', status: 'warning' });
      return;
    }

  }

  defineExpose({
    handleSubmit,
  });
</script>

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

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