first commit

This commit is contained in:
Mauve
2026-09-08 17:20:27 +08:00
commit a7f2e0ca01
752 changed files with 111259 additions and 0 deletions
+597
View File
@@ -0,0 +1,597 @@
<template>
<view>
<!-- #ifdef APP-PLUS -->
<simple-watermark ref="watermark"></simple-watermark>
<!-- #endif -->
<mgmHeader ref="headerRef" />
<view class="hz-page">
<u-sticky customStyle="border-bottom:0.5px solid #f0f0f0;" bgColor="#fff">
<u-tabs :scrollable="false" :list="tabList" lineWidth="50" @change="changeTopTab" itemStyle="width:50%; height: 40px"
:activeStyle="{color: '#C39A4B'}" line-color="#C39A4B" ></u-tabs>
</u-sticky>
<!-- 搜索栏 -->
<view class="hz-spacing hz-mr-t-20 hz-flex-row">
<u-search :placeholder="searchHolder" v-model="searchInputStr" :showAction="false" bgColor="#ffffff"
borderColor="gray" style="padding-right: 8px;" @search="toSearch()"></u-search>
<view class="">
<u-icon size="28px" @click="openFilter()" :name="filterIconPath" style="margin-top: 3px;"></u-icon>
</view>
</view>
<!-- 卡片 -->
<view class="hz-mr-t-30">
<uni-card
style="padding:12px 12px 0px 12px;margin-bottom:24rpx;position:relative;box-shadow: rgba(0, 0, 0, 0.08) 0px 0px 0px 0px;" class="hz-mr-t-20 hz-font-base">
<!-- 卡片上方视图 -->
<view class="hz-flex-row hz-mr-b-20 " style="border-bottom:0.5px solid #a3a3a3;padding-bottom: 10px;">
<view>
<u-checkbox-group
v-model="checkboxValue"
placement="column"
@change="checkboxChange"
>
<u-checkbox
labelColor="#000000"
activeColor="#C39A4B"
v-for="(item, index) in checkboxList"
:key="index"
:label="item.name"
:name="item.id"
>
</u-checkbox>
</u-checkbox-group>
</view>
<!-- 卡片日期 -->
<span class="hz-font-sm" style="color:#999;margin-left: auto;">
2025-12-30 18:35
</span>
</view>
<!-- 卡片 Player Info 视图 -->
<view class="hz-flex-row" style="border-bottom:0.5px solid #a3a3a3;padding-bottom: 10px;">
<!-- 卡片左侧信息 -->
<view class="hz-font-color-black" style="line-height:160%; flex: 1; overflow: hidden; min-width: 0;">
<!-- 用户信息 -->
<view class="hz-font-md hz-mr-b-20" style="white-space: nowrap; overflow: hidden; text-overflow: ellipsis;">
11001960 / Chan, Tai Man / Supreme
</view>
<!-- Gaming Data -->
<view class="hz-mr-b-20 hz-flex-row">
<view>
<view>C/I:2025-01-01</view>
<view>C/I:2025-01-03</view>
</view>
<view style="margin-left: auto;">
<view>MGM Macau</view>
<view>GR,1Room</view>
</view>
</view>
<view class="hz-flex-row">
<view>
<view>Current Trip Theo</view>
<view>Last 2 Days Theo</view>
</view>
<view style="margin-left: auto;">
<view style="margin-left: auto;">900,732</view>
<view style="margin-left: auto;">110,227</view>
</view>
</view>
<view class="">R3 Theo /TPD /Actual win</view>
<view class="">3,456,789/456,785/-479,887</view>
<view class="">R6 Theo /TPD /Actual win</view>
<view class="">3,456,789/456,785/-479,887</view>
</view>
<!-- 卡片右侧按钮 -->
<view v-if="this.currentIndex===0" class="" style="width: 70px; flex-shrink: 0;">
<view class="hz-bg-primary hz-font-color-white roomCount hz-mr-t-30" style="text-align: center;" @click="handleRoomCountClick">Room Count</view>
</view>
<view v-else class="" style="width: 70px; flex-shrink: 0;">
<view class="roomCount hz-mr-t-30 hz-font-color-black"
style="border: 0.5px #C39A4B solid; text-align: center;">Approved</view>
</view>
</view>
<!-- 卡片 booking 视图 -->
<view class="hz-font-sm hz-font-color-black" style="border-bottom:0.5px solid #a3a3a3;padding-bottom: 6px;">
<view style="font-weight: bolder;">
Continuous / Overlap Booking(C/I to C/O)
</view>
<view class="">
02 Jan to 04 Jan MGM C-S2K | Conf#fzfsesr1
</view>
</view>
<!-- 卡片 Waitlist 视图 -->
<view v-show="currentIndex===0" class="hz-font-sm hz-font-color-black" style="border-bottom:0.5px solid #a3a3a3;padding-bottom: 6px;">
<view style="font-weight: bolder;">
Waitlist
</view>
<view class="">
02 Jan to 03 Jan MGM-GR
</view>
</view>
<!-- 卡片 Remark 视图 -->
<view class="hz-font-sm hz-font-color-black" style="border-bottom:0.5px solid #a3a3a3;padding-bottom: 6px;">
<view style="font-weight: bolder;">
Remarks
</view>
<view>
Wynn big guest
</view>
</view>
<!-- 卡片 Sharer 视图 -->
<view class="hz-font-sm hz-font-color-black" style="border-bottom:0.5px solid #a3a3a3;padding-bottom: 6px;">
<view style="font-weight: bolder;">
Sharer
</view>
<view>
11001983 Corso Wong
</view>
</view>
<!-- 卡片 Request Reason 视图 -->
<view class="hz-font-sm hz-font-color-black" style="margin-bottom: 5px;">
<view style="font-weight: bolder;">
Request Reason
</view>
<view>
HP
</view>
</view>
<!-- 按钮视图 -->
<view v-show="currentIndex===0" class="hz-flex-row hz-font-color-primary" style="border-top:0.5px solid #a3a3a3;">
<view class="actionButton" style="border-bottom-left-radius: 8px;" @click="handleApprovalClick">Approval</view>
<view class="actionButton" style="border-left: 0.5px solid #a3a3a3; border-right: 0.5px solid #a3a3a3;" @click="handleRejectClick">Reject</view>
<view class="actionButton" style="border-bottom-right-radius: 8px;" @click="handleDelegateClick">Delegate</view>
</view>
</uni-card>
<uni-card
style="padding:12px 12px 0px 12px;margin-bottom:24rpx;position:relative;box-shadow: rgba(0, 0, 0, 0.08) 0px 0px 0px 0px;" class="hz-mr-t-20 hz-font-base">
<!-- 卡片上方视图 -->
<view class="hz-flex-row hz-mr-b-20 " style="border-bottom:0.5px solid #a3a3a3;padding-bottom: 10px;">
<view>
<u-checkbox-group
v-model="checkboxValue"
placement="column"
@change="checkboxChange"
>
<u-checkbox
labelColor="#000000"
activeColor="#C39A4B"
v-for="(item, index) in checkboxList"
:key="index"
:label="item.name"
:name="item.id"
>
</u-checkbox>
</u-checkbox-group>
</view>
<!-- 卡片日期 -->
<span class="hz-font-sm" style="color:#999;margin-left: auto;">
2025-12-30 18:35
</span>
</view>
<!-- 卡片 Player Info 视图 -->
<view class="hz-flex-row" style="border-bottom:0.5px solid #a3a3a3;padding-bottom: 10px;">
<!-- 卡片左侧信息 -->
<view class="hz-font-color-black" style="line-height:160%; flex: 1; overflow: hidden; min-width: 0;">
<!-- 用户信息 -->
<view class="hz-font-md hz-mr-b-20" style="white-space: nowrap; overflow: hidden; text-overflow: ellipsis;">
11001960 / Chan, Tai Man / Supreme
</view>
<!-- Gaming Data -->
<view class="hz-mr-b-20 hz-flex-row">
<view>
<view>C/I:2025-01-01</view>
<view>C/I:2025-01-03</view>
</view>
<view style="margin-left: auto;">
<view>MGM Macau</view>
<view>GR,1Room</view>
</view>
</view>
<view class="hz-flex-row">
<view>
<view>Current Trip Theo</view>
<view>Last 2 Days Theo</view>
</view>
<view style="margin-left: auto;">
<view style="margin-left: auto;">900,732</view>
<view style="margin-left: auto;">110,227</view>
</view>
</view>
<view class="">R3 Theo /TPD /Actual win</view>
<view class="">3,456,789/456,785/-479,887</view>
<view class="">R6 Theo /TPD /Actual win</view>
<view class="">3,456,789/456,785/-479,887</view>
</view>
<!-- 卡片右侧按钮 -->
<view v-if="this.currentIndex===0" class="" style="width: 70px; flex-shrink: 0;">
<view class="hz-bg-primary hz-font-color-white roomCount hz-mr-t-30" style="text-align: center;" @click="handleRoomCountClick">Room Count</view>
</view>
<view v-else class="" style="width: 70px; flex-shrink: 0;">
<view class="roomCount hz-mr-t-30 hz-font-color-black"
style="border: 0.5px #C39A4B solid; text-align: center;">Approved</view>
</view>
</view>
<!-- 卡片 booking 视图 -->
<view class="hz-font-sm hz-font-color-black" style="border-bottom:0.5px solid #a3a3a3;padding-bottom: 6px;">
<view style="font-weight: bolder;">
Continuous / Overlap Booking(C/I to C/O)
</view>
<view class="">
02 Jan to 04 Jan MGM C-S2K | Conf#fzfsesr1
</view>
</view>
<!-- 卡片 Waitlist 视图 -->
<view v-show="currentIndex===0" class="hz-font-sm hz-font-color-black" style="border-bottom:0.5px solid #a3a3a3;padding-bottom: 6px;">
<view style="font-weight: bolder;">
Waitlist
</view>
<view class="">
02 Jan to 03 Jan MGM-GR
</view>
</view>
<!-- 卡片 Remark 视图 -->
<view class="hz-font-sm hz-font-color-black" style="border-bottom:0.5px solid #a3a3a3;padding-bottom: 6px;">
<view style="font-weight: bolder;">
Remarks
</view>
<view>
Wynn big guest
</view>
</view>
<!-- 卡片 Sharer 视图 -->
<view class="hz-font-sm hz-font-color-black" style="border-bottom:0.5px solid #a3a3a3;padding-bottom: 6px;">
<view style="font-weight: bolder;">
Sharer
</view>
<view>
11001983 Corso Wong
</view>
</view>
<!-- 卡片 Request Reason 视图 -->
<view class="hz-font-sm hz-font-color-black" style="margin-bottom: 5px;">
<view style="font-weight: bolder;">
Request Reason
</view>
<view>
HP
</view>
</view>
<!-- 按钮视图 -->
<view v-show="currentIndex===0" class="hz-flex-row hz-font-color-primary" style="border-top:0.5px solid #a3a3a3;">
<view class="actionButton" style="border-bottom-left-radius: 8px;" @click="handleApprovalClick">Approval</view>
<view class="actionButton" style="border-left: 0.5px solid #a3a3a3; border-right: 0.5px solid #a3a3a3;" @click="handleRejectClick">Reject</view>
<view class="actionButton" style="border-bottom-right-radius: 8px;" @click="handleDelegateClick">Delegate</view>
</view>
</uni-card>
</view>
</view>
<!-- 点击按钮弹窗内容 -->
<u-popup
:safeAreaInsetBottom="true"
:safeAreaInsetTop="true"
:mode="'center'"
:round="12"
:show="showMsgBox"
customStyle="width:94%; padding-top: 30px"
:closeable="!showDirBtn"
@close="closePopup()"
>
<view v-if="confirmType!=='DELEGATE'">
<view class="hz-flex-row" style="justify-content:center;align-items:center;width:100%;">
<image :src="iconPath" style="width:64px;height:64px;"></image>
</view>
<view class="hz-font-xl hz-font-bold hz-text-center" style="margin-top:20px;margin-bottom: 20px;margin-left: 15px;margin-right: 15px;white-space:pre-wrap;">
<rich-text v-html="popMsgStr" style="line-height:26px;"></rich-text>
</view>
<view @click="callConfirmFunction()" class="hz-btn hz-font-color-white hz-font-lg hz-font-bold hz-text-center"
style="width: 90%;margin: 0 auto;margin-bottom: 15px;">
{{$t("common.confirm").toUpperCase()}}
</view>
<view @click="closePopup()" class="hz-btn hz-font-color-primary hz-font-lg hz-font-bold hz-text-center"
style="width: 90%;margin: 0 auto;margin-bottom: 30px;background-color: white;border: 0.5px solid;">
{{$t("common.cancel").toUpperCase()}}
</view>
</view>
<view v-else>
<view class="hz-flex-row" style="margin: 30px 20px;">
<view class="hz-font-bold" style="align-self: center;margin-right: 10px;">
Delegate to
</view>
<view style="flex: 1;">
<view @click="showPicker = true" style="border: 0.5px solid #a3a3a3; padding: 8px; border-radius: 4px;">
{{ selectedDelegate || 'Select approver' }}
</view>
<u-picker :show="showPicker" :columns="delegateColumns" @confirm="handlePickerConfirm" @cancel="showPicker = false" :cancelText = 'cancelStr'
:confirmText = 'okStr' confirmColor = '#C39A4B' :closeOnClickOverlay = "true"></u-picker>
</view>
</view>
<view class="hz-mr-b-30">
<view @click="confirmDelegate()" class="hz-btn hz-font-color-white hz-font-lg hz-font-bold hz-text-center" style="width: 90%;margin: 0 auto;margin-bottom: 15px;">
{{$t("common.confirm").toUpperCase()}}
</view>
<view @click="closePopup()" class="hz-btn hz-font-color-primary hz-font-lg hz-font-bold hz-text-center"
style="width: 90%;margin: 0 auto;margin-bottom: 30px;background-color: white;border: 0.5px solid;">
{{$t("common.cancel").toUpperCase()}}
</view>
</view>
</view>
</u-popup>
<u-calendar closeOnClickOverlay :confirmText="confirmText" :confirmDisabledText="confirmText" color="#C39A4B"
title="" :startText="startText" :endText="endText" :show="showCalendar" :allowSameDay="true"
mode="range" @close="cancelDate" @confirm="confirmDate" :showMark="false">
</u-calendar>
<!-- 悬浮栏 - 显示选中的记录数量 -->
<view v-if="checkboxValue.length > 0" class="floating-bar">
<view class="floating-content">
<text class="selected-count">{{ checkboxValue.length }} selected</text>
<view class="floating-actions">
<view @click="handleBatchApprove" class="action-btn approve-btn">Approve</view>
<view @click="handleBatchReject" class="action-btn reject-btn">Reject</view>
</view>
</view>
</view>
</view>
</template>
<script>
import mgmHeader from "@/components/header/header.vue";
// #ifdef APP-PLUS
import SimpleWatermark from '@/components/simple-watermark/simple-watermark.vue'
// #endif
export default {
components: {
mgmHeader, // 注册组件
},
data() {
return {
title: "Approval",
currentIndex: 0,
sliderPosition: 0,
filterIconPath:"../../static/images/filter_inactive.png",
cancelStr:this.$t('common.cancel'),
okStr:this.$t('common.ok'),
searchHolder:this.$t('approval.searchStr'),
searchInputStr:'',
keyword:'',
checkboxValue:[],
confirmType:'',
userData:'',
showMsgBox:false,
showDirBtn:false,
iconPath:'',
popMsgStr:'',
showPicker:false,
confirmText:this.$t('common.confirm'),
startText:this.$t('common.start'),
endText:this.$t('common.end'),
showCalendar:false,
delegateColumns:[
[
{text: 'Mooney', value: '105868'},
{text: 'Kelly', value: '130211'},
{text: 'Eva', value: '100712'}
]
],
selectedDelegate:'',
checkboxList: [{
name: 'Request from Annie Chan',
disabled: false,
id:1
}
],
tabList: [{
name: this.$t('approval.pendingApproval'),
}, {
name: this.$t('approval.allRequest'),
}]
};
},
mounted() {},
onReady() {
// 页面首次渲染完成后,延迟触发水印更新
setTimeout(() => {
const watermarkStore = require('@/store/watermark.js');
if (watermarkStore && watermarkStore.updateWatermark) {
watermarkStore.updateWatermark(true);
}
}, 1200);
},
onShow() {
this.userData = uni.getStorageSync("userData");
if (this.userData !== null && this.userData !== undefined){
this.showTabbarByPermission(this.userData);
}
},
methods: {
click(item) {
console.log('item', item);
},
openFilter() {
this.showCalendar = true;
},
toSearch(){
console.log(this.searchInputStr);
console.log("toSearch");
},
checkboxChange(n) {
console.log('change', n);
},
handleRoomCountClick() {
this.navTo('/pages/roomCount/roomCount',0,false)
},
handleApprovalClick() {
this.navTo('/pages/playerDetail/playerDetail',0,false)
},
handleRejectClick() {
this.iconPath = '../../static/images/ico_err.png';
this.popMsgStr = this.$t("approval.submitReject") ;
this.showMsgBox = true; // 显示整个弹窗
this.confirmType = "REJECT";
},
handleDelegateClick() {
this.showMsgBox = true; // 显示整个弹窗
this.confirmType = "DELEGATE";
},
handlePickerConfirm(e) {
const selectedItem = e.value[0];
if (selectedItem) {
this.selectedDelegate = selectedItem.text;
}
this.showPicker = false;
},
changeTopTab(index) {
this.currentIndex = index.index;
},
confirmApproval(){
console.log("Approval");
this.showMsgBox = false;
},
confirmReject(){
console.log("Reject");
this.showMsgBox = false;
},
confirmDelegate(){
console.log("Delegate");
this.showMsgBox = false;
},
closePopup(){
this.showMsgBox = false;
},
handleBatchApprove(){
console.log('Batch approve:', this.checkboxValue);
this.iconPath = '../../static/images/ico_warn.png';
this.popMsgStr = this.$t("approval.submitBatchApproval") ;
this.showMsgBox = true; // 显示整个弹窗
this.confirmType = "BATCHAPPROVAL";
},
handleBatchReject(){
console.log('Batch reject:', this.checkboxValue);
this.iconPath = '../../static/images/ico_err.png';
this.popMsgStr = this.$t("approval.submitBatchReject") ;
this.showMsgBox = true; // 显示整个弹窗
this.confirmType = "BATCHREJECT";
},
cancelDate(){
this.showCalendar = false;
},
confirmDate(){
this.showCalendar = false;
},
confirmBatchApproval(){
console.log("batch app");
this.showMsgBox = false;
this.checkboxValue = [];
},
confirmBatchReject(){
console.log("batch rej");
this.showMsgBox = false;
this.checkboxValue = [];
},
callConfirmFunction(){
if(this.confirmType === "REJECT"){
this.confirmReject();
}
if(this.confirmType === "DELEGATE"){
this.confirmDelegate()
}
if(this.confirmType === "BATCHREJECT"){
this.confirmBatchReject();
}
if(this.confirmType ==="BATCHAPPROVAL"){
this.confirmBatchApproval();
}
}
},
};
</script>
<style lang="scss" scoped>
@import '../../static/css/custom.scss';
.roomCount{
border-radius: 20px;
font-size: 10px;
padding: 3px;
margin-left: auto;
}
.actionButton{
width: 33%;
text-align: center;
padding: 8px 0;
transition: background-color 0.2s ease;
}
.actionButton:active{
background-color: #cccccc;
}
.border-bt-sld{
border-bottom:0.5px;
color: #a3a3a3;
padding-bottom: 10px
}
.floating-bar{
position: fixed;
bottom: 0;
left: 0;
right: 0;
background-color: #ffffff;
box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1);
z-index: 999;
padding: 12px 16px;
border-top: 0.5px solid #a3a3a3;
}
.floating-content{
display: flex;
justify-content: space-between;
align-items: center;
}
.selected-count{
font-size: 16px;
font-weight: bold;
color: #333;
}
.floating-actions{
display: flex;
gap: 12px;
}
.action-btn{
padding: 8px 20px;
border-radius: 20px;
font-size: 14px;
font-weight: bold;
text-align: center;
}
.approve-btn{
background-color: #C39A4B;
color: #ffffff;
}
.reject-btn{
background-color: #C39A4B;
color: #ffffff;
}
::v-deep .uni-card {
margin: 10px;
padding: 0 8px;
border-radius: 12px;
overflow: hidden;
background-color: #fff;
flex: 1;
}
::v-deep .uni-card--border {
border: 0.5px solid #ccc;
}
::v-deep .uni-card--shadow {
position: relative;
box-shadow: 0 0px 0px 0px rgba(165, 165, 165, 0.2);
}
</style>