useDrawer.vue 3.19 KB
<template>
  <BasicDrawer
    v-bind="$attrs"
    @register="registerDrawer"
    :showFooter="false"
    :title="getTitle"
    width="1000px"
  >
    <DetailChild :emitChildData="childData" />
    <BasicTable :columns="columns" :dataSource="tableData">
      <span></span>
    </BasicTable>
  </BasicDrawer>
</template>
<script lang="ts">
  import { defineComponent, ref, computed, unref } from 'vue';
  import { BasicDrawer, useDrawerInner } from '/@/components/Drawer';
  import DetailChild from './child/index.vue';
  import {
    notifyMyGetrReadApi,
    notifyMyGetDetailApi,
  } from '/@/api/stationnotification/stationnotifyApi';
  import { BasicTable } from '/@/components/Table';
  import { BasicColumn } from '/@/components/Table/src/types/table';

  export default defineComponent({
    name: 'ConfigDrawer',
    components: { BasicDrawer, DetailChild, BasicTable },
    emits: ['success', 'register'],
    setup() {
      const isUpdate = ref(true);
      const childData: any = ref(null);
      const tableData = ref([]);
      const columns: BasicColumn[] = [
        {
          title: '创建时间',
          dataIndex: 'createTime',
        },
        {
          title: '阅读状态',
          dataIndex: 'readStatus',
          format: (_text: string, record: Recordable) => {
            return record.readStatus === '0' ? '草稿' : record.readStatus === '1' ? '已读' : '其他';
          },
        },
        {
          title: '阅读时间',
          dataIndex: 'readDate',
        },
        {
          title: '发送者',
          dataIndex: 'senderName',
          format: (_text: string, record: Recordable) => {
            return record.sysNoticeDTO.senderName;
          },
        },
        {
          title: '发送时间',
          dataIndex: 'senderDate',
          format: (_text: string, record: Recordable) => {
            return record.sysNoticeDTO.senderDate;
          },
        },
        {
          title: '类型',
          dataIndex: 'type',
          format: (_text: string, record: Recordable) => {
            return record.sysNoticeDTO.type === 'NOTICE'
              ? '公告'
              : record.sysNoticeDTO.type === 'MEETING'
              ? '会议'
              : record.sysNoticeDTO.type === 'OTHER'
              ? '其他'
              : '无';
          },
        },
      ];
      const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async (data) => {
        setDrawerProps({ confirmLoading: false });
        isUpdate.value = !!data?.isUpdate;
        if (data.record) {
          let getData = await notifyMyGetDetailApi(data.record.id);
          childData.value = getData;
          let tableGet = await notifyMyGetrReadApi({
            page: 1,
            pageSize: 10,
          });
          tableData.value = tableGet.items;
        }
        //编辑
        if (unref(isUpdate)) {
        } else {
        }
      });

      const getTitle = computed(() => (!unref(isUpdate) ? '新增通知' : '查看通知'));
      const handleCancel = () => {
        closeDrawer();
      };

      return {
        tableData,
        columns,
        childData,
        handleCancel,
        getTitle,
        registerDrawer,
      };
    },
  });
</script>