<template>
  <div>
    <BasicForm @register="register">
      <template #outputParamSlot>
        <CommomParam
          ref="CommomParamInParamRef"
          :isInputParam="true"
          :isExcludeStruct="false"
          :inputParamData="inputParamData"
          @emitAddInParam="handleAddInParam"
          @emitEditInParam="handleEditInParam"
          @emitDeletelnParam="handleDelInParam"
        />
      </template>
    </BasicForm>
    <AddParamsModal @register="registerModal" @data="getData" />
  </div>
</template>
<script lang="ts" setup>
  import { unref } from 'vue';
  import { BasicForm, useForm } from '/@/components/Form';
  import { eventSchemas } from './config';
  import { useModal } from '/@/components/Modal';
  import AddParamsModal from './components/AddParamsModal.vue';
  import CommomParam from './components/CommomParam.vue';
  import useCommon from '../hook/useCommon';
  import useDefineVar from '../hook/useDefineVar';

  const { useGetInOrOutData } = useCommon();

  const { inputParamData, CommomParamInParamRef } = useDefineVar();

  const [registerModal, { openModal }] = useModal();

  const [register, { validate, setFieldsValue, resetFields }] = useForm({
    labelWidth: 100,
    schemas: eventSchemas,
    actionColOptions: {
      span: 14,
    },
    showResetButton: false,
    submitOnReset: false,
    showActionButtonGroup: false,
  });

  const getData = (d, f) => useGetInOrOutData(d, f, unref(inputParamData), []);

  const handleAddInParam = (b, o) => openModal(b, o);

  const handleEditInParam = (b, o) => openModal(b, o);

  const handleDelInParam = (i) => unref(inputParamData).splice(i, 1);

  //回显数据
  const setFormData = (v) => {
    setFieldsValue(v[0]);
    const { outputData } = v[0];
    if (outputData !== undefined) {
      inputParamData.value = [...new Array(outputData.length).keys()] && outputData;
    }
  };

  //获取数据
  const getStructList = () => CommomParamInParamRef.value?.getInputStructList();

  async function getFormData() {
    const values = await validate();
    if (!values) return;
    const outputData = getStructList();
    const { outputParam, ...value } = values;
    const none = [outputParam]; //没用，防止eslint报未使用变量
    console.log(none);
    return {
      ...value,
      ...{ outputData },
    };
  }

  //清空数据
  const resetFormData = () => {
    resetFields();
    inputParamData.value = [];
  };

  defineExpose({
    setFormData,
    resetFormData,
    getFormData,
  });
</script>
<style lang="less" scoped></style>