通知回执查询接口调试

src/api/system.js

@@ -204,3 +204,20 @@ export const noticeDestroyApi = (ids) =>
     params: { ids },
     paramsSerializer,
   });
+// notice-message
+export const noticeMessageQueryApi = (data) =>
+  request({
+    url: '/api/sys/message/query',
+    params: data,
+  });
+export const noticeMessageCountApi = (noticeId) =>
+  request({
+    url: '/api/sys/message/count',
+    params: { noticeId },
+  });
+export const noticeMessageExportApi = (data) =>
+  request({
+    url: '/api/sys/message/export',
+    params: data,
+    download: true,
+  });

src/utils/filter.js

@@ -14,7 +14,7 @@ export function enableFilter(val) {
   return val ? '启用' : '禁用';
 }
 export function timestampFilter(val) {
-  return dateFormat(val);
+  return val ? dateFormat(val) : DEFAULT_FIELD;
 }
 // 系统管理
 export function customerTypeFilter(val) {

src/views/system/notice-log/notice-manage/index.vue

@@ -109,6 +109,11 @@
       :curRow="curRow"
       @success="fetchData"
     ></edit-notice-dialog>
+    <!-- NoticeMessageDialog -->
+    <notice-message-dialog
+      v-model:visible="showNoticeMessageDialog"
+      :curRow="curRow"
+    ></notice-message-dialog>
   </div>
 </template>
 
@@ -118,6 +123,7 @@ import { DialogPlugin, MessagePlugin } from 'tdesign-vue-next';
 import { omit } from 'lodash';
 import useFetchTable from '@/hooks/useFetchTable';
 import EditNoticeDialog from './edit-notice-dialog.vue';
+import NoticeMessageDialog from './notice-message-dialog.vue';
 import {
   noticeQueryApi,
   noticeDestroyApi,
@@ -133,6 +139,7 @@ import {
 } from '@/utils/filter';
 
 const showEditNoticeDialog = ref(false);
+const showNoticeMessageDialog = ref(false);
 const curRow = ref(null);
 const selectedRowKeys = ref([]);
 
@@ -273,7 +280,8 @@ const handleCancelPublish = (row) => {
   });
 };
 const handleFeedbackView = (row) => {
-  console.log(row);
+  curRow.value = row;
+  showNoticeMessageDialog.value = true;
 };
 const handleEdit = (row) => {
   curRow.value = row;

src/views/system/notice-log/notice-manage/notice-message-dialog.vue

@@ -0,0 +1,191 @@
+<template>
+  <my-dialog
+    :visible="visible"
+    header="回执查询"
+    mode="full-screen"
+    attach="body"
+    class="t-layout"
+    :closeOnOverlayClick="false"
+    :top="0"
+    @close="emit('update:visible', false)"
+    @opened="onOpened"
+  >
+    <SearchForm :fields="fields" :params="params">
+      <template #supplier="{ item, params }">
+        <select-supplier v-model="params[item.prop]" clearable>
+        </select-supplier>
+      </template>
+    </SearchForm>
+
+    <div class="flex-1">
+      <div class="flex justify-between items-center">
+        <div>
+          <span
+            >已阅/全部：{{ messageCount.reviewed }}/{{
+              messageCount.total
+            }}</span
+          >
+        </div>
+        <div class="btn-group">
+          <t-button theme="success" @click="onExport">导出回执明细</t-button>
+        </div>
+      </div>
+
+      <t-table
+        size="small"
+        row-key="id"
+        :columns="columns"
+        :data="tableData"
+        bordered
+        :pagination="{
+          defaultCurrent: 1,
+          defaultPageSize: 10,
+          onChange,
+          total: pagination.total,
+          current: pagination.page,
+        }"
+        v-loading="tableLoading"
+      >
+        <template #type="{ col, row }">
+          {{ customerTypeFilter(row[col.colKey]) }}
+        </template>
+        <template #receive-time="{ col, row }">
+          {{ timestampFilter(row[col.colKey]) }}
+        </template>
+        <template #status="{ col, row }">
+          {{ row[col.colKey] ? '已阅' : '未阅' }}
+        </template>
+      </t-table>
+    </div>
+
+    <template #foot> </template>
+  </my-dialog>
+</template>
+<script setup name="NoticeMessageDialog">
+import { ref, reactive } from 'vue';
+import { MessagePlugin, DialogPlugin } from 'tdesign-vue-next';
+import {
+  noticeMessageQueryApi,
+  noticeMessageCountApi,
+  noticeMessageExportApi,
+} from '@/api/system';
+import useFetchTable from '@/hooks/useFetchTable';
+import { customerTypeFilter, timestampFilter } from '@/utils/filter';
+
+const emit = defineEmits(['update:visible', 'success']);
+let messageCount = reactive({ reviewed: 0, total: 0 });
+
+const props = defineProps({
+  visible: Boolean,
+  curRow: Object,
+});
+
+const fields = ref([
+  {
+    prop: 'city',
+    label: '区域',
+    type: 'select',
+    labelWidth: 50,
+    colSpan: 5,
+    options: [],
+  },
+  {
+    prop: 'supplierId',
+    label: '供应商',
+    type: 'select',
+    labelWidth: 70,
+    colSpan: 5,
+    cell: 'supplier',
+    options: [],
+  },
+  {
+    prop: 'status',
+    label: '回执状态',
+    type: 'select',
+    labelWidth: 90,
+    colSpan: 4,
+    options: [
+      {
+        label: '已阅',
+        value: true,
+      },
+      {
+        label: '未阅',
+        value: false,
+      },
+    ],
+  },
+  {
+    type: 'buttons',
+    colSpan: 2,
+    children: [
+      {
+        type: 'button',
+        text: '查询',
+        onClick: () => {
+          search();
+          getCount();
+        },
+      },
+    ],
+  },
+]);
+const params = reactive({
+  status: '',
+  city: '',
+  supplierId: '',
+  noticeId: '',
+});
+
+const columns = [
+  { colKey: 'code', title: '档案流水号', width: 120 },
+  { colKey: 'name', title: '姓名' },
+  { colKey: 'supplier', title: '供应商' },
+  { colKey: 'province', title: '常居省份', width: 100 },
+  { colKey: 'city', title: '常居城市', width: 100 },
+  { colKey: 'service', title: '服务单元' },
+  { colKey: 'custom', title: '客户名称', width: 120 },
+  { colKey: 'type', title: '客户类型', width: 100 },
+  {
+    colKey: 'receiveTime',
+    title: '消息查阅时间',
+    cell: 'receive-time',
+    width: 170,
+  },
+  { colKey: 'mobileNumber', title: '联系电话', width: 120 },
+  { colKey: 'status', title: '回执状态', cell: 'status', width: 80 },
+];
+const {
+  loading: tableLoading,
+  pagination,
+  tableData,
+  search,
+  onChange,
+} = useFetchTable(noticeMessageQueryApi, { params }, false);
+
+async function getCount() {
+  const res = await noticeMessageCountApi(props.curRow.id);
+  messageCount = res || { reviewed: 0, total: 0 };
+}
+
+function onOpened() {
+  params.noticeId = props.curRow.id;
+  search();
+  getCount();
+}
+
+async function onExport() {
+  const confirmDia = DialogPlugin({
+    header: '操作提示',
+    body: `确定要导出所有记录吗？`,
+    confirmBtn: '确定',
+    cancelBtn: '取消',
+    onConfirm: async () => {
+      confirmDia.hide();
+      const res = await noticeMessageExportApi(params).catch(() => {});
+      if (!res) return;
+      MessagePlugin.success('开始下载');
+    },
+  });
+}
+</script>