|
@@ -0,0 +1,882 @@
|
|
|
+<template>
|
|
|
+ <view class="pages">
|
|
|
+ <view class="" :style="{height: navHeight+'px' }"></view>
|
|
|
+ <view class="navbar-box">
|
|
|
+ <u-navbar title="订单详情" :safeAreaInsetTop="true" @leftClick="leftClick" :titleStyle="{color:'#fff'}" leftIconColor="#fff" bgColor="#ED0000"></u-navbar>
|
|
|
+ </view>
|
|
|
+ <u-loading-page :loading="loadingPage"></u-loading-page>
|
|
|
+ <view class="page-wrap">
|
|
|
+ <view class="status-content">
|
|
|
+ <view class="status-item" v-if="orderDetails.status==0">
|
|
|
+ <view class="text">正在审核,请耐心等待1到2个工作日~</view>
|
|
|
+ <!-- <view class="btn-wrap u-flex u-row-center" v-if="countdown!='支付超期'">
|
|
|
+ <view class="btn cancel" @click="cancelOrder">取消订单</view>
|
|
|
+ <view class="btn" @click="gotoPay(orderDetails.id)">立即支付</view>
|
|
|
+ </view> -->
|
|
|
+ </view>
|
|
|
+ <view class="status-item" v-else-if="orderDetails.status==3">
|
|
|
+ <view class="text"><text v-if="countdown!='演出已开始'">距离演出开始,还剩 </text>{{countdown}}</view>
|
|
|
+ </view>
|
|
|
+ <view class="status-item" v-else-if="orderDetails.status==6">
|
|
|
+ <view class="text"><text>退款失败: </text>{{refundInfo.errReason}}</view>
|
|
|
+ </view>
|
|
|
+ <view class="status-item" v-else>
|
|
|
+ <view class="text">{{orderDetails.status|filterOrderState}}</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="base-info">
|
|
|
+ <view class="top u-flex u-row-between">
|
|
|
+ <view class="name">{{orderDetails.theatreName}}</view>
|
|
|
+ <!-- <view class="icon-wrap u-flex">
|
|
|
+ <u-icon name="phone-fill" color="#999999" size="42rpx"></u-icon>
|
|
|
+ <u-icon name="map-fill" color="#999999" size="42rpx"></u-icon>
|
|
|
+ </view> -->
|
|
|
+ </view>
|
|
|
+ <view class="info u-flex u-row-between">
|
|
|
+ <image class="img" :src="orderDetails.performImg"></image>
|
|
|
+ <view class="text">
|
|
|
+ <view class="name u-flex u-row-between">
|
|
|
+ {{orderDetails.performName}}
|
|
|
+ <!-- <text class="status">{{orderDetails.status|filterOrderState}}</text> -->
|
|
|
+ </view>
|
|
|
+ <view class="time">{{orderDetails.performDate}} {{orderDetails.performTimeStart}}</view>
|
|
|
+ <view class="position u-flex u-row-between">
|
|
|
+ <view class="">{{orderDetails.goodsName}}/{{orderDetails.seatTypeName}}</view>
|
|
|
+ <view class="">X {{orderDetails.viewerNum}}</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="box qr-wrap" v-if="orderDetails.parentQrcodeStatus==0">
|
|
|
+ <view class="title">二维码</view>
|
|
|
+ <view class="qr-content">
|
|
|
+ <view class="img-wrap">
|
|
|
+ <!-- <image class="img" :src="orderDetails.performImg"></image> -->
|
|
|
+ <view class="ayQrcode" @click="refreshCode">
|
|
|
+ <ayQrcode v-show="!showSingleQR" ref="qrcode" :modal="modal_qr" :url="qrContent" @hideQrcode="hideQrcode" :height="180" :width="180" />
|
|
|
+ </view>
|
|
|
+ <!-- <image v-if="orderDetails.status==4" class="refund-ico" :src="staticUrl+'/img/refund-ico.png'"></image> -->
|
|
|
+ </view>
|
|
|
+ <!-- <view class="">{{orderDetails.viewersList.length}}张演出票</view> -->
|
|
|
+ <!-- order-num del-line -->
|
|
|
+ <view class="order-num">取票号:{{orderDetails.parentQrcodeNo}}</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="box viewers-list-tuan ">
|
|
|
+ <view class="title">观影人员</view>
|
|
|
+ <view class="list">
|
|
|
+ <text class="item" v-for="(item,index) in orderDetails.viewersList" :key="index">{{item.name}}</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="box order-info">
|
|
|
+ <view class="title u-flex u-row-between">
|
|
|
+ 订单信息
|
|
|
+ <text class="btn" v-if="orderDetails.status==3" @click="refund">申请退款</text>
|
|
|
+ </view>
|
|
|
+ <view class="order-info-item" v-for="(item,index) in orderInfo[orderDetails.status]" :key="index">
|
|
|
+ <text class="til">{{item.name}}</text>
|
|
|
+ <text class="con">
|
|
|
+ <text v-if="item.key=='status'">{{orderDetails[item.key]|filterApplyState}}</text>
|
|
|
+ <text v-else-if="item.key=='priceTotal'"> ¥ {{orderDetails[item.key]}}</text>
|
|
|
+ <text v-else>{{orderDetails[item.key]}}</text>
|
|
|
+ <text class="copy-btn" @click="copyOrderNum(orderDetails[item.key])" v-if="item.key=='id'">复制</text>
|
|
|
+ </text>
|
|
|
+ </view>
|
|
|
+ <view class="order-info-item">
|
|
|
+ <text class="til">购票人员</text>
|
|
|
+ <text class="con">{{orderDetails.teamName}} {{orderDetails.mobile}}</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="box order-info refundInfo" v-if="orderDetails.status==4||orderDetails.status==5||orderDetails.status==6">
|
|
|
+ <view class="title u-flex u-row-between">
|
|
|
+ 退款信息
|
|
|
+ </view>
|
|
|
+ <view class="order-info-item">
|
|
|
+ <text class="til">退款单号</text>
|
|
|
+ <text class="con">{{refundInfo.id}}</text>
|
|
|
+ <text class="copy-btn" @click="copyOrderNum(refundInfo.id)" >复制</text>
|
|
|
+ </view>
|
|
|
+ <view class="order-info-item">
|
|
|
+ <text class="til">申请时间</text>
|
|
|
+ <text class="con">{{refundInfo.refundTime}}</text>
|
|
|
+ </view>
|
|
|
+ <view class="order-info-item">
|
|
|
+ <text class="til">订单金额</text>
|
|
|
+ <text class="con">¥ {{refundInfo.orderAmount}}</text>
|
|
|
+ </view>
|
|
|
+ <view class="order-info-item">
|
|
|
+ <text class="til">退款金额</text>
|
|
|
+ <text class="con">¥ {{refundInfo.refundAmount}}</text>
|
|
|
+ </view>
|
|
|
+ <view class="order-info-item">
|
|
|
+ <text class="til">退款原因</text>
|
|
|
+ <text class="con">{{refundInfo.refundReason}}</text>
|
|
|
+ </view>
|
|
|
+ <view class="order-info-item" v-if="orderDetails.status==6">
|
|
|
+ <text class="til">失败原因</text>
|
|
|
+ <text class="con">{{refundInfo.errReason}}</text>
|
|
|
+ </view>
|
|
|
+ <view class="order-info-item">
|
|
|
+ <text class="til">退款状态</text>
|
|
|
+ <text class="con">{{refundInfo.status|filterRefundState}}</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="box tips parse-content">
|
|
|
+ <view class="title">观影须知</view>
|
|
|
+ <u-parse :content="formerNotice"></u-parse>
|
|
|
+ <!-- <view class="tips-item" v-for="(item,index) in tipsArr" :key="index">
|
|
|
+ {{item}}
|
|
|
+ </view> -->
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <u-popup :show="showSingleQR" @close="closeSingleQR" @open="openSingleQR" @touchmove.stop.prevent="handleMoveQrcode" :round="10" mode="center">
|
|
|
+ <view class="singleQR-wrap">
|
|
|
+ <view class="title">
|
|
|
+ 二维码
|
|
|
+ <!-- <u-icon class="close" @click="closeSingleQR" name="close" color="#333" size="36rpx"></u-icon> -->
|
|
|
+ </view>
|
|
|
+ <view class="single-info">
|
|
|
+ <view class="item">姓名:{{singleInfo.name}}</view>
|
|
|
+ <view class="item">身份证号码:{{singleInfo.idcard|maskID}}</view>
|
|
|
+ <view class="item">座位:{{singleInfo.seatName}}</view>
|
|
|
+ <view class="item">状态:{{singleInfo.qrcodeStatus|filterSingleState}}</view>
|
|
|
+ </view>
|
|
|
+ <view class="singleQrcode" :style="{opacity:singleInfo.qrcodeStatus===0?'1':'0.3'}">
|
|
|
+ <ayQrcode ref="singleqrcode" :modal="singleModalQr" :url="singleQrContent" @hideQrcode="hideSingleQrcode" :height="180" :width="180" />
|
|
|
+ </view>
|
|
|
+ <view class="order-num" :class="{'del-line':singleInfo.qrcodeStatus!==0}">取票号:{{singleInfo.qrcodeNo}}</view>
|
|
|
+ </view>
|
|
|
+ </u-popup>
|
|
|
+ <u-toast ref="uToast"></u-toast>
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ import { systemInfo } from "@/mixin.js";
|
|
|
+ import ayQrcode from "@/components/ay-qrcode/ay-qrcode.vue"
|
|
|
+ // #ifdef H5
|
|
|
+ import wxH5 from "weixin-jsapi";
|
|
|
+ // #endif
|
|
|
+ export default {
|
|
|
+ mixins:[systemInfo],
|
|
|
+ components:{
|
|
|
+ ayQrcode
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ timer: null,
|
|
|
+ modal_qr: false,
|
|
|
+ qrContent: {}, // 要生成的二维码值
|
|
|
+ id:'',
|
|
|
+ loadingPage:true,
|
|
|
+ staticUrl:this.$commonConfig.staticUrl,
|
|
|
+ orderDetails:{},
|
|
|
+ deadline: null, // 设置截止时间为某个日期的时间戳
|
|
|
+ countdown: '', // 用于显示倒计时时间
|
|
|
+ // 状态(0待支付,2超时取消,3支付完成,待使用,4退款中,5己退款,6退款失败,7己使用,8己超期)
|
|
|
+ orderInfo:{
|
|
|
+ 0:[{name:'需付金额',key:'priceTotal'},{name:'订单编号',key:'id'},{name:'申请时间',key:'createTime'},{name:'报名状态',key:'status'}],
|
|
|
+ 1:[{name:'订单编号',key:'id'},{name:'下单时间',key:'createTime'},{name:'支付方式',key:'payWay'},{name:'支付时间',key:'payTime'}],
|
|
|
+ 2:[{name:'订单编号',key:'id'},{name:'下单时间',key:'createTime'},{name:'支付方式',key:'payWay'},{name:'支付时间',key:'payTime'}],
|
|
|
+ 3:[{name:'订单金额',key:'realPrice'},{name:'订单编号',key:'id'},{name:'下单时间',key:'createTime'},{name:'支付方式',key:'payWay'},{name:'支付时间',key:'payTime'}],
|
|
|
+ 4:[{name:'订单编号',key:'id'},{name:'下单时间',key:'createTime'},{name:'支付方式',key:'payWay'},{name:'支付时间',key:'payTime'}],
|
|
|
+ 5:[{name:'订单编号',key:'id'},{name:'下单时间',key:'createTime'},{name:'支付方式',key:'payWay'},{name:'支付时间',key:'payTime'},{name:'备注信息',key:'remark'}],
|
|
|
+ 6:[{name:'订单编号',key:'id'},{name:'下单时间',key:'createTime'},{name:'支付方式',key:'payWay'},{name:'支付时间',key:'payTime'},{name:'备注信息',key:'remark'}],
|
|
|
+ 7:[{name:'订单编号',key:'id'},{name:'下单时间',key:'createTime'},{name:'支付方式',key:'payWay'},{name:'支付时间',key:'payTime'}],
|
|
|
+ 8:[{name:'订单金额',key:'realPrice'},{name:'订单编号',key:'id'},{name:'下单时间',key:'createTime'},{name:'备注信息',key:'remark'}],
|
|
|
+ 9:[{name:'订单金额',key:'realPrice'},{name:'订单编号',key:'id'},{name:'下单时间',key:'createTime'},{name:'备注信息',key:'remark'}],
|
|
|
+ },
|
|
|
+ tipsArr:[
|
|
|
+ '1.请提前到达影院现场,找到自助取票机,打印纸质电影票,完成取票',
|
|
|
+ '2.如现场自助取票机无法打印电影票,请联系影院工作人员处理',
|
|
|
+ '3.凭打印好的纸质电影票、检票入场观影',
|
|
|
+ '4.如果订单使用了兑换券,或购买了特殊场次,暂不支持退票和改签'
|
|
|
+ ],
|
|
|
+ params:{
|
|
|
+
|
|
|
+ },
|
|
|
+ singleInfo:{idcard:''},//观影人信息
|
|
|
+ showSingleQR:false,//显示单人二维码
|
|
|
+ singleModalQr:false,
|
|
|
+ singleQrContent:{},
|
|
|
+ formerNotice:'',
|
|
|
+ countdownTimer:null,//订单倒计时
|
|
|
+ templateIdList:[],//微信小程序订阅消息
|
|
|
+ refundInfo:{status:null},//退款信息
|
|
|
+
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onShow() {
|
|
|
+ this.getOrderDetails(this.id);
|
|
|
+ },
|
|
|
+ onLoad(page) {
|
|
|
+ console.log('page',page);
|
|
|
+ this.id = page.id;
|
|
|
+ this.getSystemInfo();
|
|
|
+
|
|
|
+ // this.getTemplateIdList();//获取模板列表
|
|
|
+
|
|
|
+ },
|
|
|
+ onUnload() {
|
|
|
+ // 页面离开时停止计时器
|
|
|
+ // clearInterval(this.timer)
|
|
|
+ clearInterval(this.countdownTimer)
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ // 每秒更新倒计时时间
|
|
|
+ this.countdownTimer = setInterval(() => {
|
|
|
+ const now = new Date().getTime();
|
|
|
+ const distance = this.deadline - now;
|
|
|
+ // console.log('distance',distance);
|
|
|
+ if(this.orderDetails.status==0 && distance<0){
|
|
|
+ this.countdown = '支付超期';
|
|
|
+ return
|
|
|
+ }else if(this.orderDetails.status==3 && distance<0){
|
|
|
+ this.countdown = '演出已开始';
|
|
|
+ return
|
|
|
+ }
|
|
|
+
|
|
|
+ // 计算倒计时时间,可以根据需求自定义显示方式
|
|
|
+ const days = Math.floor(distance / (1000 * 60 * 60 * 24));
|
|
|
+ const hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
|
|
|
+ const minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
|
|
|
+ const seconds = Math.floor((distance % (1000 * 60)) / 1000);
|
|
|
+
|
|
|
+ // 更新倒计时时间
|
|
|
+ this.countdown = `${days}天 ${hours}小时 ${minutes}分钟 ${seconds}秒`;
|
|
|
+ }, 1000);
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ leftClick(e){
|
|
|
+ let pages = getCurrentPages();
|
|
|
+ if(pages.length==1){
|
|
|
+ uni.$u.route('/pages/index/index')
|
|
|
+ }else{
|
|
|
+ uni.navigateBack()
|
|
|
+ };
|
|
|
+ },
|
|
|
+ getTemplateIdList(){
|
|
|
+ this.$u.api.templateIdList({templateLabel:'order_pay'}).then(res=>{
|
|
|
+ console.log('getTemplateIdList',res.data);
|
|
|
+ this.templateIdList = res.data.list.map(item=>{
|
|
|
+ return item.templateId
|
|
|
+ });
|
|
|
+ // if(this.templateIdList.length>0){
|
|
|
+ // this.templateEven();
|
|
|
+ // }
|
|
|
+ }).catch(err=>{
|
|
|
+ console.log('getTemplateIdList',err);
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 展示二维码
|
|
|
+ showQrcode() {
|
|
|
+ let _this = this;
|
|
|
+ this.modal_qr = true;
|
|
|
+ // uni.showLoading()
|
|
|
+ setTimeout(function() {
|
|
|
+ // uni.hideLoading()
|
|
|
+ _this.$refs.qrcode.crtQrCode()
|
|
|
+ }, 50)
|
|
|
+ },
|
|
|
+ //传入组件的方法
|
|
|
+ hideQrcode() {
|
|
|
+ this.modal_qr = false;
|
|
|
+ },
|
|
|
+ refreshCode(){
|
|
|
+ this.qrContent = {};
|
|
|
+ this.qrContent.qrcode = this.orderDetails.parentQrcodeNo;
|
|
|
+ this.qrContent.time = Date.now();
|
|
|
+ this.qrContent = JSON.stringify(this.qrContent);
|
|
|
+ this.showQrcode()
|
|
|
+ },
|
|
|
+ hideSingleQrcode(){
|
|
|
+ this.singleModalQr = false;
|
|
|
+ },
|
|
|
+ getOrderDetails(id){
|
|
|
+ this.$u.api.teamApplyDetails({id:id}).then(res=>{
|
|
|
+ this.loadingPage = false;
|
|
|
+ this.orderDetails = res.data;
|
|
|
+ this.refundInfo = res.data.refundInfo||{};
|
|
|
+ if(res.data.status==0){//待支付
|
|
|
+ this.deadline = new Date(`${res.data.cancelDateTime}`).getTime();
|
|
|
+ }else if(res.data.status==3){//待使用
|
|
|
+ this.deadline = new Date(`${res.data.performDateTime}`).getTime();
|
|
|
+ }
|
|
|
+ if(res.data.parentQrcodeStatus==0){
|
|
|
+ this.qrContent = {};
|
|
|
+ this.qrContent.qrcode = res.data.parentQrcodeNo;
|
|
|
+ this.qrContent.time = Date.now();
|
|
|
+ this.qrContent = JSON.stringify(this.qrContent);
|
|
|
+ let that = this;
|
|
|
+ that.showQrcode();//一加载生成二维码
|
|
|
+ // this.refreshCode()
|
|
|
+ }
|
|
|
+
|
|
|
+ this.getPerformerNotice();
|
|
|
+ // console.log('this.deadline',this.deadline);
|
|
|
+ // console.log('orderDetails',JSON.parse(JSON.stringify(res.data)));
|
|
|
+ }).catch(err=>{
|
|
|
+ uni.$u.toast('获取数据失败,!请重试')
|
|
|
+ uni.navigateBack();
|
|
|
+ console.log('getOrderDetails',err);
|
|
|
+ })
|
|
|
+ },
|
|
|
+ singleQR(item,index){
|
|
|
+ let that = this;
|
|
|
+ console.log('singleQR',item);
|
|
|
+ this.showSingleQR = true;
|
|
|
+ this.singleInfo = item;
|
|
|
+
|
|
|
+ this.singleQrContent = {};
|
|
|
+ this.singleQrContent.qrcode = item.qrcodeNo;
|
|
|
+ this.singleQrContent.time = Date.now();
|
|
|
+ this.singleQrContent = JSON.stringify(this.singleQrContent);
|
|
|
+ that.showSingleQrcode();//一加载生成二维码
|
|
|
+ },
|
|
|
+ // 展示二维码
|
|
|
+ showSingleQrcode() {
|
|
|
+ let _this = this;
|
|
|
+ this.singleModalQr = true;
|
|
|
+ // uni.showLoading()
|
|
|
+ setTimeout(function() {
|
|
|
+ // uni.hideLoading()
|
|
|
+ _this.$refs.singleqrcode.crtQrCode()
|
|
|
+ }, 50)
|
|
|
+ },
|
|
|
+ closeSingleQR(){
|
|
|
+ this.showSingleQR = false;
|
|
|
+ },
|
|
|
+ openSingleQR(){
|
|
|
+
|
|
|
+ },
|
|
|
+ clickEven(fun,item){
|
|
|
+ // console.log('fun',fun);
|
|
|
+ let funObj = {
|
|
|
+ pay: this.pay,
|
|
|
+ logistics:this.logistics,
|
|
|
+ evaluate:this.evaluate,
|
|
|
+ refund:this.refund,
|
|
|
+ cancelOrder:this.cancelOrder,
|
|
|
+ viewRefund:this.viewRefund,
|
|
|
+ confirmReceipt:this.confirmReceipt
|
|
|
+ };
|
|
|
+ // console.log('funObj[fun]',funObj[fun]);
|
|
|
+ if (fun in funObj) {
|
|
|
+ funObj[fun](item);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ pay(item){
|
|
|
+ // #ifdef H5
|
|
|
+ this.gotoPay(this.orderDetails.id);
|
|
|
+ // #endif
|
|
|
+ // #ifdef MP
|
|
|
+ this.setTemplate(this.orderDetails.id);
|
|
|
+ // #endif
|
|
|
+ // console.log('pay',item);
|
|
|
+ // uni.$u.route('/center/pay', {
|
|
|
+ // orderId: item.id,
|
|
|
+ // // openid: that.vuex_wechatOpenid,
|
|
|
+ // payAmount:item.orderPrice
|
|
|
+ // });
|
|
|
+ },
|
|
|
+ logistics(item){
|
|
|
+ // console.log('logistics',item);
|
|
|
+ uni.$u.route('/center/distribution', {
|
|
|
+ orderId: item.id
|
|
|
+ });
|
|
|
+ },
|
|
|
+ evaluate(item){
|
|
|
+ // console.log('logistics',item);
|
|
|
+ uni.$u.route('/shopping/evaluate', {
|
|
|
+ id: item.id
|
|
|
+ });
|
|
|
+ },
|
|
|
+ refund(item){
|
|
|
+ console.log('this.orderDetails',this.orderDetails);
|
|
|
+ uni.$u.route('/center/refundselect', {
|
|
|
+ id: this.orderDetails.id,
|
|
|
+ realPrice:this.orderDetails.realPrice
|
|
|
+ });
|
|
|
+ },
|
|
|
+ cancelOrder(item){
|
|
|
+ let that = this;
|
|
|
+ uni.showModal({
|
|
|
+ title: '提示',
|
|
|
+ content: '确认取消吗!',
|
|
|
+ success: res => {
|
|
|
+ if (res.confirm) {
|
|
|
+ this.$u.api.cancelOrder({orderId:that.orderDetails.id}).then(res=>{
|
|
|
+ this.$refs.uToast.show({
|
|
|
+ message:res.msg,
|
|
|
+ complete() {
|
|
|
+ that.getOrderDetails(that.orderDetails.id);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ // uni.$u.toast(res.msg);
|
|
|
+ console.log('res',res.data);
|
|
|
+ }).catch(err=>{
|
|
|
+ console.log('cancelOrder',err);
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+ // console.log('logistics',item);
|
|
|
+
|
|
|
+ },
|
|
|
+ confirmReceipt(item){
|
|
|
+ let that = this;
|
|
|
+ uni.showModal({
|
|
|
+ title: '提示',
|
|
|
+ content: '确认收货吗!',
|
|
|
+ success: res => {
|
|
|
+ if (res.confirm) {
|
|
|
+ this.$u.api.confirmReceipt({orderId:item.id}).then(res=>{
|
|
|
+ uni.showToast({
|
|
|
+ title:res.msg,
|
|
|
+ duration:2000,
|
|
|
+ complete() {
|
|
|
+ that.evaluate(item)
|
|
|
+ that.getOrderDetails(that.id);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ console.log('res',res.data);
|
|
|
+ }).catch(err=>{
|
|
|
+ console.log('confirmReceipt',err);
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ goMap(){
|
|
|
+ uni.openLocation({
|
|
|
+ latitude: Number(this.pickupInfo.pickupLatitude), //维度
|
|
|
+ longitude: Number(this.pickupInfo.pickupLongitude), //经度
|
|
|
+ name: "商行地址", //目的地定位名称
|
|
|
+ scale: 15, //缩放比例
|
|
|
+ address: this.pickupInfo.pickupAddress //导航详细地址
|
|
|
+ })
|
|
|
+ },
|
|
|
+ copyOrderNum(orderNum){
|
|
|
+ // console.log('copyOrderNum',orderNum);
|
|
|
+ uni.setClipboardData({
|
|
|
+ data: orderNum,
|
|
|
+ success: function () {
|
|
|
+ uni.showToast({
|
|
|
+ title: '复制成功'
|
|
|
+ });
|
|
|
+ },
|
|
|
+ fail(e) {
|
|
|
+ // console.log('copyOrderNumfail',e);
|
|
|
+ uni.showToast({
|
|
|
+ title: '复制失败',
|
|
|
+ icon:"error"
|
|
|
+ });
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ // 设置小程序订阅消息
|
|
|
+ setTemplate(orderId) {
|
|
|
+ let that = this;
|
|
|
+ console.log('templateIdList',this.templateIdList);
|
|
|
+ uni.requestSubscribeMessage({
|
|
|
+ tmplIds: that.templateIdList,
|
|
|
+ success (res) {
|
|
|
+ // that.gotoPay();
|
|
|
+ console.log("success:",res);
|
|
|
+ },
|
|
|
+ fail (res) {
|
|
|
+ console.log("fail:",res);
|
|
|
+ },
|
|
|
+ complete (res) {
|
|
|
+ that.gotoPay(orderId);
|
|
|
+ console.log("complete:",res);
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ gotoPay(orderId){
|
|
|
+ this.$u.api.gotoPay({orderId:orderId,openid:''}).then(res=>{
|
|
|
+ this.payResult = res.data.payInfo;
|
|
|
+ this.payResult.package = res.data.payInfo.packageValue;
|
|
|
+ // #ifdef H5
|
|
|
+ this.initConfig(this.payResult)
|
|
|
+ // #endif
|
|
|
+ // #ifdef MP
|
|
|
+ this.wxPay()
|
|
|
+ // #endif
|
|
|
+ // if(this.params.paymentMode==1||this.params.paymentMode==4){
|
|
|
+ // this.wxPay()
|
|
|
+ // }else{
|
|
|
+ // uni.$u.route('/shopping/paysuccess');
|
|
|
+ // }
|
|
|
+ console.log('gotoPayres',res.data);
|
|
|
+ }).catch(err=>{
|
|
|
+ this.paypass = '';
|
|
|
+ this.checkPassShow = false;
|
|
|
+ console.log('gotoPay',err);
|
|
|
+ })
|
|
|
+ },
|
|
|
+ wxPay(){
|
|
|
+ let that = this;
|
|
|
+ uni.requestPayment({
|
|
|
+ ... this.payResult,
|
|
|
+ "provider": "wxpay",
|
|
|
+ "orderInfo": {
|
|
|
+ // "appid": "wx499********7c70e", // 微信开放平台 - 应用 - AppId,注意和微信小程序、公众号 AppId 可能不一致
|
|
|
+ // "noncestr": "c5sEwbaNPiXAF3iv", // 随机字符串
|
|
|
+ // "package": "Sign=WXPay", // 固定值
|
|
|
+ // "partnerid": "148*****52", // 微信支付商户号
|
|
|
+ // "prepayid": "wx202254********************fbe90000", // 统一下单订单号
|
|
|
+ // "timestamp": 1597935292, // 时间戳(单位:秒)
|
|
|
+ // "sign": "A842B45937F6EFF60DEC7A2EAA52D5A0" // 签名,这里用的 MD5/RSA 签名
|
|
|
+ },
|
|
|
+ success(res) {
|
|
|
+ that.payQuery();
|
|
|
+ },
|
|
|
+ fail(e) {
|
|
|
+ console.log('wxPayfail',e);
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ payQuery(){
|
|
|
+ let that = this;
|
|
|
+ let retryCount = 0;
|
|
|
+ let maxRetryCount = 5; // 设置最大重试次数
|
|
|
+ let interval = 2000; // 设置间隔时间为2秒
|
|
|
+ let timeout = 10000; // 设置超时时间为10秒
|
|
|
+ let timer;
|
|
|
+ uni.showLoading({
|
|
|
+ title:'支付结果查询中'
|
|
|
+ })
|
|
|
+ timer = setInterval(() => {
|
|
|
+ retryCount++;
|
|
|
+ if (retryCount > maxRetryCount || retryCount * interval > timeout) {
|
|
|
+ clearInterval(timer);
|
|
|
+ uni.hideLoading();
|
|
|
+ console.log("支付查询超时或达到最大重试次数");
|
|
|
+ // 在这里添加超时或达到最大重试次数的处理逻辑
|
|
|
+ this.reloadList()
|
|
|
+ } else {
|
|
|
+ console.log("第" + retryCount + "次查询");
|
|
|
+ // 调用查询支付状态的方法
|
|
|
+ // 如果支付状态为成功,则清除定时器并处理成功的逻辑
|
|
|
+ // 如果支付状态为失败,则清除定时器并处理失败的逻辑
|
|
|
+ this.$u.api.payQuery({orderId:this.orderId}).then(res=>{
|
|
|
+ // 0-未支付 1-已支付 2-支付中 3-支付失败 4-支付退款
|
|
|
+ let payStatus = res.data.payStatus;
|
|
|
+ if(payStatus===1){
|
|
|
+ uni.$u.route('/center/paysuccess');
|
|
|
+ }else if(payStatus===0||payStatus===2){
|
|
|
+ this.payQuery()
|
|
|
+ }else if(payStatus===3){
|
|
|
+ uni.toast('支付失败')
|
|
|
+ }
|
|
|
+ clearInterval(timer);
|
|
|
+ }).catch(err=>{
|
|
|
+ console.log('payQuery',err);
|
|
|
+ }).finally(()=>{
|
|
|
+ uni.hideLoading()
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }, interval);
|
|
|
+ },
|
|
|
+ getPerformerNotice(){
|
|
|
+ this.$u.api.performerNotice({performId:this.orderDetails.performId}).then(res=>{
|
|
|
+ // console.log('getPerformerNotice',res.data);
|
|
|
+ this.formerNotice = res.data.performNotice;
|
|
|
+ }).catch(err=>{
|
|
|
+ console.log('getPerformerNotice',err);
|
|
|
+ })
|
|
|
+ },
|
|
|
+ handleMoveQrcode(){
|
|
|
+ console.log('handleMoveQrcode');
|
|
|
+ return false
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 公众号微信支付
|
|
|
+ */
|
|
|
+ initConfig() {
|
|
|
+ // #ifdef H5
|
|
|
+ let that = this
|
|
|
+ wxH5.config({
|
|
|
+ debug: false, // 这里一般在测试阶段先用ture,等打包给后台的时候就改回false,
|
|
|
+ appId: that.payResult.appId, // 必填,公众号的唯一标识
|
|
|
+ timestamp: that.payResult.timeStamp, // 必填,生成签名的时间戳
|
|
|
+ nonceStr: that.payResult.nonceStr, // 必填,生成签名的随机串
|
|
|
+ signature: that.payResult.paySign, // 必填,签名
|
|
|
+ jsApiList: ['chooseWXPay', 'checkJsApi'] // 必填,需要使用的JS接口列表
|
|
|
+ })
|
|
|
+ wxH5.ready(() => {
|
|
|
+ wxH5.chooseWXPay({
|
|
|
+ timestamp: that.payResult.timeStamp, // 支付签名时间戳,注意微信jssdk中的所有使用timestamp字段均为小写。但最新版的支付后台生成签名使用的timeStamp字段名需大写其中的S字符
|
|
|
+ nonceStr: that.payResult.nonceStr, // 支付签名随机串,不长于 32 位
|
|
|
+ package: that.payResult.packageValue, // 统一支付接口返回的prepay_id参数值,提交格式如:prepay_id=\*\*\*)
|
|
|
+ signType: 'SHA1', // 签名方式,默认为'SHA1',使用新版支付需传入'MD5'
|
|
|
+ paySign: that.payResult.paySign, // 支付签名
|
|
|
+ success: () => {
|
|
|
+ that.payQuery();
|
|
|
+ },
|
|
|
+ fail: (e) => {
|
|
|
+ uni.$u.route('/center/order', {
|
|
|
+ status: 0
|
|
|
+ });
|
|
|
+ console.log('wxPayfail', e);
|
|
|
+ },
|
|
|
+ cancel: () => {
|
|
|
+ uni.$u.route('/center/order', {
|
|
|
+ status: 0
|
|
|
+ });
|
|
|
+ that.cansubmit = true;
|
|
|
+ }
|
|
|
+ })
|
|
|
+ })
|
|
|
+ // #endif
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+ }
|
|
|
+</script>
|
|
|
+<style>
|
|
|
+ page{
|
|
|
+ background: linear-gradient(180deg, #ED0000 0%, #F9FBFD 50%,#F9FBFD 100%);
|
|
|
+ background-repeat: no-repeat;
|
|
|
+ }
|
|
|
+</style>
|
|
|
+<style lang="scss" scoped>
|
|
|
+.status-content{
|
|
|
+ text-align: center;
|
|
|
+ padding-top: 30rpx;
|
|
|
+ margin-bottom: 52rpx;
|
|
|
+ .text{
|
|
|
+ font-size: 32rpx;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #FFFFFF;
|
|
|
+ margin-bottom: 52rpx;
|
|
|
+ }
|
|
|
+ .btn-wrap{
|
|
|
+ margin-bottom: 40rpx;
|
|
|
+ .btn{
|
|
|
+ height: 64rpx;
|
|
|
+ line-height: 64rpx;
|
|
|
+ padding: 0 42rpx;
|
|
|
+ border-radius: 8rpx;
|
|
|
+ border: 2rpx solid #FFFFFF;
|
|
|
+ background-color: #ffffff;
|
|
|
+ font-size: 24rpx;
|
|
|
+ font-weight: bold;
|
|
|
+ color: #EE0B0B;
|
|
|
+ &.cancel{
|
|
|
+ border-color: #FFE2E2;
|
|
|
+ color: #FFE2E2;
|
|
|
+ background-color: transparent;
|
|
|
+ }
|
|
|
+ &:not(:last-of-type){
|
|
|
+ margin-right: 100rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+.base-info{
|
|
|
+ background: #FFFFFF;
|
|
|
+ box-shadow: 0rpx 2rpx 12rpx 0rpx rgba(221,221,221,0.5);
|
|
|
+ border-radius: 20rpx;
|
|
|
+ overflow: hidden;
|
|
|
+ margin-bottom: 24rpx;
|
|
|
+ .top{
|
|
|
+ padding: 36rpx 24rpx;
|
|
|
+ background: #F9FAFD;
|
|
|
+ font-size: 24rpx;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #7F7F7F;
|
|
|
+ }
|
|
|
+ .info{
|
|
|
+ padding: 28rpx 20rpx 30rpx 24rpx;
|
|
|
+ .img{
|
|
|
+ width: 180rpx;
|
|
|
+ height: 160rpx;
|
|
|
+ }
|
|
|
+ .text{
|
|
|
+ font-size: 24rpx;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #7F7F7F;
|
|
|
+ padding-left: 26rpx;
|
|
|
+ flex: 1;
|
|
|
+ .name{
|
|
|
+ font-size: 28rpx;
|
|
|
+ font-weight: bold;
|
|
|
+ color: #363636;
|
|
|
+ margin-bottom: 20rpx;
|
|
|
+ }
|
|
|
+ .time{
|
|
|
+ margin-bottom: 20rpx;
|
|
|
+ }
|
|
|
+ .position{
|
|
|
+ margin-bottom: 20rpx;
|
|
|
+ }
|
|
|
+ .status{
|
|
|
+ font-size: 24rpx;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #EE0606;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+.box{
|
|
|
+ margin-bottom: 24rpx;
|
|
|
+ background: #FFFFFF;
|
|
|
+ box-shadow: 0rpx 0rpx 20rpx 2rpx rgba(221,221,221,0.5);
|
|
|
+ border-radius: 20rpx;
|
|
|
+ padding: 36rpx 24rpx;
|
|
|
+ .title{
|
|
|
+ font-size: 28rpx;
|
|
|
+ font-weight: bold;
|
|
|
+ color: #2D2D2D;
|
|
|
+ padding-bottom: 20rpx;
|
|
|
+ margin-bottom: 24rpx;
|
|
|
+ border-bottom: 1px solid #F4F4F4;
|
|
|
+ .btn{
|
|
|
+ height: 40rpx;
|
|
|
+ line-height: 40rpx;
|
|
|
+ padding: 0 20rpx;
|
|
|
+ border-radius: 8rpx;
|
|
|
+ border: 2rpx solid #606060;
|
|
|
+ font-size: 24rpx;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #606060;
|
|
|
+ cursor: pointer;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+.order-info{
|
|
|
+ .order-info-item{
|
|
|
+ font-size: 30rpx;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #333333;
|
|
|
+ padding: 10rpx 0;
|
|
|
+ // &:not(:last-child){
|
|
|
+ // border-bottom: 0.5px solid #eee;
|
|
|
+ // }
|
|
|
+ .til{
|
|
|
+ font-size: 24rpx;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #999999;
|
|
|
+ margin-right: 40rpx;
|
|
|
+ }
|
|
|
+ .copy-btn{
|
|
|
+ margin-left: 32rpx;
|
|
|
+ height: 30rpx;
|
|
|
+ line-height: 30rpx;
|
|
|
+ padding: 0 14rpx;
|
|
|
+ border-radius: 8rpx;
|
|
|
+ font-size: 20rpx;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #999999;
|
|
|
+ background: #EDEDED;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+.tips{
|
|
|
+ .tips-item{
|
|
|
+ font-size: 24rpx;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #7F7F7F;
|
|
|
+ line-height: 36rpx;
|
|
|
+ margin-bottom: 20rpx;
|
|
|
+ }
|
|
|
+}
|
|
|
+.qr-wrap{
|
|
|
+ .qr-content{
|
|
|
+ text-align: center;
|
|
|
+ font-size: 24rpx;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #7F7F7F;
|
|
|
+ }
|
|
|
+ .img-wrap{
|
|
|
+ position: relative;
|
|
|
+ }
|
|
|
+ .ayQrcode,.img{
|
|
|
+ width: 180px;
|
|
|
+ height: 180px;
|
|
|
+ display: block;
|
|
|
+ margin: 0 auto 20rpx;
|
|
|
+
|
|
|
+ }
|
|
|
+ .refund-ico{
|
|
|
+ width: 200rpx;
|
|
|
+ height: 152rpx;
|
|
|
+ position: absolute;
|
|
|
+ bottom: -10rpx;
|
|
|
+ right: 60rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+}
|
|
|
+.order-num{
|
|
|
+ position: relative;
|
|
|
+ margin: 30rpx auto 0;
|
|
|
+ font-size: 24rpx;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #363636;
|
|
|
+ border: 1px solid #363636;
|
|
|
+ padding: 5rpx 20rpx;
|
|
|
+ border-radius: 8rpx;
|
|
|
+ width: fit-content;
|
|
|
+ &.del-line{
|
|
|
+ color: #BCBCBC;
|
|
|
+ border: 1px solid #BCBCBC;
|
|
|
+ }
|
|
|
+ &.del-line::after{
|
|
|
+ content: '';
|
|
|
+ width: 110%;
|
|
|
+ height: 1px;
|
|
|
+ background-color: #BCBCBC;
|
|
|
+ position: absolute;
|
|
|
+ top: 50%;
|
|
|
+ left: -5%;
|
|
|
+ }
|
|
|
+ }
|
|
|
+.viewers-list{
|
|
|
+ .item{
|
|
|
+ font-size: 24rpx;
|
|
|
+ color: #999;
|
|
|
+ margin-bottom: 10px;
|
|
|
+ .qrbtn{
|
|
|
+ color: #EE0606;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+.viewers-list-tuan{
|
|
|
+ .list{
|
|
|
+ display: grid;
|
|
|
+ grid-template-columns: repeat(4, 1fr);
|
|
|
+ gap: 24rpx;
|
|
|
+ }
|
|
|
+}
|
|
|
+.singleQR-wrap{
|
|
|
+ padding: 0 24rpx 50rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ min-width: 80vw;
|
|
|
+ .title{
|
|
|
+ text-align: center;
|
|
|
+ height: 94rpx;
|
|
|
+ line-height: 94rpx;
|
|
|
+ font-size: 28rpx;
|
|
|
+ font-weight: bold;
|
|
|
+ color: #2D2D2D;
|
|
|
+ border-bottom: 2rpx solid #F4F4F4;
|
|
|
+ margin-bottom: 24rpx;
|
|
|
+ }
|
|
|
+ .single-info{
|
|
|
+ margin-bottom: 24rpx;
|
|
|
+ .item{
|
|
|
+ font-size: 24rpx;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #363636;
|
|
|
+ margin-bottom: 10rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .singleQrcode{
|
|
|
+ width: 160px;
|
|
|
+ height: 160px;
|
|
|
+ margin: 24rpx auto 54rpx;
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|