yuanqu_ui/pages/order/staffcode.vue

<template>
  <view class="code pt8">
	<view class="code_box">
		<view class="code_suc" v-if="type=='code'">
			<image :src="sucimg"></image>
			<view class="f16 fw co16 txc">扫码成功</view>
		</view>
		<view class="cdet">
			<view class="ctit">预约信息</view>
			<view class="cbox">
				<view class="ctxt">预约时间</view>
				<view class="ctlist">
					<view class="tit">参观日期：</view>
					<view class="txt">{{datainfo.visitDate||''}}</view>
				</view>
				<view class="ctlist">
					<view class="tit">参观时间：</view>
					<view class="txt">{{datainfo.visitTime||''}}</view>
				</view>
			</view>
			<view class="cbox">
				<view class="ctxt">登记信息</view>
				<view class="ctlist">
					<view class="tit">游客类型：</view>
					<view class="txt" v-if="datainfo.reservatType">{{datainfo.reservatType=='2'?'散客':'团队'}}</view>
				</view>
				<view class="ctlist">
					<view class="tit">单位名称：</view>
					<view class="txt">{{datainfo.visitUnitName||''}}</view>
				</view>
				<view class="ctlist">
					<view class="tit">参观人数：</view>
					<view class="txt">{{datainfo.visitNum||''}}人</view>
				</view>
				<view class="ctlist">
					<view class="tit">联系人：</view>
					<view class="txt">{{datainfo.visitName||''}}</view>
				</view>
				<view class="ctlist">
					<view class="tit">联系电话：</view>
					<view class="txt">{{datainfo.visitPhone||''}}</view>
				</view>
				<view class="ctlist">
					<view class="tit">是否接待：</view>
					<view class="txt">{{datainfo.isReception=='Y'?'是':'否'||''}}</view>
				</view>
				<block v-if="datainfo.isReception=='Y'">
					<view class="ctlist">
						<view class="tit">接待人：</view>
						<view class="txt">{{datainfo.receptionName||''}}</view>
					</view>
					<view class="ctlist">
						<view class="tit">接待电话：</view>
						<view class="txt">{{datainfo.receptionPhone||''}}</view>
					</view>
				</block>
				
				<!-- <view class="ctlist">
					<view class="tit">任务指派：</view>
					<view class="txt">{{datainfo.visitRemark||''}}</view>
				</view> -->
				<view class="ctlist">
					<view class="tit">备注信息：</view>
					<view class="txt">{{datainfo.visitRemark||''}}</view>
				</view>
			</view>
		</view> 
	</view>
	<view class="code_btn">
		<!-- v-if="checkPermi(['system:reservat:cav'])" -->
		<view class="btn btn1" @click="getFail" >继续扫码</view>
		<view class="btn btn2 flex1" @click="getBack">返回首页</view>
	</view>
  </view>
</template>

<script>
	import { checkPermi, checkRole } from "@/utils/permission"; // 权限判断函数
	import {getReservatDetail,getReservatvav} from "@/api/mine/order.js"
  export default {
	data(){
		return{
			sucimg:require("@/static/images/order/staffs/success.png"),
			datainfo:{},
			id:'',
			type:'code'
		}
	},
	onLoad: function(e) {
		this.id=e.id;
		if(e.type){
			this.type=e.type
		}
		this.getDataFn()
	},
	methods:{
		checkPermi, checkRole,
		getFail(){
			var that = this;
			uni.scanCode({
				onlyFromCamera: true,
				autoZoom:false,
				scanType: ['qrCode'],
				success: function(red) {
					let result = red.result;
					if (typeof result == 'string') {
						try {
						
						} catch (e) {
							uni.navigateBack({
								delta: 1
							})
							uni.showToast({
								title: '扫码查询失败,请检查二维码是否正确',
								icon: "none"
							})
							return
						}
					}
					var id = red.result
					var params = {
						"reservatId": id,
					}
					getReservatvav(params).then(res => {
						if (res.code == 200) {
							// 刷新页面
							if(res.msg=='核销失败'){
								that.$tab.redirectTo('/pages/order/stafffail')
							}else{
								uni.$emit('refreshdatalist')
								that.$tab.redirectTo('/pages/order/staffcode?id='+id)
							}
							
						} else {
							uni.showToast({
								title: res.msg,
								duration: 1000,
								icon: 'none'
							});
						
						}
					})
				},
				fail: function(e) {
					if (e && e.errMsg && e.errMsg.indexOf('scanCode:fail cancel') != -1) {
						return;
					}
					uni.showToast({
						title: '扫码失败',
						icon: "none"
					})
				},
			});
		},
		getBack(){
			this.$tab.reLaunch('/pages/index/index')
		},
		getDataFn(){
			getReservatDetail(this.id).then(res=>{
				if(res.code==200){
					this.datainfo=res.data;
				}else{
					this.$toast(res.msg)
				}
			})
		}
	},
	
  }
</script>

<style lang="scss" scoped>
.code{display: flex;flex-direction: column;height: 100vh;box-sizing: border-box;}
.code_box{
	width: 684rpx;background: #FFFFFF;border-radius: 6rpx;margin: 0 auto;padding:64rpx 60rpx 40rpx;box-sizing: border-box;flex: 1;
	.code_suc{
		margin-bottom: 48rpx;
		image{width: 138rpx;height: 148rpx;margin: 0 auto 32rpx;}
	}
	.cdet{
		.ctit{font-size: 32rpx;font-weight: bold;color: #161616;position: relative;
				&::before{width: 6rpx;height: 34rpx;background: $com-cd3;border-radius: 2rpx;content: '';left: -26rpx;top: 3rpx;position: absolute;bottom: 3rpx;}
		}
		.cbox{padding: 36rpx 0 12rpx;}
		.ctxt{font-size: 30rpx;font-weight: bold;
color: $com-cd3;margin-bottom: 16rpx;}
		.ctlist{padding: 10rpx 0;display: flex;justify-content: space-between;
			.tit{font-size: 30rpx;font-weight: 500;
			color: #AAAAAA;flex:0 0 auto;margin-right: 20rpx;}
			.txt{font-size: 30rpx;font-weight: 500;color: #161616;flex: 1;text-align: right;}
		}
		
	}
}

.code_btn{flex: 0 0 auto;padding: 40rpx 32rpx;display: flex;align-items: center;justify-content: space-between;
	.btn{width: 320rpx;height: 80rpx;border-radius: 40rpx;box-sizing: border-box;font-size: 32rpx;font-weight: 500;text-align: center;line-height: 80rpx;
		&.btn1{background: #FFFFFF;border: 2rpx solid $com-cd3;color: $com-cd3;margin-right: 44rpx;}
		&.btn2{background: $com-cd3;color: #FFFFFF;}
	}

}
</style>