From f880863b9292a4cc4c0a484f721bb87bf42e57ed Mon Sep 17 00:00:00 2001 From: yangan <yangan0921@163.com> Date: 星期五, 10 十一月 2023 17:32:32 +0800 Subject: [PATCH] 质检完成修改为处理完成 --- pages/customer-page/customer-index/fayunPlanDetails/fayunPlanDetails.vue | 585 ++++++++++++++++++++++++++++++++++++++++++++++++--------- 1 files changed, 489 insertions(+), 96 deletions(-) diff --git a/pages/customer-page/customer-index/fayunPlanDetails/fayunPlanDetails.vue b/pages/customer-page/customer-index/fayunPlanDetails/fayunPlanDetails.vue index 348131f..bd74b53 100644 --- a/pages/customer-page/customer-index/fayunPlanDetails/fayunPlanDetails.vue +++ b/pages/customer-page/customer-index/fayunPlanDetails/fayunPlanDetails.vue @@ -1,116 +1,509 @@ <template> - <view class="fayunPlan"> - <view> - <view class="compDetails"> - <view class="comp">{{ orderPlanDetail.compName }}</view> - <uni-table border stripe emptyText="鏆傛棤鏇村鏁版嵁"> - <uni-tr> - <uni-th align="left">鎬婚鍙栭噺</uni-th> - <uni-td align="left">{{ orderPlanDetail.fowerdsum || 0 }}寮�</uni-td> - </uni-tr> - <uni-tr> - <uni-th align="left">杞﹂槦鍜岃揣浠�</uni-th> - <uni-td align="left">{{ orderPlanDetail.fleetOrHuodaiNub || 0 }}寮�</uni-td> - </uni-tr> - <uni-tr> - <uni-th align="left">杞﹂槦</uni-th> - <uni-td align="left">{{ orderPlanDetail.cheduiList || 0 }}寮�</uni-td> - </uni-tr> - <uni-tr> - <uni-th align="left">璐т唬</uni-th> - <uni-td align="left">{{ orderPlanDetail.huodaiList || 0 }}寮�</uni-td> - </uni-tr> - <uni-tr> - <uni-th align="left">鍙告満</uni-th> - <uni-td align="left">{{ orderPlanDetail.sijiSum || 0 }}寮�</uni-td> - </uni-tr> - </uni-table> + <view class=""> + <view class="fayunPlan"> + <view class="plan-banner"> + <view class="top-container"> + <view class="back-icon" + @click="backPage"><u-icon name="arrow-left" + size="50" + color="#fff"></u-icon></view> + <view class="top-title">鍙戣繍璁″垝璇︽儏</view> + </view> + <view class="middle-container"> + <view class="dept-name"> + {{ deptName }} + <text v-show="deptName">({{ coalName }})</text> + </view> + <view class="dept-num"> + <text style="font-size: 46rpx; + font-weight: 400; + color: #FFFFFF; + text-shadow: 0rpx 4rpx 0rpx #1A66FE;"> + {{ orderPlanDetail.fowardSum || 0 }} + </text> + <text style="font-size: 24rpx; + font-weight: 400; + color: #F81414; + text-shadow: 0rpx 4rpx 0rpx #1A66FE;"> + /{{ (cars2||'') ||(carNum||'')||'' }} + </text> + </view> + </view> + <view class="bottom-container"> + <view class="bottom-block"> + <view class="bottom-content" + v-for="(item, index) in orderPlanDetail.huodaiList" + :key="index"> + <view class="forward-name">{{ item.huoDaiName }}</view> + <view class="forward-num"> + {{ item.fleetOrHuodaiNub }} + <text>寮�</text> + </view> + </view> + <view class="bottom-content" + v-for="(item, index) in orderPlanDetail.cheduiList" + :key="index"> + <view class="fleet-name">{{ item.cheduiName }}</view> + <view class="fleet-num"> + {{ item.fleetOrHuodaiNub }} + <text>寮�</text> + </view> + </view> + <view class="bottom-content"> + <view class="fleet-name">鍙告満</view> + <view class="fleet-num"> + {{ orderPlanDetail.sijiSum || 0 }} + <text>寮�</text> + </view> + </view> + </view> + </view> </view> - - <view class="compDetails"> - <view class="comp">棰勭害鎯呭喌</view> - <uni-table border stripe emptyText="鏆傛棤鏇村鏁版嵁"> - <uni-tr v-for="(item, index) in orderPlanDetail.yyDailyList"> - <uni-td align="left">{{ orderPlanDetail.yyDailyList }}</uni-td> - <uni-td align="left">{{ orderPlanDetail.yyDailyList }}寮�</uni-td> - </uni-tr> - </uni-table> + <view class="block-top"> + <combined-title title="閫氱煡鍗曞巻鍙�"></combined-title> + <view class="total"> + 鎬诲噣閲� + <text>{{ total.toFixed(2) || 0 }}</text> + </view> + </view> + <view class="main-banner"> + <view class="empty-pointer" + v-if="yyDailyList.length===0">鏆傛棤鏇村鏁版嵁</view> + <view class="main-block"> + <view class="main-container"> + <view class="main-container_content" + v-for="(item, index) in yyDailyList" + :key="index" + @click="showMore(item)"> + <view class="arrow-icon"><u-icon name="arrow-right" + size="30" + color="#999999"></u-icon></view> + <view class="divider"><u-divider></u-divider></view> + <view class="first-line"> + <view class="car-num">{{ item.carNo || '' }}</view> + <view class="order-type">{{ coalStatus[item.statusWeigh]||'' }}</view> + </view> + <view class="second-line"> + <view class="line-content"> + <view class="line-content_text">鍑�閲�</view> + <view class="line-content_num">{{ item.clean?item.clean.toFixed(2):'' || '' }} + </view> + </view> + <view class="line-content"> + <view class="line-content_text">浣欓噺</view> + <view class="line-content_num">{{ item.allowance.toFixed(2) || 0 }}</view> + </view> + </view> + </view> + </view> + </view> </view> </view> + <view class="white-block"></view> </view> </template> <script> -export default { - onLoad(value) { - console.log('椤甸潰鍔犺浇', value); - if (value.orderPlanId) { - this.orderPlanId = value.orderPlanId; - } - }, - data() { - return { - orderPlanId: null, - orderPlanDetail: {} - }; - }, - onShow(){ - this.init(); - }, - methods: { - init() { - this.GetOrderPlanDetail(); + import combinedTitle from '@/components/combined-title/combined-title.vue'; + export default { + components: { + combinedTitle }, - // 鑾峰彇鍙戣繍璁″垝璇︽儏 - GetOrderPlanDetail() { - this.$reqGet('xiangqingList', { orderPlanId: this.orderPlanId }).then(res => { - this.orderPlanDetail = res.data; - }); + onLoad(value) { + this.orderPlanId = value.orderPlanId; + this.orderCode = value.code; + this.cars2 = value.cars2 ? value.cars2 : null; + this.deptName = value.deptName; + this.coalName = value.coalName; + this.carNum = value.carNum ? value.carNum : null + console.log(value, '鍙戣繍璁″垝鍙傛暟'); + }, + data() { + return { + orderPlanId: null, + orderCode: null, + orderPlanDetail: {}, + coalStatus: ['鏈О閲�', '绉伴噸涓�', '楠岃川涓�', '绉伴噸瀹屾垚', '澶勭悊瀹屾垚'], + yyDailyList: [], + // 棰嗗彇鏁伴噺 + cars2: '', + coalName: '', + deptName: '', + total: 0, + carNum: '' + }; + }, + onShow() { + this.init(); + }, + methods: { + backPage() { + uni.navigateBack({ + delta: 1 + }); + }, + showMore(item) { + uni.navigateTo({ + url: `/pages/customer-page/customer-index/fayunPlanDetails/fayunPlanMore/fayunPlanMore?orderPlanId=${this.orderPlanId}&id=${item.id}` + }); + }, + init() { + this.GetOrderPlanDetail(); + }, + // 鑾峰彇鍙戣繍璁″垝璇︽儏 + GetOrderPlanDetail() { + uni.showLoading({ + title: '鍔犺浇涓�...' + }); + this.$reqGet('xiangqingList', { orderPlanId: this.orderPlanId }).then(res => { + if (res.code == 0) { + this.orderPlanDetail = res.data; + this.yyDailyList = res.data.yyDailyList; + if (res.data.yyDailyList) { + this.total = this.yyDailyList.reduce((prev, cur) => { + cur.clean = cur.clean ? cur.clean : 0 + return prev + cur.clean; + }, 0); + } else { + this.total = 0; + } + console.log(); + uni.hideLoading(); + } else { + this.$u.toast('鍔犺浇澶辫触锛岃绋嶅悗閲嶈瘯'); + uni.hideLoading(); + } + }); + } } - } -}; + }; </script> -<style lang="scss" scoped> -::v-deep.fayunPlan { - width: 100%; - margin: 0 auto; - display: flex; - flex-direction: column; - .compDetails { - width: 94%; - margin: vww(24) auto 0 auto; - .comp { - font-size: vww(16); - font-weight: 400; - padding: 0 vww(10); - height: vww(40); - line-height: vww(40); - border: 1px solid #ebeef5; - border-bottom: none; - background-color: #f5f5f5; +<style lang="scss" + scoped> + @mixin flex { + display: flex; + justify-content: space-between; + align-items: center; + } + + .empty-pointer { + position: absolute; + top: 50%; + left: 38%; + color: #909399; + } + + .white-block { + width: 100%; + height: vww(50); + margin-top: vww(10); + } + + ::v-deep.fayunPlan { + width: 100%; + margin: 0 auto; + background-color: #f4f4f4; + display: flex; + flex-direction: column; + + .plan-banner { + width: 100%; + background: linear-gradient(0deg, #ffffff 0%, #0055fe 100%); + background-size: contain; + position: relative; + top: 0; + + .top-container { + width: 468rpx; + height: 38rpx; + position: relative; + top: vww(48); + @include flex margin-left: vww(10); + + .top-title { + width: 226rpx; + height: 36rpx; + font-size: 38rpx; + font-weight: normal; + color: #fff; + line-height: 69rpx; + } + } + + .middle-container { + width: 626rpx; + height: 34rpx; + margin: vww(27) vww(31) 0 vww(31); + @include flex; + position: relative; + top: vww(54); + + .dept-name { + min-width: 100rpx; + font-size: 32rpx; + font-weight: normal; + color: #ffffff; + line-height: 69rpx; + text-shadow: 0rpx 4rpx 0rpx #1a66fe; + } + } + + .bottom-container { + width: 100%; + @include flex; + justify-content: center; + margin-top: vww(80); + + .bottom-block { + width: 690rpx; + min-height: 185rpx; + background: #ffffff; + box-shadow: 4rpx 6rpx 51rpx 0rpx rgba(73, 120, 240, 0.11); + border-radius: 20rpx; + @include flex; + justify-content: space-around; + flex-wrap: wrap; + padding: 0 vww(8); + + .bottom-content { + @include flex; + flex-direction: column; + height: vww(56); + margin-right: vww(5); + + .forward-name, + .fleet-name { + font-size: 28rpx; + font-weight: normal; + color: #757575; + line-height: 69rpx; + } + + .forward-num, + .fleet-num { + font-size: 40rpx; + font-weight: 400; + color: #303030; + line-height: 69rpx; + + text { + font-size: 30rpx; + } + } + } + } + } } - .uni-table { - .uni-table-tr { - padding: 0; - // .uni-table-th { - // height: vww(40); - // line-height: vww(40); - // padding: vww(5) vww(10); - // color: #111111; - // font-weight: 300; - // background: #f5f5f5; - // } - .uni-table-td { + + .block-top { + width: 94%; + margin: vww(15); + @include flex; + + .total { + height: 30rpx; + line-height: vww(15); + font-size: 28rpx; + font-weight: normal; + color: #757575; + + text { + width: 118rpx; + height: 30rpx; + line-height: vww(15); + font-size: 40rpx; + font-weight: 400; + color: #f81414; + } + } + } + + .main-banner { + width: 100%; + @include flex; + justify-content: center; + + .main-block { + width: 690rpx; + background: #ffffff; + box-shadow: 4rpx 6rpx 51rpx 0rpx rgba(73, 120, 240, 0.11); + border-radius: 20rpx; + + .main-container { + width: 100%; + @include flex; + justify-content: center; + flex-direction: column; + background-color: #fff; + + &_content { + width: 96%; + height: 194rpx; + @include flex; + flex-direction: column; + justify-content: space-around; + align-items: flex-start; + margin-top: vww(8); + position: relative; + + .arrow-icon { + position: absolute; + right: vww(10); + top: vww(17); + } + + .divider { + position: absolute; + width: 94%; + height: vww(1); + margin: 0 auto; + border-bottom: 1px soild #d6d6d6; + left: vww(15); + bottom: vww(18); + } + + .first-line { + width: 50%; + @include flex; + margin: 0 vww(15); + + .car-num { + height: 31rpx; + font-size: 30rpx; + font-weight: 300; + color: #303030; + } + + .order-type { + border: 2px solid #035cfb; + border-radius: 4rpx; + color: #035cfb; + padding: vww(2) vww(4); + text-align: center; + } + } + + .second-line { + width: 94%; + height: vww(14); + margin: 0 vww(15); + @include flex; + justify-content: space-between; + + .line-content { + width: 40%; + + @include flex &_text { + width: 69rpx; + height: 29rpx; + line-height: 29rpx; + font-size: 28rpx; + font-weight: 400; + color: #919090; + } + + &_num { + height: 29rpx; + line-height: 29rpx; + font-size: 38rpx; + font-weight: 400; + color: #035cfb; + } + } + } + } + } + } + } + + .fayunPlanBody { + width: 94%; + margin: 0 auto; + + .compDetails { + width: 94%; + margin: vww(24) auto 0 auto; + + .comp { font-size: vww(16); - font-weight: 300; + font-weight: 400; + padding: 0 vww(10); height: vww(40); line-height: vww(40); - padding: vww(5) vww(10); - color: #111111; + border: 1px solid #ebeef5; + border-bottom: none; + background-color: #f5f5f5; + } + } + + .card { + width: 94%; + height: vww(150); + margin: vww(24) auto 0 auto; + background-color: #fff; + border-radius: 4px; + box-shadow: 0 2px 12px 0 #ebeef5; + position: relative; + display: flex; + justify-content: center; + align-items: flex-start; + + .coal-status, + .coal-clean, + .coal-allowance, + .coal-carNo { + width: 50%; + margin-top: vww(30); + height: vww(50); + text-align: center; + + .label-title { + color: #909399; + } + + .label-value { + min-width: vww(85); + margin-top: vww(10); + color: #606266; + } + } + + .more-button { + width: vww(60); + position: absolute; + top: vww(100); + display: flex; + justify-content: center; + } + } + + // 琛ㄦ牸鏍峰紡 + .uni-table { + .uni-table-tr { + padding: 0; + border: vww(1) solid #c6c6c6; + + .uni-table-th { + font-size: vww(14); + height: vww(30); + line-height: vww(30); + padding: vww(5) vww(10); + color: #111111; + font-weight: 500; + background: #e2e2e2; + } + + .uni-table-td { + font-size: vww(14); + font-weight: 400; + height: vww(30); + line-height: vww(30); + padding: vww(5) vww(10); + color: #111111; + } } } } } -} -</style> +</style> \ No newline at end of file -- Gitblit v1.9.1