yogaApp/pages/order/orderlist.vue

<template>
	<view class="page">
		<scroll-view class="scrolllist" scroll-x="true" scroll-with-animation  :scroll-left="scrollLeft">
			<view class="tabicl" v-for="(item, index) in list" :key="index" :class="index==tabCurrentIndex?'cur':''" @tap="tabSelect" :data-id="index">
				<view class="ptext">{{item.name}}</view>
				<view class="pline"></view>
			</view>
		</scroll-view>
		<swiper class="swiper-box" :duration="100" :current="tabCurrentIndex"  @animationfinish="animationfinish">
			<swiper-item class="swiper-item" v-for="tabItem in list" :key="tabItem.orderId">
				<scroll-view scroll-y style="height: 100%;width: 100%;">
					<view class="scell" v-if="tabItem.slist.length>0">
						<view v-for="(item, index) in tabItem.slist" :key="index" class="oitem">
							
							<view class="obcon" @click="gotoInfo(item.orderId)">
								<image style="width: 50rpx; height: 50rpx;margin-right: 8rpx;" src="/static/image/sj.png"></image>
								<text>{{item.storeName}}</text>
							</view>
							
							<view class="otop" @click="gotoInfo(item.orderId)">
								<view class="hleft">
									订单编号<text style="margin-left: 10rpx;">{{item.orderSn}}</text>
								</view>
								<view class="hright">
									<!-- 描述：订单状态 0->待付款；1->待发货；2->已发货；3->已完成；4->已关闭 -->
									<view v-if="item.status==0" class="ztip">待付款</view>
									<view v-else-if="item.status==1" class="jtip">待发货</view>
									<view v-else-if="item.status==2" class="htip">待收货</view>
									<!-- <view v-else-if="item.status==3" class="htip">待评价</view> -->
									<view v-else-if="item.status==3" class="wtip">已完成</view>
									<view v-else-if="item.status==4" class="ctip">已关闭</view>
								</view>
							</view>
							
							<view class="oscon" v-for="(cell, ii) in item.orderItemList"   @click="gotoProInfo(cell.productId)">
								<view class="osimg imgload">
									<image class="osimg" v-if="cell.pic" :src="cell.pic" mode="aspectFill"></image>
								</view>
								<view class="osname">
									<text class="ntxt">{{cell.productName}}</text>
									<text class="txt">规格：{{ retSku(cell.spData) }}</text>
									<text class="txt">单价：￥{{cell.salePrice}}</text>
									<text class="txt">数量：{{cell.quantity}}</text>
								</view>
								<view class="omoney">
									<text class="omtip">{{cell.salePrice?'￥'+(cell.salePrice*cell.quantity).toFixed(2):"￥0"}}</text>
								</view>
							</view> 
							
							<view class="obtncon">
								<view class="osprice">
									总金额：{{item.totalAmount?'￥'+(item.totalAmount).toFixed(2):"￥0"}}
								</view>
								<view class="obtn">
									<view class="obtnleft"></view>
									<!-- 描述：订单状态 0->待付款；1->待发货；2->已发货；3->已完成；4->已关闭-->
									<!-- 描述：售后状态：0, "待处理" 1, "退货中" 2, "已完成" 3, "已拒绝" 4,"用户取消" -->
									<button type="primary" class="cancelbtn" :data-id="item.orderId" @click="gotoInfo((item.orderId))">查看详情</button>
									<button v-if="item.status==0" type="primary" class="cancelbtn" :data-id="item.orderId" @click="canceldo">取消订单</button>
									<button v-if="item.status==0" type="primary" class="paybtn":data-id="item.orderId" @click="gotopay(item)">去支付</button>
									<button v-if="item.status==2" type="primary" class="cancelbtn" :data-id="item.orderId" @click="gotowl(item.orderId)">查看物流</button>
									<button v-if="item.status==2" type="primary" class="viewbtn" :data-id="item.orderId" @click="checkdo">确认收货</button>
									<button v-if="item.status==3" type="primary" class="gzbtn" :data-id="item.orderId" @click="gotopj(item)">去评价</button>
									<button v-if="item.status==3" type="primary" class="gzbtn" :data-id="item.orderId" @click="gotosh(item)">申请售后</button>
									<button v-if="item.status==3&&item.aftersaleStatus==0" type="primary" class="gzbtn" :data-id="item.orderId" @click="gotoshcancel(item)">取消售后</button>
									
								</view>
							</view>
						</view>
					</view>
					
					<view v-if="tabItem.slist.length==0 && tabItem.loadStatus=='noMore'" class="nodata"></view>
					<uni-load-more v-if="tabItem.slist.length>0" iconType="circle" :status="tabItem.loadStatus" />
					
				</scroll-view>
			</swiper-item>
		</swiper>
		
		<!-- 是否登录 -->
		<openlogin ref="loginId" @getPhoneNumber="getPhoneNumber"></openlogin>
		
		<!-- 支付弹框 -->
		<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_pay}}</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>
		
	</view>
</template>

<script>
	import { myCache,getRemoteFile } from '../../utils/utils.js';
	import openlogin from "../components/openlogin.vue";
	export default {
		components: {
			openlogin
		},
		data() {
			return {
				openId:"",
				phone:"",
				userid:"",
				tabCurrentIndex: 0,
				scrollLeft: 0,//tabs
				//  订单状态 -1->全部；0->待付款；1->待发货；2->待收货/使用；-2->售后单
				list:[
					{
						id:0,
						order_state:-1,
						page: 0,
						size: 10,
						loadStatus:'more', // 'more', // 'noMore',
						name:'全部',
						slist:[
							{
								id:"ord0001",
								orderid:"ord0001",
								business:"商家1",
								productid:"1",
								productprice:39.9,
								productname:"杜威克瑜伽球加厚防滑",
								img:'../../static/image/theme/p1.jpg',
								productspecs:"M 白",
								productnum:1,
								productunit:"个",
								orderstate:'1',
								orderdate:"2025-06-23 10:26:09"
							},
							{
								id:"ord0002",
								orderid:"ord0002",
								business:"商家2",
								productid:"1",
								productprice:39.9,
								productname:"杜威克瑜伽球加厚防滑",
								img:'../../static/image/theme/p3.jpg',
								productspecs:"M 白",
								productnum:2,
								productunit:"个",
								orderstate:'1',
								orderdate:"2025-06-23 10:26:09"
							},
							{
								id:"ord0003",
								orderid:"ord0003",
								business:"商家3",
								productid:"1",
								productprice:39.9,
								productname:"杜威克瑜伽球加厚防滑",
								img:'../../static/image/theme/p1.jpg',
								productspecs:"L 白",
								productnum:1,
								productunit:"个",
								orderstate:'2',
								orderdate:"2025-06-23 10:26:09"
							},
							{
								id:"ord0004",
								orderid:"ord0004",
								business:"商家4",
								productid:"1",
								productprice:39.9,
								productname:"杜威克瑜伽球加厚防滑",
								img:'../../static/image/theme/p1.jpg',
								productspecs:"M 白",
								productnum:1,
								productunit:"个",
								orderstate:'3',
								orderdate:"2025-06-23 10:26:09"
							},
							{
								id:"ord0005",
								orderid:"ord0005",
								business:"商家5",
								productid:"1",
								productprice:39.9,
								productname:"杜威克瑜伽球加厚防滑",
								img:'../../static/image/theme/p1.jpg',
								productspecs:"M 白",
								productnum:2,
								productunit:"个",
								orderstate:'4',
								orderdate:"2025-06-23 10:26:09"
							},
							{
								id:"ord0006",
								orderid:"ord0006",
								business:"商家6",
								productid:"1",
								productprice:39.9,
								productname:"杜威克瑜伽球加厚防滑",
								img:'../../static/image/theme/p1.jpg',
								productspecs:"M 白",
								productnum:3,
								productunit:"个",
								orderstate:'5',
								orderdate:"2025-06-23 10:26:09"
							},
							{
								id:"ord0007",
								orderid:"ord0007",
								business:"商家7",
								productid:"1",
								productprice:39.9,
								productname:"杜威克瑜伽球加厚防滑",
								img:'../../static/image/theme/p1.jpg',
								productspecs:"M 白",
								productnum:1,
								productunit:"个",
								orderstate:'6',
								orderdate:"2025-06-23 10:26:09"
							}
						]
					},
					{
						id:1,
						order_state:0,
						page: 0,
						size: 10,
						loadStatus:'more', // 'more',
						name:'待付款',
						slist:[
							{
								id:"ord0001",
								orderid:"ord0001",
								business:"商家1",
								productid:"1",
								productprice:39.9,
								productname:"杜威克瑜伽球加厚防滑",
								img:'../../static/image/theme/p1.jpg',
								productspecs:"M 白",
								productnum:1,
								productunit:"个",
								orderstate:'1',
								orderdate:"2025-06-23 10:26:09"
							},
							{
								id:"ord0002",
								orderid:"ord0002",
								business:"商家2",
								productid:"1",
								productprice:39.9,
								productname:"杜威克瑜伽球加厚防滑",
								img:'../../static/image/theme/p3.jpg',
								productspecs:"M 白",
								productnum:2,
								productunit:"个",
								orderstate:'1',
								orderdate:"2025-06-23 10:26:09"
							},
						]
					},
					{
						id:2,
						order_state:1,
						page: 0,
						size: 10,
						loadStatus:'more', // 'more', // 'noMore',
						name:'待发货',
						slist:[
							{
								id:"ord0003",
								orderid:"ord0003",
								business:"商家3",
								productid:"1",
								productprice:39.9,
								productname:"杜威克瑜伽球加厚防滑",
								img:'../../static/image/theme/p1.jpg',
								productspecs:"L 白",
								productnum:1,
								productunit:"个",
								orderstate:'2',
								orderdate:"2025-06-23 10:26:09"
							},
						]
					},
					{
						id:3,
						order_state:2,
						page: 0,
						size: 10,
						loadStatus:'more', // 'more', // 'noMore',
						name:'待收货',
						slist:[
							{
								id:"ord0004",
								orderid:"ord0004",
								business:"商家4",
								productid:"1",
								productprice:39.9,
								productname:"杜威克瑜伽球加厚防滑",
								img:'../../static/image/theme/p1.jpg',
								productspecs:"M 白",
								productnum:1,
								productunit:"个",
								orderstate:'3',
								orderdate:"2025-06-23 10:26:09"
							},
						]
					},
					{
						id:4,
						order_state:-2,
						page: 0,
						size: 10,
						loadStatus:'more', // 'more', // 'noMore',
						name:'退款/售后',
						slist:[
							{
								id:"ord0007",
								orderid:"ord0007",
								business:"商家7",
								productid:"1",
								productprice:39.9,
								productname:"杜威克瑜伽球加厚防滑",
								img:'../../static/image/theme/p1.jpg',
								productspecs:"M 白",
								productnum:1,
								productunit:"个",
								orderstate:'6',
								orderdate:"2025-06-23 10:26:09"
							}
						]
					},
				],
				// page: {
				// 	page: 1,
				// 	size: 10,
				// 	status:-1 //订单状态 -1->全部；0->待付款；1->待发货；2->待收货/使用；-2->售后单
				// },
				paylist: [],
				payType: "" , // 1微信支付 2支付宝支付
				pindex: 0, //当前需要支付项
				price_pay: 39.9, // 当前需要支付金额
				businessid: 0, //当前需要支付账单号
				alipay_number: '', // 支付宝交易号
				bills: [],
				info: {
					id: '',
				} // 支付订单信息
			};
		},
		onLoad(option) {
			if(option.id||option.id==0){
				if(parseInt(option.id)==0){
					this.tabCurrentIndex=0;
				}
				else{
					this.tabCurrentIndex=parseInt(option.id);
				}
				this.scrollLeft = (this.tabCurrentIndex - 1) * 60;
			}
			myCache("iforderload",0);
			this.reset();
			// 支付方式
			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(option){
			if(myCache("iforderload")){
				myCache("iforderload",0);
				this.reset();
			}
		},
		onReady(){
			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`
				});
			}
		},
		onPullDownRefresh() {
			setTimeout(()=>{
				uni.stopPullDownRefresh()
			},100);
		},
		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(',');
			},
			async getinfo() {
				console.log("order______getinfo")
				var that = this;
				// uni.showLoading({
				// 	title: '数据加载中...'
				// });
				var orderid = myCache("siginorderid");
				const {data: res} = await uni.$http.post('/alipay/getOrderById', {id:orderid});
				console.log(res)
				if(res){
					// 订单详情信息
					if(res.state&&res.state==6){
						// 已签署 待支付
						myCache("ifsigncomplete",'');
						myCache("signtype",'');
						myCache("siginorderid",'');
						uni.showModal({
							title: '提示',
							content: '电子签署成功！',
							showCancel: false,
							confirmText: '确定',
							success: ress => {
								if (ress.confirm) {
									// 重新加载数据
									that.reset();
								}
							}
						});
					}
					else{
						// 签署不成功，清空参数
						myCache("ifsigncomplete",'');
						myCache("signtype",'');
						myCache("siginorderid",'');
					}
				}
				else{
					// 签署不成功，清空参数
					myCache("ifsigncomplete",'');
					myCache("signtype",'');
					myCache("siginorderid",'');
				}
			},
			async paybackdo(){
				var that=this;
				// 查询代扣签约
				var param={
					orderId: this.info.id
				};
				// 查询代扣签约状态
				uni.showLoading({
					title: '代扣签约查询中....'
				});
				const {data: res} = await uni.$http.post("/antchainapi/queryWithholdSign", param);
				console.log('代扣签约查询',res);
				myCache("signtype","");
				myCache("payorderid","");
				myCache("price_pay","");
				myCache("businessid","");
				if(res.success){
					// 已经签约成功了,直接调起支付
					var trade_no =res.trade_no;
					if(!trade_no){
						uni.showModal({
							title: '提示!',
							content: '代扣签约成功，发起支付失败！请重试！',
							showCancel: false
						});
						return false;
					}
					uni.showLoading({
					  title: '代扣签约成功，发起支付....'
					});
					// 调起支付
					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 && resr.resultCode === '9000') {
											// 支付成功 执行想要的操作
											uni.showLoading({
												title: '订单支付成功！'
											});
											// 回调改订单状态
											that.paySuccessDo(trade_no);
										}
										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: '确定'
					});
				}
			},
			getPhoneNumber(e){
				if(e.phone){
					this.phone = e.phone
				}
				if(e.userid){
					this.userid = e.userid
				}
			},
			async getOrderList() {
				if(this.list[this.tabCurrentIndex].loadStatus!=="noMore")
				{
					uni.showLoading({
						title: '订单加载中...'
					});
					var para={
						"page":this.list[this.tabCurrentIndex].page+'',
						"size":this.list[this.tabCurrentIndex].size+'',
						"status":this.list[this.tabCurrentIndex].order_state+''
					}
					const {data: res} = await uni.$http.get('/api/order/page', para);
					if(res&&res.content&&res.content.length>0){
						if(res.totalPages&&(1*res.totalPages-1)>this.list[this.tabCurrentIndex].page){
							// 继续加载
							this.list[this.tabCurrentIndex].loadStatus="more";
							this.list[this.tabCurrentIndex].page=this.list[this.tabCurrentIndex].page+1;
						}
						else{
							this.list[this.tabCurrentIndex].loadStatus="noMore";
						}
						res.content.forEach((cell,idx)=>{
							this.list[this.tabCurrentIndex].slist.push(cell);
						});
						this.$forceUpdate();
					}
					else{
						this.list[this.tabCurrentIndex].loadStatus="noMore";
						this.$forceUpdate();
					}
				}
			},
			loadData(){
				// 加载
				if(this.list[this.tabCurrentIndex].loadStatus=="more") {
					this.list[this.tabCurrentIndex].loadStatus="loading";
					setTimeout(() => {
						this.getOrderList();
					}, 300);
				}
			},
			tabSelect(e) {
				console.log("tabSelect")
				this.tabCurrentIndex = e.currentTarget.dataset.id;
				this.scrollLeft = (e.currentTarget.dataset.id - 1) * 60;
				this.loadData();
			},
			animationfinish({ detail: { current } }) {
				console.log("animationfinish")
				this.tabCurrentIndex = current;
				this.loadData();
			},
			handleChange(e) {
				console.log("animationfinish")
				//原在animationfinish中的操作转移到这里
				this.loadData();
			},
			gotoProInfo(id){
				console.log(id);
				// 商品详情
				uni.navigateTo({
					url: `/pages/product/detail?id=${id}`
				});
			},
			gotoInfo(id){
				// 订单详情
				uni.navigateTo({
					url: `/pages/order/orderinfo?id=${id}`
				});
			},
			gotowl(id){
				// 查看物流
				uni.navigateTo({
					url: `/pages/order/orderwl?id=${id}`
				});
			},
			// 去公证
			async notarizado(e){
				// 公证
				console.log(e);
				var id= parseInt(e.currentTarget.dataset.id);
				// // 跳转详情公证
				// uni.navigateTo({
				// 	url: `/pages/order/orderinfo?id=${id}`
				// });
				
				uni.showLoading({
					title: '公证申请中...'
				});
				var param={
					oid:id
				}
				const {data: res} = await uni.$http.post('/gongzheng/dogongzheng', param);
				console.log(res);
				if(res){
					// 缓存公证
					myCache("notarizaresult",res);
					myCache("notarizaid",id);
					
					// JSON数组
					// { 
					// "appId":"2021004136682713", 
					// "apply_No":"3C20240409202103511", 
					// "applicant_Name":"王**", 
					// "id_Number":"431281198809086010", 
					// "is_Auto":0, "apply_Type":7 
					// }
					
					// app 跳转支付宝小程序操作
					// #ifdef APP
					let alipayUrl = null;
					if (uni.getSystemInfoSync().platform == "ios") {
						alipayUrl = 'alipay://platformapi/startapp?appId=2021004138655183';
					}else{
						alipayUrl = 'alipays://platformapi/startapp?appId=2021004138655183';
					}
					//alipayUrl 已经有? 问号了，所以这里需要进行编码
					let queryString = this.objectToQueryString(res);
					let params = encodeURIComponent(queryString);
					// page=pages/index/index  跳转到支付宝小程序页面的页面路径
					alipayUrl  = `${alipayUrl}&path=pages/micro-police/index&query=${params}`;
					alipayUrl=encodeURIComponent(alipayUrl);
					alipayUrl=`https://ds.alipay.com/?scheme=${alipayUrl}`;
					console.log('alipayUrl',alipayUrl)
					//唤起支付宝
					plus.runtime.openURL(alipayUrl);
					// #endif

					// #ifdef MP-ALIPAY
					my.navigateToMiniProgram({
					  // appId: '2021004106675225', // 16 位
					  appId: '2021004138655183', // 16 位
					  path: 'pages/micro-police/index',
					  extraData: res,
					  success: function (res) {
						  console.log(res);
					  },
					  fail: function (err) {
						  console.log(err);
					  }
					});
					// #endif
				}
				else{
					uni.showToast({
						title:res.msg? res.msg:'公证申请获取失败！',
						icon: 'error',
						duration: 2000
					});
				}
				
			},
			objectToQueryString(obj) {
				return Object.entries(obj).map(([key, value]) => `${encodeURIComponent(key)}=${encodeURIComponent(value)}`).join('&');
			},
			// 取消售后
			gotoshcancel(info){
				var data=encodeURIComponent(JSON.stringify(info));
				uni.navigateTo({
					url: `/pages/order/ordersh?data=${data.id}`
				});
			},
			// 申请售后
			gotosh(info){
				var data=encodeURIComponent(JSON.stringify(info));
				uni.navigateTo({
					url: `/pages/order/ordersh?data=${data.id}`
				});
			},
			// 去评价
			gotopj(info){
				var data=encodeURIComponent(JSON.stringify(info));
				uni.navigateTo({
					url: `/pages/order/orderpj?data=${data.id}`
				});
			},
			// 列表 去支付 按钮
			gotopay(item){
				this.info=item;
				this.$forceUpdate();
				// this.getbill(item);
				
				// 打开支付方式
				this._show();
			},
			// 生成支付单据（订单已有支付单据编号）
			async getbill(item) {
				uni.showLoading({
					title: '支付加载中...'
				});
				const {data: res} = await uni.$http.post('/alipay/getBillsListByOrderId', {id:this.info.id});
				console.log(res);
				if(res&&res.length>0){
					// 订单账单信息
					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 ){
							if(cell.pay_number==1){
								// 增加包支付和屏保
								this.price_pay= (item.price_spbz?parseFloat(item.price_spbz):0)+(item.price_fwbjg?parseFloat(item.price_fwbjg):0)+ parseFloat(cell.bill_money);
							}
							else{
								this.price_pay= cell.bill_money;
							}
							this.businessid=cell.id;
							this.pindex=idx;
							this.$forceUpdate();
						}
					});
					this.$forceUpdate();
					this._show();
				}
			},
			paydo(){
				
				// 是否登录
				if(!this.iflogin()){
					return false;
				}
				
				// 去支付
				if (!this.payType) {
					uni.showModal({
						title: '提示!',
						content: '请选择支付类型！',
						showCancel: false
					});
					return false;
				}
				if(!this.businessid){
					uni.showModal({
						title: '提示!',
						content: '实际支付金额异常！请刷新后支付！',
						showCancel: false
					});
					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(){
				console.log('支付宝支付');
				var that = this;
				uni.showLoading({
					title: '发起支付....'
				}); 
				// 支付宝调起支付
				//申请支付 
				var param={
					"payId": that.info.payId, 
					"type": that.payType, // 1 微信支付，2 支付宝支付
					"wechatType": "" 
				};
				const {data: ress} = await uni.$http.post("/api/order/orderPay", param);
				console.log('ress',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.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(){
				console.log('微信支付');
				var that = this;
				uni.showLoading({
					title: '发起支付....'
				}); 
				// 支付宝调起支付
				//申请支付 
				var param={
					"payId": that.info.payId, 
					"type": that.payType, // 1 微信支付，2 支付宝支付
					"wechatType": "" 
				};
				const {data: ress} = await uni.$http.post("/api/order/orderPay", param);
				console.log('ress',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`
							});
						}
					});
				}
				
			},
			
			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;
				}
			},
			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 => {
							// // 跳转到待接单订单列表
							// uni.redirectTo({
							// 	url: `/pages/order/orderlist?id=9`
							// });
							// 重新加载刷新
							this.reset();
						}
					});
				}
				else{
					uni.showModal({
						title: '提示',
						content: res.msg? res.msg:'订单支付成功！订单状态异常！请联系客服！',
						showCancel: false,
						confirmText: '确定',
						success: ress => {
							// // 跳转到待接单订单列表
							// uni.redirectTo({
							// 	url: `/pages/order/orderlist?id=0`
							// });
							// 重新加载刷新
							this.reset();
						}
					});
				}
				
				// 关闭对话框
				this._hide();
			},
			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();
			},
			// 确认收货
			checkdo(e){
				console.log(e);
				var id= e.currentTarget.dataset.id;
				var that = this;
				//取消订单
				uni.showModal({
					title: '提示',
					content: '确定订单收货吗？',
					cancelText: '取消',
					confirmText: '确定',
					success: ress => {
						if (ress.confirm) {
							that.checkdodo(id);
						}
					}
				});
			},
			async checkdodo(id){
				uni.showToast({
					title: '确认收货中...',
					icon: 'success',
					duration: 2000
				});
				var param={
					orderId:id
				};
				const {data: res} = await uni.$http.post('/api/order/orderComplete', param);
				if(res&&res=="确认收货成功"){
					uni.showToast({
						title: '订单已确认收货！',
						icon: 'success',
						duration: 2000
					});
					// 重新加载
					this.reset();
				}
				else{
					uni.showToast({
						title: res.msg? res.msg:'订单确认收货失败！',
						icon: 'error',
						duration: 2000
					});
				}
			},
			// 取消订单
			canceldo(e){
				console.log(e);
				var id= e.currentTarget.dataset.id;
				var that = this;
				//取消订单
				uni.showModal({
					title: '提示',
					content: '确定要取消订单吗？',
					cancelText: '取消',
					confirmText: '确定',
					success: ress => {
						if (ress.confirm) {
							that.deldo(id);
						}
					}
				});
			},
			async deldo(id){
				var param={
					idList:[id]
				};
				uni.showToast({
					title: '取消中...',
					icon: 'success',
					duration: 2000
				});
				const {data: res} = await uni.$http.post('/api/order/orderCancel', param);
				if(res&&res=="取消订单成功"){
					uni.showToast({
						title: '订单已取消！',
						icon: 'success',
						duration: 2000
					});
					// 重新加载
					this.reset();
				}
				else{
					uni.showToast({
						title: res.msg? res.msg:'订单取消失败！',
						icon: 'error',
						duration: 2000
					});
				}
			},
			reset(){
				console.log("reset")
				// 重新加载数据
				this.list.forEach((cell,idx)=>{
					this.list[idx].loadStatus='more';
					this.list[idx].page=0;
					this.list[idx].size=10;
					this.list[idx].slist=[];
				});
				this.$forceUpdate();
				this.loadData();
			}
		}
	}
</script>

<style lang="scss" scoped>
	.page {
		padding: 0;
		position: relative;
		background-image: url('@/static/image/bg.jpg');
		background-attachment: fixed;
		background-size: cover;
		background-position: center center;
		min-height: calc(100vh - var(--window-top) - var(--window-bottom));
	}
	.olistcon{
		padding: 0 20rpx 20rpx 20rpx;
		.olist{
			display: flex;
			flex-direction: column;
			.ocell{
				font-size: 26rpx;
				color:#747474;
				padding: 10rpx 0;
				display: flex;
				flex-direction: row;
				justify-content: space-between;
				align-items: center;
				.red{
					color:#ff3d0e;
				}
				.green{
					color:#00cd00;
				}
			}
		}
	}
	.swiper-box {
		flex: 1;
		height: calc(100vh - var(--window-top) - 130rpx) !important;
	}
	.swiper-item {
		height: 100%;
	}
	.scrolllist{
		height: 110rpx; 
		background: #FFF;
		white-space: nowrap;
		width: 100%;
	}
	.tabicl{
		min-width: 120rpx;
		height: 100rpx;
		line-height: 100rpx;
		position: relative;
		display: inline-block;
		overflow: hidden;
		margin-right: 20rpx;
	}
	.ptext{
		font-size: 30rpx;
		text-align: center;
		color: #000;
		font-weight: 600;
		height: 90rpx;
	}
	.cur .ptext{
		color: #89965f;
		font-size: 33rpx;
		font-weight: 600;
	}
	.cur .pline{
		width: 40%;
		height: 9rpx;
		background: #89965f;
		border-radius: 6rpx;
		opacity: 1;
		margin-left: 30%;
	}
	.nodata{
		width: 100%;
		height:  calc(100vh - 400rpx) !important;
		line-height: calc(100vh) !important;
		background-image: url('/static/image/no.png');
		background-size: 52% auto;
		background-repeat: no-repeat;
		background-position: center; 
		font-size: 28rpx;
		text-align: center;
		color: #89965f;
		overflow: hidden;
	}
	.scell{
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-start;
		margin: 20rpx;
		.oitem{
			display: flex;
			flex-direction: column;
			background-color: #FFFFFF;
			border-radius: 6rpx;
			padding: 20rpx;
			width: 100%;
			margin-bottom: 20rpx;
			.obcon{
				display: flex;
				flex-direction: row;
				align-items: center;
				justify-content: flex-start;
				height: 60rpx;
				line-height: 60rpx;
				color: #000;
				font-size: 30rpx;
				padding-bottom: 20rpx;
				border-bottom: 1rpx solid #eee;
			}
			.otop{
				display: flex;
				flex-direction: row;
				padding: 20rpx 0 0;
				height: 60rpx;
				line-height: 60rpx;
				width: 100%;
				.hleft{
					display: flex;
					flex:1;
					align-items: center;
					font-size: 26rpx;
					color: #000;
				}
				.hright{
					display: flex;
					justify-content: flex-end;
					align-items: center;
					// <!--1：待付款，2：待发货，3：待收货 ，4：待评价 ，5：已完成，6：订单取消-->
					.ztip{
						border-radius: 12rpx;
						color:#1296db;
						font-size: 26rpx;
						padding: 0;
						height: 40rpx;
						line-height: 40rpx;
					}
					.jtip{
						border-radius: 12rpx;
						color:#feb467;
						font-size: 26rpx;
						padding: 0;
						height: 40rpx;
						line-height: 40rpx;
					}
					.htip{
						border-radius: 12rpx;
						color:#fc6900;
						font-size: 26rpx;
						padding: 0;
						height: 40rpx;
						line-height: 40rpx;
					}
					.hwtip{
						border-radius: 12rpx;
						color:#FF0000;
						font-size: 26rpx;
						padding: 0;
						height: 40rpx;
						line-height: 40rpx;
					}
					.wtip{
						border-radius: 12rpx;
						color:#43cca4;
						font-size: 26rpx;
						padding: 0;
						height: 40rpx;
						line-height: 40rpx;
					}
					.gtip{
						border-radius: 12rpx;
						color:#0036D6;
						font-size: 26rpx;
						padding: 0;
						height: 40rpx;
						line-height: 40rpx;
					}
					.ftip{
						border-radius: 12rpx;
						color:#6A81F1;
						font-size: 26rpx;
						padding: 0;
						height: 40rpx;
						line-height: 40rpx;
					}
					.ctip{
						border-radius: 12rpx;
						color:#888;
						font-size: 26rpx;
						padding: 0;
						height: 40rpx;
						line-height: 40rpx;
					}
				}
			}
			.obtncon{
				border-top: 1rpx solid #eee;
				padding: 10rpx 0 0;
				display: flex;
				flex-direction: column;
			}
			.osprice{
				display: flex;
				justify-content: flex-end;
				font-size: 30rpx;
				color: #000;
			}
			.obtn{
				display: flex; 
				justify-content: flex-end;
				padding: 10rpx 0 0;
				.obtnleft{
					display: flex;
					flex: 1;
				}
				.omoney{
					display: flex;
					flex:1;
					height: 60rpx;
					width: 100%;
					color:#333;
					align-items: center;
					.omtip{
						font-size: 36rpx;
						color:rgb(252, 105, 0);
					}
				}
				.cancelbtn{
					background-color: #FFFFFF !important;
					margin-left: 20rpx;
					border-radius: 50rpx;
					height: 50rpx;
					line-height: 48rpx;
					padding: 0 20rpx;
					font-size: 24rpx;
					color:#888;
					border:1rpx solid #888;
				}
				.cancelbtn::after{
					border:0 !important;
				}
				.viewbtn{
					background-color: #FFFFFF !important;
					margin-left: 20rpx;
					border-radius: 50rpx;
					border-radius: 50rpx;
					height: 50rpx;
					line-height: 48rpx;
					padding: 0 20rpx;
					font-size: 24rpx;
					color:#6A81F1;
					border:1rpx solid #6A81F1;
				}
				.viewbtn::after{
					border:0 !important;
				}
				.pjbtn{
					background-color: #FFFFFF !important;
					margin-left: 20rpx;
					border-radius: 50rpx;
					border-radius: 50rpx;
					height: 50rpx;
					line-height: 48rpx;
					padding: 0 20rpx;
					font-size: 24rpx;
					border:1rpx solid rgb(252, 105, 0);
					color:rgb(252, 105, 0);
				}
				.pjbtn::after{
					border:0 !important;
				}
				.returnbtn{
					background-color: rgb(252, 105, 0) !important;
					margin-left: 20rpx;
					border-radius: 50rpx;
					border-radius: 50rpx;
					height: 50rpx;
					line-height: 48rpx;
					padding: 0 20rpx;
					font-size: 24rpx;
					border:1rpx solid rgb(252, 105, 0);
					color:#FFF;
				}
				.returnbtn::after{
					border:0 !important;
				}
				.paybtn{
					background-color: #89965f !important;
					margin-left: 20rpx;
					border-radius: 50rpx;
					border-radius: 50rpx;
					height: 50rpx;
					line-height: 48rpx;
					padding: 0 20rpx;
					font-size: 24rpx;
					border:1rpx solid #89965f;
				}
				.paybtn::after{
					border:0 !important;
				}
				.gzbtn{
					background-color: #f5aa00 !important;
					margin-left: 20rpx;
					border-radius: 50rpx;
					height: 50rpx;
					line-height: 48rpx;
					padding: 0 20rpx;
					font-size: 24rpx;
					border:1rpx solid #f5aa00;
				}
				.gzbtn::after{
					border:0 !important;
				}
			}
			.oscon{
				margin:20rpx 0;
				border-radius: 16rpx;
				display: flex;
				flex-direction: row;
				justify-content: center;
				.osimg{
					width: 120rpx;
					height: 120rpx;
					border-radius: 10rpx;
				}
				.osname{
					display: flex;
					flex-direction: column;
					flex: 1;
					margin-left: 26rpx;
					.ntxt{
						font-size: 28rpx;
						color:#000;
						line-height: 36rpx;
						margin-bottom: 8rpx;
					}
					.txt{
						font-size: 24rpx;
						color:#666;
					}
				}
				.omoney{
					display: flex;
					justify-content: baseline;
					color:#000;
					font-size: 30rpx;
				}
			}
		}
		.sitem {
			display: flex;
			flex-direction: column;
			flex: 1;
			background-color: #FFFFFF;
		    /*设置最小宽度，才会让元素排不下，导致换行排列*/
		    min-width: calc((100% - 20rpx) / 2);
			max-width: calc((100% - 20rpx) / 2);
			margin-right:5rpx;
			margin-left:5rpx;
			margin-bottom: 10rpx;
			border-radius: 16rpx;
			.simg{
				width: 100%;
				height: 360rpx;
				.img{
					width: 100%;
					height: 100%;
					border-radius: 16rpx 16rpx 0 0;
				}
			}
			.sname{
				font-size: 30rpx;
				font-weight: 600;
				color: rgb(29, 29, 29);
				padding: 16rpx;
			}
			.sinfo{
				font-size: 26rpx;
				color:rgb(116, 116, 116);
				padding: 0 16rpx;
				height: 60rpx;
				line-height: 30rpx;
				overflow: hidden;
				position: relative;
				text-overflow: ellipsis;
				display:-webkit-box;
				-webkit-box-orient:vertical;
				-webkit-line-clamp:2;
			}
			.sprices{
				padding: 0 16rpx 20rpx 16rpx;
				font-size: 36rpx;
				color:rgb(252, 105, 0);
				border-radius: 0 0 16rpx 16rpx;
				.cx{
					font-size: 28rpx;
					color:rgb(116, 116, 116);
					text-decoration: line-through;
					margin-left: 20rpx;
				}
			}
		}
	}
	
	::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: 660rpx;
		}
	}
	 
	.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;
		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: 60rpx;
				height: 60rpx;
				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>