From da2aba757aee7e412387d0567f5fb8dad47a0b12 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=83=A1=E5=B0=91=E7=BF=94?= <971366405@qq.com>
Date: Sat, 14 Sep 2024 11:06:40 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20:sparkles:=20=E6=96=B0=E5=A2=9E?=
 =?UTF-8?q?=E9=80=9A=E7=9F=A5=E5=85=AC=E5=91=8A=E5=8F=91=E9=80=81ws?=
 =?UTF-8?q?=E6=B6=88=E6=81=AF?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

新增通知公告发送ws消息
---
 src/components/Notice/index.vue               | 13 ++-
 .../Sidebar/components/SidebarMenuItem.vue    |  2 +-
 src/views/dashboard/index.vue                 |  1 -
 src/views/notice/index.vue                    | 95 ++-----------------
 src/views/system/notice/index.vue             | 24 +++--
 5 files changed, 39 insertions(+), 96 deletions(-)

diff --git a/src/components/Notice/index.vue b/src/components/Notice/index.vue
index 7247e5d4..a4ba322c 100644
--- a/src/components/Notice/index.vue
+++ b/src/components/Notice/index.vue
@@ -40,7 +40,7 @@
           </el-tabs>
           <el-divider />
           <div class="flex-x-between">
-            <el-link type="primary" :underline="false">
+            <el-link type="primary" :underline="false" @click="more">
               <span class="text-xs">查看更多</span>
               <el-icon class="text-xs">
                 <ArrowRight />
@@ -66,10 +66,11 @@ import { MessageTypeEnum, MessageTypeLabels } from "@/enums/MessageTypeEnum";
 import NoticeAPI from "@/api/notice";
 import socket from "@/api/socket";
 import NoticeModal from "@/components/NoticeModal/index.vue";
+import router from "@/router";
 
 const activeTab = ref(MessageTypeEnum.MESSAGE);
 const messages = ref<any>([]);
-const noticeModalRef = ref(null);
+const noticeModalRef = ref(NoticeModal);
 const offset = ref<Number[]>([-15, 15]);
 
 const getFilteredMessages = (type: MessageTypeEnum) => {
@@ -131,6 +132,14 @@ function readNotice(id: number) {
   noticeModalRef.value?.open(id); // 调用 open 方法，传入 ID
 }
 
+/**
+ * 查看更多
+ */
+function more() {
+  //跳转到我的消息页面
+  router.push({ path: "notice/notice" });
+}
+
 /**
  * 全部已读
  */
diff --git a/src/layout/components/Sidebar/components/SidebarMenuItem.vue b/src/layout/components/Sidebar/components/SidebarMenuItem.vue
index e45ec8d1..b742eadf 100644
--- a/src/layout/components/Sidebar/components/SidebarMenuItem.vue
+++ b/src/layout/components/Sidebar/components/SidebarMenuItem.vue
@@ -55,7 +55,7 @@ defineOptions({
 });
 
 import path from "path-browserify";
-import { isExternal } from "@/utils/index";
+import { isExternal } from "@/utils";
 import { RouteRecordRaw } from "vue-router";
 
 const props = defineProps({
diff --git a/src/views/dashboard/index.vue b/src/views/dashboard/index.vue
index bfa301c1..f7d1ce1f 100644
--- a/src/views/dashboard/index.vue
+++ b/src/views/dashboard/index.vue
@@ -391,7 +391,6 @@ const getNoticeLevelTag = (type: number) => {
 
 function connectWebSocket() {
   WebSocketManager.getWebSocketClient("/topic/onlineUserCount", (message) => {
-    console.log("收到消息：", message);
     onlineUserCount.value = JSON.parse(message);
   });
 }
diff --git a/src/views/notice/index.vue b/src/views/notice/index.vue
index 5957d303..f6c68d5e 100644
--- a/src/views/notice/index.vue
+++ b/src/views/notice/index.vue
@@ -29,8 +29,8 @@
         v-loading="loading"
         :data="pageData"
         highlight-current-row
-        @selection-change="handleSelectionChange"
       >
+        <el-table-column type="index" label="序号" width="60" />
         <el-table-column
           align="center"
           key="title"
@@ -69,7 +69,7 @@
           align="center"
           key="releaseTime"
           label="发布时间"
-          prop="sendTime"
+          prop="releaseTime"
           min-width="100"
         />
         <el-table-column align="center" fixed="right" label="操作" width="220">
@@ -95,20 +95,19 @@
         @pagination="handleQuery()"
       />
     </el-card>
+    <NoticeModal ref="noticeModalRef" />
   </div>
 </template>
 
 <script setup lang="ts">
+import NoticeModal from "@/components/NoticeModal/index.vue";
+
 defineOptions({
   name: "MyNotice",
   inheritAttrs: false,
 });
 
-import NoticeAPI, {
-  NoticePageVO,
-  NoticeForm,
-  NoticePageQuery,
-} from "@/api/notice";
+import NoticeAPI, { NoticePageVO, NoticePageQuery } from "@/api/notice";
 
 const queryFormRef = ref(ElForm);
 const pageData = ref<NoticePageVO[]>([]);
@@ -116,6 +115,7 @@ const pageData = ref<NoticePageVO[]>([]);
 const loading = ref(false);
 const ids = ref<number[]>([]);
 const total = ref(0);
+const noticeModalRef = ref(null);
 
 const queryParams = reactive<NoticePageQuery>({
   pageNum: 1,
@@ -142,85 +142,8 @@ function handleResetQuery() {
   handleQuery();
 }
 
-/** 行复选框选中记录选中ID集合 */
-function handleSelectionChange(selection: any) {
-  ids.value = selection.map((item: any) => item.id);
-}
-
-/** 打开通知公告弹窗 */
-function handleOpenDialog(id?: number) {
-  dialog.visible = true;
-  if (id) {
-    dialog.title = "修改通知公告";
-    NoticeAPI.getFormData(id).then((data) => {
-      Object.assign(formData, data);
-    });
-  } else {
-    dialog.title = "新增通知公告";
-  }
-}
-
-/** 提交通知公告表单 */
-function handleSubmit() {
-  dataFormRef.value.validate((valid: any) => {
-    if (valid) {
-      loading.value = true;
-      const id = formData.id;
-      if (id) {
-        NoticeAPI.update(id, formData)
-          .then(() => {
-            ElMessage.success("修改成功");
-            handleCloseDialog();
-            handleResetQuery();
-          })
-          .finally(() => (loading.value = false));
-      } else {
-        NoticeAPI.add(formData)
-          .then(() => {
-            ElMessage.success("新增成功");
-            handleCloseDialog();
-            handleResetQuery();
-          })
-          .finally(() => (loading.value = false));
-      }
-    }
-  });
-}
-
-/** 关闭通知公告弹窗 */
-function handleCloseDialog() {
-  dialog.visible = false;
-  dataFormRef.value.resetFields();
-  dataFormRef.value.clearValidate();
-  formData.id = undefined;
-}
-
-/** 删除通知公告 */
-function handleDelete(id?: number) {
-  const deleteIds = [id || ids.value].join(",");
-  if (!deleteIds) {
-    ElMessage.warning("请勾选删除项");
-    return;
-  }
-
-  ElMessageBox.confirm("确认删除已选中的数据项?", "警告", {
-    confirmButtonText: "确定",
-    cancelButtonText: "取消",
-    type: "warning",
-  }).then(
-    () => {
-      loading.value = true;
-      NoticeAPI.deleteByIds(deleteIds)
-        .then(() => {
-          ElMessage.success("删除成功");
-          handleResetQuery();
-        })
-        .finally(() => (loading.value = false));
-    },
-    () => {
-      ElMessage.info("已取消删除");
-    }
-  );
+function handleOpenDialog(id: number) {
+  noticeModalRef.value?.open(id);
 }
 
 onMounted(() => {
diff --git a/src/views/system/notice/index.vue b/src/views/system/notice/index.vue
index 1bc4dc3b..96565986 100644
--- a/src/views/system/notice/index.vue
+++ b/src/views/system/notice/index.vue
@@ -151,6 +151,14 @@
         />
         <el-table-column align="center" fixed="right" label="操作" width="220">
           <template #default="scope">
+            <el-button
+              type="primary"
+              size="small"
+              link
+              @click="examine(scope.row.id)"
+            >
+              查看
+            </el-button>
             <el-button
               v-if="scope.row.releaseStatus != 1"
               v-hasPerm="['system:notice:release']"
@@ -159,7 +167,6 @@
               link
               @click="releaseNotice(scope.row.id)"
             >
-              <i-ep-edit />
               发布
             </el-button>
             <el-button
@@ -170,7 +177,6 @@
               link
               @click="recallNotice(scope.row.id)"
             >
-              <i-ep-edit />
               撤回
             </el-button>
             <el-button
@@ -181,7 +187,6 @@
               link
               @click="handleOpenDialog(scope.row.id)"
             >
-              <i-ep-edit />
               编辑
             </el-button>
             <el-button
@@ -192,7 +197,6 @@
               link
               @click="handleDelete(scope.row.id)"
             >
-              <i-ep-delete />
               删除
             </el-button>
           </template>
@@ -278,10 +282,14 @@
         </div>
       </template>
     </el-dialog>
+
+    <NoticeModal ref="noticeModalRef" />
   </div>
 </template>
 
 <script setup lang="ts">
+import NoticeModal from "@/components/NoticeModal/index.vue";
+
 defineOptions({
   name: "Notice",
   inheritAttrs: false,
@@ -323,11 +331,11 @@ const formData = reactive<NoticeForm>({
   tarType: 0, // 默认目标类型为全体
 });
 
+const noticeModalRef = ref(NoticeModal);
+
 // 通知公告表单校验规则
 const rules = reactive({
   title: [{ required: true, message: "请输入通知标题", trigger: "blur" }],
-  // content: [{ required: true, message: "请输入通知内容", trigger: "blur" }],
-  // 写一个content的校验规则，去掉html标签如果为空则提示
   content: [
     {
       required: true,
@@ -372,6 +380,10 @@ function handleSelectionChange(selection: any) {
   ids.value = selection.map((item: any) => item.id);
 }
 
+function examine(id: number) {
+  noticeModalRef.value?.open(id, true);
+}
+
 /** 打开通知公告弹窗 */
 function handleOpenDialog(id?: number) {
   getUserOptions();