经销商管理pay

doum

2 天以前 1dcd8399c853ef724133d4d1ad0d700db0f293e7

 mini-program/pagesA/pages/order/order.vue

@@ -1,17 +1,17 @@
<template>
   <view class="box">
      <view class="cate">
         <view @click="changeRow(index)" :class="active === index ? 'cate-item active' : 'cate-item'" v-for="(item, index) in cate" :key="index">
         <view @click="changeRow(item)" :class="active === index ? 'cate-item active' : 'cate-item'" v-for="(item, index) in cate" :key="index">
            {{item.name}}
            <view class="cate-item-xiab" v-if="active === index"></view>
         </view>
      </view>
      <view class="list">
         <view class="list-item" v-for="(item, index) in dataList" :key="index" @click="jumpOrderDetail(item.id)">
            <view class="a">
         <view class="list-item" v-for="(item, index) in dataList" :key="index">
            <view class="a"  @click="jumpOrderDetail(item.id)">
               <view class="a-left">
                  <view class="a-left-tips">{{item.receiveType==1?'自提':'快递配送'}}</view>
                  <text>订单号：{{item.id}}</text>
                  <view :class="'a-left-tips '+(item.receiveType==1?'shop-top-tips-a':'shop-top-tips-b')">{{item.receiveType==1?'自提':'配送'}}</view>
                  <text>订单号：{{item.code}}</text>
               </view>
               <text v-if="item.status ==0" class="a-right">待支付</text>
               <text  v-if="item.status ==1" class="a-right">{{item.receiveType==1?'待自提':'待发货'}}</text>
@@ -20,20 +20,10 @@
               <text  v-if="item.status ==4" class="a-right grey">已取消</text>
               <text  v-if="item.status ==6" class="a-right grey">已退款</text>
            </view>
            <view class="b">
               <view class="b-item" v-for="(item1, index1) in (item.goodsorderDetailList||[])">
            <view class="b"  @click="jumpOrderDetail(item.id)">
               <view class="b-item" v-for="(item1, index1) in (item.goodsorderDetailList||[])"  >
                  <view class="b-item-image">
                     <image :src="item1.imgurl||'/static/logo.png'" mode="widthFix"></image>
                  </view>
                  <view class="b-item-title">{{item1.name||''}}</view>
                  <view class="b-item-jia">
                     <text>¥{{(item1.price||0).toFixed(2)}}</text>
                     <text>x{{item1.goodsNum||0}}</text>
                  </view>
               </view>
               <view class="b-item" v-for="(item1, index1) in (item.goodsorderDetailList||[])">
                  <view class="b-item-image">
                     <image :src="item1.imgurl||'/static/logo.png'" mode="widthFix"></image>
                     <image :src="item1.imgurl||'/static/static/default2.png'" mode="widthFix"></image>
                  </view>
                  <view class="b-item-title">{{item1.name||''}}</view>
                  <view class="b-item-jia">
@@ -50,12 +40,19 @@
                     <text></text>
                  </view>
               </view>
               <view class="c-btns">
               <view class="c-btns" v-if="userType ==1">
                  <view class="c-btns-item blue" @click="contactPhone(item)">联系客户</view>
                  <view class="c-btns-item bg" v-if="item.status==1 && item.receiveType==1">自提核销</view>
                  <view class="c-btns-item bg" v-if="item.status==1 && item.receiveType==1" @click="hexiaoOrder(item)">自提核销</view>
               </view>
               <view class="c-btns" v-if="userType !=1"> 
                  <view class="c-btns-item grey" @click="cancelOrder(item)" v-if="item.status==0 || item.status==1">取消订单</view> 
                  <view class="c-btns-item grey" @click="deleteOrder(item)" v-if="item.status==4">删除订单</view> 
                  <view class="c-btns-item blue" @click="openQrcode(item)"  v-if="item.status==1 && item.receiveType==1">自提码</view>
                  <view class="c-btns-item blue" @click="payOrder(item)" v-if="item.status==0">去支付</view> 
                  <view class="c-btns-item blue" @click="doneOrder(item)" v-if="item.status==2">确认收货</view>
               </view>
            </view>
            <view class="d" v-if="item.memberInfo">
            <view class="d" v-if="item.memberInfo"  @click="jumpOrderDetail(item.id)">
               订单备注：{{item.memberInfo||''}}
            </view>
         </view>
@@ -85,11 +82,68 @@
            <!-- <view class="phone-botton"  @click="contactPhone()" >关闭</view> -->
         </view>
      </u-popup>
      <!-- 确认收货 -->
      <u-popup :show="showDone" round="15" :safeAreaInsetBottom="false" mode="center">
         <view class="tc">
            <view class="tc-contemt">
               <view class="tc-contemt-title">确认收货提醒</view>
               <view class="tc-contemt-nr">
                  您确认已经收到商品了吗？
               </view>
            </view>
            <view class="tc-btn">
               <view class="tc-btn-item" @click="showDone = false;currentOrder=null;">取消</view>
               <view class="tc-btn-item" style="color: #004096;" @click="doneOrderDo()">确认收货</view>
            </view>
         </view>
      </u-popup>
      <!-- 取消订单 -->
      <u-popup :show="showCancel" round="15" :safeAreaInsetBottom="false" mode="center">
         <view class="tc">
            <view class="tc-contemt">
               <view class="tc-contemt-title">确定取消提醒</view>
               <view class="tc-contemt-nr">
                  您确认取消该订单吗？
               </view>
            </view>
            <view class="tc-btn">
               <view class="tc-btn-item" @click="showCancel = false;currentOrder=null;">我再想想</view>
               <view class="tc-btn-item" style="color: red;" @click="cancelOrderDo">确认取消</view>
            </view>
         </view>
      </u-popup>
      <!-- 删除订单 -->
      <u-popup :show="showDelete" round="15" :safeAreaInsetBottom="false" mode="center">
         <view class="tc">
            <view class="tc-contemt">
               <view class="tc-contemt-title">确认删除提醒</view>
               <view class="tc-contemt-nr">
                  您确认删除该订单吗？
               </view>
            </view>
            <view class="tc-btn">
               <view class="tc-btn-item" @click="showDelete = false;currentOrder=null;">我再想想</view>
               <view class="tc-btn-item" style="color: red;" @click="deleteOrderDo">确认删除</view>
            </view>
         </view>
      </u-popup>
      <u-popup :show="showQrcode" round="15" @close="openQrcode()"   :safeAreaInsetBottom="false" mode="bottom"  :closeable="true" :closeOnClickOverlay="false">
         <view class="tc" style="width: 100%;">
            <view class="tc-contemt">
               <view class="tc-contemt-title" style="text-align: center;">自提码</view>
               <view class="tc-contemt-nr" style="border: 1rpx solid #f2f2f2;width: 150px;height: 150px;">
                  <image style="border: 1rpx solid #f2f2f2;width: 150px;height: 150px;" v-if="currentOrder && currentOrder.qrCodeBase64" :src="currentOrder.qrCodeBase64"  model="widthFix" ></image>
               </view>
                <view class="tc-contemt-title" style="text-align: center;">{{currentOrder.exchangeCode|| ''}}</view>
            </view>
         </view>
      </u-popup>
   </view>
</template>

<script>
   import { mapState } from 'vuex'
   import QRCode from 'qrcode';
   export default {
      computed: {
         ...mapState(['navHeight', 'statusbarHeight','shopInfo', 'shopToken'])
@@ -97,37 +151,210 @@
      data() {
         return {
            i: '',
            active:0,
            currentOrder:null,
            showDone:false,
            showCancel:false,
            showDelete:false,
            showQrcode:false,
            showPay:false,
            showPhone:false,
            loading:false,
            active:0,
            currentPage:1,
            total:0,
            hasNext:true,
            userType:null,
            dataList:[],
            shop:{}, 
            linkItem:{},
            cate: [
               { name: '全部', id: '' },
               { name: '待支付', id: 0 },
               { name: '待发货/自提', id: 1 }
            cate:[],
            cate1: [
               { name: '全部', id: '' ,index:0},
               { name: '待支付', id: 0 ,index:1},
               { name: '待发货/自提', id: 1,index:2 }
            ],
            cate0: [
               { name: '全部', id: '' ,index:0},
               { name: '待支付', id: 0 ,index:1},
               { name: '待发货/自提', id: 1,index:2 },
               { name: '待收货', id: 2 ,index:3},
            ]
         };
      },
      onLoad(options) {
         if (options.status) {
            this.i = Number(options.status)
         console.log(options )
         this.active = 0
         this.cate =[]
         this.userType = Number(options.userType)
         if(this.userType == 1){
            this.shop  ={}
            this.checkShopLogin()
            this.shop = this.shopInfo || {}
             this.cate =this.cate1;
         }else{
             this.cate =this.cate0;
         }
         if (options.status) {
            this.active =  Number(options.status)
            this.i = this.cate[this.active].id
         }
         this.getFirstPageData()
         var that =this
         uni.$on('updateOrder',function(data){
            console.log('监听到事件来自 update ，携带参数 msg 为：' ,data);
            if(data.delete == 1){
               //删除订单，强制刷新数据
               that.getFirstPageData()
            }else if(data.info!=null && data.info.orderId!=null){
                 console.log('监听到事件来自 update 01：' ,data);
               that.dataList.forEach((item,index)=>{
                  if(item.id==data.info.orderId){
                      console.log('监听到事件来自 update 02：' ,data);
                     item.status = data.info.orderStatus
                  }
               }) 
            }
				
          })
      },
      onShow() {
         this.shop  ={}
         this.checkShopLogin()
         this.shop = this.shopInfo || {}
         this.getFirstPageData()
         this.showDone=false
         this.showCancel=false
         this.showDelete=false
         this.showQrcode=false
         this.showPay=false
         this.showPhone=false
         this.loading=false,
         this.currentOrder=null
      },
      onReachBottom(){
         this.getDataList();
      },
      methods: {
         async openQrcode(item){
            this.currentOrder = null
            var that =this
            if(!this.showQrcode){
               this.currentOrder = item
               if(this.currentOrder.qrCodeBase64 == undefined && this.currentOrder.qrCodeBase64==null){
                  try {
                     const ocanvas = uni.createOffscreenCanvas({ type: "2d" });
                     const qrCodeBase64 = await QRCode.toDataURL(ocanvas,this.currentOrder.exchangeCode, {
                        scale: 1, // 二维码的缩放比例，可以根据需要调整
                        width: 150, // 二维码的宽度，可以根据需要调整
                        margin: 1 // 二维码周围的空白边距，可以根据需要调整
                     }); 
                     this.currentOrder.qrCodeBase64 =qrCodeBase64
                     that.showQrcode = true
                  } catch (err) {
                     uni.showToast({
                        title:'生成自提码失败',
                        icon:'error'
                     })
                  }
               }else{
                  that.showQrcode = true
               }
            }else{
               this.showQrcode = false
            }
         },
         hexiaoOrder(item){
            uni.navigateTo({
               url:'/pagesA/pages/write-off-a/write-off-a?id='+item.id
            })
         },
         cancelOrder(item){
            this.currentOrder = null
            this.showCancel = !this.showCancel
            if(this.showCancel){
               this.currentOrder = item
            }
         },
         deleteOrder(item){
            this.currentOrder = null
            this.showDelete = !this.showDelete
            if(this.showDelete){
               this.currentOrder = item
            }
         },
			
         payOrder(item){
         },
         doneOrder(item){
            this.currentOrder = null
            this.showDone = !this.showDone
            if(this.showDone){
               this.currentOrder = item
            }
         },
         async  doneOrderDo(){
            if(this.userType == 1 || this.currentOrder==null || this.currentOrder.id == null) {
               return
            }
            var that =this
            let res = await this.$u.api.affirmOrder({ orderId: this.currentOrder.id  });
            if (res.code === 200 ) { 
               //修改订单状态
               this.dataList.forEach(item=>{
                  if(item.id==this.currentOrder.id){
                     item.status =3
                  }
               }) 
               this.doneOrder()
            }else{
               /* uni.showToast({
                  title:res.message||'确定收货失败！',
                  icon:'error'
               }) */
            }
         },
         async cancelOrderDo(){
            if(this.userType == 1 || this.currentOrder==null || this.currentOrder.id == null) {
               return
            }
               var that =this
            let res = await that.$u.api.cancelOrder({ orderId: this.currentOrder.id  });
            if (res.code === 200 ) { 
               //修改订单状态
               this.dataList.forEach(item=>{
                  if(item.id==this.currentOrder.id){
                     item.status = 4
                  }
               }) 
               this.cancelOrder()
            }else{
               /* uni.showToast({
                  title:res.message||'取消订单失败！',
                  icon:'error'
               }) */
            }
         },
         async deleteOrderDo(){
            if(this.userType == 1 || this.currentOrder==null || this.currentOrder.id == null) {
               return
            }
            var that =this
            let res = await that.$u.api.delOrder({ orderId: this.currentOrder.id  });
            if (res.code === 200 ) { 
               //修改订单状态
               /* var tindex = -1;
               this.dataList.forEach((item,index)=>{
                  if(item.id==this.currentOrder.id){
                     tindex = index
                  }
               }) 
               if(tindex>=0){
                  this.dataList.splice(tindex,1)
               } */
               this.getFirstPageData()
            }else{
               /* uni.showToast({
                  title:res.message||'删除订单失败！',
                  icon:'error'
               }) */
            }
         },
         contactPhone(item){
             this.showPhone = !this.showPhone
             this.linkItem = item ||{}
@@ -140,9 +367,9 @@
               })
            }
         },
         changeRow(index) {
            this.active=index
            this.i = this.cate[index].id
         changeRow( item) {
             this.active=item.index
             this.i = item.id
            this.getFirstPageData()
         },
         getFirstPageData(){
@@ -163,15 +390,27 @@
                  this.dataList=[]
               }
               var that =this 
               let res = await that.$u.api.shopOrderPage({
                     capacity:10,
                     model: {
                        receiveType: 1, 
                        status: this.i
                     },
                     page:this.currentPage
                  });
                  console.log(res)
               let res ={};
               if(this.userType == 1){
                  res = await that.$u.api.shopOrderPage({
                        capacity:10,
                        model: {
                           receiveType: 1, 
                           status: this.i
                        },
                        page:this.currentPage
                     });
               }else{
                  res = await that.$u.api.orderPage({
                        capacity:10,
                        model: {
                           receiveType: 1, 
                           status: this.i
                        },
                        page:this.currentPage
                     });
               }
               console.log(res)
               if (res.code === 200 ) { 
                  if ( res.data && res.data.page ===this.currentPage) { 
                     res.data.records = res.data.records||[]
@@ -188,9 +427,9 @@
         },
         jumpOrderDetail(id){
            uni.navigateTo({
               url: '/pagesA/pages/order-details/order-details?userType=1&id='+id
               url: '/pagesA/pages/order-details/order-details?userType='+this.userType+'&id='+id
            })
         },
         }, 
         checkShopLogin(){
            var that =this
            if( this.shopInfo ==null || this.shopInfo.id==null ||  this.shopToken==null || this.shopToken==''){
@@ -236,14 +475,20 @@
                  .a-left-tips {
                     padding: 0 6rpx;
                     height: 40rpx;
                     line-height: 40rpx;
                     // background: #00B775;
                     background: #00B775;
                     line-height: 40rpx; 
                     border-radius: 8rpx;
                     font-weight: 400;
                     font-size: 22rpx;
                     color: #FFFFFF;
                     margin-right: 16rpx;
                  }
                  .shop-top-tips-a {
                     background: #00B775; 
                     border: 1rpx solid #00B775;
                  }
                  .shop-top-tips-b {
                     background: #004096;
                     border: 1rpx solid #004096;
                  }
                  text {
                     font-weight: 400;
@@ -259,6 +504,19 @@
               .grey{
                  color: #999999 !important;
               }
            }
            .d{
               width: 100%;
               padding:20rpx 20rpx;
               margin-top: 22rpx;
               background: #F8F9FB;
               border-radius: 8rpx;
               font-weight: 400;
               font-size: 26rpx;
               color: #666666;
               line-height: 36rpx;
               text-align: left;
               font-style: normal;
            }
            .b {
               width: 100%;
@@ -363,6 +621,10 @@
                     border: 1rpx solid #004096;
                     color: #004096 !important;
                  }
                  .grey {
                     border: 1rpx solid #666666;
                     color: #666666 !important;
                  }
                  .bg{
                     background: #004096;
                     border-radius: 34rpx;
@@ -383,10 +645,10 @@
                     align-items: center;
                     justify-content: center;
                     border-radius: 34rpx;
                     border: 1rpx solid #B2B2B2;
                     // border: 1rpx solid #B2B2B2;
                     font-weight: 400;
                     font-size: 28rpx;
                     color: #666666;
                     // color: #666666;
                     margin-right: 20rpx;
                     &:last-child {
                        margin: 0 !important;