From 4b8fda000f9f600ba5187e738278b340b55ebd7c Mon Sep 17 00:00:00 2001 From: jiangping <jp@doumee.com> Date: 星期三, 18 十二月 2024 18:41:53 +0800 Subject: [PATCH] Merge remote-tracking branch 'origin/master' --- screen/src/views/LogisticsEfficiency.vue | 146 ++++++++++++++++++++++++++++++++++-------------- 1 files changed, 102 insertions(+), 44 deletions(-) diff --git a/screen/src/views/LogisticsEfficiency.vue b/screen/src/views/LogisticsEfficiency.vue index 899b850..ea7a49a 100644 --- a/screen/src/views/LogisticsEfficiency.vue +++ b/screen/src/views/LogisticsEfficiency.vue @@ -3,7 +3,7 @@ <div class="main_app"> <img src="@/assets/images/energy_ef/bg@2x.png" class="main_bg" alt="" /> <div class="main_header"> - <!-- <img src="@/assets/images/maintitle.gif" class="main_header_bg" alt="" /> --> + <img src="@/assets/images/maintitle.gif" class="main_header_bg" alt="" /> <div class="title">瀹夋嘲鏅烘収鐗╂祦鍥尯-璋冨害鑳芥晥璺熻釜</div> <div class="time_wrap"> <span class="date">{{ date }}</span> @@ -38,13 +38,15 @@ <img v-else src="@/assets/images/ic_down.png" class="icon" alt=""> </template> <template v-if="activeTab1 == 1 && data1.yearLastOutTotal"> - <img v-if="data1.yearOutTotal > data1.yearLastOutTotal" src="@/assets/images/ic_up.png" - class="icon" alt=""> + <img v-if="data1.yearOutTotal > data1.yearLastOutTotal" src="@/assets/images/ic_up.png" class="icon" + alt=""> <img v-else src="@/assets/images/ic_down.png" class="icon" alt=""> </template> - - <span v-if="activeTab1 == 0 && data1.monthLastOutTotal">{{ Math.abs((((data1.monthOutTotal - data1.monthLastOutTotal)/data1.monthLastOutTotal) * 100).toFixed(1)) }}%</span> - <span v-else-if="activeTab1 == 1 && data1.yearLastOutTotal">{{ Math.abs((((data1.yearOutTotal - data1.yearLastOutTotal)/data1.yearLastOutTotal) * 100).toFixed(1)) }}%</span> + + <span v-if="activeTab1 == 0 && data1.monthLastOutTotal">{{ Math.abs((((data1.monthOutTotal - + data1.monthLastOutTotal) / data1.monthLastOutTotal) * 100).toFixed(1)) }}%</span> + <span v-else-if="activeTab1 == 1 && data1.yearLastOutTotal">{{ Math.abs((((data1.yearOutTotal - + data1.yearLastOutTotal) / data1.yearLastOutTotal) * 100).toFixed(1)) }}%</span> <span v-else>-</span> </div> </div> @@ -207,7 +209,8 @@ <img src="@/assets/images/energy_ef/ic_chukuxiaolv@2x.png" alt=""> <div class="content"> <div class="name">鍑哄簱鏁堢巼</div> - <div class="num"><span>{{ activeTab12 == 0 ? data1.todayOutRate : data1.monthOutRate }}</span>涓囨敮/灏忔椂 + <div class="num"><span>{{ activeTab12 == 0 ? data1.todayOutRate || 0 : data1.monthOutRate || 0 + }}</span>涓囨敮/灏忔椂 </div> </div> </div> @@ -215,7 +218,8 @@ <img src="@/assets/images/energy_ef/ic_rukuxiaolv@2x.png" alt=""> <div class="content"> <div class="name">鍏ュ簱鏁堢巼</div> - <div class="num"><span class="today">{{ activeTab12 == 0 ? data1.todayInRate : data1.monthInRate + <div class="num"><span class="today">{{ activeTab12 == 0 ? data1.todayInRate || 0 : data1.monthInRate + || 0 }}</span>涓囨敮/灏忔椂</div> </div> </div> @@ -259,16 +263,14 @@ <div class="repertory"> <div class="use_ratio"> <div class="header"> - <div>搴撳瓨閲� <span class="num">{{ data1.stockTotal }}/{{ data1.stockMax }}</span></div> - <div v-if="data1.stockTotal && data1.stockMax">鍒╃敤鐜噞{ ((data1.stockTotal / data1.stockMax) * - 100).toFixed(0) }}%</div> + <div>搴撳瓨閲� <span class="num">{{ data6.num }}/{{ data6.totalNum }}</span></div> + <div v-if="data6.num && data6.totalNum">鍒╃敤鐜噞{ (data6.useRate * 100).toFixed(0) }}%</div> </div> - <Percent v-if="data1.stockTotal && data1.stockMax" - :rate="((data1.stockTotal / data1.stockMax) * 100).toFixed(0)" /> + <Percent v-if="data6.num && data6.totalNum" :rate="((data6.num / data6.totalNum) * 100).toFixed(0)" /> </div> <div class="list two-swiper"> <div class="swiper-wrapper"> - <div class="item two-swiper-slide swiper-slide" v-for="item in dataList6"> + <div class="item two-swiper-slide swiper-slide" v-for="item in data6.stockList"> <div class="la">{{ item.name }}</div> <div class="val">{{ item.num }}涓囨敮</div> </div> @@ -279,26 +281,26 @@ </div> </div> <!-- --> - <div class="modal" v-if="activeCar && activeCar.phone"> + <div class="modal" v-if="showModal"> <div class="title_head"> <img src="@/assets/images/energy_ef/chuku_ic_car@2x.png" alt=""> - <span>鐨朼222</span> + <span>{{ activeCar.carCode }}</span> </div> <div class="info"> <div class="item"> <div class="dian"></div> <div class="la">杩愯緭鍗曞彿锛�</div> - <div class="val">22</div> + <div class="val">{{ activeCar.billCode }}</div> </div> <div class="item"> <div class="dian"></div> <div class="la">鍙告満淇℃伅锛�</div> - <div class="val">22</div> + <div class="val">{{ activeCar.name }} {{ activeCar.phone }}</div> </div> <div class="item"> <div class="dian"></div> <div class="la">鎬昏繍杈撻噺锛�</div> - <div class="val">22 涓囨敮</div> + <div class="val" v-if="activeCar.totalNum">{{ activeCar.totalNum }}涓囨敮</div> </div> </div> <div class="tabs"> @@ -306,35 +308,45 @@ <div :class="{ active: modalTab == 1 }" @click="modalTabClick(1)" class="tab">鍚堝悓鍒楄〃</div> </div> <div class="tab1" v-if="modalTab == 0"> - <div class="item" v-for="item, i in 3"> - <div class="icon_wrap"> - <img v-if="i === 0" class="dian" src="@/assets/images/ic_dangqian@2x.png" alt=""> - <img v-else src="@/assets/images/ic_jindu@2x.png" class="dian_ac" alt=""> - <div class="line"></div> + <template v-for="item, i in activeCar.logList"> + <div class="item" v-if="i < 4 || showMore"> + <div class="icon_wrap"> + <img v-if="i != 0" class="dian" src="@/assets/images/ic_dangqian@2x.png" alt=""> + <img v-else src="@/assets/images/ic_jindu@2x.png" class="dian_ac" alt=""> + <div class="line"></div> + </div> + <div class="content"> + <div class="status" :class="{ ac: i == 0 }">{{ statusMapD[item.objType] }}</div> + <div class="text">{{ item.content }}</div> + <div class="time">{{ item.createDate }}</div> + </div> </div> - <div class="content"> - <div class="status">浣滀笟涓�</div> - <div class="text">浣滀笟浠诲姟鍦ㄣ�愬叆搴撳幓1鍙锋湀鍙般�戝紑濮嬩綔涓�</div> - <div class="time">2024-04-02 12:00</div> - </div> + </template> + <div class="more_btn" v-if="!showMore && activeCar.logList && activeCar.logList.length > 4" + @click="showMore = true">鏌ョ湅鏇村浣滀笟淇℃伅</div> + <div class="empty" v-if="!activeCar.contractList || activeCar.logList.contractList == 0"> + <img src="@/assets/images/default_nodata.png" alt=""> </div> </div> <div class="tab2" v-if="modalTab == 1"> <div class="list"> - <div class="item"> + <div class="item" v-for="item in activeCar.contractList"> <div class="head"> - <div class="code">鍚堝悓鍙凤細12312312</div> - <div class="addr">鏀惰揣鍦帮細姹熼棬鐑熻崏鐗╂祦涓績</div> + <div class="code">鍚堝悓鍙凤細{{ item.ioCode }}</div> + <div class="addr">鏀惰揣鍦帮細{{ item.address }}</div> </div> - <div class="line" v-for="i in 3"> - <div class="name">鐗╂枡鍚嶇О锛�<span class="val">榛勫北</span></div> - <div class="num">鏁伴噺锛�<span class="val">100涓囨敮</span></div> + <div class="line" v-for="i in item.detailList"> + <div class="name">鐗╂枡鍚嶇О锛�<span class="val">{{ i.materialName }}</span></div> + <div class="num">鏁伴噺锛�<span class="val">{{ i.ioQty }}涓囨敮</span></div> </div> + </div> + <div class="empty" v-if="!activeCar.contractList || activeCar.logList.contractList == 0"> + <img src="@/assets/images/default_nodata.png" alt=""> </div> </div> </div> </div> - <div class="modal_mask" v-if="activeCar && activeCar.phone" @click="activeCar = {}"></div> + <div class="modal_mask" v-if="showModal" @click="closeModal"></div> </div> </v-scale-screen> </template> @@ -362,6 +374,7 @@ import 'swiper/css/swiper.min.css' import Swiper from 'swiper' +const statusMapD = ['浠诲姟鐢熸垚', '纭浠诲姟', '宸茬鍒�', '鍏ュ洯绛夊緟', '鏈堝彴鍙彿', '浣滀笟涓�', '浣滀笟瀹屾垚', '鏈堝彴杞Щ', '寮傚父鎸傝捣', '涓嬪彂鎺堟潈绂诲洯', '绂诲洯', '宸茶繃鍙�'] const colors = ['#FEAF01', '#01ABFE', '#51F9E4'] const weekMap = ['鏄熸湡鏃�', '鏄熸湡涓�', '鏄熸湡浜�', '鏄熸湡涓�', '鏄熸湡鍥�', '鏄熸湡浜�', '鏄熸湡鍏�',] const date = ref(dayjs().format('YYYY.MM.DD')) @@ -588,7 +601,7 @@ const scatterData = data7.value.carsList.map(item => { return { name: item.terminalId, - img: item.status == 0 ? icLixian : item.status == 1 || item.status == 2 ? icZaitu : icKongxian, + img: item.jobStatus == 2 ? icLixian : item.jobStatus == 1 ? icZaitu : icKongxian, data: [{ code: item.plateNum, value: [item.longitude, item.latitude] }] } }) @@ -780,7 +793,9 @@ myChart.on('click', function (params) { const item = params.data getCarsJobDetails({ carCode: item.code }).then(res => { - activeCar.value = res.data + // getCarsJobDetails({ carCode: '鐨朅E5277' }).then(res => { + showModal.value = true + activeCar.value = { ...res.data, carCode: item.code } }) }) window.addEventListener('resize', function () {//鎵ц @@ -788,9 +803,15 @@ }) } const activeCar = ref({}) +const showModal = ref(false) const modalTab = ref(0) +const showMore = ref(false) const modalTabClick = (val) => { modalTab.value = val +} +const closeModal = () => { + showModal.value = false + activeCar.value = {} } @@ -879,11 +900,11 @@ initEchart1() }) } -const dataList6 = ref([]) +const data6 = ref({}) const getData6 = () => { wlstockList().then(res => { - const result = res.data.stockList || [] - dataList6.value = result + const result = res.data || [] + data6.value = result }) } @@ -917,8 +938,8 @@ var newSwiper1 = new Swiper('.two-swiper', { initialSlide: 0, direction: 'vertical', //绔栫洿鏂瑰悜 - slidesPerView: 7, - autoplay: autoplayFlag(dataList6.value, 7, 2000), + slidesPerView: 6, + autoplay: autoplayFlag(data6.value.stockList, 6, 2000), observer: true, //淇敼swiper鑷繁鎴栧瓙鍏冪礌鏃讹紝鑷姩鍒濆鍖杝wiperiper }) } @@ -1461,7 +1482,7 @@ .list { margin-top: 22px; - height: 240px; + height: 216px; overflow: hidden; scrollbar-width: none; @@ -1702,6 +1723,25 @@ } .tab1 { + height: 360px; + overflow: auto; + + .more_btn { + width: 116px; + height: 25px; + border-radius: 2px; + border: 1px solid #D2E0FF; + font-size: 12px; + display: flex; + align-items: center; + justify-content: center; + color: D2E0FF; + margin-left: 30px; + margin-top: 12px; + cursor: pointer; + } + + .item { display: flex; @@ -1748,6 +1788,10 @@ color: #fff; } + .ac { + color: #00F2F3; + } + .text { margin-bottom: 4px; } @@ -1761,6 +1805,9 @@ } .tab2 { + height: 360px; + overflow: auto; + .list { .item { width: 560px; @@ -1810,6 +1857,17 @@ } } } + + .empty { + display: flex; + justify-content: center; + align-items: center; + height: 340px; + + img { + width: 144px; + } + } } .modal_mask { -- Gitblit v1.9.3