yogaApp/pages/order/orderinfo.vue

<template>
	<view class="page">
		
		<view class="oinfo" v-if="info">
			
			<!-- 地址信息 -->
			<view class="yycon odrcell">
				<view class="atitle">
					<uni-icons type="location" size="23" color="#303133"></uni-icons>
					{{info.receiverName?info.receiverName:''}}
					{{info.receiverPhone?info.receiverPhone:''}}
				</view>
				<view class="olist">
					<view class="ocell1">
						{{info.receiverProvince?info.receiverProvince:''}}
						{{info.receiverCity?info.receiverCity:''}}
						{{info.receiverDistrict?info.receiverDistrict:''}}
						{{info.receiverDetailAddress?info.receiverDetailAddress:''}}
					</view>
				</view>
			</view>
			
			<!-- 订单状态 -->
			<view style="margin-top: 20rpx;" class="odrcell" 
			:class="info.status==0?'oztorange': (info.status==1||info.status==2?'ozc':(info.status==3?'owc':'oztgray'))">
				<view class="ozstate">
					<!-- 描述：订单状态 0->待付款；1->待发货；2->已发货；3->已完成；4->已关闭 -->
					{{info.status==0?"待付款":
					(info.status==1?"待发货":
					(info.status==2?"待收货":
					(info.status==3?"已完成":"订单已关闭")))}}
				</view>
				<view class="oztip">
					{{info.status==0?"订单已生成，请您完成订单支付。":
					(info.status==1?"订单已支付，请您等待发货。":
					(info.status==2?"订单已发货，请您注意查收。":
					(info.status==3?"订单已完成，感谢购买！期待您的继续使用。":
					(info.status==4?"您的订单已关闭。":"您的订单已取消。"))))}}
				</view>
			</view>
			
			<!-- 商品信息 -->
			<view class="yycon odrcell" v-if="info.orderItemList&&info.orderItemList.length>0">
				<view class="oscon" v-for="(item, index) in info.orderItemList"  :key="index">
					<view class="osimg imgload">
						<image class="osimg" v-if="item.pic" :src="item.pic" mode="aspectFill"></image>
					</view>
					<view class="osrcon">
						<view class="osname">
							{{item.productName?item.productName:''}}
						</view>
						<view class="oscell">
							<text class="txt">规格：{{ retSku(item.spData) }}</text>
						</view>
						<view class="oscell">
							<text class="txt">单价：￥{{item.salePrice}}</text>
						</view>
						<view class="oscell">
							<text class="txt">数量：{{item.quantity}}</text>
						</view>
					</view>
					<view class="omoney">
						{{item.salePrice?'￥'+(item.salePrice*item.quantity).toFixed(2):"￥0"}}
					</view>
				</view>
			</view>
			
			<!-- 订单信息 -->
			<view class="yycon odrcell">
				<view class="olist">
					<view class="ocell">
						<text>
							商品总价
						</text>
						<text style="font-size: 30rpx;color:#000;font-weight: 600;">
							{{info.totalAmount?'￥'+(info.totalAmount).toFixed(2):"￥0.0"}}
						</text>
					</view>
				</view>
				<!-- <view class="olist">
					<view class="ocell">
						<text>
							运费险
						</text>
						<text>
							￥{{info.ordershipfee}}
						</text>
					</view>
				</view> -->
				<view class="olist">
					<view class="ocell">
						<text>
							交易金额
						</text>
						<text>
							￥{{info.payAmount}}
						</text>
					</view>
				</view>
				<view class="olist">
					<view class="ocell">
						<text>
							实付款
						</text>
						<text style="color:#ff0000;font-size: 30rpx;">
							￥{{info.payAmount}}
						</text>
					</view>
				</view>
				<view class="olist">
					<view class="ocell">
						<text>
							订单编号
						</text>
						<text>
							{{info.orderSn}}
						</text>
					</view>
				</view>
				<view class="olist" v-if="info.deliverySn">
					<view class="ocell">
						<text>
							物流单号
						</text>
						<text>
							{{info.deliverySn}}
						</text>
					</view>
				</view>
				<view class="olist">
					<view class="ocell">
						<text>
							下单日期
						</text>
						<text>{{info.createTime}}</text>
					</view>
				</view>
				<view class="olist" v-if="info.payType">
					<view class="ocell">
						<text>
							支付方式
						</text>
						<text>{{info.payType}}</text>
					</view>
				</view>
				<view class="olist" v-if="info.paymentTime">
					<view class="ocell">
						<text>
							支付日期
						</text>
						<text>{{info.paymentTime}}</text>
					</view>
				</view>
				<view class="olist">
					<view class="ocell">
						<text>
							下单备注
						</text>
						<text>{{info.note?info.note:'无'}}</text>
					</view>
				</view>
			</view>
			
		</view>
		
		<view class="submitcon" v-if="info">
			<view style="display: flex;flex: 1;"></view>
			<!-- 描述：订单状态 0->待付款；1->待发货；2->已发货；3->已完成；4->已关闭 -->
			<button v-if="info.status==0" type="primary" class="cancelbtn" @click="canceldo()">取消订单</button>
			<button v-if="info.status==0" type="primary" class="btn" @click="gotopay">去支付</button>
			<button v-if="info.status==2" type="primary" class="wlbtn" @click="gotowl">查看物流</button>
			<button v-if="info.status==2" type="primary" class="btn" @click="checkdo">确认收货</button>
			<button v-if="info.status==3" type="primary" class="pjbtn" @click="gotopj">评价反馈</button>
			<button v-if="info.status==3" type="primary" class="gzbtn" @click="gotosh">申请售后</button>
			<button v-if="info.status==3&&info.aftersaleStatus==0" type="primary" class="gzbtn" @click="gotoshcancel">取消售后</button>
			<button type="primary" class="btn" @click="gotosj">联系商家</button>
			 
		</view>
		
		<!-- 支付弹框 -->
		<uni-popup ref="paypup" type="share">
			<view class="allcon">
				<view class="hcon">
					<view class="htitle">订单支付<text style="font-size: 28rpx;">(请在2小时内支付)</text></view>
					<view class="rclose" @tap="_hide">
						<uni-icons type="closeempty" size="24" color="#999999"></uni-icons>
					</view>
				</view>
				<view class="mcon" v-if="info">
					￥ <text class="mcost">{{price_payall}}</text>
				</view>
				<view class="selcon">
					<radio-group class="checklist-group" @change="change">
						<view class="sitem" v-for="(item,index) in paylist" :key="index">
							<view class="simg">
								<image class="img" :src="item.icon"></image>
							</view>
							<view class="conright">
								<view class="sname">
									{{item.name}}
								</view>
							</view>
							<view class="selbtn">
								<radio :value="item.id" :checked="item.isChecked" />
							</view>
						</view>
					</radio-group>
				</view>
				<button type="primary" class="paybtn" @click="paydo()">确认支付</button>
			</view>
		</uni-popup>
		
		<!-- 退款弹框 -->
		<uni-popup ref="refundpup" type="share">
			<view class="allcon" style="height: 980rpx;">
				<view class="hcon">
					<view class="htitle">退款</view>
					<view class="rclose" @tap="_refhide">
						<uni-icons type="closeempty" size="24" color="#999999"></uni-icons>
					</view>
				</view>
				<view class="mtxt">
					退款金额：<text style="color:#ff0000;font-size: 36rpx;">￥{{refundMoney}}</text>
				</view>
				<view class="mtxt">
					退款说明：{{refmessage?refmessage:"正常退款"}}
				</view>
				<view class="mref">
					<refdirection></refdirection>
				</view>
				<button type="primary" class="paybtn" @click="refdodo()">确认退款</button>
			</view>
		</uni-popup>
		
		<!-- 是否登录 -->
		<openlogin ref="loginId" @getPhoneNumber="getPhoneNumber"></openlogin> 
		
	</view>
</template>

<script>
	import { myCache } from '../../utils/utils.js';
	import openlogin from "../components/openlogin.vue";
	export default {
		components: {
			openlogin
		},
		data() {
			return {
				openId:"",
				phone:"",
				userid:"",
				id:"",
				info:{
					sh_state:"1",
					sh_name:"收货人",
					sh_phone:"18900000001",
					sh_address:"收货地址收货地址收货地址收货地址",
					orderid:"ord23258876543",
					business:"商家1",
					productid:"1",
					productprice:39.9,
					productname:"杜威克瑜伽球加厚防滑",
					img:'../../static/image/theme/p1.jpg',
					productspecs:"M 白",
					productnum:1,
					productunit:"个",
					status:'1',
					orderdate:"2025-06-23 10:26:09",
					paytype:"支付宝",
					paydate:"2025-06-23 10:26:09",
					ordershipfee:"0.0",
					jymoney:39.9,
					sfmoney:39.9,
					kdno:"1098768799232",
					icon:"../../static/image/product/sp1.jpg",
					username:"张三",
					tel:"18000000001",
					address:"江苏省扬州市江都市地址信息1地址信息2地址信息3地址信息4地址信息5",
					pname:"测试",
					sets:"租完6个月可买断 测试 测试",
					nums:1,
					rentcycle:6,
					last:5,
					price:0.01,
					delivery:"寄出包邮/顺丰包邮",
					freezedeposit:0.01,
					deposit:0.01,
					sesameCredit:0.00,
					freezeway:"支付宝资金授权",
					buyoutprice:0,
					orderNo:"20240314000000001",
					createdate:"2024-03-23 12:01:28",
					notes:"测试订单"
				},
				platform:"",// 退款方式 1微信支付2支付宝支付
				refundMoney:0,
				refmessage:"",
				pindex:0,//当前需要支付项
				price_pay:0,// 当前需要支付金额
				price_payall:39.9,// 当前需要支付金额
				businessid:0,//当前需要支付账单号
				alipay_number:'',// 支付宝交易号
				bills:[],
				paylist:[],
				payType:"" //1微信支付2支付宝支付
			};
		},
		onLoad(options) {
			if(options.id)
			{
				this.id=parseInt(options.id);
				this.getinfo();
			}
			
			this.paylist=[
				{
					id:"1",
					name:"微信支付",
					icon:"../../static/image/wx.png",
					isChecked:true
				},
				{
					id:"2",
					name:"支付宝支付",
					icon:"../../static/image/zfb.png",
					isChecked:true
				}
			];
			this.payType='2';
			this.platform='2';
		},
		onShow(){
			this.openId = myCache('openId');
			var user = myCache('user');
			this.userid = user.userid? user.userid:'';
			this.phone = user.userphone;
			if(this.userid==""||this.userid=="0"){
				uni.navigateTo({
					url: `/pages/login/login`
				});
			}
		},
		methods: {
			retSku(spData){
				var sels=[];
				if(spData){
					var suk= JSON.parse(spData);
					var keys=Object.keys(suk);
					keys.forEach(dd=>{
						sels.push(dd+":"+suk[dd])
					});
				}
				return sels.join(',');
			},
			goservice(val){
				console.log(val);
			},
			collapsechange(e){
				console.log('collapsechange',e);
			},
			change(e){
				console.log(e);
				if(e.detail.value){
					this.payType=e.detail.value;
				}
			},
			_show() {
				this.$refs.paypup.open();
			},
			_hide() {
				this.$refs.paypup.close();
				// 关闭弹出层
				setTimeout(() => {
					uni.hideLoading();
				}, 1000);
			},
			_cancel() {
				this._hide();
			},
			_refshow() {
				this.$refs.refundpup.open();
			},
			_refhide() {
				this.$refs.refundpup.close();
				// 关闭弹出层
				setTimeout(() => {
					uni.hideLoading();
				}, 1000);
			},
			_refcancel() {
				this._refhide();
			},
			getPhoneNumber(e){
				if(e.phone){
					this.phone = e.phone
				}
				if(e.userid){
					this.userid = e.userid
				}
			},
			iflogin(){
				this.openId = myCache('openId');
				var user = myCache('user');
				this.userid = user.userid? user.userid:'';
				this.phone = user.userphone;
				if(this.userid==""||this.userid=="0"||this.phone==""){
					uni.navigateTo({
						url: `/pages/login/login`
					});
					return false;
				}
				else{
					return true;
				}
			},
			goback(){
				uni.navigateBack({
					delta: 1
				});
			},
			// 取消售后
			gotoshcancel(){
				var id=this.id;
				uni.navigateTo({
					url: `/pages/order/ordersh?data=${id}`
				});
			},
			// 申请售后
			gotosh(){
				var id=this.id;
				uni.navigateTo({
					url: `/pages/order/ordersh?data=${id}`
				});
			},
			// 查看物流
			gotowl(){
				var id=this.id;
				uni.navigateTo({
					url: `/pages/order/orderwl?id=${id}`
				});
			},
			// 去评价
			gotopj(){
				var id=this.id;
				uni.navigateTo({
					url: `/pages/order/orderpj?data=${id}`
				});
			},
			gotosj(){
				// 在线客服
				uni.makePhoneCall({
					phoneNumber: "18900000001",
					success:function(){
						console.log('拨打电话成功');
					},
					fail() {
						console.log('打电话失败了');
					}
				});
			},
			async getinfo() {
				uni.showLoading({
					title: '数据加载中...'
				});
				const {data: res} = await uni.$http.get('/api/order/orderDetail', {orderId:this.id});
				if(res){
					// 订单信息
					this.info=res;
					this.$forceUpdate();
				}
				else{
					uni.showModal({
						title: '提示',
						content: '当前订单信息不存在..',
						cancelText: '取消',
						confirmText: '确定',
						success: ress => {
							// 返回
							uni.navigateBack({
								delta: 1
							});
						}
					});
				}
			},
			async getbill() {
				uni.showLoading({
					title: '数据加载中...'
				});
				const {data: res} = await uni.$http.post('/alipay/getBillsListByOrderId', {id:this.id});
				console.log(res);
				
				if(res){
					// 订单账单信息
					this.bills=res;
					this.bills.sort(function(a,b){
					    return a.pay_number-b.pay_number
					});
					this.price_pay=0;
					this.businessid=0;
					this.bills.forEach((cell,idx)=>{
						if(!this.price_pay&&cell.pay_state==0 ){
							this.price_pay= cell.bill_money;
							if(cell.pay_number==1){
								// 增加包支付和屏保
								this.price_payall= this.price_payall+ parseFloat(this.price_pay) ;
							}
							else{
								this.price_payall= parseFloat(this.price_pay) ;
							}
							this.businessid=cell.id;
							this.pindex=idx;
						}
					});
					this.$forceUpdate();
				}
			},
			gotopay(){
				this._show();
			},
			canceldo(){
				//取消订单
				uni.showModal({
					title: '提示',
					content: '确定要取消订单吗？',
					cancelText: '取消',
					confirmText: '确定',
					success: ress => {
						if (ress.confirm) {
							this.deldo();
						}
					}
				});
			},
			// 订单取消
			async deldo(){
				// 是否登录
				if(!this.iflogin()){
					return false;
				}
				
				var param={
					idList:[this.info.orderId]
				};
				const {data: res} = await uni.$http.post('/api/order/orderCancel', param);
				console.log(res)
				if(res&&res=="取消订单成功"){
					myCache("iforderload",1);
					uni.showModal({
						title: '提示',
						content: '订单已取消！',
						showCancel: false,
						confirmText: '确定',
						success: ress => {
							// 跳转到全部订单
							uni.redirectTo({
								url: `/pages/order/orderlist?id=0`
							});
						}
					});
				}
				else{
					uni.showModal({
						title: '提示',
						content: res.msg? res.msg:'订单取消失败！',
						showCancel: false,
						confirmText: '确定',
						success: ress => {}
					});
				}
			},
			// 确认收货
			checkdo(){
				var that = this;
				//确认收货
				uni.showModal({
					title: '提示',
					content: '确定订单收货吗？',
					cancelText: '取消',
					confirmText: '确定',
					success: ress => {
						if (ress.confirm) {
							//确认收货
							that.checkdodo();
						}
					}
				});
			},
			async checkdodo(){
				uni.showToast({
					title: '确认收货中...',
					icon: 'success',
					duration: 2000
				});
				var param={
					orderId:this.id
				};
				const {data: res} = await uni.$http.post('/api/order/orderComplete', param);
				if(res&&res=="确认收货成功"){
					uni.showModal({
						title: '提示',
						content: '订单已确认收货！',
						showCancel: false,
						confirmText: '确定',
						success: ress => {
							// 跳转到订单列表
							uni.redirectTo({
								url: `/pages/order/orderlist?id=0`
							});
						}
					});
				}
				else{
					uni.showToast({
						title: res.msg? res.msg:'订单确认收货失败！',
						icon: 'error',
						duration: 2000
					});
				}
			},
			//  e签宝电子签署
			async signdo(){
				if(!this.info.id){
					uni.showModal({
						title: '提示',
						content: '电子签署获取失败！',
						showCancel: false,
						confirmText: '确定'
					});
					return false;
				}
				myCache("signtype",'6');
				myCache("siginorderid",this.info.id);
				var id=this.info.id;
				uni.navigateTo({
					url: `/pages/setting/esignweb?data=${id}`
				});
				
			},
			// 去支付
			async paydo(){
				// 去支付
				if (!this.payType) {
					uni.showModal({
						title: '提示!',
						content: '请选择支付类型！',
						showCancel: false
					});
					return false;
				}
				if(!this.businessid){
					uni.showModal({
						title: '提示!',
						content: '实际支付金额异常！请刷新后支付！',
						showCancel: false
					});
					return false;
				}
				
				// 是否登录
				if(!this.iflogin()){
					return false;
				}
				
				var that = this;
				if(this.payType=='1'){
					// 微信支付
					that.wxpaydo();
				}
				else if(this.payType=='2'){
					// 支付宝一般支付
					that.alipaydo();
				}
				else if(this.payType=='3'){
					// 支付宝免密代扣
					that.alisignpaydo();
				}
				
			},
			async alipaydo(){
				uni.showLoading({
					title: '发起支付....'
				}); 
				// 支付宝调起支付
				var that=this;
				//申请支付 
				var param={
					id: that.businessid
				};
				const {data: ress} = await uni.$http.post("/alipay/getAppOrderStrByBillsId", param);
				console.log("生成支付信息调起支付值");
				console.log(ress);
				if(ress){
					var trade_no =ress.trim();
					// 调起支付
					uni.getProvider({
					    service: 'payment',
					    success: function (res) {
					        console.log(res.provider,"uni.getProvider");
					        if (~res.provider.indexOf('alipay')) {
					            uni.requestPayment({
					                "provider": "alipay",  //固定值为"alipay"
									"orderInfo": trade_no,// 交易单号
					                success: function (resr) {
										console.log("支付宝调起支付成功",resr);
										if(resr["errMsg"]=='requestPayment:ok'&&resr["rawdata"]){ 
											var rawdata= JSON.parse(resr["rawdata"]);
											if(rawdata.resultStatus==='9000'){
												// 关闭对话框
												that._hide();
												// uni.showLoading({
												// 	title: '订单支付成功！'
												// });
												
												uni.showModal({
													title: '提示',
													content: '订单支付成功!',
													showCancel: false,
													confirmText: '确定',
													success: ress => {
														// 跳转到待接单订单列表
														uni.redirectTo({
															url: `/pages/order/orderlist?id=0`
														});
													}
												});
											}
											else{ 
												uni.showModal({
													title: '提示',
													content: '请求支付失败!请重试!',
													showCancel: false,
													confirmText: '确定',
													success: ress => {
													}
												});
											}
										}
										else{
											uni.showModal({
												title: '提示',
												content: '请求支付失败!请重试!',
												showCancel: false,
												confirmText: '确定',
												success: ress => {
												}
											});
										}
										
					                },
					                fail: function (err) {
										console.log("支付宝调起支付失败",err)
					                    console.log('支付失败:' + JSON.stringify(err));
										that.payFailDo();
					                }
					            });
					        }
					    }
					});
					
				}
				else{
					// 请求支付订单失败,
					uni.showModal({
						title: '提示',
						content: '请求支付失败!订单已经关闭或异常!请返回订单重试!',
						showCancel: false,
						confirmText: '确定',
						success: ress => {
							// 返回订单全部列表
							uni.redirectTo({
								url: `/pages/order/orderlist?id=0`
							});
						}
					});
				}
				
			},
			async wxpaydo(){
				uni.showLoading({
					title: '发起支付....'
				}); 
				// 微信调起支付
				var that=this;
				//申请支付 
				var param={
					id: that.businessid
				};
				const {data: ress} = await uni.$http.post("/alipay/getAppOrderStrByBillsId", param);
				console.log("生成支付信息、调起支付值");
				console.log(ress);
				if(ress){
					var trade_no =ress.trim();
					// 调起支付
					uni.getProvider({
					    service: 'payment',
						success: function (res) {
						    console.log(res.provider,"uni.getProvider");
						    if (~res.provider.indexOf('wxpay')) {
								const payParams = {
								    appid: res.data.appid,
								    noncestr: res.data.noncestr,
								    package: res.data.package,
								    partnerid: res.data.partnerid,
								    prepayid: res.data.prepayid,
								    timestamp: res.data.timestamp,
								    sign: res.data.sign
								};
								const orderInfo = JSON.stringify(payParams);
								// 唤起微信支付
								uni.requestPayment({
								  provider: 'wxpay',
								  orderInfo: orderInfo,
								  success: (resr) => {
									  console.log("微信调起支付成功",resr);
									  if(resr["errMsg"]=='requestPayment:ok'&&resr["rawdata"]){
									  	var rawdata= JSON.parse(resr["rawdata"]);
									  	if(rawdata.resultStatus==='9000'){
									  		// 关闭对话框
									  		that._hide(); 
									  		uni.showModal({
									  			title: '提示',
									  			content: '订单支付成功!',
									  			showCancel: false,
									  			confirmText: '确定',
									  			success: ress => {
									  				// 跳转到待接单订单列表
									  				uni.redirectTo({
									  					url: `/pages/order/orderlist?id=0`
									  				});
									  			}
									  		});
									  	}
									  	else{ 
									  		uni.showModal({
									  			title: '提示',
									  			content: '请求支付失败!请重试!',
									  			showCancel: false,
									  			confirmText: '确定',
									  			success: ress => {
									  			}
									  		});
									  	}
									  }
									  else{
									  	uni.showModal({
									  		title: '提示',
									  		content: '请求支付失败!请重试!',
									  		showCancel: false,
									  		confirmText: '确定',
									  		success: ress => {
									  		}
									  	});
									  }
								  },
								  fail: (err) => {
								    // 支付失败处理 
								    console.log('支付失败:', err);
								  }
								});
							}
						}
					});
					
				}
				else{
					// 请求支付订单失败,
					uni.showModal({
						title: '提示',
						content: '请求支付失败!订单已经关闭或异常!请返回订单重试!',
						showCancel: false,
						confirmText: '确定',
						success: ress => {
							// 返回订单全部列表
							uni.redirectTo({
								url: `/pages/order/orderlist?id=0`
							});
						}
					});
				}
				
			},
			// 支付宝免密代扣
			async alisignpaydo(){
				var that = this;
				uni.showLoading({
					title: '发起支付....'
				}); 
				// 支付宝调起免密代扣
				var that=this;
				if(this.info.state !==6){
					// 已经签约成功了,直接调起支付
					that.alipaydo();
				}
				else{ 
					// 代扣签约操作
					var param={
						orderId: this.info.id
					};
					// 查询代扣签约状态
					uni.showLoading({
						title: '代扣签约申请中....'
					});
					const {data: res} = await uni.$http.post("/antchainapi/queryWithholdSign", param);
					console.log('代扣签约查询',res)
					if(res.success){
						// 已经签约成功了,直接调起支付
						that.alipaydo();
					}
					else{
						console.log('签约代扣请求')
						// 申请代扣签约操作
						var param={
							orderId: this.info.id
						};
						console.log(this.info.id)
						const {data: ress} = await uni.$http.post("/antchainapi/createWithholdSign", param);
						console.log('签约代扣请求接口返回',ress);
						if(ress.success){
							var query={
							    signStr:ress.signStr,// 代扣签约创建接口返回的sign_str内容
							    tenantId:ress.tenantId, // 商家的用户code，在数科控制台中查询获取
							    merchantId:ress.merchantld, // 商户id,也是企业社会信用代码，保持与进件接口一致
							    orderId:ress.orderId, // // 订单id，保持与进件接口一致
							    redirectUrl: "alipays://platformapi/startapp?appId=2021004192630073&page=pages/order/orderlist", // 代扣签署成功/失败回跳地址，示例 alipays://platformapi/startapp?appId=2021004108689505&page=pages/home/index，appId 和 page 需要根据实际情况调整真实数值
							}
							
							// 代扣签约拉起
							// app 跳转支付宝小程序操作
							// #ifdef APP
							let alipayUrl = null;
							if (uni.getSystemInfoSync().platform == "ios") {
								alipayUrl = 'alipay://platformapi/startapp?appId=2021001152620480';
							}else{
								alipayUrl = 'alipays://platformapi/startapp?appId=2021001152620480';
							}
							//alipayUrl 已经有? 问号了，所以这里需要进行编码
							let queryString = this.objectToQueryString(query);
							let params = encodeURIComponent(queryString);
							// page=pages/index/index  跳转到支付宝小程序页面的页面路径
							alipayUrl  = `${alipayUrl}&path=pages/tripartite/index&query=${params}`;
							alipayUrl=encodeURIComponent(alipayUrl);
							alipayUrl=`https://ds.alipay.com/?scheme=${alipayUrl}`;
							console.log('alipayUrl',alipayUrl);
							//唤起支付宝
							plus.runtime.openURL(alipayUrl);
							myCache("signtype",'77');
							myCache("payorderid",that.info.id);
							myCache("periodNum",that.pindex);
							myCache("price_pay",that.price_pay);
							myCache("businessid",that.businessid);
							this.$forceUpdate();
							// #endif
							
							// #ifdef MP-ALIPAY
							// 代扣签约拉起
							my.navigateToMiniProgram({
							  appId:"2021001152620480", // 固定值，无须修改。
							  path:"pages/tripartite/index", // 固定值，无须修改。
							  query:query, // 需要携带的必要参数
							  success: (alires) => {
								  // 代扣签约调起成功，保存数据
								  console.log(alires);
								  myCache("signtype",'77');
								  myCache("payorderid",that.info.id);
								  myCache("periodNum",that.pindex);
								  myCache("price_pay",that.price_pay);
								  myCache("businessid",that.businessid);
								  this.$forceUpdate();
							  },
							  fail: (err) => {
								  console.log('代扣签约失败');
								  console.log(JSON.stringify(err));
								  uni.showModal({
								  	title: '提示',
								  	content: err?err: '请求代扣签约失败2!请重试!',
								  	showCancel: false,
								  	confirmText: '确定'
								  });
							  },
							});
							// #endif
						}
						else{
							// 请求代扣签约失败,
							uni.showModal({
								title: '提示',
								content: ress.msg? ress.msg:'请求代扣签约失败!订单已经关闭或异常!请返回订单重试!',
								showCancel: false,
								confirmText: '确定',
								success: rest => {
									// 返回订单全部列表
									uni.redirectTo({
										url: `/pages/order/orderlist?id=0`
									});
								}
							});
						}
					}
				}
			},
			async payFailDo(){
				// 支付失败
				uni.hideLoading(); 
				var that=this;
				uni.showModal({
					title: '提示',
					content: '支付订单失败！请重新再试！',
					showCancel: false,
					confirmText: '确定',
					success: ress => {
						if (ress.confirm) {
							// 提示
						}
					}
				});
			},
			async paySuccessDo(trade_no){
				var that = this;
				// 支付成功
				uni.hideLoading();
				// 回调修改订单账单状态
				var param={
					id: parseInt(this.businessid),
					pay_money:Math.round(100*parseFloat(this.price_pay))/100,
					alipay_number:trade_no,
				};
				uni.showLoading({
					title: '支付中...'
				});
				
				const {data: res} = await uni.$http.post('/alipay/updateBillsState', param);
				if(res){
					uni.showModal({
						title: '提示',
						content: '订单支付成功！',
						showCancel: false,
						confirmText: '确定',
						success: ress => {
							// 重新加载
							that.getinfo();
							// 跳转到待接单订单列表
							uni.redirectTo({
								url: `/pages/order/orderlist?id=9`
							});
							 
						}
					});
				}
				else{
					uni.showModal({
						title: '提示',
						content: res.msg? res.msg:'订单支付成功！订单状态异常！请联系客服！',
						showCancel: false,
						confirmText: '确定',
						success: ress => {
							// 跳转到待接单订单列表
							uni.redirectTo({
								url: `/pages/order/orderlist?id=0`
							});
							 
						}
					});
				}
				
				// 关闭对话框
				this._hide();
			},
			
		}
	}
</script>

<style lang="scss" scoped>
	::v-deep .uni-collapse-item__title-box{
		padding: 0 !important;
	}
	::v-deep .uni-collapse-item__title-text{
		font-weight: 600;
	}
	.page{
		padding: 0;
		position: relative;
		display: block;
		background-color: #F5F5F5;
		overflow-y: auto;
		margin-bottom: 20rpx;
	}
	.ret{
		position: fixed;
		top:20rpx;
		left:20rpx;
		background: rgba(0, 0, 0, .3);
		height: 60rpx;
		width: 60rpx;
		border-radius: 50% 50%;
		text-align: center;
		line-height: 60rpx;
		z-index: 9999;
	}
	.submitcon{
		position: fixed;
		display: flex;
		bottom: 0;
		left: 0;
		width: 100%;
		height: 140rpx;
		background-color: #FFFFFF;
		.pcon{
			margin-left: 20rpx;
			margin-top: 28rpx;
			height: 50rpx;
			display: flex;
			flex:1;
			justify-content: flex-start;
			align-items: baseline;
			.hj{
				font-size: 30rpx;
			}
			.rmb{
				font-size: 30rpx;
				font-family: smallYuan;
				color:#89965f ;
				margin-left: 10rpx;
			}
			.zs{
				font-size: 48rpx;
				font-weight: 600;
				font-family: smallYuan;
				color:#89965f ;
			}
			.xs{
				font-size: 28rpx;
				font-weight: 600;
				font-family: smallYuan;
				color:#89965f ;
			}
		}
		.btn{
			background-color: #89965f !important;
			margin: 30rpx 20rpx 0 0;
			border-radius: 50rpx;
			height: 60rpx;
			line-height: 60rpx;
			width: 180rpx;
			font-size: 26rpx;
		}
		.btn::after{
			border:0 !important;
		}
		.gzbtn{
			background-color: #4A4AFF !important;
			margin: 30rpx 20rpx 0 0;
			border-radius: 50rpx;
			height: 60rpx;
			line-height: 60rpx;
			width: 180rpx;
			font-size: 26rpx;
		}
		.gzbtn::after{
			border:0 !important;
		}
		.cancelbtn{
			background-color: #FFFFFF !important;
			margin: 30rpx 20rpx 0 0;
			border-radius: 50rpx;
			height: 60rpx;
			line-height: 60rpx;
			width:180rpx;
			font-size: 26rpx;
			color:#333;
			border:1rpx solid #dddddd;
		}
		.cancelbtn::after{
			border:0 !important;
		}
		.returnbtn{
			background-color: #ff3d0e !important;
			margin: 30rpx 20rpx 0 0;
			border-radius: 50rpx;
			height: 60rpx;
			line-height: 60rpx;
			width:180rpx;
			font-size: 26rpx;
			border:1rpx solid #ff3d0e;
			color:#FFF;
		}
		.returnbtn::after{
			border:0 !important;
		}
		.pjbtn{
			background-color: #FFFFFF !important;
			margin: 30rpx 20rpx 0 0;
			border-radius: 50rpx;
			height: 60rpx;
			line-height: 60rpx;
			width:170rpx;
			font-size: 26rpx;
			border:1rpx solid #f5aa00;
			color:#f5aa00;
		}
		.pjbtn::after{
			border:0 !important;
		}
		.wlbtn{
			background-color: #FFFFFF !important;
			margin: 30rpx 20rpx 0 0;
			border-radius: 50rpx;
			height: 60rpx;
			line-height: 60rpx;
			width:170rpx;
			font-size: 26rpx;
			border:1rpx solid #89965f;
			color:#89965f;
		}
		.wlbtn::after{
			border:0 !important;
		}
	}
	.signimg{
		width: 150rpx;
		height: 180rpx;
		border-radius: 10rpx;
	}
	.oscon{
		margin:0;
		background-color: #f3fafa;
		border-radius: 16rpx;
		padding: 16rpx;
		display: flex;
		flex-direction: row;
		justify-content: center;
		.osimg{
			width: 120rpx;
			height: 120rpx;
			border-radius: 10rpx;
		}
		.osrcon{
			display: flex;
			flex-direction: column;
			flex: 1;
			justify-content: flex-start;
			margin-left: 50rpx;
		}
		.osname{
			line-height: 48rpx;
			font-size:28rpx;
			color:#303133;
		}
		.oscell{
			font-size: 24rpx;
			color:#747474;
		}
		.omoney{
			display: flex;
			width: 100rpx;
			color:#333;
			font-size: 28rpx;
			align-items: flex-end;
			justify-content: flex-end;
		}
	}
	.ydcon{
		position: relative;
	}
	.yyright{
		position: absolute;
		right: 100rpx;
		top:50rpx;
	}
	.odrcell{
		border-radius: 12rpx;
	}
	.bconall{
		padding: 12rpx 6rpx;
		display: block;
		position: relative;
		overflow: hidden;
		content: '';
		clear: both;
	}
	.bcon.billnow{
		    background-color: #cffff7;
		    border: 1rpx solid #64e2e4;
		    border-radius: 2rpx;
	}
	.bcon{
		display: flex;
		flex-direction: row;
		padding: 16rpx;
		width: 100%;
		align-items: center;
		justify-content: center;
		border-top:1rpx solid #f0f0f0 ;
		.btitle{
			font-size: 26rpx;
			color:#131212;
			width: 80rpx;
		}
		.bdate{
			display: flex;
			flex-direction: column;
			flex: 1;
			justify-content: flex-start;
			margin-left: 30rpx;
			.btxt{
				color:#ADADAD;
				font-size: 24rpx;
				margin-bottom: 6rpx;
			}
		}
		.bvalue{
			font-size: 30rpx;
		}
		 
	}
	.billimg{
		width: 64rpx;
		height: 64rpx;
		margin-left: 15rpx;
	}
	.rrwzf{
		display: flex;
		flex-direction: row;
		align-items: center;
	}
	.oinfo{
		padding:0 20rpx 20rpx 20rpx;
		position: relative;
		margin-bottom: 160rpx;
		
		.ozc{
			display: flex;
			flex-direction: column;
			background-color: #becba0 ;
			padding: 20rpx;
			border-radius: 16rpx;
			.ozstate{
				font-size: 28rpx;
				color: #333;
				width: 100%;
				margin: 10rpx 0;
			}
			.oztip{
				font-size: 26rpx;
				color: #333;
				width: 100%;
				margin: 0 0 20rpx;
			}
		}
		.owc{
			display: flex;
			flex-direction: column;
			background-color: #89965f ;
			padding: 20rpx;
			border-radius: 16rpx;
			.ozstate{
				font-size: 28rpx;
				color: #FFF;
				width: 100%;
				margin: 6rpx 0 0;
			}
			.oztip{
				font-size: 26rpx;
				color: #FFF;
				width: 100%;
				margin: 0 0 6rpx;
			}
		}
		.oztgray{
			display: flex;
			flex-direction: column;
			background-color: #ddd;
			padding: 20rpx;
			border-radius: 16rpx;
			.ozstate{
				font-size: 28rpx;
				color: #333;
				width: 100%;
				margin: 6rpx 0;
			}
			.oztip{
				font-size: 26rpx;
				color: #747474;
				width: 100%;
				margin: 0 0 20rpx;
			}
		}
		.oztorange{
			display: flex;
			flex-direction: column;
			background-color: #faa755;
			padding: 20rpx;
			border-radius: 16rpx;
			.ozstate{
				font-size: 28rpx;
				color: #FFF;
				width: 100%;
				margin: 6rpx 0;
			}
			.oztip{
				font-size: 26rpx;
				color: #FFF;
				width: 100%;
				margin: 0 0 20rpx;
			}
		}
		.yycon{
			display: flex;
			flex-direction: column;
			justify-content: center;
			background-color: #FFFFFF;
			margin-top: 20rpx;
			padding: 20rpx 20rpx;
			.atitle{
				padding: 10rpx 0 10rpx;
				color:#303133;
				font-size: 30rpx;
				font-weight: 600;
				display: flex;
				flex-direction: row;
				align-items: center;
			}
			.olist{
				display: flex;
				flex-direction: column;
				padding: 0;
				width: 100%;
				.ocell{
					font-size: 26rpx;
					color:#747474;
					padding: 10rpx 0 10rpx;
					display: flex;
					flex-direction: row;
					justify-content: space-between;
					align-items: center;
				}
				.ocell1{
					font-size: 26rpx;
					color:#747474;
					display: flex;
					flex-direction: row;
					justify-content: space-between;
					align-items: center;
					margin-left: 50rpx;
				}
			}
			.sqcon{
				padding: 20rpx;
				margin: 20rpx 0;
				background-color: #f5f5f5;
				display: flex;
				flex-direction: column;
				border-radius: 10rpx;
				.sqlist{
					display: flex;
					flex-direction: row;
					justify-content: space-between;
					color: #333333;
					font-size: 26rpx;
					line-height: 50rpx;
				}
			}
		}
	}
	
	.red{
		color:#ff3d0e;
	}
	.green{
		color:#00cd00;
	}
	
	::v-deep.uni-radio-input-checked{
		background-color: #89965f !important;
		border-color: #89965f !important;
		background-clip: content-box!important;
		box-sizing: border-box;
	}
	::v-deep.uni-radio-input-checked::before{
		display: none!important;
	}
	.allcon{
		min-height: 600rpx;
		overflow: hidden;
		background-color: #FFFFFF;
		margin-bottom: -150rpx;
		position: relative;
		display: block;
		padding-bottom: 80rpx;
		.paybtn{
			background-color: #89965f  !important;
			margin: 50rpx 20rpx 20rpx;
			border-radius: 50rpx;
			height: 75rpx;
			line-height: 75rpx;
			font-size: 30rpx;
			margin: 20rpx auto 180rpx auto;
			width: 650rpx;
		}
	}
	.mtxt{
		display: flex;
		flex-direction: row;
		align-items: baseline;
		justify-content: center;
		padding: 20rpx;
		font-size: 30rpx;
		border-top:1rpx solid #eee;
	}
	.mref{
		margin: 0 20rpx;
	}
	.mcon{
		display: flex;
		flex-direction: row;
		align-items: baseline;
		justify-content: center;
		width:100%;
		padding: 20rpx 0;
		font-size: 40rpx;
		font-weight:600; 
		.mcost{
			font-size: 60rpx;
		}
	}
	.hcon{
		display: flex;
		flex-direction: row;
		padding: 30rpx;
		.htitle{
			flex:1;
			display: flex;
			justify-content: center;
			align-items: center;
			font-size: 32rpx;
			font-weight: 600;
		}
		.rclose{
			width: 50rpx;
			display: flex;
			justify-content: flex-start;
		}
	}
	.checklist-group{
		width: 100%;
	}
	 
	.selcon{
		padding: 20rpx 20rpx 50rpx;
		position: relative;
		display: block;
		overflow-y: auto;
		.sitem {
			display: flex;
			flex-direction: row;
			flex: 1;
			background-color: #FFFFFF;
			border-top: 1rpx solid #f0f0f0;
			padding:16rpx 0;
			.conright{
				flex: 1;
				display: flex;
				flex-direction: row;
				width: 100%;
				justify-content:flex-start;
				align-items: center;
			}
			.rinfo{
				width: 100rpx;
				display: flex;
				flex-direction: column;
				justify-items: center;
				align-self: center;
				margin-right: 10rpx;
				text-align: center;
				.btn{
					padding: 0 12rpx;
					background-color: #89965f ;
					border-radius: 24rpx;
					font-size: 26rpx;
					color: #fff;
				}
			}
			.selbtn{
				width: 80rpx;
				display: flex;
				justify-content: center;
				align-items: center;
			}
			.simg{
				width: 80rpx;
				height: 80rpx;
				padding: 10rpx;
				.img{
					width: 100%;
					height: 100%;
					border-radius: 6rpx;
				}
			}
			.sname{
				display: flex;
				flex: 1;
				justify-content: flex-start;
				font-size: 28rpx;
				font-weight: 600;
				color: rgb(29, 29, 29);
				padding: 0 10rpx 0 20rpx;
			}
		}
	}
	
</style>