merge limo to daylight
This commit is contained in:
Mauve
@@ -0,0 +1,761 @@
|
||||
<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>
|
||||
Reference in New Issue
Block a user