From 2bda0940cf7d047e84c88ed057496e45f3607743 Mon Sep 17 00:00:00 2001
From: bunny <1319900154@qq.com>
Date: Thu, 31 Oct 2024 16:58:10 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=F0=9F=9A=80=20=E6=B6=88=E6=81=AF?=
 =?UTF-8?q?=E5=8F=91=E9=80=81=E9=A1=B5=E9=9D=A2=E7=AE=80=E4=BB=8B=E8=BF=98?=
 =?UTF-8?q?=E5=B7=AE=E5=9B=BE=E7=89=87=E5=B0=81=E9=9D=A2=E6=9C=AA=E6=B7=BB?=
 =?UTF-8?q?=E5=8A=A0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../lay-notice/components/NoticeItem.vue      |  2 +-
 src/layout/components/lay-notice/data.ts      | 80 ++++++++++++-------
 src/layout/components/lay-notice/index.vue    | 19 +++--
 .../messageEditing/message-editor-from.vue    |  6 +-
 .../messageEditing/utils/columns.ts           |  2 +
 .../messageEditing/utils/hooks.ts             |  2 +
 6 files changed, 76 insertions(+), 35 deletions(-)

diff --git a/src/layout/components/lay-notice/components/NoticeItem.vue b/src/layout/components/lay-notice/components/NoticeItem.vue
index 392ef2c..5199c5f 100644
--- a/src/layout/components/lay-notice/components/NoticeItem.vue
+++ b/src/layout/components/lay-notice/components/NoticeItem.vue
@@ -43,7 +43,7 @@ function hoverDescription(event, description) {
 
 <template>
 	<div class="notice-container border-b-[1px] border-solid border-[#f0f0f0] dark:border-[#303030]">
-		<el-avatar v-if="noticeItem.avatar" :size="30" :src="noticeItem.avatar" class="notice-container-avatar" />
+		<el-avatar v-if="noticeItem.cover" :size="30" :src="noticeItem.cover" class="notice-container-avatar" />
 		<div class="notice-container-text">
 			<div class="notice-text-title text-[#000000d9] dark:text-white">
 				<el-tooltip :content="noticeItem.title" :disabled="!titleTooltip" :effect="tooltipEffect" :enterable="!isMobile" placement="top-start" popper-class="notice-title-popper">
diff --git a/src/layout/components/lay-notice/data.ts b/src/layout/components/lay-notice/data.ts
index 5195308..ec0213a 100644
--- a/src/layout/components/lay-notice/data.ts
+++ b/src/layout/components/lay-notice/data.ts
@@ -1,7 +1,9 @@
 import { $t } from '@/plugins/i18n';
+import { ref } from 'vue';
+import { fetchGetMessageList } from '@/api/v1/message';
 
 export interface ListItem {
-	avatar: string;
+	cover: string;
 	title: string;
 	datetime: string;
 	type: string;
@@ -17,30 +19,52 @@ export interface TabItem {
 	emptyText: string;
 }
 
-// {
-//   avatar: 'https://xiaoxian521.github.io/hyperlink/svg/smile1.svg',
-//     title: '小铭 评论了你',
-//   description: '诚在于心，信在于行，诚信在于心行合一。',
-//   datetime: '今天',
-//   type: '2',
-// },
-export const noticesData: TabItem[] = [
-	{
-		key: '1',
-		name: $t('status.pureNotify'),
-		list: [],
-		emptyText: $t('status.pureNoNotify'),
-	},
-	{
-		key: '2',
-		name: $t('status.pureMessage'),
-		list: [],
-		emptyText: $t('status.pureNoMessage'),
-	},
-	{
-		key: '3',
-		name: $t('status.pureTodo'),
-		list: [],
-		emptyText: $t('status.pureNoTodo'),
-	},
-];
+// 请求参数
+const form = { status: false, currentPage: 1, pageSize: 100 };
+// 响应内容
+export const noticesData = ref<TabItem[]>([]);
+
+/** 获取所有消息 */
+export const getAllMessageList = async () => {
+	const baseResult = await fetchGetMessageList(form);
+	const datalist = baseResult.data.list;
+
+	// 通知消息
+	const notifications = datalist
+		.filter(message => message.messageType === 'notifications')
+		.map(message => ({
+			cover: message.cover,
+			description: message.summary,
+			title: message.title,
+			datetime: message.createTime,
+			type: '1',
+		})) as ListItem[];
+
+	// 消息
+	const notify = datalist
+		.filter(message => message.messageType !== 'notifications' && message.messageType !== 'sys')
+		.map(message => ({
+			cover: message.cover,
+			description: message.summary,
+			title: message.title,
+			datetime: message.createTime,
+			type: '2',
+		})) as ListItem[];
+
+	// 系统消息
+	const system = datalist
+		.filter(message => message.messageType === 'sys')
+		.map(message => ({
+			cover: message.cover,
+			description: message.summary,
+			title: message.title,
+			datetime: message.createTime,
+			type: '3',
+		})) as ListItem[];
+
+	noticesData.value = [
+		{ key: '1', name: $t('status.pureNotify'), list: notifications, emptyText: $t('status.pureNoNotify') },
+		{ key: '2', name: $t('status.pureMessage'), list: notify, emptyText: $t('status.pureNoMessage') },
+		{ key: '3', name: $t('status.systemMessage'), list: system, emptyText: $t('status.systemMessage') },
+	];
+};
diff --git a/src/layout/components/lay-notice/index.vue b/src/layout/components/lay-notice/index.vue
index bc48a79..e2d0866 100644
--- a/src/layout/components/lay-notice/index.vue
+++ b/src/layout/components/lay-notice/index.vue
@@ -1,18 +1,27 @@
 <script lang="ts" setup>
 import { useI18n } from 'vue-i18n';
-import { computed, ref } from 'vue';
-import { noticesData } from './data';
+import { computed, onMounted, ref } from 'vue';
+import { getAllMessageList, noticesData } from './data';
 import NoticeList from './components/NoticeList.vue';
 import BellIcon from '@iconify-icons/ep/bell';
 
 const { t } = useI18n();
 const noticesNum = ref(0);
+// 通知消息数据
 const notices = ref(noticesData);
-const activeKey = ref(noticesData[0]?.key);
-
-notices.value.map(v => (noticesNum.value += v.list.length));
+// 选择的消息栏目
+const activeKey = ref(noticesData.value[0]?.key);
 
 const getLabel = computed(() => item => item.name + (item.list.length > 0 ? `(${item.list.length})` : ''));
+
+onMounted(async () => {
+	// 获取所有的消息
+	await getAllMessageList();
+	// 整合消息一共多少条
+	notices.value.map(v => (noticesNum.value += v.list.length));
+	// 默认选中的消息类别
+	activeKey.value = noticesData.value[0]?.key;
+});
 </script>
 
 <template>
diff --git a/src/views/messageManagement/messageEditing/message-editor-from.vue b/src/views/messageManagement/messageEditing/message-editor-from.vue
index 8dc551e..3098105 100644
--- a/src/views/messageManagement/messageEditing/message-editor-from.vue
+++ b/src/views/messageManagement/messageEditing/message-editor-from.vue
@@ -107,7 +107,11 @@ onMounted(() => {
 		<!-- 是否已读 -->
 		<el-form-item :label="$t('isRead')" prop="status">
 			<el-switch v-model="formState.status" :active-text="$t('readAlready')" :active-value="true" :inactive-text="$t('unread')" :inactive-value="false" :style="switchStyle" inline-prompt />
-			<!--<el-switch v-model="formState.status" />-->
+		</el-form-item>
+
+		<!-- 简介 -->
+		<el-form-item :label="$t('summary')" prop="summary">
+			<el-input v-model="formState.summary" :autosize="{ minRows: 3, maxRows: 6 }" maxlength="200" minlength="10" show-word-limit type="textarea" />
 		</el-form-item>
 
 		<!-- 提交 -->
diff --git a/src/views/messageManagement/messageEditing/utils/columns.ts b/src/views/messageManagement/messageEditing/utils/columns.ts
index cf33cbe..a477b48 100644
--- a/src/views/messageManagement/messageEditing/utils/columns.ts
+++ b/src/views/messageManagement/messageEditing/utils/columns.ts
@@ -9,4 +9,6 @@ export const rules = {
 	content: [{ required: true, message: `${$t('input')}${$t('content')}`, trigger: 'blur' }],
 	// 编辑器类型
 	editorType: [{ required: true, message: `${$t('input')}${$t('editorType')}`, trigger: 'blur' }],
+	// 消息简介
+	summary: [{ required: true, message: `${$t('input')}${$t('summary')}`, trigger: 'blur' }],
 };
diff --git a/src/views/messageManagement/messageEditing/utils/hooks.ts b/src/views/messageManagement/messageEditing/utils/hooks.ts
index af50dd4..1bb3be4 100644
--- a/src/views/messageManagement/messageEditing/utils/hooks.ts
+++ b/src/views/messageManagement/messageEditing/utils/hooks.ts
@@ -8,4 +8,6 @@ export const formState = reactive({
 	content: '',
 	editorType: 'markdown',
 	status: false,
+	summary: '',
+	cover: '',
 });