From 589231104e74c362512f656f8a50b4bb6c26e182 Mon Sep 17 00:00:00 2001 From: yangan <yangan0921@163.com> Date: 星期三, 05 六月 2024 13:34:56 +0800 Subject: [PATCH] feat:库管确认装卸 及查看详情功能 --- pages/loadUnload-page/selectTarget/selectTarget.vue | 431 +++++++++++++++++++++++++++++++++++++++++++++++------ 1 files changed, 377 insertions(+), 54 deletions(-) diff --git a/pages/loadUnload-page/selectTarget/selectTarget.vue b/pages/loadUnload-page/selectTarget/selectTarget.vue index cd780e7..dc157c4 100644 --- a/pages/loadUnload-page/selectTarget/selectTarget.vue +++ b/pages/loadUnload-page/selectTarget/selectTarget.vue @@ -1,6 +1,13 @@ <template> <view class="main"> - <u--form labelPosition="top" + <!-- 褰撳墠閫夋嫨浠撳簱 --> + <view class="top-tag"> + <u-tag + :text="dataForm.firstClass ? dataForm.firstClass : '璇烽�夋嫨浠撳簱'" + @click="firstClassSelect" + ></u-tag> + </view> + <!-- <u--form labelPosition="top" labelWidth="20%" :borderBottom="false" :model="dataForm" @@ -17,62 +24,149 @@ size="30"></u-icon></u-cell> </u-cell-group> </u-form-item> - <!-- <u-form-item label="鐓や粨" - prop="secondClass" - :borderBottom="false"> - <u-cell-group> - <u-cell :title="dataForm.secondClass" - value="璇烽�夋嫨" - @click="secondClassSelect" - :disabled="!dataForm.firstClass"> - <u-icon name="arrow-right" - slot="right-icon" - size="30"></u-icon></u-cell> - </u-cell-group> - </u-form-item> - <u-form-item label="纾呭崟" - prop="orderType" - :borderBottom="false"> - <u-cell-group> - <u-cell :title="dataForm.orderType" - :value="isOrderType" - @click="orderTypeSelect"> - <view slot="right-icon" - @click.stop="cleanOrderType"> - <u-icon :name="!dataForm.orderType?'arrow-right':'close-circle'" - size="30"></u-icon> - </view> - </u-cell> - </u-cell-group> - </u-form-item> --> - </u--form> - <view class="coal-name" - v-show="coalList.length!==0"> - <u-checkbox-group v-model="checkedCoal" - placement="column" - @change="checkboxChange" - size="30"> - <u-checkbox :customStyle="{marginBottom: '8px',fontSize:'20px'}" - v-for="(item, index) in coalList" - :key="item.id" - :label="item.name" - :name="item.name" - labelSize='40' - iconSize='40'></u-checkbox></u-checkbox-group> - </view> - <view style="margin-top: 20rpx;"> + + </u--form> --> + + <!-- <view style="margin-top: 20rpx;"> <u-button type="primary" shape="circle" text="鏌ョ湅璇ヤ粨搴撴敹鍙戝崟" @click.stop="formHandle"></u-button> - </view> + </view> --> <!-- 鐓ゅ満 --> + <view class='div-box'> + <u-empty mode="data" + icon="http://cdn.uviewui.com/uview/empty/data.png" + text="鏆傛棤鏁版嵁" + textSize="30" + iconSize="1000" + v-if="detailData.length===0"></u-empty> + <!-- 娓叉煋鍖哄煙 --> + <zh-collapse @change='change' accordion v-for="item,i in detailData" + :key="i"> + <zh-collapse-item + class="collItem"> + <view class="" slot='title'> + <view class="history-information"> + <view class="first"> + <view class="">{{ item.deptName || '' }}</view> + <view class=""><u-icon name="arrow-right" + color="#999999" + size="40"></u-icon></view> + </view> + <view class="second"> + <view class="coal-name">{{ item.coalName || '' }}</view> + <view class="order-type">{{ item.orderType || '' }}</view> + </view> + <view class="third"> + <view class="third-line"> + <view class="third-line_text">棰嗗彇鏁�:</view> + <view class="third-line_num">{{ item.cars2 }}</view> + </view> + <view class="third-line"> + <view class="third-line_text">鍓╀綑鏁�:</view> + <view class="third-line_num" + v-if="roleType == 1">{{ item.carNumSurplus1 }}</view> + <view class="third-line_num" + v-else-if="roleType == 2">{{ item.carNumSurplus }}</view> + </view> + <view class="third-line"> + <view class="third-line_text">鎻愮叅鍗曚釜鏁�:</view> + <view class="third-line_num">{{ item.tmCount }}</view> + </view> + </view> + <view class="fourth"> + <view class="fourth-icon"> + <view + style="width: 24rpx;height: 24rpx;line-height: 24rpx;background: url('https://mx.jzeg.cn:9096/appimg/image/banner/clock.png') no-repeat;background-size: cover"> + </view> + </view> + <view class="senddate">{{ item.sendDate }}</view> + </view> + <view class="fourth"> + <view class="fourth-icon"> + <view + style="width: 26rpx;height: 26rpx;line-height: 26rpx;background: url('https://mx.jzeg.cn:9096/appimg/image/banner/carnNUm.png') no-repeat;background-size: cover;"> + </view> + </view> + <view class="senddate">{{ item.orderCode }}</view> + </view> + </view> + + </view> + <view class="" slot='cont'> + <view class="table"> + <uni-table border stripe + emptyText="鏆傛棤鏇村鏁版嵁"> + <uni-tr> + <uni-th align="center" width='100'>浜у搧</uni-th> + <uni-th align="center">杞︾墝鍙�</uni-th> + <uni-th align="center" width='100'>绫诲瀷</uni-th> + <uni-th align="center" width='100'>鐨噸</uni-th> + <uni-th align="center" width='100'>姣涢噸</uni-th> + <!-- <uni-th align="center">浠撳簱</uni-th> --> + <uni-th align="center" width='100'>鐘舵��</uni-th> + <uni-th width='200' class="fixed" align="center">鎿嶄綔</uni-th> + </uni-tr> + <uni-tr v-for="(subItem, index) in item.tmTaskCoalList" :key="index"> + <uni-td align="center"> + <view>{{ subItem.productName }}</view></uni-td> + <uni-td align="center"> + <view style="width:150rpx">{{ subItem.carNo }}</view></uni-td> + <uni-td> + <view class="name">{{ subItem.orderType }}</view> + </uni-td> + <uni-td> + <view class="name">{{ subItem.skin }}</view> + </uni-td> + <uni-td> + <view class="name">{{ subItem.hair }}</view> + </uni-td> +<!-- + 聽 <uni-td align="center"> + <view>{{ subItem.bunkerName }}</view></uni-td> --> + <uni-td align="center"> + <view>{{ subItem.statusView }}</view></uni-td> + <uni-td align="center"> + <view class="btnBox"> + <text @click="viewDetail(subItem)">鏌ョ湅</text> + <text v-if="subItem.flag" @click="enterOk(subItem)">纭瑁呭嵏</text> + </view></uni-td> + </uni-tr> + </uni-table> + </view> + </view> + </zh-collapse-item> + </zh-collapse> + + </view> <u-action-sheet :actions="firstClassActionsList" :show="firstClassShow" cancelText='鍙栨秷' :closeOnClickOverlay='true' @close='firstClassClose' @select="firstClassSelectClick"></u-action-sheet> + <u-modal :show="enterZx" + :title="'鎻愮ず'" + @close="closeModal" + @cancel="cancelModal" + @confirm="confirmModal" + :closeOnClickOverlay="true" + :showCancelButton="true"> + <view class="slot-content"> + 鏄惁纭瑁呭嵏锛� + <view v-if="isNumOk"> + <text>浜у搧鍚嶇О锛歿{activeObj.productName}}</text> + <view> + <u--input + placeholder="璇疯緭鍏ユ暟閲�" + border="surround" + v-model="checkNum" + ></u--input> + </view> + </view> + </view> + </u-modal> <!-- 鐓や粨 --> <!-- <u-action-sheet :actions="secondClassActionsList" :show="secondClassShow" @@ -101,6 +195,8 @@ bunkerId:"" }, index: '', + enterZx:false, + isNumOk:false, // 鐓ゅ満鎿嶄綔鑿滃崟 firstClassActionsList: [], firstClassShow: false, @@ -109,7 +205,10 @@ secondClassShow: false, coalList: [], checkedCoal: [], + checkNum:'', + activeObj:{}, userInfo: {}, + detailData:[], filedId: "", selectedCoal: [], orderTypeShow: false, @@ -128,6 +227,13 @@ }; }, methods: { + viewDetail(item){ + //鏌ョ湅鏀跺彂鍗曡鎯� + uni.navigateTo({ + url: `/pages/loadUnload-page/loadUnlaodPageDetail/detail?id=${item.id}&checkId=${item.checkId}` + }); + + }, getUserInfo() { this.$reqGet('getUserEntity').then(res => { this.userInfo = res.data; @@ -147,11 +253,6 @@ this.dataForm.bunkerId = res.data[0].id; uni.setStorageSync('bunkerId',res.data[0].id) this.dataForm.firstClass = res.data[0].name; - setTimeout(()=>{ - uni.navigateTo({ - url: `/pages/loadUnload-page/loadUnload-detail/loadUnload-detail?bunkerId=${this.dataForm.bunkerId}` - }) - },300) } } else { @@ -167,10 +268,32 @@ firstClassClose() { this.firstClassShow = false }, + getDetailData(){ + uni.showLoading({ + title:'鍔犺浇涓�' + }) + this.$reqGet('getTaskCoalListByBunkerId', { bunkerId:this.dataForm.bunkerId }).then(res => { + if (res.code === 0) { + this.detailData = res.data.map(item=>{ + item.tmTaskCoalList.map(el=>{ + el.flag = el.isPretendDischar ? false : true + return el + }) + return item; + }); + console.log(this.detailData,'detailData') + uni.hideLoading(); + } else { + this.$u.toast('鍔犺浇澶辫触') + } + }) + + }, firstClassSelectClick(val) { this.dataForm.firstClass = val.name; this.dataForm.bunkerId= val.id; - uni.setStorageSync('bunkerId', val.id) + uni.setStorageSync('bunkerId', val.id); + this.getDetailData(); this.filedId = val.id }, // 鑾峰彇鐓や粨 @@ -223,7 +346,46 @@ }) }) + }, + change(){ + + }, + close(){ + + }, + open(){}, + enterOk(item){ + console.log('123',item) + this.activeObj = item; + if(item.productQuantity){ + this.isNumOk = true; + } + this.enterZx = true; + }, + closeModal(){ + this.enterZx = false; + }, + cancelModal(){ + this.enterZx = false; + }, + confirmModal(){ + this.enterZx = false; + this.$reqPost('confirmLoadAndUnload',{ + id: this.activeObj.id, + productQuantity:this.isNumOk ? this.checkNum :this.activeObj.skin, + isPretendDischar:this.activeObj.isPretendDischar + },'json').then(res=>{ + console.log(res,'rez') + if(res.code === 0){ + this.$u.toast('鎿嶄綔鎴愬姛'); + this.getDetailData(); + + } + }) } + + + }, onShow(){ uni.showLoading({ @@ -251,12 +413,64 @@ <style lang="scss" scoped> + .table{ + width: 94%; + margin-left: 20rpx; + overflow-x: auto; + /deep/ .uni-table-th{ + font-size: 12px; + } + /deep/ .uni-table-td { + font-size: 12px; + } + /deep/ .uni-table{ + min-width: 340rpx!important; + } + /deep/ .uni-table-body-wrapper { + position: relative; +} + /deep/ .uni-table-body { + display: flex; +} +.fixed { + position: sticky; + right: 0; + z-index: 1; + background-color: #ffffff; +} + + } + .btnBox{ + min-width: 150rpx; + display: flex; + justify-content: space-between; + text{ + color: #035cfb; + } + } .main { width: 94%; margin: 10px; // margin-top: vww(100); position: relative; - top: vww(-120); + top: vww(-160); + .top-tag{ + width: 25%; + height: 100rpx; + margin-left: 70%; + display: flex; + /* margin-top: 40rpx; */ + color: #fff; + justify-content: space-between; + } + + .div-box{ + width: 100%; + /deep/ .u-collapse{ + background: #fff; + } + + } } .slide-fade-enter-active { @@ -264,11 +478,120 @@ } .coal-name { - width: 95%; + width: 75%; min-height: vww(100); .u-checkbox-group { .u-checkbox {} } } + .box{ + display: flex; + flex-direction: column; + width: 100%; + .box-top{ + width: 100%; + height: 100rpx; + display: inline-block; + display: flex; + justify-content: space-between; + align-items: center; + + } + } + .collItem{ + margin-top: 30rpx; + /deep/ .content{ + background: none!important; + } + } + .history-information { + + background: #ffffff; + border-radius: 20rpx; + @include flex flex-direction: column; + padding: 10px; + align-items: flex-start; + justify-content: space-evenly; + box-shadow: 0rpx 0rpx 14rpx 0rpx rgba(73, 120, 240, 0.14), 0rpx 7rpx 45rpx 0rpx rgba(73, 120, 240, 0.12); + + + .first { + width: 96%; + height: 34rpx; + font-size: 32rpx; + font-weight: 300; + color: #303030; + @include flex; + margin: vww(10) vww(10) 0; + } + + .second { + width: 100%; + height: 31rpx; + font-size: 30rpx; + font-weight: 300; + color: #515151; + margin: vww(10) vww(10) 0; + @include flex; + justify-content: flex-start; + + .coal-name { + min-width: vww(20); + height: vww(20); + margin-right: vww(21); + } + + .order-type { + height: 45rpx; + color: #035cfb; + border: 2px solid #035cfb; + border-radius: 4rpx; + padding: vww(2) vww(4); + text-align: center; + } + } + + .third { + width: 96%; + height: 31rpx; + font-size: 30rpx; + font-weight: 300; + color: #515151; + margin: vww(10) vww(10) 0; + @include flex; + + .third-line { + @include flex; + + &_text { + color: #919090; + } + + &_num { + color: #035cfb; + } + } + } + + .fourth { + width: 100%; + height: 31rpx; + font-size: 30rpx; + font-weight: 300; + color: #515151; + margin: vww(10) vww(10) 0; + @include flex; + + .fourth-icon { + width: vww(13); + height: vww(13); + margin-right: vww(14); + } + + .senddate { + flex: 1; + } + } + } </style> \ No newline at end of file -- Gitblit v1.9.1