Forráskód Böngészése

fix: Message 代码找回

lanceJiang 1 éve
szülő
commit
a2459c9275
1 módosított fájl, 21 hozzáadás és 5 törlés
  1. 21 5
      src/layout/components/Header/components/Message.vue

+ 21 - 5
src/layout/components/Header/components/Message.vue

@@ -16,7 +16,7 @@
 				<template #label> {{ v.label }}({{ v.list.length }}) </template>
 				<template v-if="v.list.length">
 					<div class="message-list">
-						<div v-for="item of v.list" :key="item.id" class="message-item">
+						<div v-for="item of v.list" :key="item.id" class="message-item" @click="jumpMessageDetail(item.id)">
 							<!--<img src="" alt="" class="message-icon" />-->
 							<div class="message-content">
 								<div class="message-title">
@@ -26,6 +26,7 @@
 								<span class="message-txt">{{ item.content }}</span>
 							</div>
 						</div>
+						<div class="message-fix-item" @click="jumpMessageInfo">查看更多</div>
 					</div>
 				</template>
 				<template v-else>
@@ -39,6 +40,7 @@
 <script setup lang="ts">
 import { ref, reactive } from 'vue'
 import { getMessage } from '@/api/system/message'
+import router from '@/router'
 // noticeList  通知     messageList   消息     todoList   待办
 const tabsConfig = reactive({
 	noticeList: {
@@ -53,7 +55,7 @@ const tabsConfig = reactive({
 	},
 	todoList: {
 		name: 'todoList',
-		label: '办',
+		label: '办',
 		list: []
 	}
 })
@@ -72,6 +74,14 @@ getMessage().then(res => {
 	})
 	total.value = _total
 })
+
+const jumpMessageInfo = () => {
+	router.push('/message/list')
+}
+
+const jumpMessageDetail = (id: any) => {
+	router.push('/message/list?id=' + id)
+}
 </script>
 
 <style scoped lang="scss">
@@ -85,6 +95,7 @@ getMessage().then(res => {
 		align-items: center;
 		padding: 8px 0;
 		border-bottom: 1px solid var(--el-border-color-light);
+		cursor: pointer;
 		&:last-child {
 			border: none;
 		}
@@ -113,8 +124,13 @@ getMessage().then(res => {
 			}
 		}
 	}
-}
-.menu--message-trigger {
-	height: 100%;
+	.message-fix-item {
+		// flex 居中
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		height: 40px;
+		cursor: pointer;
+	}
 }
 </style>