修复bug

apps/web-ele/src/api/messageHistory/index.ts

@@ -0,0 +1,31 @@
+import { requestClient } from '#/api/request';
+enum Api {
+  querymessageRecordslist = '/messageRecords/records/list',
+  details = '/messageRecords/records',
+}
+// //新增知识库分类
+// export function addKnowledgeCategory(data: any) {
+//   return requestClient.post(Api.baseknowledgeCategory, data, {
+//     successMessageMode: 'message',
+//   });
+// }
+//查询消息记录列表
+export function queryMessageRecordsList(params: any) {
+  return requestClient.get(Api.querymessageRecordslist, { params });
+}
+// //详情
+export function queryMessageRecordsDetail(id: any) {
+  return requestClient.get(`${Api.details}/${id}`);
+}
+// //修改知识库分类
+// export function editKnowledgeCategory(data: any) {
+//   return requestClient.put(Api.baseknowledgeCategory, data, {
+//     successMessageMode: 'message',
+//   });
+// }
+// //删除知识库分类
+// export function deleteKnowledgeCategory(ids: any) {
+//   return requestClient.delete(`${Api.baseknowledgeCategory}/${ids}`, {
+//     successMessageMode: 'message',
+//   });
+// }

apps/web-ele/src/layouts/basic.vue

@@ -1,7 +1,6 @@
 <script lang="ts" setup>
 import type { NotificationItem } from '@vben/layouts';
-
-import { computed, ref, watch } from 'vue';
+import { computed, ref, watch, onMounted, onUnmounted } from 'vue';
 import { useRouter } from 'vue-router';
 // @ts-ignore
 import { AuthenticationLoginExpiredModal } from '@vben/common-ui';
@@ -15,48 +14,71 @@ import {
 } from '@vben/layouts';
 import { preferences } from '@vben/preferences';
 import { useAccessStore, useUserStore } from '@vben/stores';
-
 import { useAuthStore } from '#/store';
 import LoginForm from '#/views/_core/authentication/login.vue';
+import { queryMessageRecordsList } from '#/api/messageHistory/index';
 
-const notifications = ref<NotificationItem[]>([
-  {
-    avatar: 'https://avatar.vercel.sh/vercel.svg?text=VB',
-    date: '3小时前',
-    isRead: true,
-    message: '描述信息描述信息描述信息',
-    title: '收到了 14 份新周报',
-  },
-  {
-    avatar: 'https://avatar.vercel.sh/1',
-    date: '刚刚',
-    isRead: false,
-    message: '描述信息描述信息描述信息',
-    title: '朱偏右 回复了你',
-  },
-  {
-    avatar: 'https://avatar.vercel.sh/1',
-    date: '2024-01-01',
-    isRead: false,
-    message: '描述信息描述信息描述信息',
-    title: '曲丽丽 评论了你',
-  },
-  {
-    avatar: 'https://avatar.vercel.sh/satori',
-    date: '1天前',
-    isRead: false,
-    message: '描述信息描述信息描述信息',
-    title: '代办提醒',
-  },
-]);
+const notifications = ref([
+  // {
+  //   avatar: 'https://avatar.vercel.sh/vercel.svg?text=VB',
+  //   date: '3小时前',
+  //   isRead: true,
+  //   message: '描述信息描述信息描述信息',
+  //   title: '收到了 14 份新周报',
+  // },
+  // {
+  //   avatar: 'https://avatar.vercel.sh/1',
+  //   date: '刚刚',
+  //   isRead: false,
+  //   message: '描述信息描述信息描述信息',
+  //   title: '朱偏右 回复了你',
+  // },
+  // {
+  //   avatar: 'https://avatar.vercel.sh/1',
+  //   date: '2024-01-01',
+  //   isRead: false,
+  //   message: '描述信息描述信息描述信息',
+  //   title: '曲丽丽 评论了你',
+  // },
+  // {
+  //   avatar: 'https://avatar.vercel.sh/satori',
+  //   date: '1天前',
+  //   isRead: false,
+  //   message: '描述信息描述信息描述信息',
+  //   title: '代办提醒',
+  // },
+]) as any;
 
 const userStore = useUserStore();
 const authStore = useAuthStore();
 const accessStore = useAccessStore();
 const { destroyWatermark, updateWatermark } = useWatermark();
-const showDot = computed(() =>
-  notifications.value.some((item) => !item.isRead),
-);
+// const showDot = computed(() =>
+//   notifications.value.some((item: any) => !item.isRead),
+// );
+const queryMessageRecordsListfn = async () => {
+  const res = await queryMessageRecordsList({
+    pageNum: 1,
+    pageSize: 20,
+  });
+  notifications.value = res.rows || [];
+};
+
+// 定时器变量
+let notificationTimer: number | undefined;
+
+onMounted(() => {
+  queryMessageRecordsListfn();
+  notificationTimer = window.setInterval(() => {
+    queryMessageRecordsListfn();
+  }, 60000);
+});
+
+onUnmounted(() => {
+  if (notificationTimer) {
+    clearInterval(notificationTimer);
+  }
+});
 const router = useRouter();
 const menus = computed(() => [
   {
@@ -106,9 +128,12 @@ async function handleLogout() {
 function handleNoticeClear() {
   notifications.value = [];
 }
-
+// const handleclick = ()=>{
+//   console.log('打开了');
+  
+// }
 function handleMakeAll() {
-  notifications.value.forEach((item) => (item.isRead = true));
+  notifications.value.forEach((item: any) => (item.isRead = true));
 }
 watch(
   () => preferences.app.watermark,
@@ -140,11 +165,12 @@ watch(
       />
     </template>
     <template #notification>
+              <!-- :dot="showDot" -->
       <Notification
-        :dot="showDot"
         :notifications="notifications"
         @clear="handleNoticeClear"
         @make-all="handleMakeAll"
+        @refresh="queryMessageRecordsListfn"
       />
     </template>
     <template #extra>

apps/web-ele/src/router/routes/local.ts

@@ -301,11 +301,20 @@ const localRoutes: RouteRecordStringComponent[] = [
     name: 'WarningDetail',
     path: '/aiAnalysis/warning/detail/:alertId',
   },
+  {
+    component: '/messageHistory/index',
+    meta: {
+      activePath: '/messageHistory',
+      icon: 'carbon:information',
+      title: '消息列表',
+      hideInMenu: true,
+    },
+    name: 'MessageList',
+    path: '/messageHistory/index',
+  },
 ];
 
 /**
  * 这里放本地路由
  */
-export const localMenuList: RouteRecordStringComponent[] = [
-  ...localRoutes,
-];
+export const localMenuList: RouteRecordStringComponent[] = [...localRoutes];

apps/web-ele/src/views/messageHistory/config-data.tsx

@@ -0,0 +1,56 @@
+import type { VxeGridProps } from '#/adapter/vxe-table';
+export const columns: VxeGridProps['columns'] = [
+  {
+    field: 'action',
+    fixed: 'right',
+    slots: { default: 'action' },
+    resizable: false,
+    title: '操作',
+    width: 180,
+  },
+  {
+    title: '消息标题',
+    field: 'title',
+    minWidth: 130,
+  },
+  {
+    title: '消息类型',
+    field: 'messageType',
+    slots: { default: 'messageType' },
+    minWidth: 130,
+  },
+  {
+    title: '优先级',
+    field: 'priority',
+    minWidth: 130,
+    slots: { default: 'priority' },
+  },
+  {
+    title: '消息状态',
+    field: 'status',
+    minWidth: 130,
+    slots: { default: 'status' },
+  },
+  {
+    title: '消息内容',
+    field: 'content',
+    minWidth: 130,
+    slots: { default: 'content' },
+  },
+  {
+    title: '操作时间',
+    field: 'updateTime',
+    minWidth: 130,
+  },
+  {
+    title: '创建时间',
+    field: 'createTime',
+    minWidth: 130,
+  },
+  {
+    title: '任务类型',
+    field: 'taskType',
+    minWidth: 130,
+    slots: { default: 'taskType' },
+  },
+];

apps/web-ele/src/views/messageHistory/index.vue

@@ -0,0 +1,123 @@
+<script setup lang="ts">
+import { Page } from '@vben/common-ui';
+import { useVbenVxeGrid, type VxeGridProps } from '#/adapter/vxe-table';
+//@ts-ignore
+import { columns } from './config-data';
+//@ts-ignore
+import type { VbenFormProps } from '@vben/common-ui';
+import { DictEnum } from '@vben/constants';
+import { getDictOptions } from '#/utils/dict';
+import { useRouter } from 'vue-router';
+import {
+  queryMessageRecordsList,
+  queryMessageRecordsDetail,
+} from '#/api/messageHistory/index';
+const router = useRouter();
+// 获取任务类型文本
+const getTaskTypeText = (taskType: string | undefined) => {
+  if (!taskType) return '';
+  const taskTypeOptions = getDictOptions(DictEnum.TASK_TYPE);
+  const option = taskTypeOptions.find((opt) => opt.value === taskType);
+  return option?.label || '';
+};
+
+// 列表中显示配置
+const gridOptions: VxeGridProps = {
+  checkboxConfig: {
+    // 高亮
+    highlight: true,
+    // 翻页时保留选中状态
+    reserve: true,
+    // 点击行选中
+    trigger: 'default',
+  },
+  columns,
+  size: 'medium',
+  height: 'auto',
+  proxyConfig: {
+    ajax: {
+      query: async ({ page }, formValues = {}) => {
+        const resp = await queryMessageRecordsList({
+          pageNum: page.currentPage,
+          pageSize: page.pageSize,
+        });
+        return { items: resp.rows, total: resp.total };
+      },
+    },
+  },
+  rowConfig: {
+    keyField: 'roleId',
+  },
+  toolbarConfig: {
+    custom: true,
+    refresh: true,
+    zoom: true,
+  },
+  id: 'system-role-index',
+};
+const [BasicTable, BasicTableApi] = useVbenVxeGrid({
+  gridOptions,
+});
+const handleView = async (row: any) => {
+  try {
+    await queryMessageRecordsDetail(row.id);
+    if (row.messageType === 1) {
+      router.push(`/schedule/detail/${row?.relatedId}`);
+    } else if (row.messageType === 2) {
+      router.push({
+        name: 'WarningDetail',
+        params: { alertId: row?.relatedId },
+      });
+    }
+  } catch (error) {
+    console.log(error);
+  }
+};
+</script>
+<template>
+  <Page :auto-content-height="true">
+    <BasicTable table-title="历史任务列表">
+      <template #action="{ row }">
+        <el-button size="small" type="primary" plain @click="handleView(row)"
+          >查看</el-button
+        >
+      </template>
+      <template #messageType="{ row }">
+        {{
+          row?.messageType === 1
+            ? '任务消息'
+            : row?.messageType === 2
+              ? '预警消息'
+              : ''
+        }}
+      </template>
+      <template #priority="{ row }">
+        {{
+          row?.priority === 0
+            ? '低'
+            : row?.priority === 1
+              ? '中'
+              : row?.priority === 2
+                ? '高'
+                : ''
+        }}
+      </template>
+      <template #status="{ row }">
+        <span :style="{ color: row?.status === 0 ? 'red' : 'green' }">
+          {{ row?.status === 0 ? '未读' : row?.status === 1 ? '已读' : '' }}
+        </span>
+      </template>
+      <template #content="{ row }">
+        <div v-html="row?.content || ''"></div>
+      </template>
+      <template #taskType="{ row }">
+        {{ getTaskTypeText(row.taskType) }}
+      </template>
+    </BasicTable>
+  </Page>
+</template>
+<style scoped lang="scss">
+:deep(.el-tooltip__trigger:focus) {
+  outline: none;
+}
+</style>

packages/effects/layouts/src/widgets/notification/notification.vue

@@ -1,33 +1,31 @@
 <script lang="ts" setup>
 import type { NotificationItem } from './types';
-
+import { useRouter } from 'vue-router';
 import { Bell, MailCheck } from '@vben/icons';
 import { $t } from '@vben/locales';
-
 import {
   VbenButton,
   VbenIconButton,
   VbenPopover,
   VbenScrollbar,
 } from '@vben-core/shadcn-ui';
-
 import { useToggle } from '@vueuse/core';
-
+import { queryMessageRecordsDetail } from '../../../../../../apps/web-ele/src/api/messageHistory/index';
 interface Props {
   /**
    * 显示圆点
    */
-  dot?: boolean;
+  // dot?: boolean;
   /**
    * 消息列表
    */
-  notifications?: NotificationItem[];
+  notifications?: any[];
 }
 
 defineOptions({ name: 'NotificationPopup' });
 
 withDefaults(defineProps<Props>(), {
-  dot: false,
+  // dot: false,
   notifications: () => [],
 });
 
@@ -36,29 +34,46 @@ const emit = defineEmits<{
   makeAll: [];
   read: [NotificationItem];
   viewAll: [];
+  refresh: [];
 }>();
 
 const [open, toggle] = useToggle();
+const router = useRouter();
 
 function close() {
   open.value = false;
 }
 
 function handleViewAll() {
-  emit('viewAll');
-  close();
+  router.push({ path: '/messageHistory/index' });
+  // emit('viewAll');
+  // close();
 }
 
 function handleMakeAll() {
-  emit('makeAll');
+  // emit('makeAll');
 }
 
 function handleClear() {
   emit('clear');
 }
 
-function handleClick(item: NotificationItem) {
-  emit('read', item);
+async function handleClick(item: any) {
+  try {
+    await queryMessageRecordsDetail(item.id);
+    if (item.messageType === 1) {
+      router.push(`/schedule/detail/${item?.relatedId}`);
+    } else if (item.messageType === 2) {
+      router.push({
+        name: 'WarningDetail',
+        params: { alertId: item?.relatedId },
+      });
+    }
+    emit('refresh');
+  } catch (error) {
+    console.log(error);
+  }
+  // emit('read', item);
 }
 </script>
 <template>
@@ -70,7 +85,7 @@ function handleClick(item: NotificationItem) {
       <div class="flex-center mr-2 h-full" @click.stop="toggle()">
         <VbenIconButton class="bell-button text-foreground relative">
           <span
-            v-if="dot"
+            v-if="notifications.some((item) => item.status === 0)"
             class="bg-primary absolute right-0.5 top-0.5 h-2 w-2 rounded"
           ></span>
           <Bell class="size-4" />
@@ -97,26 +112,28 @@ function handleClick(item: NotificationItem) {
               @click="handleClick(item)"
             >
               <span
-                v-if="!item.isRead"
+                v-if="item.status === 0"
                 class="bg-primary absolute right-2 top-2 h-2 w-2 rounded"
               ></span>
 
               <span
-                class="relative flex h-10 w-10 shrink-0 overflow-hidden rounded-full"
+                class="bg-primary relative flex h-10 w-10 shrink-0 items-center justify-center overflow-hidden rounded-full text-sm font-semibold text-white"
               >
-                <img
+                <!-- <img
                   :src="item.avatar"
                   class="aspect-square h-full w-full object-cover"
                   role="img"
-                />
+                /> -->
+                {{ item.title?.substring(0, 2) || '未' }}
               </span>
               <div class="flex flex-col gap-1 leading-none">
                 <p class="font-semibold">{{ item.title }}</p>
-                <p class="text-muted-foreground my-1 line-clamp-2 text-xs">
+                <!-- <div v-html="item?.content"></div> -->
+                <!-- <p class="text-muted-foreground my-1 line-clamp-2 text-xs">
                   {{ item.message }}
-                </p>
+                </p> -->
                 <p class="text-muted-foreground line-clamp-2 text-xs">
-                  {{ item.date }}
+                  {{ item.updateTime }}
                 </p>
               </div>
             </li>