|
|
@@ -18,84 +18,84 @@ const notificationTypeList = ref({
|
|
|
Feature_Update: 'Feature Update'
|
|
|
})
|
|
|
|
|
|
-const notificationList = ref<any[]>([])
|
|
|
-// const notificationList = [
|
|
|
-// {
|
|
|
-// notificationType: 'feature',
|
|
|
-// info: {
|
|
|
-// isRead: true,
|
|
|
-// title: 'Feature Update',
|
|
|
-// header: 'New feature online: Quick search has been released!',
|
|
|
-// content:
|
|
|
-// 'We are pleased to announce that the quick search function is now officially online! You can now quickly find what you need by entering keywords, greatly improving your work efficiency. Go and experience it!'
|
|
|
-// }
|
|
|
-// },
|
|
|
-// {
|
|
|
-// notificationType: 'event',
|
|
|
-// info: {
|
|
|
-// type: 'milestone',
|
|
|
-// isMultiple: true,
|
|
|
-// numericRecords: 3,
|
|
|
-// isRead: true,
|
|
|
-// title: 'Milestone Update',
|
|
|
-// mode: 'Ocean Freight',
|
|
|
-// no: 'HBOL: SHJN2301234',
|
|
|
-// tag: 'Booking Confirmed',
|
|
|
-// location: 'Hong Kong',
|
|
|
-// time: 'Jan 10, 2025 14:30 UTC+8',
|
|
|
-// info: {
|
|
|
-// route: ['Hong Kong', 'Shanghai', 'Ningbo']
|
|
|
-// }
|
|
|
-// }
|
|
|
-// },
|
|
|
-// {
|
|
|
-// notificationType: 'password',
|
|
|
-// info: {
|
|
|
-// title: 'Password Notifications',
|
|
|
-// isExpiration: true,
|
|
|
-// tips: 'Password Expiration in 311 Days',
|
|
|
-// content:
|
|
|
-// 'Your password will expire in 7 days. To ensure the security of your account, please change your password as soon as possible.'
|
|
|
-// }
|
|
|
-// },
|
|
|
-// {
|
|
|
-// notificationType: 'password',
|
|
|
-// info: {
|
|
|
-// isRead: false,
|
|
|
-// title: 'Password Notifications',
|
|
|
-// isExpiration: false,
|
|
|
-// tips: 'Password Expiration in 3 Days',
|
|
|
-// content:
|
|
|
-// 'Your password will expire in 7 days. To ensure the security of your account, please change your password as soon as possible.'
|
|
|
-// }
|
|
|
-// },
|
|
|
-// {
|
|
|
-// notificationType: 'password',
|
|
|
-// info: {
|
|
|
-// isRead: true,
|
|
|
-// title: 'Password Notifications',
|
|
|
-// isExpiration: true,
|
|
|
-// tips: 'Password Expiration in 31111 Days',
|
|
|
-// content:
|
|
|
-// 'Your password will expire in 7 days. To ensure the security of your account, please change your password as soon as possible.'
|
|
|
-// }
|
|
|
-// }
|
|
|
-// ]
|
|
|
+// const notificationList = ref<any[]>([])
|
|
|
+const notificationList = [
|
|
|
+ {
|
|
|
+ notificationType: 'feature',
|
|
|
+ info: {
|
|
|
+ isRead: true,
|
|
|
+ title: 'Feature Update',
|
|
|
+ header: 'New feature online: Quick search has been released!',
|
|
|
+ content:
|
|
|
+ 'We are pleased to announce that the quick search function is now officially online! You can now quickly find what you need by entering keywords, greatly improving your work efficiency. Go and experience it!'
|
|
|
+ }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ notificationType: 'event',
|
|
|
+ info: {
|
|
|
+ type: 'milestone',
|
|
|
+ isMultiple: true,
|
|
|
+ numericRecords: 3,
|
|
|
+ isRead: true,
|
|
|
+ title: 'Milestone Update',
|
|
|
+ mode: 'Ocean Freight',
|
|
|
+ no: 'HBOL: SHJN2301234',
|
|
|
+ tag: 'Booking Confirmed',
|
|
|
+ location: 'Hong Kong',
|
|
|
+ time: 'Jan 10, 2025 14:30 UTC+8',
|
|
|
+ info: {
|
|
|
+ route: ['Hong Kong', 'Shanghai', 'Ningbo']
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ notificationType: 'password',
|
|
|
+ info: {
|
|
|
+ title: 'Password Notifications',
|
|
|
+ isExpiration: true,
|
|
|
+ tips: 'Password Expiration in 311 Days',
|
|
|
+ content:
|
|
|
+ 'Your password will expire in 7 days. To ensure the security of your account, please change your password as soon as possible.'
|
|
|
+ }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ notificationType: 'password',
|
|
|
+ info: {
|
|
|
+ isRead: false,
|
|
|
+ title: 'Password Notifications',
|
|
|
+ isExpiration: false,
|
|
|
+ tips: 'Password Expiration in 3 Days',
|
|
|
+ content:
|
|
|
+ 'Your password will expire in 7 days. To ensure the security of your account, please change your password as soon as possible.'
|
|
|
+ }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ notificationType: 'password',
|
|
|
+ info: {
|
|
|
+ isRead: true,
|
|
|
+ title: 'Password Notifications',
|
|
|
+ isExpiration: true,
|
|
|
+ tips: 'Password Expiration in 31111 Days',
|
|
|
+ content:
|
|
|
+ 'Your password will expire in 7 days. To ensure the security of your account, please change your password as soon as possible.'
|
|
|
+ }
|
|
|
+ }
|
|
|
+]
|
|
|
|
|
|
const getNotificationList = () => {
|
|
|
- loading.value = true
|
|
|
- $api
|
|
|
- .getNotificationList({
|
|
|
- rules_type: 'Milestone_Update'
|
|
|
- })
|
|
|
- .then((res) => {
|
|
|
- if (res.code === 200) {
|
|
|
- notificationList.value = res.data
|
|
|
- }
|
|
|
- })
|
|
|
- .finally(() => {
|
|
|
- loading.value = false
|
|
|
- })
|
|
|
+ // loading.value = true
|
|
|
+ // $api
|
|
|
+ // .getNotificationList({
|
|
|
+ // rules_type: notificationType.value
|
|
|
+ // })
|
|
|
+ // .then((res) => {
|
|
|
+ // if (res.code === 200) {
|
|
|
+ // notificationList.value = res.data
|
|
|
+ // }
|
|
|
+ // })
|
|
|
+ // .finally(() => {
|
|
|
+ // loading.value = false
|
|
|
+ // })
|
|
|
}
|
|
|
|
|
|
const handleMarkAllRead = () => {
|
|
|
@@ -138,7 +138,7 @@ const clearData = () => {
|
|
|
</el-select>
|
|
|
</template>
|
|
|
<template #default>
|
|
|
- <div v-vloading="loading" style="height: 100%">
|
|
|
+ <el-scrollbar v-vloading="loading" style="height: 100%">
|
|
|
<div class="notification-header">
|
|
|
<el-button @click="handleMarkAllRead" class="mark-all-read el-button--text" size="small">
|
|
|
<span class="font_family icon-icon_confirm_b show-icon"></span>
|
|
|
@@ -165,7 +165,7 @@ const clearData = () => {
|
|
|
<div class="notification-content">
|
|
|
<NotificationMessageCard :data="notificationList" />
|
|
|
</div>
|
|
|
- </div>
|
|
|
+ </el-scrollbar>
|
|
|
</template>
|
|
|
</el-drawer>
|
|
|
</template>
|
|
|
@@ -173,6 +173,7 @@ const clearData = () => {
|
|
|
div.layout-toolbar {
|
|
|
.notification-content {
|
|
|
padding: 16px;
|
|
|
+ background-color: var(--color-dialog-body-bg);
|
|
|
}
|
|
|
.password-notifications {
|
|
|
margin-bottom: 16px;
|
|
|
@@ -286,7 +287,7 @@ div.layout-toolbar {
|
|
|
height: 40px;
|
|
|
padding: 0 16px;
|
|
|
line-height: 40px;
|
|
|
- background-color: white;
|
|
|
+ background-color: var(--color-dialog-body-bg);
|
|
|
border-bottom: 1px solid var(--color-border);
|
|
|
.mark-all-read {
|
|
|
span {
|
zhouyuhao