| | |
| | | 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 }}车 |
| | |
| | | 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)"> |
| | |
| | | <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> |
| | |
| | | size="28"></u-icon></view> |
| | | <view class="send-date">{{ value.sendDate }}</view> |
| | | </view> |
| | | </view> |
| | | </view> --> |
| | | </view> |
| | | </scroll-view> |
| | | </view> |
| | | </view> |
| | | <u-popup :show="conditinonShow" |
| | |
| | | :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" |
| | |
| | | |
| | | <script> |
| | | import BigNumber from "bignumber.js" |
| | | import { BaseUrl } from '@/api/publicInterface.js' |
| | | import combinedTitle from '@/components/combined-title/combined-title.vue'; |
| | | export default { |
| | | components: { |
| | |
| | | forwarderList: [], |
| | | fleetList: [], |
| | | filedList: [], |
| | | btndisbled:false, |
| | | page:{ |
| | | size:5, |
| | | current:1, |
| | | total:1, |
| | | |
| | | }, |
| | | carNoList: [], |
| | | isactive: false, |
| | | info: { |
| | |
| | | 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, |
| | |
| | | fleetToggeleState: false, |
| | | filedToggeleState: false, |
| | | carNoToggeleState: false, |
| | | pageList:[], |
| | | // 点击右箭头详情弹窗 |
| | | faYunDetailobj: {}, |
| | | modalShow: false, |
| | | coalStatus: ['领取', '预约', '签到', '入场', '称皮', '称毛', '离场', '入磅房', '出磅房', '入煤仓', '出煤仓', '放空', '作废', '入场申请', |
| | | '进入场院', '异常审核中' |
| | | '进入场院', '异常审核中', '返回加减吨', '超时', '打印中', '打印中', '填写' |
| | | ] |
| | | }; |
| | | }, |
| | |
| | | }, |
| | | // 获取数据 |
| | | 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 => |
| | |
| | | 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) |
| | | }; |
| | | |
| | |
| | | customerName: validateFn('customerName'), |
| | | xsUser2Name: validateFn('xsUser2Name'), |
| | | fleetName: validateFn('fleetName'), |
| | | filedName: validateFn('filedName'), |
| | | deptName: validateFn('deptName'), |
| | | carNo: validateFn('carNo') |
| | | }; |
| | | this.filterList = this.taskList.map(val => { |
| | |
| | | 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 => |
| | |
| | | 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) { |
| | |
| | | // 关闭筛选条件弹窗 |
| | | 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: { |
| | |
| | | this.first = newV.slice(0, 10); |
| | | this.last = newV.slice(11); |
| | | this.getTmTaskCoalData(); |
| | | this.getShipping(); |
| | | } |
| | | } |
| | | } |
| | |
| | | ::v-deep .toggle-button .u-button { |
| | | width: vww(40); |
| | | } |
| | | |
| | | .scroll-box{ |
| | | height: 1500rpx; |
| | | } |
| | | .scroll-Y { |
| | | height: 1000rpx; |
| | | position: relative; |
| | |
| | | } |
| | | |
| | | .utils-button { |
| | | width: 94%; |
| | | width: 100%; |
| | | height: vww(30); |
| | | margin: vww(50) auto; |
| | | @include flex; |
| | | justify-content: space-around; |
| | | |
| | | .reset-button { |
| | | /deep/ .u-button { |
| | |
| | | } |
| | | |
| | | /deep/ .u-button { |
| | | width: 279rpx; |
| | | width: 220rpx; |
| | | height: 60rpx; |
| | | font-size: 28rpx; |
| | | } |
| | |
| | | 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 { |
| | |
| | | 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 { |
| | |
| | | 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 { |
| | |
| | | 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; |
| | | } |
| | | } |
| | | |
| | |
| | | .first-extra { |
| | | @include firstLine; |
| | | height: vww(32); |
| | | align-items: center; |
| | | |
| | | .main-information { |
| | | width: 100%; |
| | |
| | | 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; |
| | | } |
| | | } |
| | | } |
| | |
| | | // } |
| | | // } |
| | | } |
| | | </style> |
| | | </style> |