Mauve
762 lines
20 KiB
Vue
762 lines
20 KiB
Vue
<template>
|
|
<view>
|
|
<u-navbar
|
|
:safeAreaInsetTop="true"
|
|
:placeholder="true"
|
|
:title="title"
|
|
:fixed="true"
|
|
:autoBack="true"
|
|
leftIconColor="#ffffff"
|
|
bgColor="#C39A4B"
|
|
titleStyle="font-weight:bold;color:#ffffff;"
|
|
>
|
|
<view
|
|
v-if="activeTabKey === 'approval' && canViewApproval && hasSelectedDate"
|
|
class="hz-nav-filter-clear"
|
|
slot="right"
|
|
@click="clearDateFilter"
|
|
>
|
|
<u-icon
|
|
size="28px"
|
|
name="../../static/images/filter-clear.svg"
|
|
></u-icon>
|
|
</view>
|
|
<view
|
|
v-if="activeTabKey === 'notification' && canViewNotification"
|
|
class="hz-nav-read-all"
|
|
slot="right"
|
|
@click="onReadAllClick"
|
|
>
|
|
<image src="/static/images/read_all.png" class="hz-nav-read-all-img"></image>
|
|
</view>
|
|
</u-navbar>
|
|
|
|
<u-tabs
|
|
v-if="shouldShowTabs"
|
|
:list="visibleTabList"
|
|
lineColor="#C39A4B"
|
|
lineWidth="36"
|
|
inactiveStyle="color: #c0c0c0; font-weight: bold;"
|
|
activeStyle="color: #C39A4B; font-weight: bold;"
|
|
:scrollable="false"
|
|
:current="tabIndex"
|
|
@change="tabChange"
|
|
>
|
|
</u-tabs>
|
|
|
|
<!-- Limo Notification -->
|
|
<view v-show="activeTabKey === 'notification' && canViewNotification">
|
|
<view v-if="!showNotification">
|
|
<view class="hz-flex-row approval-empty-img-row">
|
|
<image src="/static/images/datanull.png" class="approval-empty-img"></image>
|
|
</view>
|
|
<view class="hz-flex-row hz-font-bolder hz-font-md approval-empty-text-row">
|
|
{{ dataNull }}
|
|
</view>
|
|
</view>
|
|
<view
|
|
v-else
|
|
class="notice-card"
|
|
v-for="(notice, index) in limoNoticeList"
|
|
:key="notice.id != null ? notice.id : index"
|
|
@click="onNoticeCardClick(notice)"
|
|
:style="getNoticeCardStyle(notice)"
|
|
>
|
|
<image class="icon" :src="notice.icon" mode="aspectFill"></image>
|
|
<view class="info">
|
|
<view class="notice-type">{{ notice.type }}</view>
|
|
<view class="notice-title">{{ notice.title }}</view>
|
|
<view class="notice-desc">{{ notice.desc }}</view>
|
|
<view class="notice-time">{{ notice.time }}</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- Approval Routing -->
|
|
<view v-show="activeTabKey === 'approval' && canViewApproval">
|
|
<view class="hz-spacing hz-mr-t-20 hz-flex-row approval-search-row">
|
|
<u-search
|
|
:placeholder="searchHolder"
|
|
v-model="searchInputStr"
|
|
:showAction="false"
|
|
bgColor="#ffffff"
|
|
:label="searchLabel"
|
|
borderColor="gray"
|
|
class="approval-search-input"
|
|
@search="searchApprovalByPlayerId"
|
|
></u-search>
|
|
<u-icon
|
|
name="calendar"
|
|
:size="45"
|
|
:color="calendarIconColor"
|
|
@click="showCalendar = true"
|
|
></u-icon>
|
|
</view>
|
|
|
|
<view v-if="!showApprovalList">
|
|
<view class="hz-flex-row approval-empty-img-row">
|
|
<image src="/static/images/datanull.png" class="approval-empty-img"></image>
|
|
</view>
|
|
<view class="hz-flex-row hz-font-bolder hz-font-md approval-empty-text-row">
|
|
{{ dataNull }}
|
|
</view>
|
|
</view>
|
|
<view v-else>
|
|
<uni-card
|
|
v-for="(approvalRecord, index) in approvalList"
|
|
:key="index"
|
|
@click="toDetail(approvalRecord.playerId)"
|
|
>
|
|
<view class="notification-content">
|
|
<view class="icon-container">
|
|
<image src="/static/images/task.png" class="task-icon"></image>
|
|
</view>
|
|
<view class="notification-info">
|
|
<view class="notification-title">
|
|
{{ $t("notification.pendingApprovalRequest") }}
|
|
</view>
|
|
<view class="notification-date">
|
|
{{ approvalRecord.createdAt }}
|
|
</view>
|
|
</view>
|
|
<view class="notification-time">
|
|
{{ getTimeAgo(approvalRecord.createdAt) }}
|
|
</view>
|
|
</view>
|
|
<view class="notification-detail">
|
|
{{ approvalRecord.memberLastName }}, {{ approvalRecord.playerId }} ({{ approvalRecord.tier }}), {{ approvalRecord.propertyName }}, {{ approvalRecord.roomTypeCode }}, {{ approvalRecord.checkinDate }} to {{ approvalRecord.checkoutDate }}, {{ approvalRecord.booker }}
|
|
</view>
|
|
</uni-card>
|
|
</view>
|
|
</view>
|
|
|
|
<u-empty
|
|
v-if="!hasAnyViewPermission"
|
|
mode="list"
|
|
:text="$t('notification.noPermission')"
|
|
></u-empty>
|
|
|
|
<u-calendar
|
|
v-if="activeTabKey === 'approval' && canViewApproval"
|
|
:show="showCalendar"
|
|
@close="showCalendar = false"
|
|
:confirmText="confirmText"
|
|
:confirmDisabledText="confirmText"
|
|
color="#C39A4B"
|
|
:allowSameDay="true"
|
|
:startText="startText"
|
|
:endText="endText"
|
|
mode="range"
|
|
:showMark="false"
|
|
title=""
|
|
@confirm="handleFilterDate"
|
|
:defaultDate="selectedDate"
|
|
>
|
|
</u-calendar>
|
|
|
|
<u-modal
|
|
:content="msgStr"
|
|
:show="showMsg"
|
|
:confirmText="yesText"
|
|
:showCancelButton="false"
|
|
closeOnClickOverlay
|
|
@confirm="showMsg = false"
|
|
confirmColor="#C39A4B"
|
|
@close="showMsg = false"
|
|
></u-modal>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import { getNotificationByUserId, changeNotification, countNotification, readAllNotification } from '../../api/notificationApi.js'
|
|
import { getApprovalList } from '../../api/approvalApi.js'
|
|
|
|
export default {
|
|
data() {
|
|
return {
|
|
title: this.$t('notification.title'),
|
|
userData: null,
|
|
tabList: [
|
|
{ name: this.$t('notification.title'), key: 'notification' },
|
|
{ name: this.$t('approvalRouting.title'), key: 'approval' }
|
|
],
|
|
tabIndex: 0,
|
|
activeTabKey: 'notification',
|
|
pendingTabKey: '',
|
|
limoNoticeList: [],
|
|
limoEmptyText: this.$t('notification.noData'),
|
|
searchInputStr: '',
|
|
approvalList: [],
|
|
showApprovalList: true,
|
|
dataNull: this.$t('notification.noData'),
|
|
searchHolder: this.$t('approval.searchStr'),
|
|
calendarIconColor: '#000000',
|
|
showCalendar: false,
|
|
confirmText: this.$t('common.confirm').toUpperCase(),
|
|
startText: this.$t('common.start'),
|
|
endText: this.$t('common.end'),
|
|
selectedDate: [],
|
|
searchLabel: this.$t('common.playerId'),
|
|
msgStr: '',
|
|
showMsg: false,
|
|
yesText: this.$t('common.yes'),
|
|
notificationCount: 0,
|
|
approvalRoutingCount: 0,
|
|
showNotification: false
|
|
}
|
|
},
|
|
computed: {
|
|
effectiveUserData() {
|
|
return this.getEffectiveUserData(this.userData);
|
|
},
|
|
canViewNotification() {
|
|
return !!(this.effectiveUserData && this.effectiveUserData.canViewNotification === true);
|
|
},
|
|
canViewApproval() {
|
|
return !!(this.effectiveUserData && this.effectiveUserData.canViewApproval === true);
|
|
},
|
|
visibleTabList() {
|
|
return this.tabList.filter((tab) => {
|
|
if (tab.key === 'notification') {
|
|
return this.canViewNotification;
|
|
}
|
|
if (tab.key === 'approval') {
|
|
return this.canViewApproval;
|
|
}
|
|
return false;
|
|
}).map((tab) => ({
|
|
...tab,
|
|
badge: this.getTabBadge(tab.key)
|
|
}));
|
|
},
|
|
shouldShowTabs() {
|
|
return this.visibleTabList.length > 1;
|
|
},
|
|
pageTitle() {
|
|
if (this.visibleTabList.length === 1) {
|
|
return this.visibleTabList[0].name;
|
|
}
|
|
return this.$t('notification.title');
|
|
},
|
|
hasAnyViewPermission() {
|
|
return this.visibleTabList.length > 0;
|
|
},
|
|
hasSelectedDate() {
|
|
return Array.isArray(this.selectedDate) && this.selectedDate.length > 0;
|
|
}
|
|
},
|
|
onLoad(options) {
|
|
if (options && options.tab != null && options.tab !== '') {
|
|
const tab = Number(options.tab);
|
|
if (tab === 1) {
|
|
this.pendingTabKey = 'approval';
|
|
this.activeTabKey = 'approval';
|
|
}
|
|
}
|
|
this.applyNotificationCountsFromOptions(options || {});
|
|
},
|
|
onShow() {
|
|
this.userData = uni.getStorageSync('userData');
|
|
this.syncVisibleTabState(this.pendingTabKey || this.activeTabKey);
|
|
this.syncPageTitle();
|
|
this.pendingTabKey = '';
|
|
this.fetchNotificationCounts();
|
|
this.fetchActiveTabData();
|
|
},
|
|
methods: {
|
|
getEffectiveUserData(userData) {
|
|
if (userData && userData.data && typeof userData.data === 'object') {
|
|
return userData.data;
|
|
}
|
|
return userData || {};
|
|
},
|
|
applyNotificationCountsFromOptions(options) {
|
|
this.notificationCount = this.parseCountValue(options.notificationCount);
|
|
this.approvalRoutingCount = this.parseCountValue(options.approvalRoutingCount);
|
|
},
|
|
parseCountValue(value) {
|
|
const count = Number(value);
|
|
return Number.isFinite(count) && count > 0 ? count : 0;
|
|
},
|
|
getTabBadge(tabKey) {
|
|
const count = tabKey === 'approval'
|
|
? this.approvalRoutingCount
|
|
: this.notificationCount;
|
|
if (count <= 0) {
|
|
return {
|
|
show: false,
|
|
value: 0
|
|
};
|
|
}
|
|
return {
|
|
show: true,
|
|
value: count,
|
|
max: 99,
|
|
bgColor: '#fa3534',
|
|
color: '#ffffff',
|
|
customStyle: {
|
|
transform: 'translateY(-2px)',
|
|
fontSize: '10px',
|
|
lineHeight: '10px',
|
|
padding: '1px 4px'
|
|
}
|
|
};
|
|
},
|
|
parseNotificationCounts(res) {
|
|
const data = res && res.data && typeof res.data === 'object' ? res.data : (res || {});
|
|
return {
|
|
notificationCount: this.parseCountValue(data.notificationCount ?? data.NotificationCount),
|
|
approvalRoutingCount: this.parseCountValue(data.approvalRoutingCount ?? data.ApprovalRoutingCount)
|
|
};
|
|
},
|
|
async fetchNotificationCounts() {
|
|
const userId = this.getUserIdFromUserData(this.userData);
|
|
if (!userId || !this.hasAnyViewPermission) {
|
|
this.notificationCount = 0;
|
|
this.approvalRoutingCount = 0;
|
|
return;
|
|
}
|
|
try {
|
|
const res = await countNotification({ userId });
|
|
const counts = this.parseNotificationCounts(res);
|
|
if (this.canViewNotification) {
|
|
this.notificationCount = counts.notificationCount;
|
|
}
|
|
if (this.canViewApproval) {
|
|
this.approvalRoutingCount = counts.approvalRoutingCount;
|
|
}
|
|
} catch (error) {
|
|
console.error('[Notification] countNotification failed', error);
|
|
}
|
|
},
|
|
syncVisibleTabState(preferredKey) {
|
|
const tabs = this.visibleTabList;
|
|
if (!tabs.length) {
|
|
this.tabIndex = 0;
|
|
this.activeTabKey = '';
|
|
this.showCalendar = false;
|
|
this.syncPageTitle();
|
|
return;
|
|
}
|
|
const nextIndex = tabs.findIndex((tab) => tab.key === preferredKey);
|
|
this.tabIndex = nextIndex >= 0 ? nextIndex : 0;
|
|
this.activeTabKey = tabs[this.tabIndex].key;
|
|
if (this.activeTabKey !== 'approval') {
|
|
this.showCalendar = false;
|
|
}
|
|
this.syncPageTitle();
|
|
},
|
|
syncPageTitle() {
|
|
this.title = this.pageTitle;
|
|
},
|
|
fetchActiveTabData() {
|
|
if (this.activeTabKey === 'notification' && this.canViewNotification) {
|
|
this.fetchNotificationList();
|
|
return;
|
|
}
|
|
if (this.activeTabKey === 'approval' && this.canViewApproval) {
|
|
this.getApprovalList();
|
|
}
|
|
},
|
|
getUserIdFromUserData(userData) {
|
|
const realUserData = this.getEffectiveUserData(userData);
|
|
if (userData == null || userData === '') {
|
|
return '';
|
|
}
|
|
const userId = realUserData.userId != null && realUserData.userId !== ''
|
|
? realUserData.userId
|
|
: realUserData.UserId;
|
|
return userId != null && userId !== '' ? userId : '';
|
|
},
|
|
unwrapNotificationList(response) {
|
|
if (Array.isArray(response)) {
|
|
return response;
|
|
}
|
|
if (response && Array.isArray(response.notifications)) {
|
|
return response.notifications;
|
|
}
|
|
if (response && Array.isArray(response.data)) {
|
|
return response.data;
|
|
}
|
|
if (response && Array.isArray(response.records)) {
|
|
return response.records;
|
|
}
|
|
if (response && Array.isArray(response.Records)) {
|
|
return response.Records;
|
|
}
|
|
return [];
|
|
},
|
|
formatNotificationTime(value) {
|
|
if (value == null || value === '') {
|
|
return '';
|
|
}
|
|
const timestamp = Number(value);
|
|
if (!Number.isFinite(timestamp)) {
|
|
return String(value);
|
|
}
|
|
const date = new Date(timestamp);
|
|
if (Number.isNaN(date.getTime())) {
|
|
return String(value);
|
|
}
|
|
const pad = (num) => String(num).padStart(2, '0');
|
|
return `${date.getFullYear()}-${pad(date.getMonth() + 1)}-${pad(date.getDate())} ${pad(date.getHours())}:${pad(date.getMinutes())}`;
|
|
},
|
|
getNoticeCardStyle(notice) {
|
|
if (notice && Number(notice.status) === 0) {
|
|
return { backgroundColor: '#F7F2E8' };
|
|
}
|
|
return {};
|
|
},
|
|
async onReadAllClick() {
|
|
try {
|
|
const res = await readAllNotification({});
|
|
if (res.success == true) {
|
|
this.fetchNotificationCounts();
|
|
this.fetchNotificationList();
|
|
} else {
|
|
this.msgStr = res.message;
|
|
this.showMsg = true;
|
|
}
|
|
} catch (error) {
|
|
console.error('[Notification] readAllNotification failed', error);
|
|
}
|
|
},
|
|
mapNotificationItem(item, index) {
|
|
const content = item.content || '';
|
|
return {
|
|
id: item.id != null ? item.id : index,
|
|
type: 'Limo',
|
|
title: item.title || '',
|
|
desc: content,
|
|
confNo: item.confirmationNo,
|
|
time: this.formatNotificationTime(item.createdAt || item.updatedAt),
|
|
status: item.status != null ? Number(item.status) : 1,
|
|
icon: '/static/images/limo_notification.png'
|
|
};
|
|
},
|
|
updateNotificationLists(list) {
|
|
this.limoNoticeList = list
|
|
.map((item, index) => this.mapNotificationItem(item, index))
|
|
.sort((a, b) => {
|
|
const statusA = a.status != null ? Number(a.status) : 1;
|
|
const statusB = b.status != null ? Number(b.status) : 1;
|
|
return statusA - statusB;
|
|
});
|
|
},
|
|
async fetchNotificationList() {
|
|
const userId = this.getUserIdFromUserData(this.userData);
|
|
if (!userId) {
|
|
console.warn('[Notification] userId not found in userData cache');
|
|
return;
|
|
}
|
|
uni.showLoading({
|
|
title: this.$t('common.loading')
|
|
});
|
|
try {
|
|
const res = await getNotificationByUserId();
|
|
if(res.success == true){
|
|
this.showNotification = true;
|
|
const list = this.unwrapNotificationList(res);
|
|
this.updateNotificationLists(list);
|
|
}else {
|
|
this.msgStr = res.message;
|
|
this.showNotification = false;
|
|
if (res.code === 'NO_PERMISSION') {
|
|
this.dataNull = this.$t('notification.noPermission');
|
|
}
|
|
}
|
|
} catch (error) {
|
|
console.error('[Notification] getNotificationByUserId failed', error);
|
|
} finally {
|
|
uni.hideLoading();
|
|
}
|
|
},
|
|
tabChange(e) {
|
|
const index = e && e.index != null ? e.index : e;
|
|
const selectedTab = this.visibleTabList[index];
|
|
if (!selectedTab) {
|
|
return;
|
|
}
|
|
this.tabIndex = index;
|
|
this.activeTabKey = selectedTab.key;
|
|
this.fetchActiveTabData();
|
|
},
|
|
extractConfNoFromContent(content) {
|
|
if (content == null || content === '') {
|
|
return '';
|
|
}
|
|
const match = String(content).match(/confNo#([A-Za-z0-9]+)/i);
|
|
return match ? match[1] : '';
|
|
},
|
|
async onNoticeCardClick(notice) {
|
|
if (!notice || notice.id == null || notice.id === '') {
|
|
uni.showToast({
|
|
title: 'Notification id not found',
|
|
icon: 'none'
|
|
});
|
|
return;
|
|
}
|
|
if (!notice.confNo) {
|
|
uni.showToast({
|
|
title: 'ConfNo not found',
|
|
icon: 'none'
|
|
});
|
|
return;
|
|
}
|
|
try {
|
|
await changeNotification({ id: notice.id });
|
|
this.fetchNotificationCounts();
|
|
} catch (error) {
|
|
console.error('[Notification] changeNotification failed', error);
|
|
}
|
|
if(notice.confNo!=null && notice.confNo!='' && notice.confNo!=undefined){
|
|
this.navTo(
|
|
'/limo/bookingDetail/bookingDetail?conf=' +
|
|
notice.confNo +
|
|
'&from=notification',
|
|
0,
|
|
false
|
|
);
|
|
}else{
|
|
|
|
}
|
|
|
|
},
|
|
handleFilterDate(e) {
|
|
this.selectedDate = e;
|
|
this.showCalendar = false;
|
|
|
|
if (Array.isArray(this.selectedDate) && this.selectedDate.length > 0) {
|
|
this.calendarIconColor = '#C39A4B';
|
|
} else {
|
|
this.calendarIconColor = '#000000';
|
|
}
|
|
|
|
if (this.canViewApproval) {
|
|
this.getApprovalList();
|
|
}
|
|
},
|
|
clearDateFilter() {
|
|
this.selectedDate = [];
|
|
this.calendarIconColor = '#000000';
|
|
if (this.canViewApproval) {
|
|
this.getApprovalList();
|
|
}
|
|
},
|
|
toDetail(playerId) {
|
|
this.navTo('/pages/playerDetail/playerDetail?playerId=' + playerId, 0, false);
|
|
},
|
|
getTimeAgo(createdAt) {
|
|
if (!createdAt) return '';
|
|
|
|
const now = new Date();
|
|
const created = new Date(createdAt);
|
|
const diffMs = now - created;
|
|
const diffMins = Math.floor(diffMs / 60000);
|
|
const diffHours = Math.floor(diffMins / 60);
|
|
const diffDays = Math.floor(diffHours / 24);
|
|
|
|
if (diffMins < 1) return 'just now';
|
|
if (diffMins < 60) return diffMins + 'm';
|
|
if (diffHours < 24) return diffHours + 'h';
|
|
return diffDays + 'd';
|
|
},
|
|
async getApprovalList() {
|
|
if (!this.getUserIdFromUserData(this.userData)) {
|
|
this.userData = uni.getStorageSync('userData');
|
|
}
|
|
const userId = this.getUserIdFromUserData(this.userData);
|
|
if (!userId) {
|
|
return;
|
|
}
|
|
uni.showLoading({
|
|
title: this.$t('common.loading')
|
|
});
|
|
try {
|
|
const params = {
|
|
userId,
|
|
playerId: this.searchInputStr,
|
|
rangeDate: this.selectedDate
|
|
};
|
|
const res = await getApprovalList(params);
|
|
if (res.success == true) {
|
|
if (res.data !== null && res.data.length > 0) {
|
|
this.approvalList = res.data;
|
|
const playerIds = this.approvalList.map((item) => item.playerId);
|
|
const uniquePlayerIds = [...new Set(playerIds)];
|
|
const playerList = uniquePlayerIds.map((playerId) => ({ playerId }));
|
|
uni.setStorageSync('approvalPlayerList', playerList);
|
|
this.showApprovalList = true;
|
|
} else {
|
|
this.approvalList = [];
|
|
this.showApprovalList = false;
|
|
this.dataNull = this.$t('notification.noData');
|
|
}
|
|
} else {
|
|
this.msgStr = res.message;
|
|
this.showApprovalList = false;
|
|
if (res.errorCode === 'NO_PERMISSION') {
|
|
this.dataNull = this.$t('notification.noPermission');
|
|
}
|
|
}
|
|
} catch (e) {
|
|
console.error(e);
|
|
uni.$u.toast(e.errMsg, 5000);
|
|
const request = e.config != undefined ? JSON.stringify(e.config) : '';
|
|
const response = e.data != undefined ? JSON.stringify(e.data) : '';
|
|
await this.writeLog(
|
|
userId,
|
|
'find_player',
|
|
'',
|
|
'[APP][notification.vue][getApprovalList][Catch Exception]' + e.errMsg,
|
|
request,
|
|
response,
|
|
1,
|
|
false
|
|
);
|
|
} finally {
|
|
uni.hideLoading();
|
|
}
|
|
},
|
|
searchApprovalByPlayerId() {
|
|
if (this.canViewApproval) {
|
|
this.getApprovalList();
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.hz-nav-filter-clear {
|
|
margin-top: 2px;
|
|
margin-right: 3px;
|
|
}
|
|
|
|
.hz-nav-read-all {
|
|
margin-top: 2px;
|
|
margin-right: 3px;
|
|
}
|
|
|
|
.hz-nav-read-all-img {
|
|
width: 20px;
|
|
height: 20px;
|
|
}
|
|
|
|
.approval-search-row {
|
|
padding-right: 8px;
|
|
}
|
|
|
|
.approval-search-input {
|
|
flex: 1;
|
|
padding-right: 8px;
|
|
}
|
|
|
|
.approval-empty-img-row {
|
|
justify-content: center;
|
|
margin-top: 80px;
|
|
}
|
|
|
|
.approval-empty-img {
|
|
width: 160px;
|
|
height: 160px;
|
|
}
|
|
|
|
.approval-empty-text-row {
|
|
justify-content: center;
|
|
margin: 20px;
|
|
}
|
|
|
|
.notice-card {
|
|
display: flex;
|
|
padding: 24rpx;
|
|
margin: 30rpx;
|
|
border: 1rpx solid #EBEEF5;
|
|
border-radius: 20rpx;
|
|
box-shadow: rgba(0, 0, 0, 0.08) 0rpx 0rpx 6rpx 2rpx;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.icon {
|
|
width: 30px;
|
|
height: 30px;
|
|
flex-shrink: 0;
|
|
}
|
|
|
|
.info {
|
|
margin-left: 20rpx;
|
|
}
|
|
|
|
.notice-type {
|
|
font-size: 28rpx;
|
|
}
|
|
|
|
.notice-title {
|
|
font-size: 26rpx;
|
|
color: #333333;
|
|
}
|
|
|
|
.notice-desc {
|
|
font-size: 26rpx;
|
|
color: #333333;
|
|
font-weight: 400;
|
|
}
|
|
|
|
.notice-time {
|
|
font-size: 20rpx;
|
|
color: #909399;
|
|
font-weight: 400;
|
|
}
|
|
|
|
.notification-content {
|
|
display: flex;
|
|
align-items: center;
|
|
position: relative;
|
|
}
|
|
|
|
.icon-container {
|
|
margin-right: 10px;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
}
|
|
|
|
.task-icon {
|
|
width: 32px;
|
|
height: 32px;
|
|
}
|
|
|
|
.notification-info {
|
|
flex: 1;
|
|
}
|
|
|
|
.notification-title {
|
|
font-weight: bold;
|
|
font-size: 14px;
|
|
color: #000000;
|
|
}
|
|
|
|
.notification-date {
|
|
font-weight: normal;
|
|
font-size: 12px;
|
|
color: #999;
|
|
}
|
|
|
|
.notification-time {
|
|
font-weight: normal;
|
|
font-size: 12px;
|
|
color: #C39A4B;
|
|
background-color: #FFF8E7;
|
|
padding: 2px 8px;
|
|
border-radius: 10px;
|
|
margin-left: auto;
|
|
}
|
|
|
|
.notification-detail {
|
|
font-weight: normal;
|
|
font-size: 12px;
|
|
color: #000000;
|
|
margin-top: 6px;
|
|
}
|
|
</style>
|