qingyiay
2023-04-24 bb52e0d4baffe8e0486c951e525b6614bd4aaa28
pages/freight-forwarder-page/freightForwarder-index/freightForwarder-index.vue
@@ -2,7 +2,7 @@
   <view class="freightForwarder-index">
      <view class="freightForwarder-index-body">
         <u-empty mode="data" icon="http://cdn.uviewui.com/uview/empty/data.png" textSize="30" iconSize="1000" v-if="orderPlanData.length == 0"></u-empty>
         <card v-for="(item, index) in orderPlanData" :key="index" :name="item.id" @click="cardBodyClick" backgroundType="1">
         <card v-for="(item, index) in orderPlanData" :key="index" :name="item.id" @click="cardBodyClick(item)" backgroundType="1">
            <template v-slot:left>
               <view class="card-left__top">
                  <text>{{ item.carNum }}</text>
@@ -29,14 +29,95 @@
            </template>
         </card>
      </view>
      <view class="history-numbers">
         <combined-title title="历史提煤单"></combined-title>
         <scroll-view :scroll-top="scrollTop" scroll-y="true" class="scroll-Y" @scrolltolower="historyScrolltolower">
            <view class="history-information" v-for="(item, index) in historyCoalData" :key="index" @click="faYundetail(item)">
               <view class="history-sendate">
                  <text>发运日期 {{ item.sendDate || '' }}</text>
                  <view class="view-more">
                     <text style="color: #449cfc;">详情</text>
                     <view class="arrow-right"><u-icon name="arrow-right" size="40" color="#449cfc"></u-icon></view>
                  </view>
               </view>
               <view class="history-main">
                  <view class="main-left">
                     <view class="history-body">
                        <text>所属单位 {{ item.deptName || '' }}</text>
                     </view>
                     <view class="history-body">
                        <text>煤场名称 {{ item.filedName || '' }}</text>
                     </view>
                     <view class="history-body">
                        <text>煤种名称 {{ item.coalName || '' }}</text>
                     </view>
                  </view>
                  <view class="main-right">
                     <view class="history-body">
                        <text style="word-break: break-all;">订单编号 {{ item.orderCode || '' }}</text>
                     </view>
                     <view class="history-body">
                        <text>订单剩余量 {{ item.carNumSurplus || '' }}</text>
                     </view>
                     <view class="history-body">
                        <text>提煤单个数 {{ item.tmCount || '' }}</text>
                     </view>
                  </view>
               </view>
            </view>
            <view class="more_text" v-if="showMoreData && historyCoalData.length !== 0">没有数据了...</view>
         </scroll-view>
      </view>
   </view>
</template>
<script>
import combinedTitle from '@/components/combined-title/combined-title.vue';
export default {
   props: {
      indexHistoryCoalData: {
         type: Array,
         default: []
      },
      indexHuoDaiOrderPlanData: {
         type: Array,
         default: []
      }
   },
   watch: {
      indexHistoryCoalData: {
         handler(v) {
            this.historyCoalData = v;
         },
         deep: true,
         immediate: true
      },
      indexHuoDaiOrderPlanData: {
         handler(v) {
            this.orderPlanData = v;
         },
         deep: true,
         immediate: true
      }
   },
   components: {
      combinedTitle
   },
   data() {
      return {
         orderPlanData: []
         orderPlanData: [],
         historyCoalData: [],
         // 表格加载状态
         loading: false,
         scrollTop: 0,
         // 每页数据量
         pageSize: 10,
         // 当前页
         pageCurrent: 1,
         // 数据总量
         total: 0,
         // 是否显示更多数据
         showMoreData: false
      };
   },
   onShow() {
@@ -48,23 +129,56 @@
      }
   },
   methods: {
      // 获取历史提煤单
      getJhOrderPlanDataPage() {
         this.loading = true;
         this.$reqGet('getJhOrderPlanDataPage', { current: this.pageCurrent, size: this.pageSize }).then(res => {
            if (res.data.records) {
               if (this.pageCurrent > 1) {
                  this.historyCoalData = this.historyCoalData.concat(res.data.records);
                  this.historyCoalData = this.ArrSet(this.historyCoalData, 'id');
                  this.loading = false;
               } else {
                  this.historyCoalData = res.data.records;
                  this.loading = false;
               }
            }
         });
      },
      // 上拉加载
      historyScrolltolower() {
         if (this.pageCurrent * this.pageSize >= this.total) return (this.showMoreData = true);
         this.pageCurrent++;
         this.getJhOrderPlanDataPage();
      },
      //fix 点击提煤单返回会增加重复数据
      ArrSet(Arr, id) {
         var obj = {};
         const arrays = Arr.reduce((setArr, item) => {
            obj[item[id]] ? '' : (obj[item[id]] = true && setArr.push(item));
            return setArr;
         }, []);
         return arrays;
      },
      init() {
         this.huoDaiList();
         this.getJhOrderPlanDataPage();
      },
      huoDaiList() {
         this.$reqGet('huoDaiList').then(res => {
            this.orderPlanData = res.data;
         });
      },
      cardBodyClick(id) {
         let code = null;
         this.orderPlanData.forEach(item => {
            if (item.id == id) {
               code = item.code;
            }
         });
      cardBodyClick(item) {
         // let code = null;
         // this.orderPlanData.forEach(item => {
         //    if (item.orderPlanId == id) {
         //       code = item.code;
         //       id = item.orderPlanId;
         //    }
         // });
         uni.navigateTo({
            url: `/pages/customer-page/customer-index/fayunPlanDetails/fayunPlanDetails?orderPlanId=${id}&code=${code}`
            url: `/pages/customer-page/customer-index/fayunPlanDetails/fayunPlanDetails?orderPlanId=${item.orderPlanId}&code=${item.code}`
         });
      },
      // 转发
@@ -72,18 +186,75 @@
         uni.navigateTo({
            url: `/pages/public-page/forward/forward?orderPlanId=${value.orderPlanId}&carNumSurplusHuodai=${value.carNumSurplusHuodai}&carNum=${value.carNum}`
         });
      },
      // 点击历史提煤单一行获取详情
      faYundetail(v) {
         uni.navigateTo({
            url: `/pages/customer-page/customer-index/fayunPlanDetails/fayunPlanDetails?orderPlanId=${v.id}&cars2=${v.cars2}`
         });
      }
   }
};
</script>
<style lang="scss" scoped>
.scroll-Y {
   height: 900rpx;
   background-color: #e2e2e2;
   border-radius: vww(10);
   .history-information {
      width: 94%;
      display: flex;
      flex-direction: column;
      border: 1px solid #e2e2e2;
      background-color: #fff;
      border-radius: vww(10);
      margin: vww(10);
      .history-sendate {
         height: vww(40);
         border-bottom: 1px solid #e2e2e2;
         line-height: vww(40);
         padding-left: vww(8);
         position: relative;
         .view-more {
            display: flex;
            width: vww(80);
            position: absolute;
            right: vww(10);
            top: vww(-1);
            .arrow-right {
               position: absolute;
               right: vww(27);
               top: vww(12);
            }
         }
      }
      .history-main {
         min-height: vww(120);
         display: flex;
         justify-content: space-between;
         .main-left,
         .main-right {
            width: 45%;
            display: flex;
            flex-direction: column;
            justify-content: space-between;
            padding: vww(4) vww(4);
         }
      }
   }
   .more_text {
      color: #333;
      font-size: 24rpx;
      text-align: center;
   }
}
::v-deep.freightForwarder-index {
   width: 94%;
   margin: 0 auto;
   // 主体
   .freightForwarder-index-body {
      margin-bottom: vww(56);
      margin-bottom: vww(10);
      // 卡片样式
      .card-left__top {