<template>
  <div>
    <BasicDrawer
      v-bind="$attrs"
      @register="registerDrawer"
      :title="getTitle"
      width="800px"
      showFooter
    >
      <BasicForm @register="registerForm" />
      <template #footer>
        <a-button @click="handleCancel">取消</a-button>
        <a-button @click="handleSaveDraft">保存草稿</a-button>
        <a-button type="primary" @click="handleSend">发布通知</a-button>
      </template>
    </BasicDrawer>
  </div>
</template>
<script lang="ts">
  import { defineComponent, computed, unref, ref } from 'vue';
  import { BasicForm, useForm } from '/@/components/Form';
  import { formSchema } from './config.d';
  import { BasicDrawer, useDrawerInner } from '/@/components/Drawer';
  import {
    notifyAddDraftApi,
    notifyAddLeaseApi,
  } from '/@/api/stationnotification/stationnotifyApi';
  import { useMessage } from '/@/hooks/web/useMessage';
  export default defineComponent({
    name: 'ConfigDrawer',
    components: { BasicDrawer, BasicForm },
    emits: ['success', 'register'],
    setup(_, { emit }) {
      const { createMessage } = useMessage();
      const isUpdate = ref<Boolean>();
      const getTitle = computed(() => (!unref(isUpdate) ? '新增通知' : '编辑通知'));
      const noticeId = ref('');
      const [registerForm, { setFieldsValue, resetFields, validate, getFieldsValue }] = useForm({
        labelWidth: 120,
        schemas: formSchema,
        showActionButtonGroup: false,
      });
      const [registerDrawer, { closeDrawer }] = useDrawerInner(async (data) => {
        await resetFields();
        isUpdate.value = data.isUpdate;
        //编辑
        if (data.isUpdate) {
          noticeId.value = data.record.id;
          Reflect.set(data.record, 'receiverType', data.record.receiverType === '全部' ? '0' : '1');
          if (data.record.receiverType === '1') {
            if (!data.record.pointId.length) return;
            const organizationId = data.record.pointId.split(',');
            Reflect.set(data.record, 'organizationId', organizationId);
          }
          setFieldsValue(data.record);
        }
      });
      // 发布通知
      const handleSend = async () => {
        await validate();
        const field = getFieldsValue();
        const pointId = field.receiverType === '1' ? field.organizationId + '' : null;
        // 新增情况
        if (!unref(isUpdate)) {
          const addNotice = {
            ...field,
            pointId,
          };
          await notifyAddLeaseApi(addNotice);
        } else {
          const editNotice = {
            ...field,
            pointId,
            id: unref(noticeId),
          };
          await notifyAddLeaseApi(editNotice);
        }
        emit('success');
        closeDrawer();
        createMessage.success('发布成功');
      };
      // 保存草稿
      const handleSaveDraft = async () => {
        await validate();
        const field = getFieldsValue();
        const pointId = field.receiverType === '1' ? field.organizationId + '' : null;
        if (!unref(isUpdate)) {
          const saveDraft = {
            ...field,
            pointId,
          };
          await notifyAddDraftApi(saveDraft);
        } else {
          const editDraft = {
            ...field,
            pointId,
            id: unref(noticeId),
          };
          await notifyAddDraftApi(editDraft);
        }
        emit('success');
        closeDrawer();
        createMessage.success('保存草稿成功');
      };
      const handleCancel = () => {
        // resetFields();
        closeDrawer();
      };
      return {
        getTitle,
        handleSend,
        handleCancel,
        handleSaveDraft,
        registerForm,
        registerDrawer,
        setFieldsValue,
      };
    },
  });
</script>