<template>
  <BasicModal @register="registerModal" v-bind="$attrs" wrapClassName="form-modal">
    <template #title>
      <div class="step-form-form">
        <a href="https://www.learun.cn/" target="_blank">
          <DesignLogo />
        </a>
        <span>{{ title }}</span>
        <div class="btn-box">
          <a-button type="primary" @click="handleSave" class="w-82px !rounded">{{
            t('保存')
          }}</a-button>
          <a-button type="primary" danger @click="handleClose" class="w-82px !rounded">{{
            t('关闭')
          }}</a-button>
        </div>
      </div>
      <div class="step-box">
        <div>基础信息</div>
      </div>
    </template>

    <div class="step-container">
      <BasicConfigStep ref="basicConfigStepRef" />
    </div>
  </BasicModal>
</template>
<script lang="ts" setup>
  import { ref } from 'vue';
  import BasicConfigStep from './BasicConfigStep.vue';
  import { BasicModal, useModalInner } from '/@/components/Modal';
  import { addBiRelease, getBiRelease, updateBiRelease } from '/@/api/bi/index';
  import { useI18n } from '/@/hooks/web/useI18n';
  import DesignLogo from '/@/components/ModalPanel/src/DesignLogo.vue';
  const { t } = useI18n();
  const isFormEdit = ref<boolean>(false);

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

  const basicConfigStepRef = ref();

  const isUpdate = ref<boolean>(false);
  const releaseId = ref<string>('');
  const menuId = ref<string>('');
  const title = ref<string>('');

  const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
    isFormEdit.value = !!data.isUpdate;
    isUpdate.value = !!data.isUpdate;
    releaseId.value = data.id;
    title.value = data.title;
    setModalProps({
      confirmLoading: false,
      canFullscreen: false,
      defaultFullscreen: true,
      draggable: false,
      destroyOnClose: true,
      maskClosable: false,
      footer: null,
      closable: false,
      //wrapperProps: { modalHeaderHeight: 152 },
    });
    if (isUpdate.value) {
      const res = await getBiRelease(releaseId.value);
      if (res && res.id) {
        basicConfigStepRef.value.setFieldsValue(res);
      }
    }
  });

  function handleClose() {
    emit('close');
  }

  async function handleSave() {
    const { isOk, data } = await basicConfigStepRef.value.validateStep();
    if (!isOk) {
      return;
    }
    const params = {
      ...data,
      id: releaseId.value,
      menuId: menuId.value,
    };
    if (isUpdate.value) {
      await updateBiRelease(params);
    } else {
      await addBiRelease(data);
    }
    closeModal();
    emit('success', isFormEdit.value);
    emit('close');
  }
</script>
