<template>
  <div>
    <BasicModal
      v-bind="$attrs"
      @register="registerDrawer"
      showFooter
      :title="getTitle"
      width="1000px"
      @ok="handleSubmit"
      @cancel="handleCancel"
    >
      <div class="step-form-form">
        <a-steps :current="current">
          <a-step title="选择转换方式" />
          <a-step title="完善配置参数" />
        </a-steps>
      </div>
      <div>
        <div v-show="current === 0">
          <TransferConfigMode ref="refTransferConfigMode" @next="handleNext"
        /></div>
        <div v-show="current === 1">
          <TransferConfigParams
            ref="refTransferConfigParams"
            :getModeSelect="getModeSelectVal"
            @prevSon="handlePrev"
        /></div>
      </div>
    </BasicModal>
  </div>
</template>
<script lang="ts">
  import { defineComponent, reactive, ref, computed, unref, getCurrentInstance } from 'vue';
  import { BasicModal, useModalInner } from '/@/components/Modal';
  import { Steps } from 'ant-design-vue';
  import TransferConfigMode from './cpns/transferConfigMode.vue';
  import TransferConfigParams from './cpns/transferConfigParams.vue';
  import { postAddConvertApi } from '/@/api/datamanager/dataManagerApi';
  import { useMessage } from '/@/hooks/web/useMessage';

  export default defineComponent({
    name: 'ConfigDrawer',
    components: {
      BasicModal,
      [Steps.name]: Steps,
      [Steps.Step.name]: Steps.Step,
      TransferConfigMode,
      TransferConfigParams,
    },
    emits: ['success', 'register'],
    setup(_, { emit }) {
      const { createMessage } = useMessage();
      const { proxy } = getCurrentInstance();
      const allPostForm = reactive({});
      const getNameObj = reactive({
        name: '',
      });
      const getTypeObj = reactive({
        type: '',
        remark: '',
      });
      const additionalInfoV = {
        additionalInfo: {
          description: '',
        },
      };
      const getSonFormValue = ref({});
      const getModeSonFormValue = ref({});
      const refTransferConfigParams = ref(null);
      const refTransferConfigMode = ref(null);
      const getModeSelectVal = ref({});
      const isUpdate = ref(true);
      const getTitle = computed(() => (!unref(isUpdate) ? '新增转换配置' : '编辑数据转换'));
      const current = ref(0);
      const editPostId = ref('');
      const editType = reactive({
        type: '',
        configuration: {},
        name: '',
      });
      const editNextType = reactive({
        type: '',
        configuration: {},
        name: '',
      });
      const editTypeFunc = (d) => {
        editType.type = d.type;
        editType.configuration = d.configuration;
        editType.name = d.name;
      };

      const [registerDrawer, { closeModal }] = useModalInner(async (data) => {
        isUpdate.value = !!data?.isUpdate;
        current.value = 0;
        if (unref(isUpdate)) {
          editPostId.value = data.record.id;
          editNextType.type = data.record.type;
          editNextType.configuration = data.record;
          editNextType.name = data.record.name;
          proxy.$refs.refTransferConfigMode.setStepOneFieldsValueFunc(editNextType);
        }
      });
      const handleCancel = () => {
        defineClearFunc();
      };
      const defineClearFunc = () => {
        try {
          proxy.$refs.refTransferConfigMode.customResetStepOneFunc();
          proxy.$refs.refTransferConfigParams?.clearSonValueDataFunc();
        } catch (e) {
          return e;
        }
      };
      const handleNext = (args) => {
        current.value++;
        getModeSelectVal.value = args;
        if (unref(isUpdate)) {
          try {
            if (editNextType.type == 'org.thingsboard.rule.engine.kafka.TbKafkaNode') {
              editTypeFunc(editNextType.configuration);
            } else if (editNextType.type == 'org.thingsboard.rule.engine.mqtt.TbMqttNode') {
              editTypeFunc(editNextType.configuration);
            } else if (editNextType.type == 'org.thingsboard.rule.engine.rabbitmq.TbRabbitMqNode') {
              editTypeFunc(editNextType.configuration);
            } else if (editNextType.type == 'org.thingsboard.rule.engine.rest.TbRestApiCallNode') {
              editTypeFunc(editNextType.configuration);
            }
            proxy.$refs.refTransferConfigParams.editSonValueDataFunc(editType);
          } catch (e) {
            return e;
          }
        }
      };
      const handlePrev = () => {
        current.value--;
      };

      const commonFunc = () => {
        try {
          additionalInfoV.additionalInfo.description =
            getSonFormValue.value.configuration.description;
          delete getSonFormValue.value.configuration.description;
          delete getSonFormValue.value.configuration.type;
          delete getSonFormValue.value?.configuration?.name;
        } catch (e) {
          return e;
        }
      };
      const addOrEditFunc = async () => {
        if (!unref(isUpdate)) {
          proxy.$refs.refTransferConfigParams.clearSonValueValidateFunc();
        }
        getModeSonFormValue.value = await proxy.$refs.refTransferConfigMode.getSonValueFunc();
        getSonFormValue.value = await proxy.$refs.refTransferConfigParams.getSonValueDataFunc();
        if (getModeSonFormValue.value?.type == 'org.thingsboard.rule.engine.kafka.TbKafkaNode') {
          getTypeObj.type = 'org.thingsboard.rule.engine.kafka.TbKafkaNode';
          getTypeObj.remark = getModeSonFormValue.value.remark;
          getNameObj.name = getSonFormValue.value?.configuration?.name;
          commonFunc();
        } else if (
          getModeSonFormValue.value?.type == 'org.thingsboard.rule.engine.mqtt.TbMqttNode'
        ) {
          getTypeObj.type = 'org.thingsboard.rule.engine.mqtt.TbMqttNode';
          getTypeObj.remark = getModeSonFormValue.value.remark;
          getNameObj.name = getSonFormValue.value?.configuration?.name;
          commonFunc();
        } else if (
          getModeSonFormValue.value?.type == 'org.thingsboard.rule.engine.rabbitmq.TbRabbitMqNode'
        ) {
          getTypeObj.type = 'org.thingsboard.rule.engine.rabbitmq.TbRabbitMqNode';
          getTypeObj.remark = getModeSonFormValue.value.remark;
          getNameObj.name = getSonFormValue.value?.configuration?.name;
          commonFunc();
        } else if (
          getModeSonFormValue.value?.type == 'org.thingsboard.rule.engine.rest.TbRestApiCallNode'
        ) {
          getTypeObj.type = 'org.thingsboard.rule.engine.rest.TbRestApiCallNode';
          getTypeObj.remark = getModeSonFormValue.value.remark;
          getNameObj.name = getSonFormValue.value?.configuration?.name;
          commonFunc();
        }
        const id: any = {
          id: unref(isUpdate) ? editPostId.value : '',
        };
        Object.assign(
          allPostForm,
          getTypeObj,
          getSonFormValue.value,
          getNameObj,
          id,
          additionalInfoV
        );
        if (!unref(isUpdate)) {
          delete allPostForm.id;
        }
      };
      const handleSubmit = async () => {
        if (!unref(isUpdate)) {
          await addOrEditFunc();
          await postAddConvertApi(allPostForm);
          createMessage.success('数据转换新增成功');
          emit('success');
          defineClearFunc();
          closeModal();
        } else {
          await addOrEditFunc();
          await postAddConvertApi(allPostForm);
          createMessage.success('数据转换编辑成功');
          emit('success');
          defineClearFunc();
          closeModal();
        }
      };
      return {
        handleCancel,
        registerDrawer,
        handleSubmit,
        getTitle,
        current,
        handleNext,
        handlePrev,
        getModeSelectVal,
        refTransferConfigParams,
        refTransferConfigMode,
      };
    },
  });
</script>