819527061@qq.com
2024-06-11 7f482f8e9e8b4900a890b571c75a02efc1bd25cc
pages/customer-page/customer-my/faYunstatistics/faYunstatistics.vue
@@ -29,17 +29,27 @@
                        size="50"></u-icon></view>
               </view>
            </view>
            <view class="filter-condition"></view>
            <view class="filter-condition">
            </view>
            <view class="date-information">
               <u-empty mode="data"
                  icon="http://cdn.uviewui.com/uview/empty/data.png"
                  textSize="30"
                  iconSize="1000"
                  text="暂无数据"
                  v-if="filterList.length == 0"></u-empty>
                  <scroll-view
                  scroll-y
                  class="scroll-box"
                  :throttle="false"
                  @scrolltolower="handleScrolltolower">
               <view class="statistics-card"
                  v-for="(item, index) in filterList"
                  v-for="(item, index) in  pageList"
                  :key="index">
                  <view class="card-top">
                  <statisticsItem :item="item"></statisticsItem>
                  <!-- <view class="card-top">
                     <view class="left"><combined-title :title="item.condition"></combined-title></view>
                     <view class="card-top_num">
                        {{ item.taskCoalList.length }}车
@@ -49,8 +59,8 @@
                                            return prev + cur.clean;
                                        }, 0)).toFixed(2)}}吨
                     </view>
                  </view>
                  <view class="card-main"
                  </view> -->
                  <!-- <view class="card-main"
                     v-for="(value, i) in item.taskCoalList"
                     :key="i"
                     @click="faYunDetail(value.id)">
@@ -85,12 +95,10 @@
                           <view class="coal-type"
                              v-if="value.orderType">{{ value.orderType }}</view>
                        </view>
                        <!-- <view class="black-block"><view class="black-bar"></view></view>
                        <view class="coal-type">{{ value.orderType }}</view> -->
                     </view>
                     <view class="third-line">
                        <view class="carnum-icon">
                           <image src="https://mx.jzeg.cn:9095/appimg/image/banner/carNO.png"
                           <image src="https://mx.jzeg.cn:9096/appimg/image/banner/carNO.png"
                              mode="widthFix"></image>
                        </view>
                        <view class="carnum-text">{{ value.carNo || '' }}</view>
@@ -101,8 +109,9 @@
                              size="28"></u-icon></view>
                        <view class="send-date">{{ value.sendDate }}</view>
                     </view>
                  </view>
                  </view> -->
               </view>
            </scroll-view>
            </view>
         </view>
         <u-popup :show="conditinonShow"
@@ -264,6 +273,9 @@
                     :plain="true"
                     shape="circle"
                     @click="resetCondition"></u-button></view>
                     <view class="f-button">
                  <u-button type="primary" :size="'mini'" shape="circle"    @click="download" text="导出详情"></u-button>
               </view>
               <view class="confirm-button"><u-button type="primary"
                     text="确定"
                     :plain="true"
@@ -279,6 +291,7 @@
<script>
   import BigNumber from "bignumber.js"
   import { BaseUrl } from '@/api/publicInterface.js'
   import combinedTitle from '@/components/combined-title/combined-title.vue';
   export default {
      components: {
@@ -293,6 +306,13 @@
            forwarderList: [],
            fleetList: [],
            filedList: [],
            btndisbled:false,
            page:{
               size:5,
               current:1,
               total:1,
            },
            carNoList: [],
            isactive: false,
            info: {
@@ -309,11 +329,23 @@
            filterList: [],
            totalLength: 0,
            totalTon: 0,
            pageFlag:false, // 是否需要分页
            // 筛选弹出层
            conditinonShow: false,
            // 超过两行自动隐藏
            coalShow: 3,
            typeShow: 3,
            filterParams:{
               coalName:'',//煤种
               xsUserIdTwo:'',//货代
               fleetId:'', // 车队
               deptId:'',//单位
               customerId:'' ,// 客户
               carNo:'',//车牌
               startTime:'',//起始时间
               endTime:'',//结束时间
            },
            customerShow: 3,
            forwarderShow: 3,
            fleetShow: 3,
@@ -326,11 +358,12 @@
            fleetToggeleState: false,
            filedToggeleState: false,
            carNoToggeleState: false,
            pageList:[],
            // 点击右箭头详情弹窗
            faYunDetailobj: {},
            modalShow: false,
            coalStatus: ['领取', '预约', '签到', '入场', '称皮', '称毛', '离场', '入磅房', '出磅房', '入煤仓', '出煤仓', '放空', '作废', '入场申请',
               '进入场院', '异常审核中'
               '进入场院', '异常审核中', '返回加减吨', '超时', '打印中', '打印中', '填写'
            ]
         };
      },
@@ -422,11 +455,31 @@
         },
         // 获取数据
         getTmTaskCoalData() {
            this.page.current = 1; //还原分页
            this.filterList =  [],this.pageList = [];
            uni.showLoading({
               title: '加载中'
            });
            this.$reqGet('getTmTaskCoalData', { startTime: this.first, endTime: this.last }).then(res => {
               this.filterList = this.taskList = res.data;
                this.taskList = res.data;
               // 滚动加载  分页
               if(res.data.length <=5){
                  this.filterList = res.data;
                  this.pageList = res.data;
                  this.pageFlag = false
               }else{
                  //大于等于 5 的情况就得分页
                  this.pageFlag = true;
                  this.filterList = res.data;
                  this.loadMorePage();
                  //   // 分页的起始下标
                  //  const startIndex = (this.page.current - 1) * this.page.size;
                  // // 分页的末尾下标
                  // const endIndex = startIndex + this.page.size;
                  // // 返回切割后的数据
                  // this.filterList =  this.filterList.concat(this.filterList.slice(startIndex, endIndex))
                  // this.page.total =  Math.ceil(this.filterList.length / this.page.size);
               }
               if (this.filterList.length != 0) {
                  this.totalLength = this.filterList.map(v => v.taskCoalList.length).reduce((x, y) => x + y);
                  this.totalTon = this.filterList.map(v =>
@@ -486,7 +539,7 @@
               customerName: this.customerList.filter(v => v.active == true).map(item => item.condition),
               xsUser2Name: this.forwarderList.filter(v => v.active == true).map(item => item.condition),
               fleetName: this.fleetList.filter(v => v.active == true).map(item => item.condition),
               filedName: this.filedList.filter(v => v.active == true).map(item => item.condition),
               deptName: this.filedList.filter(v => v.active == true).map(item => item.condition),
               carNo: this.carNoList.filter(v => v.active == true).map(item => item.condition)
            };
@@ -496,7 +549,7 @@
               customerName: validateFn('customerName'),
               xsUser2Name: validateFn('xsUser2Name'),
               fleetName: validateFn('fleetName'),
               filedName: validateFn('filedName'),
               deptName: validateFn('deptName'),
               carNo: validateFn('carNo')
            };
            this.filterList = this.taskList.map(val => {
@@ -508,6 +561,8 @@
                     mapping[key](v, conditionMapping[key])))
               };
            });
            this.pageList = this.filterList;//赋值给分页数组
            this.pageFlag = false;
            if (this.filterList.length != 0) {
               this.totalLength = this.filterList.map(v => v.taskCoalList.length).reduce((x, y) => x + y);
               this.totalTon = this.filterList.map(v =>
@@ -553,15 +608,54 @@
            this.filedList.forEach(v => {
               v.active = false;
            });
        this.getTmTaskCoalData()
         },
         confirm(e) {
            console.log(e, '日期选择');
            this.first = e.range.before;
            this.last = e.range.after;
            this.conditinonShow = false;
        this.$nextTick(() => {
          this.$refs.calendar.close()
        })
         },
         opencalendar() {
            this.$refs.calendar.open();
         },
         loadMorePage(){
              // 分页的起始下标
                   const startIndex = (this.page.current - 1) * this.page.size;
                  // 分页的末尾下标
                  const endIndex = startIndex + this.page.size;
                  // 返回切割后的数据
                  this.pageList.push(...this.filterList.slice(startIndex, endIndex))
                  this.page.total =  Math.ceil(this.filterList.length / this.page.size);
         },
         handleScrolltolower(){
            console.log('到底了')
               uni.showLoading({
               title: '加载中'
            });
            if(this.pageFlag){
               if(this.page.current  < this.page.total){
                   this.page.current = this.page.current + 1;
                   this.loadMorePage();
                   console.log( this.page.current + 1,this.page.total,' this.page.current+1;')
               }else {
                  uni.showToast({
                  title: '已经到底啦',
                    duration: 1000
               });
               }
               // this.getTmTaskCoalData()
            }
            setTimeout(() => {
               uni.hideLoading();
            }, 0);
         },
         // 点击查看更多
         toggle(value) {
@@ -644,6 +738,70 @@
         // 关闭筛选条件弹窗
         conditinonclose() {
            this.conditinonShow = false;
         },
         download(){
            let conditionMapping = {
               coalName: this.coalList.filter(v => v.active == true).map(item => item.condition).join(','), //煤种
               customerId: this.customerList.filter(v => v.active == true).map(item => item.conditionId).join(','), //  客户
               xsUserIdTwo: this.forwarderList.filter(v => v.active == true).map(item => item.conditionId).join(','), //货代
               fleetId: this.fleetList.filter(v => v.active == true).map(item => item.conditionId).join(','),  //车队
               deptId: this.filedList.filter(v => v.active == true).map(item => item.conditionId).join(','), //矿场
               carNo: this.carNoList.filter(v => v.active == true).map(item => item.condition).join(','), //车牌
               startTime:this.first + ' ' + '00:00:00',
               endTime:this.last + ' ' + '23:59:59',
            };
            //如果请求参数没值,则去除
            Object.keys(conditionMapping).forEach(item=>{
               if(!conditionMapping[item]){
                  delete conditionMapping[item]
               }
            })
            uni.showLoading({
               title: '加载中',
               mask:true,
               });
               this.$reqGet('downloadExcel',conditionMapping).then(res=>{
                  if(res.data){
                     const hostUrl = res.data.excelAddress.split("/")[res.data.excelAddress.split("/").length - 1]
                     // const hostUrl = res.data.excelAddress;
                     console.log(res.data,hostUrl,'res.data');
                     if(hostUrl){
                        wx.downloadFile({
                        url: `${BaseUrl}/admin/sys-file/local/${hostUrl}`,
                        filePath:wx.env.USER_DATA_PATH+`/${hostUrl}`,
                        header: {
                           Authorization: 'Bearer' + ' ' + uni.getStorageSync('token'),
                           CLIENT_TOC: 'Y'
                        },
                        success(res){
                           console.log(res)
                           let data = res.filePath;
                           wx.openDocument({
                           filePath: data,
                           fileType: 'xlsx',
                           showMenu: true  //表示右上角是否有转发按钮
                           })
                           uni.hideLoading();
                        }
               })
                     }
                     uni.hideLoading();
                  }else{
                     uni.hideLoading();
                     uni.showToast({
                        icon: 'none',
                        title: '所选条件暂无数据'
                     })
                  }
               }).catch((err) => {
                  uni.hideLoading();
               })
         }
      },
      computed: {
@@ -685,6 +843,7 @@
               this.first = newV.slice(0, 10);
               this.last = newV.slice(11);
               this.getTmTaskCoalData();
               this.getShipping();
            }
         }
      }
@@ -710,7 +869,9 @@
   ::v-deep .toggle-button .u-button {
      width: vww(40);
   }
    .scroll-box{
      height: 1500rpx;
   }
   .scroll-Y {
      height: 1000rpx;
      position: relative;
@@ -718,10 +879,11 @@
   }
   .utils-button {
      width: 94%;
      width: 100%;
      height: vww(30);
      margin: vww(50) auto;
      @include flex;
      justify-content: space-around;
      .reset-button {
         /deep/ .u-button {
@@ -739,7 +901,7 @@
      }
      /deep/ .u-button {
         width: 279rpx;
         width: 220rpx;
         height: 60rpx;
         font-size: 28rpx;
      }
@@ -854,7 +1016,16 @@
            height: 54rpx;
            background: #f5f5f5;
            @include flex;
            justify-content: end;
            margin-top: vww(15);
            position: relative;
            .f-button{
               width: auto !important;
               height: 30rpx!important;
               font-size: 25rpx!important;
            }
         }
         .date-information {
@@ -863,13 +1034,13 @@
            border-radius: 20rpx;
            .statistics-card {
               width: 100%;
               min-height: vww(120);
               @include flex;
               flex-direction: column;
               margin-top: vww(5);
               margin-bottom: vww(5);
               overflow: hidden;
               // width: 100%;
               // min-height: vww(120);
               // @include flex;
               // flex-direction: column;
               // margin-top: vww(5);
               // margin-bottom: vww(5);
               // overflow: hidden; // 自定义组件 已有该样式,该样式会导致样式混乱
               &:last-child {
                  .card-main {
@@ -904,7 +1075,8 @@
                  margin-left: vww(20);
                  padding-bottom: vww(12);
                  position: relative;
                  @include flex flex-direction: column;
                  @include flex;
                  flex-direction: column;
                  align-items: flex-start;
                  .first-line {
@@ -927,12 +1099,19 @@
                           height: vww(28);
                           line-height: vww(28);
                           text-align: center;
                           background: url('https://mx.jzeg.cn:9095/appimg/image/banner/blueblock.png') no-repeat;
                           background: url('https://mx.jzeg.cn:9096/appimg/image/banner/blueblock.png') no-repeat;
                           background-size: contain;
                           font-size: 30rpx;
                           font-weight: 400;
                           color: #ffffff;
                           margin-right: vww(20);
                        }
                        .filedname {
                           white-space: nowrap;
                           overflow: hidden;
                           text-overflow: ellipsis;
                           flex: 1;
                        }
                     }
@@ -960,6 +1139,7 @@
                  .first-extra {
                     @include firstLine;
                     height: vww(32);
                     align-items: center;
                     .main-information {
                        width: 100%;
@@ -973,12 +1153,22 @@
                           height: vww(28);
                           line-height: vww(28);
                           text-align: center;
                           background: url('https://mx.jzeg.cn:9095/appimg/image/banner/redblock.png') no-repeat;
                           // display: flex;
                           // justify-content: center;
                           // align-items: center;
                           background: url('https://mx.jzeg.cn:9096/appimg/image/banner/redblock.png') no-repeat;
                           background-size: contain;
                           font-size: 30rpx;
                           font-weight: 400;
                           color: #ffffff;
                           margin-right: vww(20);
                        }
                        .filedname {
                           white-space: nowrap;
                           overflow: hidden;
                           text-overflow: ellipsis;
                           flex: 1;
                        }
                     }
                  }
@@ -1180,4 +1370,4 @@
      //    }
      // }
   }
</style>
</style>