first commit
This commit is contained in:
Mauve
@@ -0,0 +1,235 @@
|
||||
<template>
|
||||
<view>
|
||||
<u-navbar
|
||||
:safeAreaInsetTop="true"
|
||||
:placeholder="true"
|
||||
:title="title"
|
||||
:fixed="true"
|
||||
:autoBack="true"
|
||||
leftIconColor="#000000"
|
||||
bgColor="#ffffff"
|
||||
titleStyle="font-weight:bold;color:#000000;"
|
||||
>
|
||||
<view style="margin-top:2px;margin-right:3px;" slot="right">
|
||||
<u-icon
|
||||
v-if="hasSelectedDate"
|
||||
@click="clearDateFilter"
|
||||
size="28px" name="../../static/images/filter-clear.svg"
|
||||
></u-icon>
|
||||
</view>
|
||||
</u-navbar>
|
||||
<!-- 搜索栏 -->
|
||||
<view class="hz-spacing hz-mr-t-20 hz-flex-row">
|
||||
<u-search :placeholder="searchHolder" v-model="searchInputStr" :showAction="false" bgColor="#ffffff" :label="searchLabel"
|
||||
borderColor="gray" style="padding-right: 8px" @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" style="justify-content: center;margin-top:80px;">
|
||||
<image src="/static/images/datanull.png" style="width:160px;height:160px;"></image>
|
||||
</view>
|
||||
<view class="hz-flex-row hz-font-bolder hz-font-md" style="justify-content: center;margin:20px;">
|
||||
{{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>
|
||||
|
||||
<u-calendar :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>
|
||||
</view>
|
||||
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {getApprovalList} from '../../api/approvalApi.js'
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
title:this.$t("notification.pendingApproval"),
|
||||
searchInputStr:'',
|
||||
userData:'',
|
||||
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")
|
||||
}
|
||||
},
|
||||
onShow() {
|
||||
this.userData = uni.getStorageSync("userData");
|
||||
this.getApprovalList();
|
||||
},
|
||||
methods: {
|
||||
handleFilterDate(e) {
|
||||
this.selectedDate = e;
|
||||
this.showCalendar = false;
|
||||
|
||||
if (Array.isArray(this.selectedDate) && this.selectedDate.length > 0) {
|
||||
this.calendarIconColor = '#C39A4B';
|
||||
} else {
|
||||
this.calendarIconColor = '#000000';
|
||||
}
|
||||
|
||||
this.getApprovalList();
|
||||
},
|
||||
clearDateFilter() {
|
||||
this.selectedDate = [];
|
||||
this.calendarIconColor = '#000000';
|
||||
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(){
|
||||
uni.showLoading({
|
||||
title: this.$t("common.loading")
|
||||
});
|
||||
try{
|
||||
let params = {
|
||||
userId: this.userData.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;
|
||||
// 提取所有 playerId 到新的 playerList 并去重
|
||||
const playerIds = this.approvalList.map(item => item.playerId);
|
||||
const uniquePlayerIds = [...new Set(playerIds)];
|
||||
this.playerList = uniquePlayerIds.map(playerId => ({ playerId }));
|
||||
uni.setStorageSync("approvalPlayerList",this.playerList);
|
||||
this.showApprovalList = true;
|
||||
} else {
|
||||
this.showApprovalList = false;
|
||||
this.dataNull = this.$t("notification.noData");
|
||||
}
|
||||
}else{
|
||||
this.msgStr = res.message;
|
||||
this.showMsg = true;
|
||||
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);
|
||||
var request = e.config!=undefined?JSON.stringify(e.config):"";
|
||||
var response = e.data!=undefined?JSON.stringify(e.data):"";
|
||||
await this.writeLog(this.userData.userId,"find_player","","[APP][findPlayer.vue][getProfileByPlayerId][Catch Exception]"+e.errMsg,request,response,1,false);
|
||||
}finally{
|
||||
uni.hideLoading();
|
||||
}
|
||||
},
|
||||
// 搜索玩家審批請求
|
||||
searchApprovalByPlayerId() {
|
||||
this.getApprovalList();
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
hasSelectedDate() {
|
||||
return Array.isArray(this.selectedDate) && this.selectedDate.length > 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.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