dnyAppTruck/pages/feedback/signOrderCode.vue

<template>
  <view class="">
    <u-sticky v-if="!signVisible"  style="background-color: white;padding: 0;">
      <uni-search-bar @confirm="searchBill" placeholder="请输入搜索内容"></uni-search-bar>
    </u-sticky>
    <uni-list style="margin-top: -20rpx">
      <uni-list-item style="margin-top: 0;padding-top: 0" v-for="(item,index) in billList" :key="item.id" :index="index" :threshold="0">
        <template slot="body">
          <uni-card>
            <view class="demo-layout">
              <view>
                <text class="tag-con">支付状态</text>
                <span>{{ item.shipmentPackageCount }}</span>{{ item.shipmentUnit }}&nbsp;&nbsp;&nbsp;&nbsp;代收金额:<span>{{ item.shipmentMoney }}</span>&nbsp;&nbsp;&nbsp;&nbsp;
              </view>
              <view>{{ item.erpOrderCode }}</view>
              <view>{{ item.clientName }}</view>
              <view>{{ item.shipmentName }}&{{item.productName}}</view>
              <view style="font-size: 28rpx">{{ item.receiveAddress }}</view>
            </view>
            <view slot="actions" class="card-actions">
              <view class="card-actions-item" @click="viewDetail(item)">
                <uni-icons type="info-filled" size="18" color="#999"></uni-icons>
                <text class="card-actions-item-text">货款代收</text>
              </view>
              <view class="card-actions-item" @click="viewOrderTrace(item,index)">
                <uni-icons type="camera-filled" size="18" color="#999"></uni-icons>
                <text class="card-actions-item-text">拍照签收</text>
              </view>
            </view>
          </uni-card>
        </template>
      </uni-list-item>
    </uni-list>
    <view v-show="isLoadMore && !signVisible">
      <uni-load-more :status="loadStatus" showIcon @clickLoadMore="loadMoreBill()"></uni-load-more>
    </view>
    <uni-fab style="bottom: 100rpx;" ref="fab" :pattern="fabPattern" icon="color" :popMenu="false" horizontal="right"
             vertical="bottom"
             @fabClick="scanFabClick"/>
  </view>
</template>

<script>
import request from '@/common/libs/request.js';

export default {
  data() {
    return {
      signVisible:false,
      fabPattern: {
        color: '#7A7E83',
        backgroundColor: '#fff',
        selectedColor: '#007AFF',
        buttonColor: '#007AFF',
        iconColor: '#fff'
      },
      billList: [],
      page: {
        pageIndex: 1,
        pageSize: 20
      },
      isLoadMore: true,
      loadStatus: 'noMore',
    }
  },
  onLoad() {
    this.getSignBillList();
  },
  created(){
    uni.$on('eventName',this.handelEvent)
  },
  onPullDownRefresh() {
    this.billList = [];
    this.getSignBillList();
  },
  methods: {
    handelEvent(data){
      this.billList.splice(data, 1)
    },
    scanFabClick() {
      //扫码
      let _that = this;
      uni.scanCode({
        onlyFromCamera: true,
        scanType: ['barCode', 'qrCode'],
        success: function (res) {
          console.log("res1212",res);
          if (res.result.indexOf('sendOrder') != -1) {
            let idOrder = res.result.split("-")[2];
            _that.truckUpOrder(idOrder)
          }else if(res.result.indexOf('orderLabel') != -1){
            let orderCode = res.result.split("-")[1];
            _that.getShipDetails(orderCode)
          }else {
            uni.showToast({
              title: "请扫正确的二维码",
              icon: 'none'
            })
          }

        }
      })
    },
    truckUpOrder(idOrder){
      let _that = this;
      let parms = {
        idOrder: idOrder
      }
      request.httpPost("/dnyDriver/signInScanSendOrder", parms, true).then(res => {
        console.log('res444',res);
      })
    },
    getShipDetails(orderCode){
      let _that = this;
      let parms = {
        orderCode: orderCode
      }
      request.httpPost("/dnyDriver/signInScanERPOrder", parms, true).then(res => {
        _that.signVisible = true;

      })
    },
    getSignBillList: function () {
      let _that = this;
      var info = {
        ltItemState: 10
      }
      let listData = {
        params: JSON.stringify(info),
        page: JSON.stringify(_that.page)
      }
      request.httpPost("/dnyDriver/driverQuerySignInItem", listData, true).then(res => {
        // console.log("res1111", res);
        uni.stopPullDownRefresh();
        if (!res.data || res.data.length == 0) {
          this.loadStatus = "noMore";
          return;
        }
        this.billList = this.billList.concat(res.data);
        this.loadStatus = "more";
        // supplierIndex = 0;
      });
    },
    searchBill(res) {
    },
    loadMoreBill: function () {
      this.loadStatus = "loading";
      setTimeout(() => {
        this.page.pageIndex += 1;
        this.getSignBillList();
      }, 100);
    },
    viewDetail: function (item) {
      // console.log(item.id);
      uni.navigateTo({
        url: "./detail?id=" + item.id + "&billCode=" + item.billCode,
        animationType: 'pop-in'
      })
    },
    parseBillState: function (item) {
      if (item.voidFlag == 1) {
        return "已作废";
      } else if (item.billState == 1) {
        return "已下达";
      } else {
        return "";
      }
    },
    viewOrderTrace: function (item,index) {
      // console.log(item.id);
      uni.navigateTo({
        url: "../feedback/traceCamera?idOrder=" + item.id + "&orderCode=" + item.erpOrderCode + "&shipmentName=" + item.shipmentName+ "&index=" + index
      });
    }
  }
}
</script>

<style lang="scss" scoped>
.tag-con {
  color: #e4493c;
  margin-right: 20rpx;
}
/deep/ .uni-list-item__container {
  padding: 0rpx;
}
.demo-layout span {
  font-weight: bold;
  color: #e4493c;
  padding: 0 5rpx;
}

/deep/ .uni-list-item__container {
  padding: 0 rpx;
}
/deep/ .uni-card uni-card--border{
  padding: 0 rpx;
}
.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: 180 rpx;
  text-align: left;
  margin-bottom: 5px;
  color: #8799a3;
}
</style>