优化

MrShi

2025-08-21 a223d5e29e9384f720ae98c44cbe10f8fa4f73e7

 small-program/pages/order-details/order-details.vue

@@ -10,16 +10,20 @@
      <view class="order-quxiao">
         <view class="order-quxiao-btn" @click="show = true" v-if="userInfo.id === info.acceptMemberId && info.status ===2">取消订单</view>
         <view class="order-quxiao-btn" @click="show = true" v-if="userInfo.id === info.releaseMemberId && (info.status ===0 ||  info.status ===1|| info.status ===2)">取消订单</view>
         <view class="order-quxiao-btn1" v-if="userInfo.id === info.releaseMemberId && (info.status ===0 ||  info.status ===1|| info.status ===2)" @click="jumpEdit()">修改订单</view>
      </view>
      <view class="order-user"  v-if="userInfo.id === info.releaseMemberId">
         <view class="order-user-info">
            <view class="user-info-l">
               <view class="user-info-l-image">
                  <image v-if="info.acceptCoverImage" :src="info.acceptCoverImage" mode="widthFix"></image>
                  <image v-else src="/static/logo.png" mode="widthFix"></image>
                  <image v-else src="/static/icon/img@2x.png" mode="widthFix"></image>
               </view>
               <view class="user-info-l-i">
                  <view class="user-info-l-i-top">{{info.acceptName || '匿名'}}</view>
                  <view class="user-info-l-i-top">
                     <text>{{info.acceptName || '匿名'}}</text>
                     <view class="user-info-l-i-top-jdf">接单方</view>
                  </view>
                  <view class="user-info-l-i-bottom">
                     <view class="user-info-l-i-bottom-item">
                        <text>评分：</text>
@@ -58,12 +62,12 @@
         <view class="order-info-address">
            <image src="/static/icon/order_ic_time@2x.png" mode="widthFix"></image>
            <view class="order-info-address-info">
               <text>{{info.startDate || ''}}-{{info.endDate || ''}}({{info.totalDays||0}}天)</text>
               <text>{{info.startDate || ''}}{{' 至 '}}{{info.endDate || ''}}({{info.totalDays||0}}天)</text>
            </view>
         </view>
         <view class="address" v-if="info.type===1 && wayList && wayList.length>0">
            <view class="address-xian"></view>
            <view class="address-row"  v-for="(item,index) in wayList" style="display: block;margin: 10px" :key="'bbb'+index">
            <view class="address-row"  v-for="(item,index) in wayList" style="display: block;margin: 10px" :key="index">
               <image v-if="index === 0" src="/static/icon/ic_qidian@2x.png" mode="widthFix"></image>
               <image v-if="index >0 && index < wayList.length-1" src="/static/icon/ic_jingguo@2x.png" mode="widthFix"></image>
               <image v-if="index === wayList.length-1" src="/static/icon/ic_zhongdian@2x.png" mode="widthFix"></image>
@@ -113,10 +117,10 @@
         <view class="order-ren-left">
            <view class="order-ren-left-img">
               <image v-if="info.releaseCoverImage" :src="info.releaseCoverImage" mode="widthFix"></image>
               <image v-else src="/static/logo.png" mode="widthFix"></image>
               <image v-else src="/static/icon/img@2x.png" mode="widthFix"></image>
            </view>
            <text>{{info.releaseName || '匿名'}}</text>
            <view class="order-ren-left-tip">发单方</view>
            <view class="order-ren-left-tip">业主</view>
         </view>
         <view class="order-ren-x"></view>
         <view class="order-ren-lx"  @click="contactPhone(info.releasePhone)">
@@ -129,51 +133,54 @@
            <text>订单信息</text>
         </view>
         <view class="order-info-list">
            <view class="order-info-list-item">
            <view class="order-info-list-item" v-if="info.code">
               <text>订单编号：</text>
               <text>{{info.code || ''}}</text>
            </view>
            <view class="order-info-list-item">
            <view class="order-info-list-item" v-if="info.createTime">
               <text>下单时间：</text>
               <text>{{info.createTime||'-'}}</text>
            </view>
            <view class="order-info-list-item">
            <view class="order-info-list-item" v-if="info.acceptTime">
               <text>接单时间：</text>
               <text>{{info.acceptTime||'-'}}</text>
            </view>
            <view class="order-info-list-item">
            <view class="order-info-list-item" v-if="info.workStartTime">
               <text>开始时间：</text>
               <text>{{info.workStartTime||'-'}}</text>
            </view>
            <view class="order-info-list-item">
            <view class="order-info-list-item" v-if="info.finishTime">
               <text>完成时间：</text>
               <text>{{info.finishTime||'-'}}</text>
            </view>
            <view class="order-info-list-item">
            <view class="order-info-list-item" v-if="info.payTime">
               <text>支付时间：</text>
               <text>{{info.payTime||'-'}}</text>
            </view>
            <view class="order-info-list-item">
            <view class="order-info-list-item" v-if="info.payMethod && info.payMethod >= 0">
               <text>支付方式：</text>
               <text>{{info.payMethod==0?'微信支付':'-'}}</text>
            </view>
            <view class="order-info-list-item">
            <view class="order-info-list-item" v-if="info.wxExternalNo">
               <text>交易单号：</text>
               <text>{{info.wxExternalNo || '-'}}</text>
            </view>
         </view>
      </view>
      <view style="width: 100%; height: calc(108rpx + env(safe-area-inset-bottom));"></view>
      <view class="order-footer">
         <view class="order-footer-btn"> 
      <view style="width: 100%; height: calc(108rpx + env(safe-area-inset-bottom));" v-if="![99].includes(info.status)"></view>
      <view class="order-footer" v-if="![99].includes(info.status)">
         <template v-if="(userInfo.id === info.releaseMemberId) && info.status ===2">
            <sunui-mverify hint="开始作业" @change="getaccept($event)"></sunui-mverify>
         </template>
         <view class="order-footer-btn" v-else> 
            <view class="order-footer-btn-a" @click="show = true" v-if="userInfo.id === info.acceptMemberId && info.status ===2">取消订单</view>
            <view class="order-footer-btn-a" @click="show = true" v-if="userInfo.id === info.releaseMemberId && (info.status ===0 ||  info.status ===1|| info.status ===2)">取消订单</view>
            <view class="order-footer-btn-b" @click="show2=true" v-if="userInfo.id === info.releaseMemberId && (info.status ===4 && info.commentStatus!=1)">去评价</view>
            <view class="order-footer-btn-b" v-if="userInfo.id === info.releaseMemberId &&((info.status ===3 && info.type !==2)|| (info.status ===0 && info.type===2))" @click="show1 = true">去支付</view>
            <view class="order-footer-btn-b" v-if="userInfo.id === info.releaseMemberId &&((info.status ===3 && info.type !==2)|| (info.status ===0 && info.type===2))" @click="show1 = true">完成并支付</view>
            <view class="order-footer-btn-b" v-if="userInfo.id === info.releaseMemberId && (info.status ===0 ||  info.status ===1|| info.status ===2)" @click="jumpEdit()">修改订单</view>
            <view class="order-footer-btn-b" @click="show5 =true" v-if="userInfo.id === info.releaseMemberId && (info.isUpdate==1 && info.status ===2)">修改确认</view>
            <view class="order-footer-btn-b" @click="show3 =true" v-if="userInfo.id === info.releaseMemberId && (info.status ===2)">开始作业</view>
            <view class="order-footer-btn-b"  @click="show4 =true" v-if="userInfo.id !== info.releaseMemberId && (info.status ===1)">抢单</view>
            <view class="order-footer-btn-b" @click="show5 =true" v-if="userInfo.id === info.acceptMemberId && (info.isUpdate==1 && info.status ===2)">修改确认</view>
            <view class="order-footer-btn-b" @click="startJobs()" v-if="userInfo.id === info.releaseMemberId && (info.status ===2)">开始作业</view>
            <view class="order-footer-btn-b"  @click="show6 =true" v-if="userInfo.id !== info.releaseMemberId && (info.status ===1)">抢单</view>
         </view>
         <view style="width: 100%; height: env(safe-area-inset-bottom);"></view>
      </view>
@@ -208,7 +215,7 @@
      </u-modal>
      <u-modal
         title="温馨提示"
         :show="show5"
         :show="show6"
         closeOnClickOverlay
         showCancelButton
      >
@@ -216,7 +223,7 @@
            确认抢单吗？
         </view>
         <view slot="confirmButton" style="display: flex; justify-content: space-between; align-items: center; width: 100%;">
            <view class="btn1" @click="show4 = false">我再想想</view>
            <view class="btn1" @click="show6 = false">我再想想</view>
            <view class="btn2" @click="acceptDo">确认接单</view>
         </view>
      </u-modal>
@@ -231,7 +238,9 @@
         </view>
         <view slot="confirmButton" style="display: flex; justify-content: space-between; align-items: center; width: 100%;">
            <view class="btn1" @click="show5=false">我再想想</view>
            <view class="btn2" style="color: red;" @click="confirmUpdDo(1)">不同意</view>
            <view style="width: 20rpx; height: 100%;"></view>
            <view class="btn2" style="background-color: #f56c6c; color: #ffffff;" @click="confirmUpdDo(1)">不同意</view>
            <view style="width: 20rpx; height: 100%;"></view>
            <view class="btn2" @click="confirmUpdDo(0)">同意</view>
         </view>
      </u-modal>
@@ -283,6 +292,7 @@

<script>
   import { mapState } from 'vuex'
   import sunuiMverify from '@/components/sunui-mverify/sunui-mverify.vue';
   export default {
      computed: {
         ...mapState( ['userInfo'])
@@ -296,6 +306,7 @@
            show3:false,
            show4:false,
            show5:false,
            show6:false,
            value:0,
            wayList:[],
            bgImg: require('@/static/image/bg_green@2x.png'),
@@ -313,6 +324,24 @@
         this.getOrderData()
      },
      methods:{
         getaccept(e) {
            if (!e.msg) return;
            this.$u.api.begin({ orderId: this.info.id })
               .then(res => {
                  if (res.code === 200) {
                     this.getOrderData()
                  }
               })
         },
         // 开始作业
         startJobs() {
            this.$u.api.begin({ orderId: this.info.id })
               .then(res => {
                  if (res.code === 200) {
                     this.getOrderData()
                  }
               })
         },
         // 修改
         jumpEdit() {
            if (this.info.type === 0 && this.info.workType === 0) {
@@ -412,11 +441,15 @@
         confirmUpdDo(status){
            var that = this
            var param = {orderId: this.id,status:status}
            this.$u.api.confirmUpdDo(param).then(res =>{
            this.$u.api.confirmUpd(param).then(res =>{
               if(res.code ===200){
                  that.show5=false
                  uni.showToast({ title: '确认成功', icon: 'error', duration: 2000 });
                  that.getOrderData()
                  if(status==1){
                     uni.navigateBack({ delta: 1 })
                  }else{
                     that.getOrderData()
                  } 
               }
            }) 
         },
@@ -425,7 +458,7 @@
            var param = {orderId: this.id}
            this.$u.api.accept(param).then(res =>{
               if(res.code ===200){
                  that.show4=false
                  that.show6=false
                  uni.showToast({ title: '抢单成功', icon: 'error', duration: 2000 });
                  that.getOrderData()
               }
@@ -438,15 +471,19 @@
               if(res.code ===200){
                  that.show=false
                  uni.showToast({ title: '订单取消成功', icon: 'error', duration: 2000 });
                  that.getOrderData()
                  if(that.userInfo.id !== that.info.releaseMemberId){
                     uni.navigateBack({ delta: 1 })
                  }else{
                     that.getOrderData()
                  } 
               }
             }) 
         },
         previemImg(src){
            uni.previewImage({
               current: src, // 当前显示图片的http链接
               urls: [src] // 需要预览的图片http链接列表
              });
               current: src,
               urls: [src]
            });
         },
         contactPhone(phone){
            if(phone !=null && phone!=''){
@@ -1005,9 +1042,26 @@
                  flex-direction: column;
                  justify-content: space-between;
                  .user-info-l-i-top {
                     font-weight: 400;
                     font-size: 30rpx;
                     color: #222222;
                     width: 100%;
                     display: flex;
                     align-items: center;
                     text {
                        font-weight: 400;
                        font-size: 30rpx;
                        color: #222222;
                     }
                     .user-info-l-i-top-jdf {
                        width: 96rpx;
                        height: 42rpx;
                        line-height: 42rpx;
                        text-align: center;
                        font-weight: 400;
                        font-size: 24rpx;
                        color: #FF7200;
                        border-radius: 8rpx;
                        border: 2rpx solid #FD9E24;
                        margin-left: 10rpx;
                     }
                  }
                  .user-info-l-i-bottom {
                     display: flex;
@@ -1072,6 +1126,18 @@
            border-radius: 34rpx;
            border: 1rpx solid #B2B2B2;
         }
         .order-quxiao-btn1 {
            width: 160rpx;
            height: 64rpx;
            line-height: 64rpx;
            text-align: center;
            border-radius: 34rpx;
            font-weight: 400;
            font-size: 28rpx;
            color: #00BC12;
            margin-left: 20rpx;
            border: 1rpx solid #00BC12;
         }
      }
   }
   .address {