ws增加报错关闭重连功能

qingyiay

2023-07-03 d4bffaa2419bc3e3d6b1af4a6314065c67a8cbc0

 pages/driver-page/driver-index/bill-of-lading-details/weighDetail/weighDetail.vue

@@ -1,339 +1,349 @@
<!-- 查看皮毛净明细 -->
<template>
  <view class="main">
    <u-empty mode="data"
             icon="http://cdn.uviewui.com/uview/empty/data.png"
             textSize="30"
             iconSize="1000"
             v-if="showWeigh"></u-empty>
    <view class="main-block"
          v-for="(item,i) in showWeigh"
          :key="i">
      <view class="weigh-item">
        <view class="item">
          <view class="concrete"
                style="background: url('https://mx.jzeg.cn:9095/appimg/image/banner/skin.png') no-repeat;background-size: cover;">
            皮
          </view>
          <view class="num">{{ item.skin }}</view>
        </view>
        <view class="item">
          <view class="concrete"
                style="background: url('https://mx.jzeg.cn:9095/appimg/image/banner/hair.png') no-repeat;background-size: cover;">
            毛
          </view>
          <view class="num">{{ item.hair }}</view>
        </view>
        <view class="item">
          <view class="concrete"
                style="background: url('https://mx.jzeg.cn:9095/appimg/image/banner/clean.png') no-repeat;background-size: cover;">
            净
          </view>
          <view class="num">{{ item.clean }}</view>
        </view>
      </view>
      <view class="discount">
        <view class="rate">
          <view class="label-text">
            折扣率
          </view>
          <view v-if='roleType!==1'
                class="count">{{ item.discount }}%
          </view>
          <view v-else
                class="count-input">
            <u--input placeholder="请输入折扣率"
                      border="bottom"
                      clearable
                      v-model="item.discount"
                      @input='v=>discountInputHandle(v,i,item.clean)'></u--input>
          </view>
        </view>
        <view class="weigh">
          <view class="label-text">
            折扣后重量
          </view>
          <view class="count">{{ item.discountWeight }}</view>
        </view>
      </view>
      <view class="level">
        <u-tag :text="item.level||'请选择'"
               plain
               @click="popoverShow(i)"
               v-if='item.level||roleType===1'></u-tag>
        <u-tag :text="item.productName||'请选择'"
               plain
               @click="productNamePopoverShow(i)"
               v-if='item.level||roleType===1'></u-tag>
      </view>
      <view v-if='roleType===1'>
        <u-picker :show="show"
                  :columns="columns"
                  @cancel='cancel'
                  @confirm='confirm'></u-picker>
      </view>
      <view class="">
        <u-action-sheet :actions="actionsList"
                        :show="actionShow"
                        cancelText='取消'
                        :closeOnClickOverlay='true'
                        @close='productNameClose'
                        @select="selectClick"></u-action-sheet>
      </view>
    </view>
    <view class="confirm-button"
          v-if='roleType===1'>
      <u-button type="primary"
                shape="circle"
                text="确认"
                @click="confirmInput"
                :loading="loading"
                loading-text="确认"></u-button>
    </view>
  </view>
   <view class="main">
      <u-empty mode="data"
         icon="http://cdn.uviewui.com/uview/empty/data.png"
         textSize="30"
         iconSize="1000"
         v-if="showWeigh.length===0"></u-empty>
      <view class="main-block"
         v-for="(item,i) in showWeigh"
         :key="i">
         <view class="weigh-item">
            <view class="item">
               <view class="concrete"
                  :style="{ backgroundImage: `url(${onlineurl}/appimg/image/banner/skin.png)`, backgroundSize: 'cover', backgroundRepeat: 'no-repeat' }">
                  皮
               </view>
               <view class="num">{{ item.skin }}</view>
            </view>
            <view class="item">
               <view class="concrete"
                  :style="{ backgroundImage: `url(${onlineurl}/appimg/image/banner/hair.png)`, backgroundSize: 'cover', backgroundRepeat: 'no-repeat' }">
                  毛
               </view>
               <view class="num">{{ item.hair }}</view>
            </view>
            <view class="item">
               <view class="concrete"
                  :style="{ backgroundImage: `url(${onlineurl}/appimg/image/banner/clean.png)`, backgroundSize: 'cover', backgroundRepeat: 'no-repeat' }">
                  净
               </view>
               <view class="num">{{ item.clean }}</view>
            </view>
         </view>
         <view class="discount">
            <view class="rate">
               <view class="label-text">
                  折扣率
               </view>
               <view v-if='roleType===4&&!flag'
                  class="count-input">
                  <u--input placeholder="请输入折扣率"
                     border="bottom"
                     clearable
                     v-model="item.discount"
                     @input='v=>discountInputHandle(v,i,item.clean)'></u--input>
               </view>
               <view v-else-if='flag'
                  class="count">{{ item.discount }}%
               </view>
            </view>
            <view class="weigh">
               <view class="label-text">
                  折扣后重量
               </view>
               <view class="count">{{ item.discountWeight }}</view>
            </view>
         </view>
         <view class="level">
            <u-tag :text="item.level||'请选择'"
               plain
               @click="popoverShow(i)"
               v-if='item.level||roleType===4'></u-tag>
            <u-tag :text="item.productName||'请选择'"
               plain
               @click="productNamePopoverShow(i)"
               v-if='item.level||roleType===4'></u-tag>
         </view>
         <view v-if='roleType===4'>
            <u-picker :show="show"
               :columns="columns"
               @cancel='cancel'
               @confirm='confirm'></u-picker>
         </view>
         <view class="">
            <u-action-sheet :actions="actionsList"
               :show="actionShow"
               cancelText='取消'
               :closeOnClickOverlay='true'
               @close='productNameClose'
               @select="selectClick"></u-action-sheet>
         </view>
      </view>
      <view class="confirm-button"
         v-if='roleType===4&&!flag'>
         <u-button type="primary"
            shape="circle"
            text="确认"
            @click="confirmInput"
            :loading="loading"
            loading-text="确认"></u-button>
      </view>
   </view>
</template>

<script>
import loginVue from '../../../../login/login.vue';

export default {
  data() {
    return {
      orderPlanId: "",
      index: null,
      coalDetailsData: {},
      showWeigh: [],
      discountrate: "",
      loading: false,
      show: false,
      columns: [
        ['轻质', '中质', '重质']
      ],
      level: '请选择',
      selectIndex: null,
      // 产品列表
      actionsList: [],
      actionShow: false,
      actionIndex: null
    };
  },
  computed: {
    roleType() {
      return uni.getStorageSync('roleType')
    }
  },
  onLoad(params) {
    this.orderPlanId = params.orderPlanId ? params.orderPlanId : ''
    this.index = params.index ? params.index : ''
  },
  onShow() {
    this.roleType === 1 ? this.GetOrderPlan() : this.getTakeCoal()
    this.getJcProductList()
  },
  methods: {
    getTakeCoal() {
      uni.showLoading({
        title: '加载中'
      });
      this.$reqGet('getTakeCoal', {takeCoalId: this.orderPlanId}).then(res => {
        if (res.code == 0) {
          this.coalDetailsData = res.data;
          this.showWeigh = this.coalDetailsData.tmTaskCoalItems ? this.coalDetailsData
              .tmTaskCoalItems : [],
              uni.hideLoading()
        } else {
          this.$u.toast('加载失败')
          uni.hideLoading()
        }
      })
    },
    GetOrderPlan() {
      uni.showLoading({title: '加载中...'});
      this.$reqGet('GetOrderPlan').then(res => {
        if (res.data) {
          this.coalDetailsData = res.data;
          this.showWeigh = this.coalDetailsData[this.index].tmTaskCoalItems ? this.coalDetailsData[
              this.index].tmTaskCoalItems : [],
              uni.hideLoading();
        } else {
          this.$u.toast('加载失败')
          uni.hideLoading()
        }
      });
    },
    getJcProductList() {
      this.$reqGet('getJcProductList').then(res => {
        if (res.code === 0) {
          this.actionsList = res.data.map(v => {
            return {
              ...v,
              name: v.productName
            }
          })
        }
      })
    },
    // 输入折扣率后点击确认
    confirmInput() {
      this.loading = true
      this.$reqPost('updateTmTaskCoalItem', this.showWeigh, 'json').then(
          res => {
            if (res.code == 0) {
              this.loading = false
              this.$u.toast('操作成功')
            } else {
              this.loading = false
              this.$u.toast('操作失败')
            }
          })
    },
    // 选择质量
    popoverShow(i) {
      if (this.roleType === 1) {
        this.show = true
        this.selectIndex = i
      }
    },
    // 选择产品
    productNamePopoverShow(i) {
      if (this.roleType === 1) {
        this.actionShow = true
        this.actionIndex = i
      }
    },
    confirm(e) {
      this.show = false
      this.showWeigh[this.selectIndex].level = e.value[0]
    },
    cancel() {
      this.show = false
    },
    productNameClose() {
      this.actionShow = false
    },
    selectClick(val) {
      console.log(this.showWeigh);
      this.showWeigh[this.actionIndex].productName = val.productName
      this.showWeigh[this.actionIndex].productId = val.id
    },
    // 折扣率输入
    discountInputHandle(value, index, clean) {
      this.showWeigh[index].discountWeight = (Number(value) * clean) / 100
    }
  },
}
   import { onlineurl } from '@/api/request.js'
   export default {
      data() {
         return {
            orderPlanId: "",
            coalDetailsData: {},
            showWeigh: [],
            discountrate: "",
            loading: false,
            show: false,
            columns: [
               ['轻质', '中质', '重质']
            ],
            level: '请选择',
            selectIndex: null,
            // 产品列表
            actionsList: [],
            actionShow: false,
            actionIndex: null,
            onlineurl,
            havedInput: false,
            flag: false
         };
      },
      computed: {
         roleType() {
            return uni.getStorageSync('roleType')
         }
      },
      onLoad(params) {
         this.orderPlanId = params.orderPlanId ? params.orderPlanId : ''
         this.flag = params.flag ? params.flag : false
      },
      onShow() {
         this.roleType === 1 ? this.GetOrderPlan() : this.getTakeCoal()
         this.getJcProductList()
      },
      methods: {
         getTakeCoal() {
            uni.showLoading({
               title: '加载中'
            });
            this.$reqGet('getTakeCoal', { takeCoalId: this.orderPlanId }).then(res => {
               if (res.code == 0) {
                  this.coalDetailsData = res.data;
                  this.showWeigh = this.coalDetailsData.tmTaskCoalItems ? this.coalDetailsData
                     .tmTaskCoalItems : [],
                     this.showWeigh.forEach(v => {
                        if (!v.discount) {
                           v.discount = ''
                        }
                     })
                  uni.hideLoading()
               } else {
                  this.$u.toast('加载失败')
                  uni.hideLoading()
               }
            })
         },
         GetOrderPlan() {
            uni.showLoading({ title: '加载中...' });
            this.$reqGet('GetOrderPlan').then(res => {
               if (res.data) {
                  this.coalDetailsData = res.data;
                  this.showWeigh = this.coalDetailsData[this.index].tmTaskCoals ? this.coalDetailsData[
                        this.index].tmTaskCoals : [],
                     uni.hideLoading();
               } else {
                  this.$u.toast('加载失败')
                  uni.hideLoading()
               }
            });
         },
         getJcProductList() {
            this.$reqGet('getJcProductList').then(res => {
               if (res.code === 0) {
                  this.actionsList = res.data.map(v => {
                     return {
                        ...v,
                        name: v.productName
                     }
                  })
               }
            })
         },
         // 输入折扣率后点击确认
         confirmInput() {
            this.loading = true
            this.$reqPost('updateTmTaskCoalItem', this.showWeigh, 'json').then(
               res => {
                  if (res.code == 0) {
                     this.loading = false
                     this.$u.toast('操作成功,即将返回上一页')
                     setTimeout(() => {
                        uni.navigateBack({
                           delta: 1
                        })
                     }, 800)
                  } else {
                     this.loading = false
                     this.$u.toast('操作失败')
                  }
               })
         },
         // 选择质量
         popoverShow(i) {
            console.log();
            if (this.roleType === 4 && !this.flag) {
               this.show = true
               this.selectIndex = i
            }
         },
         // 选择产品
         productNamePopoverShow(i) {
            if (this.roleType === 4 && !this.flag) {
               this.actionShow = true
               this.actionIndex = i
            }
         },
         confirm(e) {
            this.show = false
            this.showWeigh[this.selectIndex].level = e.value[0]
         },
         cancel() {
            this.show = false
         },
         productNameClose() {
            this.actionShow = false
         },
         selectClick(val) {
            this.showWeigh[this.actionIndex].productName = val.productName
            this.showWeigh[this.actionIndex].productId = val.id
         },
         // 折扣率输入
         discountInputHandle(value, index, clean) {
            this.showWeigh[index].discountWeight = ((Number(value) * clean) / 100).toFixed(2)
         }
      },
   }
</script>

<style lang="scss"
       scoped>
@mixin flex {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
   scoped>
   @mixin flex {
      display: flex;
      justify-content: space-between;
      align-items: center;
   }

/deep/ .u-picker {
  height: 600 rpx;
}
   /deep/ .u-picker {
      height: 600rpx;
   }

.main {
  width: 100%;
  height: 100vh;
  background-color: #fff;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
   .main {
      width: 96%;
      height: 100%;
      min-height: 400rpx;
      background-color: #fff;
      margin: 10rpx auto;
      display: flex;
      flex-direction: column;

  .main-block {
    width: 690 rpx;
    height: 360 rpx;
    margin: vww(20) auto;
    padding: vww(5);
    background: #ffffff;
    box-shadow: 4 rpx 6 rpx 51 rpx 0 rpx rgba(73, 120, 240, 0.11);
    border-radius: 20 rpx;
    overflow: hidden;
    position: relative;
      .main-block {
         width: 690rpx;
         height: 360rpx;
         margin: vww(20) auto;
         padding: vww(5);
         background: #ffffff;
         box-shadow: 4rpx 6rpx 51rpx 0rpx rgba(73, 120, 240, 0.11);
         border-radius: 20rpx;
         overflow: hidden;
         position: relative;

    .weigh-item {
      width: 100%;
      height: vww(36);
      margin: vww(10);
      @include flex;
      justify-content: space-around;
         .weigh-item {
            width: 100%;
            height: vww(36);
            margin: vww(10);
            @include flex;
            justify-content: space-around;

      .item {
        min-width: vww(50);
        height: vww(45);
        font-size: 21 rpx;
        font-weight: 400;
        color: #ffffff;
        text-align: center;
        line-height: vww(30);
        @include flex;
            .item {
               min-width: vww(50);
               height: vww(45);
               font-size: 21rpx;
               font-weight: 400;
               color: #ffffff;
               text-align: center;
               line-height: vww(30);
               @include flex;

        .concrete {
          width: vww(36);
          height: vww(36);
        }
               .concrete {
                  width: vww(36);
                  height: vww(36);
               }

        .num {
          font-size: 40 rpx;
          font-weight: 300;
          color: #303030;
        }
      }
    }
               .num {
                  font-size: 40rpx;
                  font-weight: 300;
                  color: #303030;
               }
            }
         }

    .discount {
      @include flex;
      justify-content: space-around;
      width: 100%;
      line-height: vww(36);
         .discount {
            @include flex;
            justify-content: space-around;
            width: 100%;
            line-height: vww(36);

      .rate,
      .weigh {
        width: 50%;
        display: flex;
        align-items: center;
        justify-content: space-around;
        flex-direction: column;
            .rate,
            .weigh {
               width: 50%;
               display: flex;
               align-items: center;
               justify-content: space-around;
               flex-direction: column;

        .count-input {
          width: 70%;
          border-bottom: 1px solid rgb(218, 219, 222);
               .count-input {
                  width: 70%;
                  border-bottom: 1px solid rgb(218, 219, 222);

        }
      }
               }
            }

      .count {
        font-size: 40 rpx;
        color: rgb(242, 70, 79);
      }
            .count {
               font-size: 40rpx;
               color: rgb(242, 70, 79);
            }

    }
         }

    .level {
      width: 40%;
      margin-top: 30 rpx;
      margin-left: 80 rpx;
      display: flex;
      justify-content: space-between;
    }
         .level {
            width: 40%;
            margin-top: 30rpx;
            margin-left: 80rpx;
            display: flex;
            justify-content: space-between;
         }

  }
      }

  .confirm-button {
    // position: relative;
    // bottom: 10rpx;
    // right: 10rpx;
    width: 100%;
    @include flex;
    justify-content: center;
      .confirm-button {
         width: 100%;
         @include flex;
         justify-content: center;
         margin-bottom: 40rpx;

    /deep/ .u-button {
      width: 180 rpx !important;
    }
  }
}
         /deep/ .u-button {
            width: 180 rpx !important;
         }
      }
   }
</style>