From 29cf554a10c485c1793d17a082cc3ac145151cae Mon Sep 17 00:00:00 2001
From: Bunny <1319900154@qq.com>
Date: Sun, 29 Dec 2024 21:30:16 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=F0=9F=A7=A9=20=E6=B7=BB=E5=8A=A0?=
 =?UTF-8?q?=E6=B6=88=E6=81=AF=E5=86=85=E9=83=A8=E9=80=9A=E7=9F=A5;?=
 =?UTF-8?q?=E4=B8=8A=E4=BC=A0=E5=9B=BE=E7=89=87=E5=A4=A7=E5=B0=8F=E8=AE=BE?=
 =?UTF-8?q?=E7=BD=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 docker/nginx.conf                             |  1 +
 .../lay-notice/components/NoticeItem.vue      |  6 ++--
 .../lay-notice/{data.ts => data.tsx}          | 33 +++++++++++++------
 src/layout/components/lay-notice/index.vue    |  1 -
 src/views/login/index.vue                     |  3 +-
 .../message-editing/index.vue                 | 17 ++++++++++
 6 files changed, 46 insertions(+), 15 deletions(-)
 rename src/layout/components/lay-notice/{data.ts => data.tsx} (81%)

diff --git a/docker/nginx.conf b/docker/nginx.conf
index c062808..003d454 100644
--- a/docker/nginx.conf
+++ b/docker/nginx.conf
@@ -7,6 +7,7 @@ server {
      listen 80 ;
      listen       [::]:80;
      server_name localhost;
+     client_max_body_size 5M; # 最大文件上传设置
 
      location / {
          root   /etc/nginx/html;
diff --git a/src/layout/components/lay-notice/components/NoticeItem.vue b/src/layout/components/lay-notice/components/NoticeItem.vue
index bcb5ee1..2d6d99b 100644
--- a/src/layout/components/lay-notice/components/NoticeItem.vue
+++ b/src/layout/components/lay-notice/components/NoticeItem.vue
@@ -49,7 +49,7 @@ function goMessageDetail(message: ListItem) {
 
 <template>
 	<div class="notice-container border-b-[1px] border-solid border-[#f0f0f0] dark:border-[#303030]" @click="goMessageDetail(noticeItem)">
-		<el-avatar v-if="noticeItem.cover" :size="30" :src="noticeItem.cover" class="notice-container-avatar" />
+		<img v-if="noticeItem.cover" :src="noticeItem.cover" alt="" class="notice-container-avatar" />
 		<div class="notice-container-text">
 			<div class="notice-text-title text-[#000000d9] dark:text-white">
 				<el-tooltip
@@ -102,7 +102,9 @@ function goMessageDetail(message: ListItem) {
 	// border-bottom: 1px solid #f0f0f0;
 
 	.notice-container-avatar {
-		margin-right: 16px;
+		object-fit: cover;
+		width: 30px;
+		margin-right: 8px;
 		background: #fff;
 	}
 
diff --git a/src/layout/components/lay-notice/data.ts b/src/layout/components/lay-notice/data.tsx
similarity index 81%
rename from src/layout/components/lay-notice/data.ts
rename to src/layout/components/lay-notice/data.tsx
index 2e9706d..be97012 100644
--- a/src/layout/components/lay-notice/data.ts
+++ b/src/layout/components/lay-notice/data.tsx
@@ -2,7 +2,7 @@ import { $t } from '@/plugins/i18n';
 import { computed, ref } from 'vue';
 import { fetchGetUserMessageList } from '@/api/v1/message/messageUser';
 import { throttle } from '@pureadmin/utils';
-import { useWebNotification } from '@vueuse/core';
+import { ElNotification, ElTag } from 'element-plus';
 
 export interface ListItem {
 	messageId: string;
@@ -92,15 +92,7 @@ export const getAllMessageList = async () => {
 	];
 
 	// 调用浏览器系统通知
-	if (system.length > 0) {
-		useWebNotification({
-			title: system[0]?.title,
-			dir: 'auto',
-			lang: 'zh',
-			renotify: true,
-			tag: system[0]?.extra,
-		});
-	}
+	showNotification([...system, ...notify, ...notifications]);
 };
 
 /** 计算消息数量 */
@@ -115,3 +107,24 @@ export const computedNoticesNum = throttle(async () => {
 	activeKey.value = noticesData.value[0]?.key;
 	// 定时刷新
 }, 666);
+
+/** 显示通知消息 */
+const showNotification = NotificationList => {
+	if (NotificationList.length > 0) {
+		NotificationList.forEach(message => {
+			ElNotification({
+				title: message?.title,
+				message: (
+					<div class='flex '>
+						<img src={message.cover} alt='' style={{ width: '50px', height: '50px', objectFit: 'cover' }} />
+						<div class='flex justify-between mt-3 mx-2'>
+							<span class='mr-2'>{message.description}</span>
+							{message.status && <ElTag type={message.status}>{message?.extra}</ElTag>}
+						</div>
+					</div>
+				),
+				position: 'bottom-right',
+			});
+		});
+	}
+};
diff --git a/src/layout/components/lay-notice/index.vue b/src/layout/components/lay-notice/index.vue
index dad6e19..1e73595 100644
--- a/src/layout/components/lay-notice/index.vue
+++ b/src/layout/components/lay-notice/index.vue
@@ -19,7 +19,6 @@ onMounted(() => {
 	<el-dropdown placement="bottom-end" trigger="click">
 		<span
 			:class="['dropdown-badge', 'navbar-bg-hover', 'select-none', Number(noticesNum) !== 0 && 'mr-[10px]']"
-			@click="computedNoticesNum"
 			@dblclick="$router.push(`/message-detail/${messageTypeStore?.allMessageTypeList[0]?.messageType}`)"
 		>
 			<el-badge :max="99" :value="Number(noticesNum) === 0 ? '' : noticesNum">
diff --git a/src/views/login/index.vue b/src/views/login/index.vue
index 0d6c1bb..f64602d 100644
--- a/src/views/login/index.vue
+++ b/src/views/login/index.vue
@@ -64,8 +64,7 @@ onMounted(() => {
 			</div>
 			<div class="login-box">
 				<div class="login-form">
-					<!--<avatar class="avatar" />-->
-					<img alt="" class="avatar" src="/logo.png" />
+					<img alt="logo" class="avatar" src="/logo.png" />
 					<Motion>
 						<h2 class="outline-none">{{ title }}</h2>
 					</Motion>
diff --git a/src/views/message-management/message-editing/index.vue b/src/views/message-management/message-editing/index.vue
index b493560..6c45efb 100644
--- a/src/views/message-management/message-editing/index.vue
+++ b/src/views/message-management/message-editing/index.vue
@@ -5,6 +5,23 @@ import RichEditor from '@/views/message-management/message-editing/rich-editor.v
 import { formState } from '@/views/message-management/message-editing/utils/hooks';
 import MarkdownEditor from '@/views/message-management/message-editing/markdown-editor.vue';
 import { settingLR } from '@/views/message-management/message-editing/utils/columns';
+import { onMounted } from 'vue';
+import { useRouter } from 'vue-router';
+
+const router = useRouter();
+
+/** 退出提醒 */
+const exitAlter = () => {
+	window.addEventListener('beforeunload', function (e) {
+		e.preventDefault();
+		// 为了兼容旧版浏览器
+		e.returnValue = '';
+	});
+};
+
+onMounted(() => {
+	exitAlter();
+});
 </script>
 
 <template>