<template>
  <div>
    <BasicModal
      destroyOnClose
      v-bind="$attrs"
      width="30rem"
      @register="register"
      title="添加规则链"
      @ok="handleSuccess"
      @close="handleClose"
    >
      <div>
        <BasicForm @register="registerForm" />
      </div>
    </BasicModal>
  </div>
</template>
<script setup lang="ts">
  import { BasicModal, useModalInner } from '/@/components/Modal';
  import { ExecuteReportRecord } from '/@/api/export/model/exportModel';
  import { useForm, BasicForm } from '/@/components/Form';
  import { formSchema } from './config';
  import { createRuleChine } from '/@/api/ruleengine/ruleengineApi';
  import { useMessage } from '/@/hooks/web/useMessage';

  const emit = defineEmits(['register', 'success']);

  const { createMessage } = useMessage();

  const [registerForm, { getFieldsValue, validate }] = useForm({
    labelWidth: 120,
    schemas: formSchema,
    showActionButtonGroup: false,
  });

  const [register, { setModalProps, closeModal }] = useModalInner(
    async (data: { record: ExecuteReportRecord }) => {
      setModalProps({ loading: true });
      console.log(data, 'record');
    }
  );

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

  const handleSuccess = async () => {
    console.log(1, '1', getFieldsValue());
    await validate();
    const record = getFieldsValue();
    const { description, debugMode, name } = record;
    const form = {
      additionalInfo: {
        description,
      },
      debugMode,
      name,
      type: 'CORE',
    };

    await createRuleChine(form);
    createMessage.success('添加成功');
    handleClose();
    emit('success');
  };
</script>
<style lang="less" scoped></style>