From 40a7d8db73f81ad10de03684dc9f6720e18cc315 Mon Sep 17 00:00:00 2001 From: qingyiay <2386314947@qq.com> Date: 星期二, 08 八月 2023 16:11:14 +0800 Subject: [PATCH] 称重异常修改 --- pages/customer-page/customer-my/faYunstatistics/faYunstatistics.vue | 1638 +++++++++++++++++++++++++++++++++++++-------------------- 1 files changed, 1,058 insertions(+), 580 deletions(-) diff --git a/pages/customer-page/customer-my/faYunstatistics/faYunstatistics.vue b/pages/customer-page/customer-my/faYunstatistics/faYunstatistics.vue index b8dd609..1434f5f 100644 --- a/pages/customer-page/customer-my/faYunstatistics/faYunstatistics.vue +++ b/pages/customer-page/customer-my/faYunstatistics/faYunstatistics.vue @@ -1,86 +1,200 @@ <template> - <view class="main"> - <view class="top-statistics"> - <view class="content-statistics"> - <view class="content-text">鍙戣繍缁熻</view> - <view class="content-text">鍏眥{ totalLength }}杞�</view> - <view class="content-text">鍏眥{ totalTon.toFixed(2) }}鍚�</view> + <view class=""> + <view class="main"> + <view class="top-statistics"> + <view class="top-body"> + <view class="content-title">鍙戣繍缁熻</view> + <view class="content-statistics"> + <view class="content-text"> + <view class="content-container">{{ totalLength }}</view> + <view class="content-num">鍙戣繍杞︽暟</view> + </view> + <view class="content-text"> + <view class="content-container">{{ totalTon}}</view> + <view class="content-num">鍙戣繍鍚ㄦ暟</view> + </view> + </view> + </view> </view> - </view> - <view class="collapse-main"> - <view class="filter-show"> - <view class="filtershow-date">{{ dateRange }}</view> - <view class="filter-icon"><u-icon name="grid" :size="40" color="#9ec16c "></u-icon></view> - <view class="filtershow-text" @click="showPopup">绛涢��</view> - </view> - <u-popup :show="conditinonShow" mode="top" :closeable="true" :closeOnClickOverlay="true" @close="conditinonclose"> - <view class="filter-main"> - <view class="filter-body date-button"> - <view class="condition-name">鏃ユ湡</view> - <view class="filter-name"> - <u-button :text="dateselect" @click="opencalendar"></u-button> - <view class="filter-button "> - <uni-calendar - ref="calendar" - class="uni-calendar--hook" - :clear-date="true" - :date="info.date" - :insert="info.insert" - :lunar="info.lunar" - :startDate="info.startDate" - :endDate="info.endDate" - :range="info.range" - @confirm="confirm" - /> + <view class="main-block"> + <view class="data-filter" + @click="showPopup"> + <view class="search-icon"><u-icon name="search" + color="#494949" + size="50"></u-icon></view> + <view class="date-text">{{ dateselect }}</view> + <view class=""> + <view class="arrow-icon"><u-icon name="arrow-down-fill" + color="#1481FF" + size="50"></u-icon></view> + </view> + </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" + v-if="filterList.length == 0"></u-empty> + <view class="statistics-card" + v-for="(item, index) in filterList" + :key="index"> + <view class="card-top"> + <view class="left"><combined-title :title="item.condition"></combined-title></view> + <view class="card-top_num"> + {{ item.taskCoalList.length }}杞� + {{Number(item.taskCoalList + .reduce((prev, cur) => { + cur.clean=cur.clean||0 + return prev + cur.clean; + }, 0)).toFixed(2)}}鍚� + </view> + </view> + <view class="card-main" + v-for="(value, i) in item.taskCoalList" + :key="i" + @click="faYunDetail(value.id)"> + <view class="first-line"> + <view class="main-information"> + <view class="sign">瑁�</view> + <view class="filedname"> + <text + v-if="value.orderType == '澶栭攢' || value.orderType == '鍐呴攢' || value.orderType == '杞嚭'">{{ value.deptName || '' }}</text> + <text + v-else-if="value.orderType == '澶栬喘' || value.orderType == '鍐呰喘' || value.orderType == '杞叆'">{{ value.customerName || '' }}</text> + </view> + </view> + <view class="main-divider"></view> + <view class="point-number">{{ value.clean.toFixed(2) || 0 }}</view> + </view> + <view class="first-extra"> + <view class="main-information"> + <view class="sign">鍗�</view> + <view class="filedname"> + <text + v-if="value.orderType == '澶栭攢' || value.orderType == '鍐呴攢' || value.orderType == '杞嚭'">{{ value.customerName || '' }}</text> + <text + v-else-if="value.orderType == '澶栬喘' || value.orderType == '鍐呰喘' || value.orderType == '杞叆'">{{ value.deptName || '' }}</text> + </view> + </view> + </view> + <view class="second-line"> + <view class="coal-name"> + <view class="">{{ value.coalName }}</view> + <view class="black-bar"></view> + <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" + mode="widthFix"></image> + </view> + <view class="carnum-text">{{ value.carNo || '' }}</view> + </view> + <view class="fourth-line"> + <view class="time-icon"><u-icon name="clock" + color="#515151" + size="28"></u-icon></view> + <view class="send-date">{{ value.sendDate }}</view> </view> </view> </view> - <view class="filter-body"> - <view class="condition-name">鐓ょ</view> - <view class="filter-name"> - <view class="filter-button" v-for="(item, index) in coalList" :key="index" @click="filterCondition(0, index, item.condition)"> - <u-button :text="item.condition" :type="item.active ? 'success' : ''" size="small" v-if="index < coalShow"></u-button> + </view> + </view> + <u-popup :show="conditinonShow" + mode="bottom" + :closeable="true" + :closeOnClickOverlay="true" + @close="conditinonclose"> + <scroll-view scroll-y="true" + class="scroll-Y"> + <view class="filter-main"> + <view class="filter-body date-button"> + <view class="condition-name">鏃ユ湡</view> + <view class="filter-name"> + <u-button :text="dateselect" + @click="opencalendar"></u-button> + <view class="filter-button "> + <uni-calendar ref="calendar" + class="uni-calendar--hook" + :clear-date="true" + :date="info.date" + :insert="info.insert" + :lunar="info.lunar" + :startDate="info.startDate" + :endDate="info.endDate" + :range="info.range" + @confirm="confirm" /> + </view> </view> - <view class="toggle-button"> + </view> + <view class="filter-body"> + <view class="condition-name">鐓ょ</view> + <view class="filter-name"> + <view class="filter-button" + v-for="(item, index) in coalList" + :key="index" + @click="filterCondition(0, index, item.condition)"> + <u-button :text="item.condition" + :type="item.active ? 'primary' : ''" + size="small" + :class="{ shadowactive: item.active }"></u-button> + </view> + <!-- <view class="toggle-button"> <u-button :text="coalShow < coalTotal ? '鏌ョ湅鏇村' : '鏀惰捣'" type="primary" size="small" @click="toggle(0)" v-if="coalTotal > 3"></u-button> + </view> --> </view> </view> - </view> - <view class="filter-body"> - <view class="condition-name">绫诲瀷</view> - <view class="filter-name"> - <view class="filter-button" v-for="(item, index) in typeList" :key="index" @click="filterCondition(1, index, item.condition)"> - <u-button :text="item.condition" :type="item.active ? 'success' : ''" size="small" v-if="index < typeShow"></u-button> - </view> - <view class="toggle-button"> + <view class="filter-body" + v-if="typeList.length !== 0"> + <view class="condition-name">绫诲瀷</view> + <view class="filter-name"> + <view class="filter-button" + v-for="(item, index) in typeList" + :key="index" + @click="filterCondition(1, index, item.condition)"> + <u-button :text="item.condition" + :type="item.active ? 'primary' : ''" + size="small"></u-button> + </view> + <!-- <view class="toggle-button"> <u-button :text="typeShow < typeTotal ? '鏌ョ湅鏇村' : '鏀惰捣'" type="primary" size="small" @click="toggle(1)" v-if="typeTotal > 3"></u-button> + </view> --> </view> </view> - </view> - <view class="filter-body"> - <view class="condition-name">瀹㈡埛</view> - <view class="filter-name"> - <view class="filter-button" v-for="(item, index) in customerList" :key="index" @click="filterCondition(2, index, item.condition)"> - <u-button :text="item.condition" :type="item.active ? 'success' : ''" size="small" v-if="index < customerShow"></u-button> - </view> - <view class="toggle-button"> - <u-button - :text="customerShow < customerTotal ? '鏌ョ湅鏇村' : '鏀惰捣'" - type="primary" - size="small" - @click="toggle(2)" - v-if="customerTotal > 3" - ></u-button> + <view class="filter-body" + v-if="roleType !== 1"> + <view class="condition-name">瀹㈡埛</view> + <view class="filter-name"> + <view class="filter-button" + v-for="(item, index) in customerList" + :key="index" + @click="filterCondition(2, index, item.condition)"> + <u-button :text="item.condition" + :type="item.active ? 'primary' : ''" + size="small"></u-button> + </view> + <!-- <view class="toggle-button"> + <u-button :text="customerShow < customerTotal ? '鏌ョ湅鏇村' : '鏀惰捣'" type="primary" size="small" @click="toggle(2)" v-if="customerTotal > 3"></u-button> + </view> --> </view> </view> - </view> - <view class="filter-body" v-if="roleType == 1"> - <view class="condition-name">璐т唬</view> - <view class="filter-name"> - <view class="filter-button" v-for="(item, index) in forwarderList" :key="index" @click="filterCondition(3, index, item.condition)"> - <u-button :text="item.condition" :type="item.active ? 'success' : ''" v-if="index < forwarderShow"></u-button> - </view> - <view class="toggle-button"> + <view class="filter-body" + v-if="roleType == 1"> + <view class="condition-name">璐т唬</view> + <view class="filter-name"> + <view class="filter-button" + v-for="(item, index) in forwarderList" + :key="index" + @click="filterCondition(3, index, item.condition)"> + <u-button :text="item.condition" + :type="item.active ? 'primary' : ''"></u-button> + </view> + <!-- <view class="toggle-button"> <u-button :text="forwarderShow < forwarderTotal ? '鏌ョ湅鏇村' : '鏀惰捣'" type="primary" @@ -88,538 +202,896 @@ @click="toggle(3)" v-if="forwarderTotal > 3" ></u-button> + </view> --> </view> </view> - </view> - <view class="filter-body" v-if="roleType != 3"> - <view class="condition-name">杞﹂槦</view> - <view class="filter-name"> - <view class="filter-button" v-for="(item, index) in fleetList" :key="index" @click="filterCondition(4, index, item.condition)"> - <u-button :text="item.condition" :type="item.active ? 'success' : ''" size="small" v-if="index < fleetShow"></u-button> - </view> - <view class="toggle-button"> + <view class="filter-body" + v-if="roleType != 3"> + <view class="condition-name">杞﹂槦</view> + <view class="filter-name"> + <view class="filter-button" + v-for="(item, index) in fleetList" + :key="index" + @click="filterCondition(4, index, item.condition)"> + <u-button :text="item.condition" + :type="item.active ? 'primary' : ''" + size="small"></u-button> + </view> + <!-- <view class="toggle-button"> <u-button :text="fleetShow < fleetTotal ? '鏌ョ湅鏇村' : '鏀惰捣'" type="primary" size="small" @click="toggle(4)" v-if="fleetTotal > 3"></u-button> + </view> --> </view> </view> - </view> - <view class="filter-body" v-if="roleType != 1"> - <view class="condition-name">鐭垮満</view> - <view class="filter-name"> - <view class="filter-button" v-for="(item, index) in filedList" :key="index" @click="filterCondition(5, index, item.condition)"> - <u-button :text="item.condition" :type="item.active ? 'success' : ''" size="small" v-if="index < filedShow"></u-button> - </view> - <view class="toggle-button"> + <view class="filter-body"> + <view class="condition-name">鐭垮満</view> + <view class="filter-name"> + <view class="filter-button" + v-for="(item, index) in filedList" + :key="index" + @click="filterCondition(5, index, item.condition)"> + <u-button :text="item.condition" + :type="item.active ? 'primary' : ''" + size="small"></u-button> + </view> + <!-- <view class="toggle-button"> <u-button :text="filedShow < filedTotal ? '鏌ョ湅鏇村' : '鏀惰捣'" type="primary" size="small" @click="toggle(5)" v-if="filedTotal > 3"></u-button> + </view> --> </view> </view> - </view> - <view class="filter-body" v-if="roleType == 2"> - <view class="condition-name">杞︾墝鍙�</view> - <view class="filter-name"> - <view class="filter-button" v-for="(item, index) in carNoList" :key="index" @click="filterCondition(6, index, item.condition)"> - <u-button :text="item.condition" :type="item.active ? 'success' : ''" size="small" v-if="index < carNoShow"></u-button> - </view> - <view class="toggle-button"> + <view class="filter-body" + v-if="roleType == 2"> + <view class="condition-name">杞︾墝鍙�</view> + <view class="filter-name"> + <view class="filter-button" + v-for="(item, index) in carNoList" + :key="index" + @click="filterCondition(6, index, item.condition)"> + <u-button :text="item.condition" + :type="item.active ? 'primary' : ''" + size="small" + v-if="index < carNoShow"></u-button> + </view> + <!-- <view class="toggle-button"> <u-button :text="carNoShow < carNoTotal ? '鏌ョ湅鏇村' : '鏀惰捣'" type="primary" size="small" @click="toggle(6)" v-if="carNoTotal > 3"></u-button> + </view> --> </view> </view> </view> + </scroll-view> + <view class="utils-button"> + <view class="reset-button"><u-button type="default" + text="閲嶇疆" + :plain="true" + shape="circle" + @click="resetCondition"></u-button></view> + <view class="confirm-button"><u-button type="primary" + text="纭畾" + :plain="true" + shape="circle" + @click="confirmCondition"></u-button></view> </view> </u-popup> + <tab-bar :current="1"></tab-bar> </view> - <view class="date-information"> - <view class="statistics-card" v-for="(item, index) in filterList" :key="index"> - <view class="card-title"> - <view class="title-date">{{ item.condition }}</view> - <view class="title-number"> - 鍏眥{ item.taskCoalList.length }}杞� {{ - item.taskCoalList.reduce((prev, cur) => { - return prev + cur.clean; - }, 0) - }}鍚� - </view> - </view> - <view class="card-main" v-for="(value, i) in item.taskCoalList" :key="i" @click="faYunDetail(value.id)"> - <view class="arrow-right"><u-icon name="arrow-right" size="50"></u-icon></view> - <view class="main-body"> - <view class="coal-name">鐓ょ:{{ value.coalName || '' }}</view> - <view class="clean">鎵ц閲�:{{ value.clean.toFixed(2) || 0 }}</view> - <view class="out-time">鍑哄満鏃堕棿:{{ value.outTime || '' }}</view> - <view class="car-number">杞︾墝鍙�:{{ value.carNo || '' }}</view> - <view class="filedName">鐭垮満:{{ value.filedName || '' }}</view> - </view> - </view> - </view> - </view> - <tab-bar :current="1"></tab-bar> + <view class="white-block"></view> </view> </template> <script> -export default { - data() { - return { - conditionList: [], - coalList: [], - typeList: [], - customerList: [], - forwarderList: [], - fleetList: [], - filedList: [], - carNoList: [], - isactive: false, - info: { - lunar: false, - range: true, - insert: false, - selected: [] + import BigNumber from "bignumber.js" + import combinedTitle from '@/components/combined-title/combined-title.vue'; + export default { + components: { + combinedTitle + }, + data() { + return { + conditionList: [], + coalList: [], + typeList: [], + customerList: [], + forwarderList: [], + fleetList: [], + filedList: [], + carNoList: [], + isactive: false, + info: { + lunar: false, + range: true, + insert: false, + selected: [] + }, + first: '', + last: '', + firstFilter: '', + lastFilter: '', + taskList: [], + filterList: [], + totalLength: 0, + totalTon: 0, + // 绛涢�夊脊鍑哄眰 + conditinonShow: false, + // 瓒呰繃涓よ鑷姩闅愯棌 + coalShow: 3, + typeShow: 3, + customerShow: 3, + forwarderShow: 3, + fleetShow: 3, + filedShow: 3, + carNoShow: 3, + coalToggeleState: false, + typeToggeleState: false, + customerToggeleState: false, + forwarderToggeleState: false, + fleetToggeleState: false, + filedToggeleState: false, + carNoToggeleState: false, + // 鐐瑰嚮鍙崇澶磋鎯呭脊绐� + faYunDetailobj: {}, + modalShow: false, + coalStatus: ['棰嗗彇', '棰勭害', '绛惧埌', '鍏ュ満', '绉扮毊', '绉版瘺', '绂诲満', '鍏ョ鎴�', '鍑虹鎴�', '鍏ョ叅浠�', '鍑虹叅浠�', '鏀剧┖', '浣滃簾', '鍏ュ満鐢宠', + '杩涘叆鍦洪櫌', '寮傚父瀹℃牳涓�' + ] + }; + }, + onLoad() { + this.firstDate(); + this.lastDate(); + this.getShipping(); + this.getTmTaskCoalData(); + }, + methods: { + firstDate() { + let y = new Date().getFullYear(); //鑾峰彇骞翠唤 + let m = new Date().getMonth() + 1; //鑾峰彇鏈堜唤 + let d = '01'; + m = m < 10 ? '0' + m : m; //鏈堜唤琛� 0 + this.first = [y, m, d].join('-'); + this.firstFilter = [y, m, d].join('-'); }, - first: '', - last: '', - taskList: [], - filterList: [], - totalLength: 0, - totalTon: 0, - // 绛涢�夊脊鍑哄眰 - conditinonShow: false, - // 瓒呰繃涓よ鑷姩闅愯棌 - coalShow: 3, - typeShow: 3, - customerShow: 3, - forwarderShow: 3, - fleetShow: 3, - filedShow: 3, - carNoShow: 3, - coalToggeleState: false, - typeToggeleState: false, - customerToggeleState: false, - forwarderToggeleState: false, - fleetToggeleState: false, - filedToggeleState: false, - carNoToggeleState: false, - // 鐐瑰嚮鍙崇澶磋鎯呭脊绐� - faYunDetailobj: {}, - modalShow: false, - coalStatus: ['棰嗗彇', '棰勭害', '绛惧埌', '鍏ュ満', '绉扮毊', '绉版瘺', '绂诲満', '鍏ョ鎴�', '鍑虹鎴�', '鍏ョ叅鍦�', '鍑虹叅浠�'] - }; - }, - onShow() { - this.firstDate(); - this.lastDate(); - this.getShipping(); - this.getTmTaskCoalData(); - }, - methods: { - firstDate() { - let y = new Date().getFullYear(); //鑾峰彇骞翠唤 - let m = new Date().getMonth() + 1; //鑾峰彇鏈堜唤 - let d = '01'; - m = m < 10 ? '0' + m : m; //鏈堜唤琛� 0 - this.first = [y, m, d].join('-'); - }, - lastDate() { - let y = new Date().getFullYear(); //鑾峰彇骞翠唤 - let m = new Date().getMonth() + 1; //鑾峰彇鏈堜唤 - let d = new Date(y, m, 0).getDate(); //鑾峰彇褰撴湀鏈�鍚庝竴鏃� - m = m < 10 ? '0' + m : m; //鏈堜唤琛� 0 - d = d < 10 ? '0' + d : d; //鏃ユ暟琛� 0 - this.last = [y, m, d].join('-'); - }, - // 绛涢�夋潯浠� - getShipping() { - this.$reqGet('getShippingCondition', { startTime: this.first, endTime: this.last }).then(res => { - this.conditionList = res.data; - this.coalList = res.data - .filter(v => v.conditionType == 0) - .map(item => { - return { - ...item, - active: false - }; - }); - this.typeList = res.data - .filter(v => v.conditionType == 1) - .map(item => { - return { - ...item, - active: false - }; - }); - this.customerList = res.data - .filter(v => v.conditionType == 2) - .map(item => { - return { - ...item, - active: false - }; - }); - this.forwarderList = res.data - .filter(v => v.conditionType == 3) - .map(item => { - return { - ...item, - active: false - }; - }); - this.fleetList = res.data - .filter(v => v.conditionType == 4) - .map(item => { - return { - ...item, - active: false - }; - }); - this.filedList = res.data - .filter(v => v.conditionType == 5) - .map(item => { - return { - ...item, - active: false - }; - }); - this.carNoList = res.data - .filter(v => v.conditionType == 6) - .map(item => { - return { - ...item, - active: false - }; - }); - }); - }, - // 鑾峰彇鏁版嵁 - getTmTaskCoalData() { - uni.showLoading({ - title: '鍔犺浇涓�' - }); - this.$reqGet('getTmTaskCoalData', { startTime: this.first, endTime: this.last }).then(res => { - this.filterList = this.taskList = res.data; + lastDate() { + let y = new Date().getFullYear(); //鑾峰彇骞翠唤 + let m = new Date().getMonth() + 1; //鑾峰彇鏈堜唤 + let d = new Date(y, m, 0).getDate(); //鑾峰彇褰撴湀鏈�鍚庝竴鏃� + m = m < 10 ? '0' + m : m; //鏈堜唤琛� 0 + d = d < 10 ? '0' + d : d; //鏃ユ暟琛� 0 + this.last = [y, m, d].join('-'); + this.lastFilter = [y, m, d].join('-'); + }, + // 绛涢�夋潯浠� + getShipping() { + this.$reqGet('getShippingCondition', { startTime: this.first, endTime: this.last }).then(res => { + this.conditionList = res.data; + this.coalList = res.data + .filter(v => v.conditionType == 0) + .map(item => { + return { + ...item, + active: false + }; + }); + this.typeList = res.data + .filter(v => v.conditionType == 1) + .map(item => { + return { + ...item, + active: false + }; + }); + this.customerList = res.data + .filter(v => v.conditionType == 2) + .map(item => { + return { + ...item, + active: false + }; + }); + this.forwarderList = res.data + .filter(v => v.conditionType == 3) + .map(item => { + return { + ...item, + active: false + }; + }); + this.fleetList = res.data + .filter(v => v.conditionType == 4) + .map(item => { + return { + ...item, + active: false + }; + }); + this.filedList = res.data + .filter(v => v.conditionType == 5) + .map(item => { + return { + ...item, + active: false + }; + }); + this.carNoList = res.data + .filter(v => v.conditionType == 6) + .map(item => { + return { + ...item, + active: false + }; + }); + }); + }, + // 鑾峰彇鏁版嵁 + getTmTaskCoalData() { + uni.showLoading({ + title: '鍔犺浇涓�' + }); + this.$reqGet('getTmTaskCoalData', { startTime: this.first, endTime: this.last }).then(res => { + this.filterList = this.taskList = res.data; + 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 => + v.taskCoalList.reduce((prev, cur) => { + const cleanvalue = cur.clean || 0 + return cleanvalue + prev + }, 0) + ); + this.totalTon = this.totalTon.reduce((x, y) => { + let xx = new BigNumber(x) + let yy = new BigNumber(y) + return xx.plus(yy).toNumber().toFixed(2) + }, new BigNumber(0)); + } else { + this.totalLength = 0; + this.totalTon = 0; + } + uni.hideLoading(); + }); + }, + // 绛涢�夋暟鎹� + filterCondition(value, i, data) { + switch (value) { + case 0: + this.coalList[i].active = !this.coalList[i].active; + break; + case 1: + this.typeList[i].active = !this.typeList[i].active; + break; + case 2: + this.customerList[i].active = !this.customerList[i].active; + break; + case 3: + this.forwarderList[i].active = !this.forwarderList[i].active; + break; + case 4: + this.fleetList[i].active = !this.fleetList[i].active; + break; + case 5: + this.filedList[i].active = !this.filedList[i].active; + break; + case 6: + this.carNoList[i].active = !this.carNoList[i].active; + break; + } + + const validateFn = key => (v, arr) => { + if (arr.length == 0) { + return true; + } else { + return arr.includes(v[key]); + } + }; + let conditionMapping = { + coalName: this.coalList.filter(v => v.active == true).map(item => item.condition), + orderType: this.typeList.filter(v => v.active == true).map(item => item.condition), + 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), + carNo: this.carNoList.filter(v => v.active == true).map(item => item.condition) + }; + + const mapping = { + coalName: validateFn('coalName'), + orderType: validateFn('orderType'), + customerName: validateFn('customerName'), + xsUser2Name: validateFn('xsUser2Name'), + fleetName: validateFn('fleetName'), + filedName: validateFn('filedName'), + carNo: validateFn('carNo') + }; + this.filterList = this.taskList.map(val => { + return { + condition: val.condition, + conditionId: val.conditionId, + conditionType: val.conditionType, + taskCoalList: val.taskCoalList.filter(v => Reflect.ownKeys(conditionMapping).every(key => + mapping[key](v, conditionMapping[key]))) + }; + }); 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 => v.taskCoalList.reduce((prev, cur) => { - return cur.clean + prev; + const cleanvalue = cur.clean || 0 + return cleanvalue + prev }, 0) ); - this.totalTon = this.totalTon.reduce((x, y) => x + y); + this.totalTon = this.totalTon.reduce((x, y) => { + let xx = new BigNumber(x) + let yy = new BigNumber(y) + return xx.plus(yy).toNumber().toFixed(2) + }, new BigNumber(0)); } else { this.totalLength = 0; this.totalTon = 0; } - uni.hideLoading(); - }); - }, - // 绛涢�夋暟鎹� - filterCondition(value, i, data) { - switch (value) { - case 0: - this.coalList[i].active = !this.coalList[i].active; - break; - case 1: - this.typeList[i].active = !this.typeList[i].active; - break; - case 2: - this.customerList[i].active = !this.customerList[i].active; - break; - case 3: - this.forwarderList[i].active = !this.forwarderList[i].active; - break; - case 4: - this.fleetList[i].active = !this.fleetList[i].active; - break; - case 5: - this.filedList[i].active = !this.filedList[i].active; - break; - case 6: - this.carNoList[i].active = !this.carNoList[i].active; - break; - } - - const validateFn = key => (v, arr) => { - if (arr.length == 0) { - return true; - } else { - return arr.includes(v[key]); + }, + // 纭畾绛涢�� + confirmCondition() { + this.conditinonShow = false; + }, + // 閲嶇疆绛涢�� + resetCondition() { + this.conditinonShow = false; + this.first = this.dateRange.slice(0, 10); + this.last = this.dateRange.slice(11); + this.coalList.forEach(v => { + v.active = false; + }); + this.typeList.forEach(v => { + v.active = false; + }); + this.customerList.forEach(v => { + v.active = false; + }); + this.forwarderList.forEach(v => { + v.active = false; + }); + this.fleetList.forEach(v => { + v.active = false; + }); + this.filedList.forEach(v => { + v.active = false; + }); + }, + confirm(e) { + console.log(e, '鏃ユ湡閫夋嫨'); + this.first = e.range.before; + this.last = e.range.after; + this.conditinonShow = false; + }, + opencalendar() { + this.$refs.calendar.open(); + }, + // 鐐瑰嚮鏌ョ湅鏇村 + toggle(value) { + switch (value) { + case 0: + if (!this.coalToggeleState) { + this.coalShow = this.coalTotal; + this.coalToggeleState = true; + } else { + this.coalShow = 3; + this.coalToggeleState = false; + } + break; + case 1: + if (!this.typeToggeleState) { + this.typeShow = this.typeTotal; + this.typeToggeleState = true; + } else { + this.typeShow = 3; + this.typeToggeleState = false; + } + break; + case 2: + if (!this.customerToggeleState) { + this.customerShow = this.customerTotal; + this.customerToggeleState = true; + } else { + this.customerShow = 3; + this.customerToggeleState = false; + } + break; + case 3: + if (!this.forwarderToggeleState) { + this.forwarderShow = this.forwarderTotal; + this.forwarderToggeleState = true; + } else { + this.forwarderShow = 3; + this.forwarderToggeleState = false; + } + break; + case 4: + if (!this.fleetToggeleState) { + this.fleetShow = this.fleetTotal; + this.fleetToggeleState = true; + } else { + this.fleetShow = 3; + this.fleetToggeleState = false; + } + break; + case 5: + if (!this.filedToggeleState) { + this.filedShow = this.filedTotal; + this.filedToggeleState = true; + } else { + this.filedShow = 3; + this.filedToggeleState = false; + } + break; + case 6: + if (!this.carNoToggeleState) { + this.carNoShow = this.carNoTotal; + this.carNoToggeleState = true; + } else { + this.carNoShow = 3; + this.carNoToggeleState = false; + } + break; } - }; - let conditionMapping = { - coalName: this.coalList.filter(v => v.active == true).map(item => item.condition), - orderType: this.typeList.filter(v => v.active == true).map(item => item.condition), - 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), - carNo: this.carNoList.filter(v => v.active == true).map(item => item.condition) - }; - - const mapping = { - coalName: validateFn('coalName'), - orderType: validateFn('orderType'), - customerName: validateFn('customerName'), - xsUser2Name: validateFn('xsUser2Name'), - fleetName: validateFn('fleetName'), - filedName: validateFn('filedName'), - carNo: validateFn('carNo') - }; - this.filterList = this.taskList.map(val => { - return { - condition: val.condition, - conditionId: val.conditionId, - conditionType: val.conditionType, - taskCoalList: val.taskCoalList.filter(v => Reflect.ownKeys(conditionMapping).every(key => mapping[key](v, conditionMapping[key]))) - }; - }); - 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 => - v.taskCoalList.reduce((prev, cur) => { - return cur.clean + prev; - }, 0) - ); - this.totalTon = this.totalTon.reduce((x, y) => x + y); - } else { - this.totalLength = 0; - this.totalTon = 0; + }, + // 璺宠浆鍙戣繍璇︽儏 + faYunDetail(takeCoalId) { + uni.navigateTo({ + url: `/pages/public-page/faYunstatisticsDetails/faYunstatisticsDetails?id=${takeCoalId}` + }); + }, + // 鎵撳紑绛涢�夋潯浠跺脊绐� + showPopup() { + this.conditinonShow = true; + }, + // 鍏抽棴绛涢�夋潯浠跺脊绐� + conditinonclose() { + this.conditinonShow = false; } }, - confirm(e) { - console.log(e, '鏃ユ湡閫夋嫨'); - this.first = e.range.before; - this.last = e.range.after; - }, - opencalendar() { - this.$refs.calendar.open(); - }, - // 鐐瑰嚮鏌ョ湅鏇村 - toggle(value) { - switch (value) { - case 0: - if (!this.coalToggeleState) { - this.coalShow = this.coalTotal; - this.coalToggeleState = true; - } else { - this.coalShow = 3; - this.coalToggeleState = false; - } - break; - case 1: - if (!this.typeToggeleState) { - this.typeShow = this.typeTotal; - this.typeToggeleState = true; - } else { - this.typeShow = 3; - this.typeToggeleState = false; - } - break; - case 2: - if (!this.customerToggeleState) { - this.customerShow = this.customerTotal; - this.customerToggeleState = true; - } else { - this.customerShow = 3; - this.customerToggeleState = false; - } - break; - case 3: - if (!this.forwarderToggeleState) { - this.forwarderShow = this.forwarderTotal; - this.forwarderToggeleState = true; - } else { - this.forwarderShow = 3; - this.forwarderToggeleState = false; - } - break; - case 4: - if (!this.fleetToggeleState) { - this.fleetShow = this.fleetTotal; - this.fleetToggeleState = true; - } else { - this.fleetShow = 3; - this.fleetToggeleState = false; - } - break; - case 5: - if (!this.filedToggeleState) { - this.filedShow = this.filedTotal; - this.filedToggeleState = true; - } else { - this.filedShow = 3; - this.filedToggeleState = false; - } - break; - case 6: - if (!this.carNoToggeleState) { - this.carNoShow = this.carNoTotal; - this.carNoToggeleState = true; - } else { - this.carNoShow = 3; - this.carNoToggeleState = false; - } - break; + computed: { + roleType() { + return uni.getStorageSync('roleType'); + }, + dateRange() { + return `${this.firstFilter}鑷�${this.lastFilter}`; + }, + dateselect() { + return `${this.first}鑷�${this.last}`; + }, + coalTotal() { + return this.coalList.length; + }, + typeTotal() { + return this.typeList.length; + }, + customerTotal() { + return this.customerList.length; + }, + forwarderTotal() { + return this.forwarderList.length; + }, + fleetTotal() { + return this.fleetList.length; + }, + filedTotal() { + return this.filedList.length; + }, + carNoTotal() { + return this.carNoList.length; } }, - // 璺宠浆鍙戣繍璇︽儏 - faYunDetail(takeCoalId) { - uni.navigateTo({ - url: `/pages/public-page/faYunstatisticsDetails/faYunstatisticsDetails?id=${takeCoalId}` - }); - }, - // 鎵撳紑绛涢�夋潯浠跺脊绐� - showPopup() { - this.conditinonShow = true; - }, - // 鍏抽棴绛涢�夋潯浠跺脊绐� - conditinonclose() { - this.conditinonShow = false; - } - }, - computed: { - roleType() { - return uni.getStorageSync('roleType'); - }, - dateRange() { - return `鏃ユ湡:${this.first}-${this.last}`; - }, - dateselect() { - return `${this.first}-${this.last}`; - }, - coalTotal() { - return this.coalList.length; - }, - typeTotal() { - return this.typeList.length; - }, - customerTotal() { - return this.customerList.length; - }, - forwarderTotal() { - return this.forwarderList.length; - }, - fleetTotal() { - return this.fleetList.length; - }, - filedTotal() { - return this.filedList.length; - }, - carNoTotal() { - return this.carNoList.length; - } - }, - watch: { - dateselect(newV, old) { - let tempDate = `${this.first}-${this.last}`; - if (newV != old && old != '-') { - this.first = newV.slice(0, 10); - this.last = newV.slice(11); - this.getTmTaskCoalData(); + watch: { + dateselect(newV, old) { + let tempDate = `${this.first}鑷�${this.last}`; + if (newV != old && old != '鑷�') { + this.first = newV.slice(0, 10); + this.last = newV.slice(11); + this.getTmTaskCoalData(); + } } } - } -}; + }; </script> -<style lang="scss" scoped> -::v-deep .toggle-button .u-button { - width: vww(40); -} -// ::v-deep .filter-name:nth-last-child(1) { -// .u-button { -// width: 66%; -// } -// } -.main { - width: 96%; - margin: 0 auto; - background-color: #e8eaec; - /*椤堕儴缁熻鏍�*/ - .top-statistics { - width: 100%; - height: vww(50); +<style lang="scss" + scoped> + @mixin flex { display: flex; - justify-content: center; + justify-content: space-between; align-items: center; - .content-statistics { - width: 100%; - height: 100%; - padding: 0 vww(10); - display: flex; - justify-content: space-between; - align-items: center; - .content-text { - width: 33.3%; - height: vww(30); - font-size: vww(20); - color: #393a3c; + } + + @mixin firstLine { + width: 80%; + height: vww(68); + margin: vww(10) vww(16) 0 0; + display: flex; + justify-content: space-between; + } + + ::v-deep .toggle-button .u-button { + width: vww(40); + } + + .scroll-Y { + height: 1000rpx; + position: relative; + top: 20rpx; + } + + .utils-button { + width: 94%; + height: vww(30); + margin: vww(50) auto; + @include flex; + + .reset-button { + /deep/ .u-button { + border: 1px solid #c5c5c5; + outline: none; } } + + .confirm-button { + /deep/ .u-button { + border: 1px solid #3b56eb; + outline: none; + color: #3b56eb; + } + } + + /deep/ .u-button { + width: 279rpx; + height: 60rpx; + font-size: 28rpx; + } } - // 閫夐」鎶樺彔妗� - .collapse-main { + + .white-block { width: 100%; + height: vww(50); margin-top: vww(10); - background-color: #fff; - border: 1px solid #cccccc; - border-radius: vww(5); - .filter-show { + } + + .main { + width: 100%; + margin: 0 auto; + + /*椤堕儴缁熻鏍�*/ + .top-statistics { width: 100%; - height: vww(40); - background-color: #fff; - border-radius: vww(5); - font-size: vww(18); - color: #333; - position: relative; + height: 430rpx; + background: linear-gradient(0deg, #ffffff 0%, #0055fe 100%); display: flex; - justify-content: space-between; - align-items: center; - .filtershow-date { - font-size: vww(15); - padding-left: vww(8); - } - .filter-icon { - position: absolute; - right: vww(45); - top: vww(11); - } - .filtershow-text { - color: #9ec16c; - padding-right: vww(8); - position: relative; - &::before { - content: ''; - position: absolute; - width: 1px; - height: vww(22); - background-color: #dcdfe6; - right: 94px; - bottom: 0; + justify-content: center; + + .top-body { + width: 690rpx; + height: 220rpx; + margin: vww(21) auto; + display: flex; + justify-content: space-between; + flex-direction: column; + + .content-statistics { + width: 690rpx; + height: 140rpx; + background: #ffffff; + box-shadow: 0rpx 0rpx 14rpx 0rpx rgba(73, 120, 240, 0.14), 0rpx 7rpx 45rpx 0rpx rgba(73, 120, 240, 0.12); + border-radius: 10rpx; + display: flex; + justify-content: space-evenly; + align-items: center; + + .content-text { + height: vww(40); + @include flex; + flex-direction: column; + margin-top: 31rpx; + margin-bottom: 31rpx; + + .content-container { + width: 100%; + min-height: vww(16); + font-size: 40rpx; + font-weight: bold; + color: #3b56eb; + text-align: center; + } + + .content-num { + width: 96rpx; + min-height: 24rpx; + font-size: 24rpx; + font-weight: 400; + color: #333333; + } + } + } + + .content-title { + width: 160rpx; + height: 38rpx; + font-size: 40rpx; + font-weight: normal; + color: #ffffff; + line-height: 69rpx; + margin: vww(21) auto; } } } + + .main-block { + width: 690rpx; + margin: vww(12) vww(15) auto vww(15); + background: #ffffff; + box-shadow: 0rpx 0rpx 14rpx 0rpx rgba(73, 120, 240, 0.14), 0rpx 7rpx 45rpx 0rpx rgba(73, 120, 240, 0.12); + border-radius: 20rpx; + @include flex; + flex-direction: column; + overflow: hidden; + position: relative; + top: -145rpx; + + .data-filter { + width: 635rpx; + height: 68rpx; + border: 2px solid rgba(73, 95, 252, 0.6); + box-shadow: 0rpx 5rpx 13rpx 0rpx rgba(73, 95, 252, 0.6); + border-radius: 34rpx; + margin-top: vww(21); + padding: 0 vww(5); + + @include flex .date-text { + width: 330rpx; + height: 40rpx; + font-size: 28rpx; + font-weight: 400; + color: #494949; + } + } + + .filter-condition { + width: 100%; + height: 54rpx; + background: #f5f5f5; + @include flex; + margin-top: vww(15); + } + + .date-information { + width: 635rpx; + background: #f6faff; + 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; + + &:last-child { + .card-main { + &:last-child { + border-bottom: 0; + } + } + } + + .card-top { + width: 96%; + @include flex; + + .left { + font-size: 30rpx; + font-weight: 400; + color: #494949; + } + + .card-top_num { + font-size: 40rpx; + font-weight: 400; + color: #6074ee; + } + } + + .card-main { + width: 100%; + height: vww(150); + border-bottom: vww(1) solid #d6d6d6; + margin-top: vww(12); + margin-left: vww(20); + padding-bottom: vww(12); + position: relative; + @include flex flex-direction: column; + align-items: flex-start; + + .first-line { + width: 80%; + height: vww(32); + color: #303030; + display: flex; + justify-content: space-between; + align-items: center; + + .main-information { + width: 88%; + height: vww(28); + display: flex; + justify-content: flex-start; + align-items: center; + + .sign { + width: vww(28); + 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-size: contain; + font-size: 30rpx; + font-weight: 400; + color: #ffffff; + margin-right: vww(20); + } + } + + .main-divider { + width: 530rpx; + height: 1rpx; + background: #e3e3e3; + position: absolute; + top: 80rpx; + left: vww(50); + } + + .point-number { + width: 20%; + font-size: 40rpx; + font-weight: 400; + color: #f81414; + position: absolute; + right: 12rpx; + display: flex; + flex-wrap: wrap; + } + } + + .first-extra { + @include firstLine; + height: vww(32); + + .main-information { + width: 100%; + height: vww(28); + display: flex; + justify-content: flex-start; + align-items: center; + + .sign { + width: vww(28); + height: vww(28); + line-height: vww(28); + text-align: center; + background: url('https://mx.jzeg.cn:9095/appimg/image/banner/redblock.png') no-repeat; + background-size: contain; + font-size: 30rpx; + font-weight: 400; + color: #ffffff; + margin-right: vww(20); + } + } + } + + .second-line { + width: 100%; + height: vww(15); + display: flex; + justify-content: space-between; + align-items: center; + + .coal-name { + flex-grow: 1; + height: 30rpx; + font-size: 30rpx; + font-weight: 300; + color: #515151; + position: relative; + display: flex; + align-items: center; + + .black-bar { + width: 2rpx; + height: 30rpx; + background: #515151; + margin-left: vww(12); + } + + .coal-type { + margin-left: vww(12); + min-width: vww(50); + height: 30rpx; + line-height: 30rpx; + font-size: 30rpx; + font-weight: 300; + color: #515151; + } + } + } + + .third-line { + width: 40%; + min-height: vww(15); + display: flex; + justify-content: flex-start; + align-items: flex-start; + + .carnum-icon { + width: 28rpx; + height: 28rpx; + margin-right: vww(10); + + image { + width: 28rpx; + height: 28rpx; + } + } + + .carnum-text { + font-size: 28rpx; + font-weight: 300; + color: #515151; + } + } + + .fourth-line { + width: 40%; + height: vww(14); + display: flex; + justify-content: flex-start; + align-items: center; + color: #515151; + + .time-icon { + margin-right: vww(10); + } + } + } + } + } + } + .filter-main { + min-height: 950rpx; width: 100%; display: flex; flex-direction: column; justify-content: space-around; + .date-button { width: 80%; height: vww(80); margin: vww(5) auto; + .condition-name { margin-bottom: vww(10); } } + .filter-body { width: 100%; position: relative; display: flex; justify-content: flex-start; flex-wrap: wrap; + .condition-name { margin-left: vww(15); margin-top: vww(10); font-size: vww(16); color: #686868; } + .filter-name { width: 94%; margin: 0 auto; @@ -635,7 +1107,13 @@ padding: vww(8); margin: vww(5) vww(5); margin-bottom: vww(10); + + /deep/ .shadowactive { + background: linear-gradient(90deg, rgba(73, 123, 251, 0.32), rgba(72, 16, 255, 0.32)); + box-shadow: 2rpx 3rpx 13rpx 0rpx rgba(43, 98, 239, 0.5), 0rpx 0rpx 9rpx 0rpx rgba(247, 250, 253, 0.29); + } } + .toggle-button { width: 30%; display: flex; @@ -647,59 +1125,59 @@ } } } + + // 鏃ユ湡鍙戣繍 + // .date-information { + // width: 100%; + // display: flex; + // flex-direction: column; + // .statistics-card { + // width: 100%; + // margin-top: vww(8); + // border: 1px solid #cccccc; + // border-radius: vww(5); + // background-color: #fff; + // min-height: vww(120); + // display: flex; + // flex-direction: column; + // justify-content: space-between; + // .card-title { + // width: 100%; + // height: vww(40); + // line-height: vww(40); + // padding-left: vww(5); + // color: #bcbcbc; + // border-bottom: 1px solid #cccccc; + // display: flex; + // .title-date { + // width: vww(90); + // margin-right: vww(10); + // } + // .title-number { + // flex: 1; + // } + // } + // .card-main { + // width: 100%; + // flex: 1; + // position: relative; + // .arrow-right { + // position: absolute; + // right: vww(14); + // top: vww(18); + // } + // .main-body { + // width: 80%; + // height: vww(60); + // margin-top: vww(5); + // padding: vww(3); + // color: #686868; + // display: flex; + // flex-wrap: wrap; + // justify-content: space-around; + // } + // } + // } + // } } - // 鏃ユ湡鍙戣繍 - .date-information { - width: 100%; - display: flex; - flex-direction: column; - .statistics-card { - width: 100%; - margin-top: vww(8); - border: 1px solid #cccccc; - border-radius: vww(5); - background-color: #fff; - min-height: vww(120); - display: flex; - flex-direction: column; - justify-content: space-between; - .card-title { - width: 100%; - height: vww(40); - line-height: vww(40); - padding-left: vww(5); - color: #bcbcbc; - border-bottom: 1px solid #cccccc; - display: flex; - .title-date { - width: vww(90); - margin-right: vww(10); - } - .title-number { - flex: 1; - } - } - .card-main { - width: 100%; - flex: 1; - position: relative; - .arrow-right { - position: absolute; - right: vww(14); - top: vww(18); - } - .main-body { - width: 80%; - height: vww(60); - margin-top: vww(5); - padding: vww(3); - color: #686868; - display: flex; - flex-wrap: wrap; - justify-content: space-around; - } - } - } - } -} -</style> +</style> \ No newline at end of file -- Gitblit v1.9.1