doum
2026-04-27 46e6a2b43b042963953b4d1d6a36e0cee69962b0
small-program/pages/itinerary/itinerary.vue
@@ -14,7 +14,7 @@
                     :key="item.value"
                     class="filter-tab"
                     :class="{ active: activeTab === item.value }"
                     @tap="activeTab = item.value"
                     @click="changeTab(item) "
                  >
                     {{ item.label }}
                  </view>
@@ -26,16 +26,22 @@
      <view class="content-wrap">
         <view class="page-padding card-list">
            <view v-for="(item, index) in dataList" :key="item.id" class="order-card">
               <view class="order-head" :class="item.mode === 'city' ? 'city-head-bg' : 'local-head-bg'">
               <view class="order-head" :class="item.mode === 'city' ? 'city-head-bg' : 'local-head-bg'"  @click="jumpOrderDetail(item.id)">
                  <view v-if="item.type === 0" class="head-local">
                     <view class="mode-tag local-tag">就地寄存</view>
                     <view class="head-copy single-copy">
                        <text class="head-name text-ellipsis">{{ item.depositShopName||'' }}</text>
                        <text class="head-user">{{ item.takeUser ||'' }}</text>
                     </view>
                     <text v-if="item.status < 7" class=" status-text status-orange">{{ item.statusName||'' }}</text>
                     <text v-else-if="item.status ===7" class=" status-text">{{ item.statusName||'' }}</text>
                     <text v-else-if="item.status >7" class=" status-text status-grey">{{ item.statusName||'' }}</text>
                     <view style="display: flex;flex-direction: column;">
                        <text v-if="item.status ===5 && item.overdueStatus ===1 "  class="status-text" style="color: red;">超时未取件</text>
                        <text v-else-if="item.status ===5 && item.overdueStatus ===3 "  class="status-text" style="color: red;">超时到店取件</text>
                        <text v-else-if="item.status < 7" class=" status-text status-orange">{{ item.statusName||'' }}</text>
                        <text v-else-if="item.status ===7" class=" status-text  status-grey">{{ item.statusName||'' }}</text>
                        <text v-else class=" status-text status-grey">{{ item.statusName||'' }}</text>
                        <text v-if="item.status ===5 && item.overdueStatus ===1 "  class="status-text" style="color: red;font-size: 24rpx;">逾期费用¥{{((item.overdueFee || 0)/100).toFixed(2)}}</text>
                        <text v-if="item.status ===5 && item.overdueStatus ===3 "  class="status-text" style="color: red;font-size: 24rpx;">逾期费用¥{{((item.overdueFee || 0)/100).toFixed(2)}}</text>
                     </view>
                  </view>   
                  <view v-else class="head-city">
                     <view class="head-copy city-left">
@@ -48,16 +54,21 @@
                        <view class="arrow-head"></view>
                     </view>
                     <view class="head-copy city-right align-right">
                        <text v-if="item.status < 7" class=" status-text status-orange">{{ item.statusName||'' }}</text>
                        <text v-else-if="item.status ===7" class="status-text">{{ item.statusName||'' }}</text>
                        <text v-else-if="item.status >7" class=" status-text status-grey">{{ item.statusName||'' }}</text>
                        <text class="head-name text-ellipsis">{{ item.takeShopName||'对对对' }}</text>
                        <view style="display: flex;flex-direction: column;">
                           <text v-if="item.status ===5 && item.overdueStatus ===1 "  class="status-text" style="color: red;">超时未取件</text>
                           <text v-else-if="item.status ===5 && item.overdueStatus ===3 "  class="status-text" style="color: red;">超时到店取件</text>
                           <text v-else-if="item.status < 7" class=" status-text status-orange">{{ item.statusName||'' }}</text>
                           <text v-else-if="item.status ===7" class=" status-text  status-grey">{{ item.statusName||'' }}</text>
                           <text v-else class=" status-text status-grey">{{ item.statusName||'' }}</text>
                           <text v-if="item.status ===5 && item.overdueStatus ===1 "  class="status-text" style="color: red;font-size: 24rpx;">逾期费用¥{{((item.overdueFee || 0)/100).toFixed(2)}}</text>
                           <text v-if="item.status ===5 && item.overdueStatus ===3 "  class="status-text" style="color: red;font-size: 24rpx;">逾期费用¥{{((item.overdueFee || 0)/100).toFixed(2)}}</text>
                        </view>
                        <text class="head-name text-ellipsis">{{ item.takeShopName || item.takeLocation||'' }}</text>
                        <text class="head-user">{{ item.takeUser||'' }}</text>
                     </view>
                  </view>
               </view>
               <view class="goods-area" v-if="item.detailList">
               <view class="goods-area" v-if="item.detailList" @click="jumpOrderDetail(item.id)">
                  <view v-for="goods in item.detailList " :key="goods.luggageName" class="goods-row">
                     <view class="goods-left">
                        <text class="goods-name">{{ goods.luggageName ||'' }}</text>
@@ -89,24 +100,26 @@
               <view class="card-footer">
                  <view class="footer-actions" v-if="item.type===0">
                     <view class="footer-btn contact-btn" @click="contactPhone(item,0)" v-if="item.status ===1 || item.status==2 || item.status===98">联系门店</view>
                     <view class="footer-btn contact-btn" @click="contactPhone(item,0)" v-if="item.status ===1 ||item.status ===5 || item.status==2 || item.status===98">联系门店</view>
                      <view class="footer-btn contact-btn" v-if="item.status ===0 || item.status ===1"  @click="cancelOrder(item)">取消订单</view>
                     <view class="footer-btn contact-btn" @click="deleteOrder(item)" v-if="item.status ===7 || item.status===96 || item.status == 99">删除订单</view>
                     <view class="footer-btn primary-btn"  @click="payOrder(item)" v-if="item.status ===0">立即支付</view>
                     <view class="footer-btn primary-btn" @click="payOrderFee(item)" v-if="item.status ===5 && item.overdueStatus===3 ">立即支付</view>
                     <view class="footer-btn primary-btn" v-if="item.status >=1 &&item.status <7 " @click="openQrcode(item)" >核销码</view>
                     <view class="footer-btn primary-btn" v-if="item.status ===7 && !commentStatus ">评价订单</view>
                     <view class="footer-btn primary-btn" @click="evaluateOrder(item)" v-if="item.status ===7 && !item.commentStatus ">评价订单</view>
                  </view>
                  <view class="footer-actions" v-else>
                     <view class="footer-btn contact-btn" @click="contactPhone(item,0)" v-if="item.status ===1 || item.status ==2">联系门店</view> 
                     <view class="footer-btn contact-btn" @click="contactPhone(item,2)" v-if="item.status ===3 || item.status ===4 ">联系骑手</view>
                     <view class="footer-btn contact-btn" @click="contactPhone(item,1)" v-if="item.status ===5">联系门店</view>
                        <view class="footer-btn contact-btn" v-if="item.status ===0"  @click="cancelOrder(item)">取消订单</view>
                        <view class="footer-btn primary-btn" @click="payOrder(item)" v-if="item.status ===0">立即支付</view>
                     <view class="footer-btn contact-btn" v-if="item.status ===0"  @click="cancelOrder(item)">取消订单</view>
                     <view class="footer-btn primary-btn" @click="payOrder(item)" v-if="item.status ===0">立即支付</view>
                     <view class="footer-btn primary-btn" @click="payOrderFee(item)" v-if="item.status ===5 && item.overdueStatus===3 ">立即支付</view>
                     <view class="footer-btn contact-btn" @click="deleteOrder(item)" v-if="item.status ===7 || item.status===96 || item.status == 99">删除订单</view>
                     <view class="footer-btn primary-btn" @click="cancelOrder(item)" v-if="item.status ===1">申请退款</view>
                     <view class="footer-btn primary-btn" v-if="item.status ===1 || (item.takeShopId && item.status ===5)" @click="openQrcode(item)" >核销码</view>
                     <view class="footer-btn primary-btn"  @click="doneOrder(item)"  v-if="!item.takeShopId && item.status ===5">确认收货</view>
                     <view class="footer-btn primary-btn" v-if="item.status ===7 && !commentStatus ">评价订单</view>
                     <view class="footer-btn primary-btn"  @click="evaluateOrder(item)" v-if="item.status ===7 && !item.commentStatus ">评价订单</view>
                  </view>
               </view>
            </view>
@@ -120,7 +133,7 @@
         <view class="phone">
            <view class="phone-head">
               <view></view>
               <text>联系客户</text>
               <text>{{linkItem.title}}</text>
            </view>
            <!-- <view class="phone-item">
               <view>
@@ -130,10 +143,10 @@
                <view class="line" v-if="serverPhone && serverPhone.length"></view>
            </view> -->
             <view class="phone-item" >
                <view>
                  <image src="/static/icon/ic_call@2x.png" mode="widthFix" @click="contactPhoneDo()" ></image>
                  <text>{{linkItem.linkname||''}} </text>
                  <text style="margin-left: 10px;"> {{linkItem.linkphone||''}}</text>
                <view @click="contactPhoneDo()">
                  <image src="/static/icon/ic_call@2x.png" mode="widthFix"  ></image>
                  <text  >{{linkItem.linkname||''}} </text>
                  <text  style="margin-left: 10px;"> {{linkItem.linkphone||''}}</text>
               </view> 
             </view>  
             <view style="width: 100%; height: 30rpx;"></view>
@@ -197,11 +210,13 @@
            </view>
         </view>
      </u-popup>
      <custom-tabbar></custom-tabbar>
   </view>
</template>
<script>
   import { mapState } from 'vuex'
   import CustomTabbar from '@/components/custom-tabbar/custom-tabbar.vue'
   import drawQrcode from 'weapp-qrcode'
   export default {
      computed: {
@@ -225,6 +240,8 @@
            qrcodeImage:null,
            isLoadingMore: false,
            currentOrder:null,
            contanctType:0,
            linkItem:{title:'',linkname:'',linkphone:''},
            filterTabs: [
               { label: '全部'  ,value: -1},
               { label: '待支付',value: 0 },
@@ -232,23 +249,22 @@
               { label: '待配送', value: 2 },
               { label: '待收货', value: 3},
               { label: '已完成', value: 4},
               { label: '已退款', value: 5}
               { label: '已取消', value: 5}
            ],
            dataList: []
         }
      },
      watch: {
         activeTab() {
           this.getFirstPageData()
         }
      },
      // watch: {
      //    activeTab() {
      //      this.getFirstPageData()
      //    }
      // },
      onLoad(options) {
         console.log(options )
         this.activeTab = -1
         if (options.status) {
         /* if (options.status != null && options.status != undefined) {
            this.activeTab =  Number(options.status)
         }
         this.getFirstPageData()
         } */
         var that =this
         uni.$on('updateOrder',function(data){
            console.log('监听到事件来自 update ,携带参数 msg 为:' ,data);
@@ -261,6 +277,7 @@
                  if(item.id==data.info.orderId){
                      console.log('监听到事件来自 update 02:' ,data);
                     item.status = data.info.orderStatus
                     item.commentStatus = data.info.commentStatus
                  }
               }) 
            }
@@ -268,19 +285,73 @@
          })
      },
      onShow() {
         this.activeTab = -1
         this.showDone=false
         this.showCancel=false
         this.showDelete=false
         this.showQrcode=false
         this.showPay=false
         this.contanctType =0
         this.showPhone=false
         this.loading=false
         this.currentOrder=null
         this.linkItem={title:'',linkname:'',linkphone:''}
         var orderStatus = uni.getStorageSync("orderStatus");
         console.log(orderStatus,"==================")
         if (orderStatus != null &&orderStatus != undefined ) {
            if( Number(orderStatus) === -2){
               this.activeTab = 0
            } else{
               this.activeTab =  Number(orderStatus)
            }
         }
         uni.clearStorageSync("orderStatus")
         this.getFirstPageData()
      },
      onReachBottom(){
         this.getDataList();
      },
      methods: {
         changeTab(item){
             this.activeTab = item.value
             this.getFirstPageData()
         },
         payOrderFee(info){
            var that = this;
            uni.showLoading({ title: '发起支付中...', mask: true })
            this.$u.api.payOverdueFee({
               orderId: info.id
            }).then(res => {
               uni.hideLoading()
               if (res.code === 200 && res.data) {
                  let paymentData = res.data.response
                  uni.requestPayment({
                     provider: 'wxpay',
                     timeStamp: paymentData.timeStamp || '',
                     nonceStr: paymentData.nonceStr || '',
                     package: paymentData.package || '',
                     signType: paymentData.signType || 'MD5',
                     paySign: paymentData.paySign || '',
                     success: (res) => {
                        that.getFirstPageData()
                     },
                     fail: (err) => {
                        if (err.errMsg.includes('cancel')) {
                           uni.showToast({ title: '已取消支付', icon: 'none' })
                        } else {
                           uni.showToast({ title: '支付失败', icon: 'none' })
                        }
                     }
                  })
               } else {
                  uni.showToast({ title: res.msg || '支付失败', icon: 'none' })
               }
            }).catch(err => {
               uni.hideLoading()
               uni.showToast({ title: '支付失败', icon: 'none' })
            })
         },
         payOrder(item){
            var that = this;
            uni.showLoading({ title: '发起支付中...', mask: true })
@@ -335,10 +406,20 @@
               that.showDone()
            } 
         },
         contactPhone(item){
         contactPhone(item,type){
             this.showPhone = !this.showPhone
             this.linkItem = item ||{}
            this.linkItem = {title:'',linkname:'',linkphone:''}
             console.log("==================================",this.showPhone)
             if(!item){
                return
             }
            if(type == 0){
               this.linkItem = {title:'联系门店',linkname:item.depositShopName,linkphone:item.depositShopPhone}
            }else if(type ==2){
               this.linkItem = {title:'联系骑手',linkname:item.driverName,linkphone:item.driverPhone}
            }else if(type ==1){
               this.linkItem = {title:'联系门店',linkname:item.takeShopName,linkphone:item.takeShopPhone}
            }
         },
         contactPhoneDo(){ 
            if(this.linkItem.linkphone !=null && this.linkItem.linkphone!=''){
@@ -473,7 +554,12 @@
         },
         jumpOrderDetail(id){
            uni.navigateTo({
               url:'/pages/details-entry/details-entry?userType='+this.userType+'&id='+id
               url:'/pages/delivery-order-detail/delivery-order-detail?userType=0&id='+id
            })
         },
         evaluateOrder(item){
            uni.navigateTo({
               url:"/pages/evaluate/evaluate?id="+item.id
            })
         }
      }
@@ -675,9 +761,12 @@
   }
   .text-ellipsis {
      display: block;
      white-space: nowrap;
      overflow: hidden;
      text-align: center;
      text-overflow: ellipsis;
      max-width: 100%;
   }
   .city-arrow {