tearoom/page_user/dingdanxq.vue

<template>
	<view class="page">
		<u-navbar title="订单详情" :border-bottom="false" :background="bgc" back-icon-color="#262B37" title-color='#262B37'
			title-size='36' height='40' id="navbar" :custom-back="btns">
		</u-navbar>
         <image src="https://api.ccttiot.com/smartmeter/img/static/u3lZnmhqSqkMd7gHKtMD" mode="" class="imgbj"></image>
         <view class="boxda">
         	<view class="timeduan">
         		<view class="one">
         			<view class="top">
         				{{orderobj.reserveStartTime == null ? '--' : orderobj.reserveStartTime.slice(10,16)}}
         			</view>
         			<view class="bot">
         				{{orderobj.reserveStartTime == null ? '--' : orderobj.reserveStartTime.slice(0, -8)}}
         			</view>
         		</view>
         		<view class="two">
         			<view class="top">
         				共{{orderobj.hours == null ? '--' : orderobj.hours}}小时
         			</view>
         			<view class="bot">
         				<image src="https://api.ccttiot.com/smartmeter/img/static/u6L1mhUywZHY1lwqntik" mode=""></image>
         			</view>
         		</view>
         		<view class="one">
         			<view class="top">
         				{{orderobj.reserveEndTime == null ? '--' : orderobj.reserveEndTime.slice(10,16)}}
         			</view>
         			<view class="bot">
         				{{orderobj.reserveEndTime == null ? '--' : orderobj.reserveEndTime.slice(0, -8)}}
         			</view>
         		</view>
         	</view>
         	<view class="dianpu">
         		<view class="top">
         			<view class="lt">
         				【{{orderobj.storeName == null ? '--' : orderobj.storeName}}】 <text v-if="orderobj.roomType2 == 1">房间</text> <text v-else>大厅</text>
         			</view>
         			<view class="rt" @click="btndaohang">
         				<image src="https://api.ccttiot.com/smartmeter/img/static/u5yJpwCHAhqWlEwpbRsu" mode=""></image>
         			</view>
         		</view>
         		<view class="bd">
         		    <image :src="orderobj.picture" mode=""></image>
         			<view class="rts">
         				<view class="" style="margin-top: 0;">
         					预定包厢：{{orderobj.roomName == null ? '--' : orderobj.roomName}}
         				</view>
         				<view class="">
         					下单时间：{{orderobj.createTime == null ? '--' : orderobj.createTime}}
         				</view>
         				<view class="">
         					开始时间：{{orderobj.reserveStartTime == null ? '--' : orderobj.reserveStartTime}}
         				</view>
         				<view class="">
         					结束时间：{{orderobj.reserveEndTime == null ? '--' : orderobj.reserveEndTime}}
         				</view>
         			</view>
         		</view>
         		<view class="bianh">
         			<view class="bianh_val">
         				<text>订单编号：</text>
         				<text>{{orderobj.orderNo == null ? '--' : orderobj.orderNo}}</text>
         			</view>
         			<view class="bianh_val">
         				<text>支付类型：</text>
         				<text v-if="orderobj.payType == 'wx'">微信支付</text>
         				<text v-if="orderobj.payType == 'ye'">门店余额</text>
         			</view>
					<view class="bianh_val">
						<text>套餐名称：</text>
						<text>{{orderobj.explain == null ? '--' : orderobj.explain}}</text>
					</view>
         			<view class="bianh_val">
         				<text>付款金额：</text>
         				<text>￥{{orderobj.price == null ? '--' : orderobj.price}}({{orderobj.hours == null ? '--' : orderobj.hours}}小时套餐)</text>
         			</view>
         		</view>
         	</view>
         	<view class="zizhu" v-if="orderobj.status == 2 || orderobj.status == 3">
         		<view class="top">
         			<view class="lt">
         				自助操作
         			</view>
					<view class="rt" @click="btnkz" v-if="orderobj.userId == user.userId">
						控制设备
					</view>
         		</view>
         		<view class="ckwifi">
         			<view class="lt">
         				<image src="https://api.ccttiot.com/smartmeter/img/static/uG0ADmcyhSCuOTSFZtKC" mode=""></image> 门店	WIFI
         			</view>
         			<view class="rt" @click="btnwifi">
         				查看
         			</view>
         		</view>
         		<view class="imglist">
         			<image @click="btnkdm" src="https://api.ccttiot.com/smartmeter/img/static/uk2rqBfNYDmDwcEPdojx" mode=""></image>
         			<image v-if="orderobj.roomType2 == 1" @click="btnkbxm" src="https://api.ccttiot.com/smartmeter/img/static/usV5AH49VApLz92J1w19" mode=""></image>
					<image v-if="orderobj.roomType2 == 2" @click="btnkai" src="https://api.ccttiot.com/smartmeter/img/static/u1V3rc8uoZLRzKFO7K1r" mode=""></image>
         			<!-- <image @click="btnhuanzuo" src="https://api.ccttiot.com/smartmeter/img/static/uv6wjMeqhbc07ZWGkdS7" mode=""></image> -->
         			<image v-if="orderobj.userId == user.userId" @click="btnxudan" src="https://api.ccttiot.com/smartmeter/img/static/utXKDITJDghq6PRyLWTA" mode=""></image>
         			<button v-if="orderobj.userId == user.userId" open-type="share"><image src="https://api.ccttiot.com/smartmeter/img/static/uJrkufnmzJju3xpmxqFE" mode=""></image></button>
         		</view>
         	</view>
         	<view class="tishi" v-if="orderobj.status == 2 || orderobj.status == 3">
         		<view class="top">
         			温馨提示
         		</view>
         		<view class="wenzi">
         			1、订单转发好友后，好友也可直接自助开门进入门店、包厢；
         		</view>
         		<view class="wenzi">
         			2、订单续单可能碰到后续时间段被人预定而无法续单的情况，请提前规划好预约时间段；
         		</view>
         		<view class="wenzi">
         			3、如果临时有事无法到店消费，请在订单开始前进行取消订单操作，开始后，不支持退款，请合理规划您的时间；
         		</view>
         		<view class="wenzi">
         			4、若您迟到，订单仍按预定开始时间计费，迟到部分时长不进行退款，不进行延期，请合理规划预定时间段；
         		</view>
         		<view class="wenzi">
         			5、请勿大声喧哗，订单结束离店请爱护财务。
         		</view>
         	</view>
         </view>
		<view class="ljwifi" v-if="wififlag">
			<view class="cuo" @click="wififlag = false">
				×
			</view>
			<view class="name">
				WIFI连接
			</view>
			<view class="tanx">
				<view class="one">
					{{orderobj.wifi == null ? '--' : orderobj.wifi}}
					 <view class="" style="font-size: 16rpx;">
					 	{{orderobj.wifiPassword == null ? '--' : orderobj.wifiPassword}}
					 </view>
				</view>
				<view class="two">
					<text class="fz" @click="copy">复制密码</text>
					<text class="lj" @click="onAutolink">一键连接</text>
				</view>
			</view>
		</view>
		<view class="mask" v-if="wififlag" @click="wififlag = false"></view>
		<view class="lxlanya" v-if="lanyaflag">
			<view class="lxtit">
				蓝牙控制开关
			</view>
			<view class="cha" @click.stop="btncha">
				×
			</view>
			<view class="lxzt">
			    <view v-if="ver_dataflag == 1" style="color: red;">
			    	<image src="https://api.ccttiot.com/smartmeter/img/static/u6akzRBuxxP94XlUcMtV" mode=""></image>
			    	<text>未连接</text>
			    </view>
			    <view v-if="ver_dataflag == 2" style="color: #ccc;">
			    	<image src="https://api.ccttiot.com/smartmeter/img/static/u6akzRBuxxP94XlUcMtV" mode=""></image>
			    	<text>连接中</text>
			    </view>
			    <view v-if="ver_dataflag == 3" style="color: #48893B;">
			    	<image src="https://api.ccttiot.com/smartmeter/img/static/uU0nfPcXVEhbEsvECEQg" mode=""></image>
			    	<text>已连接</text>
			    </view>
			</view>
			<view class="kongzhi">
		        <!-- <view class="lxkai" @click.stop="btngb">
		        	关闭
		        </view> -->
		        <view class="lxkai" @click.stop="btnkq">
		        	开启
		        </view>				
			</view>
		</view>
		<view class="mask" v-if="lanyaflag"></view>
	</view>
</template>

<script>
	var xBlufi = require("@/components/blufi/xBlufi.js")
	export default {
		data() {
			return {
                bgc: {
                	backgroundColor: "",
                },
				wififlag:false,
				orderNo:'',
				orderobj:{},
				flag:true,
				user:{},
				checked:false,
				viewType:'',
				ver_dataflag:2,
				devicesarr:[],
				deviceIds:'',
				name:'',
				deviceId:'',
				lanyaflag:false,
				lanyamac:''
			}
		},
		onLoad(option) {
			if(option.orderNo){
				this.orderNo = option.orderNo
				this.viewType =  option.viewType
				this.getxq()
			}else{
				this.orderNo = option.orderNowx
				this.getxqs()
			}
		},
		onShow() {
            this.getinfo()
			xBlufi.notifyStartDiscoverBle({'isStart': true})
			xBlufi.listenDeviceMsgEvent(true, this.funListenDeviceMsgEvent)
		},
		onShareAppMessage(res) {
		    if (res.from === 'button') {// 来自页面内分享按钮
		      console.log(res.target)
		    }
		    return {
		      title: '共享时光屋',
			  imageUrl:'https://api.ccttiot.com/smartmeter/img/static/uS8TEdeETwvOdHDswc9c',
		      path: '/page_user/dingdanxq?orderNowx=' + this.orderNo
		    }
		},
		methods: {
			// 蓝牙开启
			btnkq(){
				// if(this.lanyaobj.type == 1){
					if(this.lanyaobj.gateUnlockMode == 1){
						xBlufi.notifySendCustomData({
							customData: '11km' + this.lanyaobj.gateUnlockTime + '@'
						})
						let data = {
							mac:this.lanyamac,
							reason:'正常开门',
							command:'11km' + this.lanyaobj.gateUnlockTime + '@',
							result:true
						}
						this.$u.post(`/app/commandLog/bluetooth`,data).then(res => {})
					}else{
						xBlufi.notifySendCustomData({
						    	customData: '11gm' + this.lanyaobj.gateUnlockTime + '@'
						    })
						    let data = {
						    	mac:this.lanyamac,
						    	reason:'反向开门',
						    	command:'11gm' + this.lanyaobj.gateUnlockTime + '@',
						    	result:true
						    }
						    this.$u.post(`/app/commandLog/bluetooth`,data).then(res => {})
					}
				// }else{
				// 	xBlufi.notifySendCustomData({
				// 		customData: '11open'
				// 	})
				// 	let data = {
				// 		mac:this.lanyamac,
				// 		reason:'开启',
				// 		command:'11open',
				// 		result:true
				// 	}
				// 	this.$u.post(`/app/commandLog/bluetooth`,data).then(res => {})
				// }
			},
			// 蓝牙关闭
			btngb(){
				xBlufi.notifySendCustomData({
					customData: '11close'
				})
				let data = {
					mac:this.lanyamac,
					reason:'关闭',
					command:'11close',
					result:true
				}
				this.$u.post(`/app/commandLog/bluetooth`,data).then(res => {})
			},
			// 点击蓝牙弹出隐藏
			btncha(){
				this.lanyaflag = false
				this.ver_dataflag = 2
				xBlufi.notifyConnectBle({
				    isStart: false,
				    deviceId: this.deviceId,
				    name: this.name
				})
			},
			// 连接蓝牙函数
			getlanya() {
				if (this.ver_dataflag != 3) {
					this.ver_dataflag = 2
					let that = this
					if (that.deviceId != '') {
						let systemInfo = uni.getSystemInfoSync()
							if (systemInfo.platform == 'android') {
								that.lanyaflag = true
								that.deviceId = that.deviceId.match(/.{2}/g).reverse().join(':')
								xBlufi.notifyStartDiscoverBle({
									'isStart': false 
								})
								console.log("进入蓝牙连接", that.deviceId)
								console.log("进入that.name", that.name)
								xBlufi.notifyConnectBle({
									isStart: true,
									deviceId: that.deviceId,
									name: that.name
								})
							} else if (systemInfo.platform == 'ios') {
								// 当前设备是 iOS 
								that.lanyaflag = true
							    that.findDevice()
						}else{
							console.log('其他');
						}
					}
				}
			},
			findDevice() {
			    const matchedDevice = this.devicesarr.find(device => {
			        console.log(device.name, '111') 
			        console.log("IOSMAC", device)
			        return device.name.slice(-12) == this.deviceId.slice(-12)
			    })
			    if (matchedDevice) {
			        xBlufi.notifyStartDiscoverBle({
			            'isStart': false
			        })
			        xBlufi.notifyConnectBle({
			            isStart: true,
			            deviceId: matchedDevice.deviceId,
			            name: matchedDevice.name
			        })
			        this.deviceId = matchedDevice.deviceId
			        this.name = matchedDevice.name
			        console.log(this.deviceId, '11221')
			    } else {
			        console.log("未找到匹配的设备，继续查找...")
			        setTimeout(this.findDevice.bind(this), 1000) // 使用 bind 保持 this 上下文
			    }
			},
			
			// 获取附近蓝牙设备列表
			funListenDeviceMsgEvent: function (options) {
				switch (options.type) {
					case xBlufi.XBLUFI_TYPE.TYPE_GET_DEVICE_LISTS:
						if (options.result) {
							this.devicesarr = options.data
						}
						break;
					case xBlufi.XBLUFI_TYPE.TYPE_CONNECTED:
						console.log("连接回调：" + JSON.stringify(options))
						if (options.result == true) { 
							    setTimeout(()=>{
							    	this.ver_dataflag = 3
							    },2000)
								xBlufi.notifyInitBleEsp32({
									deviceId: this.deviceId
								})
								this.deviceIds = options.data.deviceId
								this.name = this.name
						} 
						break;
					case xBlufi.XBLUFI_TYPE.TYPE_RECIEVE_CUSTON_DATA:
						this.ver_dataflag = 3
						console.log("1收到设备发来的自定义数据结果：", options.data)
						break;
					case xBlufi.XBLUFI_TYPE.TYPE_GET_DEVICE_LISTS_START:
						if (!options.result) {
							console.log('蓝牙未开启')
							return
						}
						break;
				}
			},
			
			// 点击跳转到控制设施
			btnkz(){
				uni.navigateTo({
					url:'/page_user/sheshikz?roomId=' + this.orderobj.roomId + '&storeId=' + this.orderobj.storeId
				})
			},
			// 查询个人信息
			getinfo() {
				this.$u.get(`/getAppInfo`).then(res => {
					if (res.code == 200) {
						this.user = res.user
					}
				})
			},
			// 如果是大厅设施则点击开启
			btnkai(){
				this.$u.get(`/app/room/openRoomGate/${this.orderobj.roomId} `).then(res => {
					if (res.code == 200) {
						uni.showToast({
						  title: '开启成功',
						  icon: 'success',
						  duration: 2000
						})
					}else{
						uni.showToast({
							title: res.msg,
							icon: 'none',
							duration: 2000
						})
					}
				})
			},
			// 自定义导航栏返回
			btns(){
				uni.reLaunch({
					url:'/pages/tj'
				})
			},
			// 点击开店门
			btnkdm(){
				// if(this.orderobj.gateOnlineStatus == 1){
					if(this.orderobj.userId == this.user.userId){
						this.$u.get(`app/store/openGate/${this.orderobj.storeId}`).then(res => {
							if (res.code == 200) {
								uni.showToast({
								  title: '开启店门成功',
								  icon: 'success',
								  duration: 2000
								})
							}else if(res.code == 501){
								this.deviceId = res.msg
								this.lanyamac = res.msg
								console.log(this.deviceId);
								this.getlanya()
							}else{
								uni.showToast({
									title: res.msg,
									icon: 'none',
									duration: 2000
								})
							}
						})
					}else{
						let data = {
							isVerify:false
						}
					   this.$u.get(`app/store/openGate/${this.orderobj.storeId}`,data).then(res => {
					   	if (res.code == 200) {
					   		uni.showToast({
					   		  title: '开启店门成功',
					   		  icon: 'success',
					   		  duration: 2000
					   		})
					   	}else if(res.code == 501){
							this.deviceId = res.msg
							this.lanyamac = res.msg
							console.log(this.deviceId);
							this.getlanya()
						}else{
					   		uni.showToast({
					   			title: res.msg,
					   			icon: 'none',
					   			duration: 2000
					   		})
					   	}
					   })	
					}
				// }
			},
			// 点击开包厢门
			btnkbxm(){
				if(this.orderobj.roomType2 == 1){
					this.$u.post(`/app/device/adminAll/${this.orderobj.roomId}/switch?open=true`).then(res => {
						if (res.code == 200) {
							uni.showToast({
							  title: '开启包厢门成功',
							  icon: 'success',
							  duration: 2000
							})
						}else{
							uni.showToast({
								title: res.msg,
								icon: 'none',
								duration: 2000
							})
						}
					})
				}else{
					uni.showToast({
						title: '大厅无需开包厢门',
						icon: 'none',
						duration: 2000
					})
				}
			},
			// 请求订单详情(被分享人)
			getxqs(){
				let data = {
					orderNo:this.orderNo
				}
				this.$u.get(`/app/shareOrder?orderNo=${this.orderNo}`,data).then(res => {
					if (res.code == 200) {
						this.orderobj = res.data
					}else{
						uni.showToast({
							title: res.msg,
							icon: 'none',
							duration: 2000
						})
					}
				})
			},
			// 请求订单详情
			getxq(){
				let data = {
					orderNo:this.orderNo
				}
				this.$u.get(`/appVerify/orderInfo?orderNo=${this.orderNo}`,data).then(res => {
					if (res.code == 200) {
						this.orderobj = res.data
						this.lanyaobj = res.data
						console.log(this.lanyaobj)
					}else{
						uni.showToast({
							title: res.msg,
							icon: 'none',
							duration: 2000
						})
					}
				})
			},
			// 点击进行导航
			btndaohang(){
				uni.openLocation({
				   latitude:this.orderobj.lat,//纬度-目的地/坐标点
				   longitude:this.orderobj.lng,//经度-目的地/坐标点
				   name:this.orderobj.storeName,//地点名称
				   address:this.orderobj.storeAddress//详细地点名称
				})
			},
			// 点击复制wifi密码
			copy() {
			 	uni.setClipboardData({
			 	    data: this.orderobj.wifiPassword,
			    	success: function () {
			        	uni.showToast({
			        		title: '复制成功',
			        		icon: 'success',
							duration:2000
			        	})
			    	}
			 	})
			 },
			 // 点击一键连接wifi
			 onAutolink(){
			     let wifiName = this.orderobj.wifi
			     let wifiPassword = this.orderobj.wifiPassword
			 	uni.startWifi({
			 		success:e=>{
			 			uni.connectWifi({
			 				SSID:wifiName,  // SSID就是账号
			 				password:wifiPassword, // 密码
			 				complete:complete=>{
			 					console.log("complete",complete)
								uni.showToast({
									title: '连接成功',
									icon: 'success',
									duration:2000
								})
			 				}
			 			})
			 	    },
			 	})
			},
			// 点击查看wifi
			btnwifi(){
				this.wififlag = true
			},
			// 换座
			btnhuanzuo(){
				uni.navigateTo({
					url:'/page_user/huanzuo'
				})
			},
		    // 续单
			btnxudan(){
				if(this.orderobj.mode == 2){
					uni.navigateTo({
						url:'/page_user/xudan?roomId=' + this.orderobj.roomId + '&orderNo=' + this.orderNo + '&viewType=' + this.viewType
					})
				}else{
					uni.showToast({
						title: '押金收费暂不支持续单',
						icon: 'none',
						duration:2000
					})
				}
			}
		}
	}
</script>

<style lang="scss">
	.boxda{
		overflow: scroll;
		width: 100%;
		height: 88vh;
		padding-bottom: 200rpx;
		box-sizing: border-box;
	}
	// 离线蓝牙开关
	.lxlanya{
		position: fixed;
		top: 40%;
		left: 50%;
		transform: translateX(-50%);
		width: 500rpx;
		max-height:600rpx;
		background-color: #fff;
		border-radius: 30rpx;
		z-index: 9;
		padding: 30rpx 40rpx;
		box-sizing: border-box;
		.cha{
			font-size: 50rpx;
			position: absolute;
			top: 20rpx;
			right: 30rpx;
			font-weight: 600;
		}
		.lxzt{
			margin-top: 30rpx;
			padding: 0 20rpx;
			box-sizing: border-box;
			view{
				display: flex;
				justify-content: space-between;
				align-items: center;
				image{
					width: 80rpx;
					height: 80rpx;
				}
			}
		}
		.lxtit{
			font-size: 32rpx;
			font-weight: 600;
			width: 100%;
			text-align: center;
			margin-top: 30rpx;
		}
		.kongzhi{
			display: flex;
			justify-content: space-between;
			margin-top: 30rpx;
			.lxkai{
				width: 200rpx;
				height: 80rpx;
				background-color: #48893B;
				color: #fff;
				text-align: center;
				line-height: 80rpx;
				border-radius: 20rpx;
			}
		}
	}
	page {
		background: #fff;
		padding-bottom: 64rpx;
		box-sizing: border-box;
		.mask{
			width: 100%;
			height: 100vh;
			position: fixed;
			top: 0;
			left: 0;
			background-color: #000;
			opacity: .5;
		}
		.ljwifi{
			width: 660rpx;
			height: 240rpx;
			// line-height: 120rpx;
			padding: 0 40rpx;
			box-sizing: border-box;
			background-color: #fff;
			position: fixed;
			top: 40%;
			left: 50%;
			transform: translateX(-50%);
			z-index: 1;
			border-radius: 10rpx;
			padding-top: 20rpx;
			.cuo{
				font-size: 46rpx;
				position: fixed;
				top: 0;
				right: 20rpx;
			}
			.name{
				width: 100%;
				height: 60rpx;
				text-align: center;
				font-size: 36rpx;
			}
			.tanx{
				margin-top: 10rpx;
				display: flex;
				justify-content: space-between;
				align-items: center;
				background-color: #eee;
				height: 110rpx;
				box-sizing: border-box;
				padding: 0 20rpx;
				border-radius: 10rpx;
				.one{
					text-align: center;
				}
				.two{
					.fz{
						padding: 10rpx 20rpx;
						border: 1px solid #000;
						text-align: center;
						border-radius: 50rpx;
						margin-left: 10rpx;
					}
					.lj{
						padding: 10rpx 20rpx;
						border: 1px solid #48893B;
						background-color: #48893B;
						text-align: center;
						border-radius: 50rpx;
						margin-left: 10rpx;
						color: #fff;
					}
				}
			}
		}
		.tishi{
			width: 674rpx;
			height: 642rpx;
			background: #FFFFFF;
			box-shadow: 0rpx 2rpx 12rpx 0rpx rgba(0,0,0,0.15);
			border-radius: 18rpx 18rpx 18rpx 18rpx;
			margin: auto;
			margin-top: 24rpx;
			padding: 30rpx;
			box-sizing: border-box;
			.top{
				font-weight: 600;
				font-size: 32rpx;
				color: #3D3D3D;
				border-left: 8rpx solid #48893B;
				padding-left: 14rpx;
				box-sizing: border-box;
				border-radius: 4rpx;
			}
			.wenzi{
				font-size: 28rpx;
				color: #3D3D3D;
				margin-top: 24rpx;
			}
		}
		.zizhu{
			width: 674rpx;
			max-height: 572rpx;
			background: #FFFFFF;
			box-shadow: 0rpx 2rpx 12rpx 0rpx rgba(0,0,0,0.15);
			border-radius: 18rpx 18rpx 18rpx 18rpx;
			margin: auto;
			margin-top: 24rpx;
			padding: 30rpx;
			box-sizing: border-box;
			.imglist{
				margin-top: 20rpx;
				display: flex;
				justify-content: space-between;
				flex-wrap: wrap;
				image{
					width: 288rpx;
					height: 78rpx;
					margin-top: 20rpx;
				}
				button{
					width: 288rpx;
					height: 78rpx;
					margin-top: 20rpx !important;
					/* margin-left: 40rpx; */
					/* position: relative; */
					border-radius: 50rpx;
					padding: 0 !important;
					margin: 0;
					image{
						margin-top: 0;
						position: absolute;
						top: 0;
						left: 0;
					}
				}
			}
			.ckwifi{
				width: 614rpx;
				height: 104rpx;
				background: #F1F1F1;
				border-radius: 12rpx 12rpx 12rpx 12rpx;
				display: flex;
				justify-content: space-between;
				align-items: center;
				padding:  0 28rpx;
				box-sizing: border-box;
				margin-top: 30rpx;
				.lt{
					display: flex;
					justify-content: space-between;
					align-items: center;
					font-weight: 600;
					font-size: 36rpx;
					color: #3D3D3D;
					image{
						width: 60rpx;
						height: 60rpx;
						margin-right: 36rpx;
					}
				}
				.rt{
					width: 158rpx;
					height: 64rpx;
					border-radius: 32rpx 32rpx 32rpx 32rpx;
					border: 2rpx solid #48893B;
					font-size: 36rpx;
					color: #48893B;
					text-align: center;
					line-height: 64rpx;
				}
			}
			.top{
				font-weight: 600;
				font-size: 32rpx;
				color: #3D3D3D;
				border-left: 8rpx solid #48893B;
				border-radius: 4rpx;
				padding-left: 12rpx;
				display: flex;
				justify-content: space-between;
				align-items: center;
				.rt{
					font-weight: 400;
					border: 1px solid #48893B;
					background-color: #48893B;
					color: #fff;
					padding: 10rpx 20rpx;
					box-sizing: border-box;
					border-radius: 50rpx;
				}
			}
		}
		.dianpu{
			width: 674rpx;
			max-height: 600rpx;
			background: #FFFFFF;
			box-shadow: 0rpx 2rpx 12rpx 0rpx rgba(0,0,0,0.15);
			border-radius: 18rpx 18rpx 18rpx 18rpx;
			padding:30rpx;
			box-sizing: border-box;
			margin: auto;
			margin-top: 24rpx;
			.bianh{
				margin-top: 36rpx;
				.bianh_val{
					font-size: 26rpx;
					color: #272536;
					margin-top: 18rpx;
					display: flex;
					justify-content: space-between;
				}
			}
			.bd{
				display: flex;
				margin-top: 40rpx;
				image{
					width: 176rpx;
					height: 176rpx;
					border-radius: 10rpx; 
					margin-right: 28rpx;
				}
				.rts{
					view{
						font-size: 26rpx;
						color: #3D3D3D;
						margin-top: 16rpx;
					}
				}
			}
			.top{
				display: flex;
				justify-content: space-between;
				align-items: center;
				.lt{
					font-weight: 600;
					font-size: 32rpx;
					color: #3D3D3D;
					border-left: 8rpx solid #48893B;
					border-radius: 4rpx;
					text{
						padding: 4rpx;
						border: 1px solid #48893B;
						font-size: 24rpx;
						font-weight: 400;
						color: #48893B;
					}
				}
				.rt{
					image{
						width: 200rpx;
						height: 50rpx;
					}
				}
			}
		}
		.timeduan{
			display: flex;
			justify-content: space-between;
			margin-top: 26rpx;
			padding: 0 38rpx;
			box-sizing: border-box;	
			.two{
				text-align: center;
				.top{
					font-weight: 600;
					font-size: 40rpx;
					color: #3D3D3D;
				}
				.bot{
					image{
						width: 208rpx;
						height: 8rpx;
					}
				}
			}
			.one{
				text-align: center;
				.top{
					font-weight: 600;
					font-size: 36rpx;
					color: #3D3D3D;
				}
				.bot{
					font-size: 28rpx;
					color: #3D3D3D;
					margin-top: 4rpx;
				}
			}
		}
		.imgbj{
			width: 750rpx;
			height: 424rpx;
			position: fixed;
			top: 0;
			left: 0;
			z-index: -1;
		}
	}

</style>