mgm-daylight-mcrm-mobile-ios/pages/findPlayer/findPlayer.vue

<template>
	<view>
		<u-navbar
			:safeAreaInsetTop="true" 
			:placeholder="true" 
			:title="title"
			:fixed="true"
			:autoBack="false"
			leftIconColor="#C39A4B"
			bgColor="#C39A4B"
			titleStyle="font-weight:bold;color:#ffffff;"
		>
			<view 
				@click="logout"
				style="margin-top:2px;margin-right:3px;"
				slot="right"
			>
				<image src="/static/images/ico_exit.png" style="width:24px;height:24px;"></image>
			</view>
			<view 
				v-show="canViewApproval"
				@click="toNotification"
				style="margin-top:2px;margin-right:3px; position: relative"
				slot="left"
			>
				<image src="/static/images/160task01.png" style="width:24px;height:24px;"/>
				<u-badge :value="countAp" type="error" :offset="[-8, -8]" :show="countAp > 0" :absolute="true"></u-badge>
			</view>
		</u-navbar>
		
		<view class="hz-text-center" style="margin-top:120rpx;">
			<image src="../../static/images/room_book.png" style="width:128rpx;height:128rpx;"></image>
		</view>
		<view class="hz-font-bolder hz-font-xl hz-text-center hz-font-color-primary">
			{{$t('hotel.roombooking')}}
		</view>
		<view class="hz-font-bolder hz-font-xl hz-text-center hz-font-color-dark" style="margin-top:160rpx;">
			{{$t('findPlayer.title')}}
		</view>
		<view style="margin-top:30rpx;margin-right:60rpx;margin-left:60rpx;">
			<u--input
				v-model="searchPlayerId"
				:placeholder="playerIdStr"
				prefixIcon="search"
				prefixIconStyle="font-size: 26px;color:#C39A4B;"
				customStyle="border-radius:22px;"
				type="number"
				:clearable="true"
				:maxlength="8"
			></u--input>
			<view style="margin-top:30rpx;">
				<view @click="getProfileByPlayerId" class="hz-btn hz-font-color-white hz-font-lg hz-font-bold hz-text-center" >{{$t("common.search").toUpperCase()}}</view>
			</view>
		</view>
		<u-modal :content="msgStr" :show="showMsg" :confirmText="yesText" :showCancelButton="false" closeOnClickOverlay @confirm="confirmMsg" confirmColor="#C39A4B" @cancel="confirmMsg" @close="confirmMsg"></u-modal>
	</view>
</template>

<script>
	import { getApprovalCount } from '../../api/approvalApi.js';
import {playerLookup} from '../../api/mgmApi.js'
	import mgmHeader from '@/components/header/header.vue'
	
	
	export default {
		components: {
			mgmHeader // 注册组件
		},
		data() {
				return {
					// 数据变量
					playerIdStr: this.$t("common.playerId"),
					searchPlayerId: '',
					userData:null,
					deviceData:null,
					siteData:null,
					countAp: '',
					// 定时器变量
					approvalCountTimer: null,
					// 页面激活态（避免残留定时器回调在非当前页继续请求）
					isFindPlayerActive: false,
					// 界面变量
					showMsg:false,
					title: '',
					msgStr:'',
					yesText:this.$t("common.ok"),
					canViewApproval:false
				}
		},
		onLoad() {
			// 初始化界面
			//uni.setLocale("en") //測試切換語言en or zh-Hant
			this.initUI();
			this.siteData = uni.getStorageSync("siteData");
		},
		onShow() {
			this.isFindPlayerActive = true;
			this.getApporvalCount();
			this.userData = uni.getStorageSync("userData");
			this.searchPlayerId = '';
			this.playerIdStr=this.$t("common.playerId");
			if(this.userData!==null && this.userData!==undefined){
				this.title = this.userData.userName+','+this.userData.userId;
				this.showTabbarByPermission(this.userData);
			}
			this.isLogin();
			this.$nextTick(() => {
				const header = this.$refs.headerRef;
				if(header) {
					header.updateUserData();
				}
			});
			
			// 切回页面时，先停后启，避免存在残留定时器
			this.stopApprovalCountTimer();
			this.startApprovalCountTimer();
			if(this.userData.canViewApproval!==undefined && this.userData.canViewApproval==true) this.canViewApproval = true;
		},
		onHide() {
			this.isFindPlayerActive = false;
			// 切到其他页面时立即停止定时器，避免后台持续调用
			this.stopApprovalCountTimer();
		},
		onUnload() {
			this.isFindPlayerActive = false;
			// 页面销毁时兜底清理
			this.stopApprovalCountTimer();
		},
		onReady(){
		},
		methods: {
			startApprovalCountTimer() {
				if (!this.approvalCountTimer) {
					this.approvalCountTimer = setInterval(() => {
						// 双保险：非当前页不请求
						if (this.isFindPlayerActive) {
							this.getApporvalCount();
						}
					}, 30000); // 30秒
				}
			},
			stopApprovalCountTimer() {
				if (this.approvalCountTimer) {
					clearInterval(this.approvalCountTimer);
					this.approvalCountTimer = null;
				}
			},
			// 数据方法
			async getProfileByPlayerId(){
				if(!this.searchPlayerId){
					uni.$u.toast(this.$t("findPlayer.alert"));
					return;
				}
				uni.showLoading({
					title: this.$t("common.loading")
				});
				try{
					let params = {playerId:this.searchPlayerId,userId:this.userData.userId};
					const res = await playerLookup(params);
					if(res.success == true){
						if(res.data !== null){
							if(res.data.codedFlag==1){
								uni.setStorageSync("playerData",res.data);
								uni.hideLoading();
								this.navTo("/booking/bookingRecord/bookingRecord",0,false);
							}else{
								this.msgStr = this.$t("findPlayer.noPermission");
								this.showMsg = true;
							}
						}
					}else{
						this.msgStr = res.message;
						this.showMsg = true;
					}
				}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();
				}
			},
			async getApporvalCount(){
				if (!this.isFindPlayerActive) return;
				try{
					let params = {};
					const res = await getApprovalCount(params);
					if(res.success == true){
						if(res.data !== null){
							this.countAp = res.data;
						}
					}
				}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();
				}
			},
			// 界面方法
			confirmMsg(){
				this.msgStr = '';
				this.showMsg = false;
			},
			toNotification(){
				this.navTo("/pages/notification/notification",0,false)
			},
			clearSearchInput(){
				this.searchPlayerId = '';
				uni.removeStorageSync("playerData");
			},
			initUI() {
			  this.deviceData = uni.getStorageSync("deviceData");
			},
			logoutWithADFSApp() {
			  var wv =  plus.webview.create(ADFS_LOGOUT_URL,'IDP'); 
			  wv.show();
			},
		},
	}
</script>

<style>
	.u-border {
	    border-width: 0.5px !important;
	    border-color: #434343 !important;
	    border-style: solid;
		height:30px;
	}
</style>