dnyAppTruck/pages/feedback/print.vue

<template>
  <view style="padding-bottom:118rpx;">
    <uni-list :border="false">
      <view v-if="branchLineName" class="branch-tit">{{branchLineName}}-{{deliveryBillCode}}</view>
      <uni-list-item v-for="(item,index) in breedTaskList" :key="item.id" :index="index" :threshold="0">
        <template slot="body">
            <uni-card>
              <u-row>
                <u-col span="12">
                  <view class="demo-layout">
                    <view><span>{{item.shipmentPackageCount}}</span>{{item.shipmentUnit}}</view>
                    <view>{{item.erpOrderCode}}</view>
                    <view>{{item.shipmentName}}</view>
                    <view style="font-size: 28rpx">{{item.receiveAddress}}</view>
                  </view>
                </u-col>
              </u-row>
            </uni-card>
        </template>
      </uni-list-item>
    </uni-list>
    <view class="footer">
      <view>
        <view style="padding: 10rpx 0">
          <text class="footer-text">包&nbsp;&nbsp;&nbsp;&nbsp;数：<span>{{totalUnit}}</span></text><br>
          <text class="footer-text">订单数：<span>{{breedTaskList.length}}</span></text>
        </view>
      </view>
      <view @click="confirmOrderCodes">确认交接</view>
    </view>

    <uni-fab style="bottom: 100rpx;" ref="fab" :pattern="fabPattern" icon="color" :popMenu="false" horizontal="right" vertical="bottom"
             @fabClick="scanFabClick" />
    <u-loading-page :loading="loading"></u-loading-page>
  </view>
</template>

<script>
import request from '@/common/libs/request.js';
export default {
  data() {
    return {
      token:"",
      loading:false,
      branchLineName:'',
      deliveryBillCode:'',
      totalUnit:0,
      fabPattern: {
        color: '#7A7E83',
        backgroundColor: '#fff',
        selectedColor: '#007AFF',
        buttonColor: '#007AFF',
        iconColor: '#fff'
      },
      breedTaskList: []
    }
  },
  mounted() {
    this.initData()
  },
  methods: {
    confirmOrderCodes(){
      let _that = this;
      var ids = [];
      if(_that.breedTaskList.length<=0){
        uni.showToast({
          title: "请先扫码",
          icon: 'none'
        })
        return
      }
      _that.loading = true;
      for (let i = 0; i < _that.breedTaskList.length; i++) {
        ids.push(_that.breedTaskList[i].id)
      }
      let parms = {
        idBillItems: ids.join(','),
        token: _that.token
      }
      request.httpPost("/dnyDriver/handOverBillItems", parms, true).then(res => {
        _that.loading = false;
        _that.initData()
        if (res.httpCode == 200) {
          _that.breedTaskList = [];
          _that.branchLineName = "";
          _that.deliveryBillCode = "";
          _that.totalUnit=0;
          uni.showToast({
            title: "交接成功",
          })
        }else {
          uni.showToast({
            title: res.msg,
            icon: 'none',
            mask: true,
            duration: 3000,
          })
        }
      });
    },
    initData(){
      let _that = this;
      request.httpPost("/dnyDriver/driverFormToken", {},true).then(tokenRes => {
        _that.token = tokenRes.data
      })
    },
    scanFabClick() {
      let _that = this;
      uni.scanCode({
        onlyFromCamera: true,
        scanType: ['barCode', 'qrCode'],
        success: function(res) {
          // console.log(res);
          if (res.result.indexOf('dnySendBill') != -1) {
            let qrCode = res.result
            _that.truckUpOrder(qrCode)
          }else {
            uni.showToast({
              title: "请扫送货单的码",
              icon: 'none'
            })
          }

        }
      })
    },
    truckUpOrder(qrCode){
      let _that = this;
      _that.loading = true;
      let parms = {
        qrCode: qrCode
      }
      request.httpPost("/dnyDriver/handOverScanBillBranch", parms, true).then(res => {
        // console.log("25111",res);
        _that.loading = false
        _that.breedTaskList = [];
        _that.totalUnit = 0;
        if(res.httpCode==200){
          var datas = res.data;
          _that.branchLineName = datas[0].branchLineName
          _that.deliveryBillCode = datas[0].deliveryBillCode
          for (let i = 0; i < datas.length; i++) {
            var items = datas[i]
            var itemData = {
              'erpOrderCode':items.erpOrderCode,//发货单号
              'receiveAddress':items.receiveAddress,
              'shipmentPackageCount':items.shipmentPackageCount,
              'shipmentUnit':items.shipmentUnit,
              'shipmentName':items.shipmentName,
              'id':items.id
            }
            _that.totalUnit+=items.shipmentPackageCount
            _that.breedTaskList.push(itemData)
          }
        }else {
          uni.showToast({
            title: res.msg,
            icon: 'none',
            mask: true,
            duration: 4000,
          })
        }
      })
    },
    deleteBtn(index){
      this.totalUnit = this.totalUnit-this.breedTaskList[index].shipmentPackageCount
      this.breedTaskList.splice(index, 1)
    },
  }
}
</script>

<style lang="scss" scoped>
.branch-tit{
  font-size: 36rpx;
  margin-left: 10rpx;
  padding-top: 20rpx;
}
.footer-text{
  line-height: 18rpx;
}
.footer-text span{
  font-weight: bold;
  color: #e4493c;
}
.demo-layout span{
  font-weight: bold;
  color: #e4493c;
  padding: 0 5rpx;
}
.span-txt{
  font-weight: bold;
  color: #e4493c;
}
.demo-layout{
  font-size: 36rpx;
}
/deep/ .uni-card .uni-card__header{
  border-bottom: none !important;
}
/deep/ .uni-list-item__container {
  padding: 0rpx;
}
/deep/ .fab{
  .uniui-plusempty:before {
    //content: "\e67b";
    content: '\e654' !important;
  }
}
.card-actions {
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  align-items: center;
  height: 45px;
  border-top: 1px #eee solid;
}

.card-actions-item {
  display: flex;
  flex-direction: row;
  align-items: center;
}

.card-actions-item-text {
  font-size: 12px;
  color: #666;
  margin-left: 5px;
}

.textTitle {
  border-left: 0px solid #007AFF;
  display: inline-block;
  width: 180rpx;
  text-align: left;
  margin-bottom: 5px;
  color: #8799a3;
}

.u-popup-slot {
  width: 750rpx;
  height: 400px;
  @include flex;
  justify-content: center;
  align-items: center;
  padding: 20px;
}
.footer {
  position: fixed;
  bottom: 0;
  z-index: 10;
  display: flex;
  justify-content: space-between;
  width: 100%;
  height: 108rpx;
  background: #FFFFFF;
  border-top: 1px solid #E8E8E8;

  >view {
    width: 50%;
    height: 100%;
    font-size: 34rpx;
    font-weight: 600;
    display: flex;
    justify-content: center;
    align-items: center;

    &:active {
      opacity: 0.8;
    }

    .cart {
      width: 67rpx;
      height: 67rpx;
      margin-top: 10rpx;
      margin-right: 25rpx;
    }

    .amout {
      font-size: 34rpx;

      >text {
        font-size: 20rpx;
      }
    }

    .badge {
      position: relative;

      >text {
        position: absolute;
        top: 2rpx;
        right: 10rpx;
        z-index: 10;
        font-size: 22rpx;
        background: #FF3D00;
        border-radius: 50%;
        color: #fff;
        padding: 0 10rpx 2rpx;
      }
    }
  }
  >view:last-child {
    background: #FFD202;
  }
}
</style>