<template>
  <div>
    <BasicDrawer
      v-bind="$attrs"
      @register="registerDrawer"
      :showFooter="false"
      :title="descInfo?.title"
      destroyOnClose
      width="70%"
    >
      <div v-html="descInfo?.content"></div>
      <Description @register="registerDesc" class="mt-4" />

      <BasicTable @register="registerTable" />
    </BasicDrawer>
  </div>
</template>
<script lang="ts">
  import { defineComponent, ref } from 'vue';
  import { BasicDrawer, useDrawerInner } from '/@/components/Drawer';
  import { Description, DescItem, useDescription } from '/@/components/Description/index';
  import {
    getNotifyDetailPage,
    noticeByIdGetInfo,
  } from '/@/api/stationnotification/stationnotifyApi';
  import { useTable, BasicTable } from '/@/components/Table';
  import { detailColumns } from './config.d';
  const schema: DescItem[] = [
    {
      field: 'senderName',
      label: '发送者',
    },
    {
      field: 'senderDate',
      label: '发送时间',
    },
    {
      field: 'type',
      label: '类型:',
      render: (_, data) => {
        return data.type === 'NOTICE'
          ? '公告'
          : data.type === 'MEETING'
          ? '会议'
          : data.type === 'OTHER'
          ? '其他'
          : '';
      },
    },
  ];
  export default defineComponent({
    name: 'ConfigDrawer',
    components: { BasicDrawer, Description, BasicTable },
    emits: ['success', 'register'],
    setup() {
      let descInfo = ref();
      const noticeId = ref('');
      const [registerDrawer] = useDrawerInner(async (data) => {
        if (data.isUpdate) {
          let getDescInfo = await noticeByIdGetInfo(data.record.id);
          noticeId.value = data.record.id;
          descInfo.value = getDescInfo;
          console.log(noticeId);
        }
      });

      const [registerDesc] = useDescription({
        bordered: true,
        data: descInfo,
        schema: schema,
      });
      const [registerTable] = useTable({
        api: getNotifyDetailPage(noticeId.value),
        columns: detailColumns,
        showTableSetting: false,
        bordered: true,
        showIndexColumn: false,
      });
      return {
        descInfo,
        registerDesc,
        registerTable,
        registerDrawer,
        noticeId,
      };
    },
  });
</script>