From 71ba67906896248aa2df5e70756b997fad9a9033 Mon Sep 17 00:00:00 2001 From: wk Date: 星期一, 09 九月 2024 17:54:18 +0800 Subject: [PATCH] feat:门卫 --- pages/doorkeeper-page/doorkeeper-index/doorkeeper-index.vue | 686 +++++++++++++++++++++++++++++++++++++++++++++++--------- 1 files changed, 574 insertions(+), 112 deletions(-) diff --git a/pages/doorkeeper-page/doorkeeper-index/doorkeeper-index.vue b/pages/doorkeeper-page/doorkeeper-index/doorkeeper-index.vue index be323c3..474e6f5 100644 --- a/pages/doorkeeper-page/doorkeeper-index/doorkeeper-index.vue +++ b/pages/doorkeeper-page/doorkeeper-index/doorkeeper-index.vue @@ -1,47 +1,161 @@ <template> <view class="appointment"> - <view class="wait-collection" - style="background: url('https://mx.jzeg.cn:9096/appimg/image/banner/diverbanner.png') no-repeat;background-size:contain"> + <view class="searchview"> + <u-search @change="change" :searchIconSize="40" placeholder="璇疯緭鍏ヨ溅鐗屽彿" height="60" clearabled v-model="carNo" @search="search" @custom="custom" @clear="clear" > + </u-search > </view> - <uni-table border - stripe - emptyText="鏆傛棤鏇村鏁版嵁"> - <uni-tr> - <uni-th align="center">鍙告満</uni-th> - <uni-th align="center">浜у搧</uni-th> - <uni-th align="center">杞︾墝鍙�</uni-th> - <uni-th align="center">鎵嬫満鍙�</uni-th> - <uni-th align="center">鎿嶄綔</uni-th> - </uni-tr> - <uni-tr v-for="(item, index) in driverBillOfLoadingData" - :key="item.id"> - <uni-td align="center">{{ item.driver }}</uni-td> - <uni-td align="center">{{ item.productName || '' }}</uni-td> - <uni-td align="center">{{ item.carNo || '' }}</uni-td> - <uni-td align="center">{{ item.phone || '' }}</uni-td> - <uni-td><u-button text="閫夋嫨" - type="primary" - @click="yuYueBtnClick(item)"></u-button></uni-td> - </uni-tr> - </uni-table> - <view v-show="isshow"> - <uni-table border - stripe - type="selection" - @selection-change="selectionChange" - emptyText="鏆傛棤鏇村鏁版嵁"> - <uni-tr> - <uni-th align="center">妫�娴嬮」</uni-th> - </uni-tr> - <uni-tr v-for="(item, index) in inspectData" - :key="item.id"> - <uni-td align="center">{{ item.title }}</uni-td> - </uni-tr> - </uni-table> - <view class="fourth-line"> - <view class="button-img" - @click.stop="toAppointmentClick(item)">纭畾</view> + <u-collapse + ref="myCollapse" + :value='["1"]' + > + <u-collapse-item + name='1' + class="collItem" + :title="'寰呮鏌ュ徃鏈�'"> + <view style="position: relative;top: -40px;"> + <u-empty mode="data" + icon="http://cdn.uviewui.com/uview/empty/data.png" + textSize="30" + iconSize="1000" + text="鏆傛棤杞﹁締" + v-if="driverBillOfLoadingData.length == 0"></u-empty> + </view> + <view class="collection-form"> + <view class="collection-form-item" + v-for="(item, index) in driverBillOfLoadingData" + :key="index"> + <view class="first-line"> + <view class="dispatch-receive"> + <view class="dispatch-dept">{{ item.code || '' }}</view> + <view class="black-bar"></view> + <view class="dispatch">{{ item.customerName ||'' }}</view> + </view> + <view class="point-number"> + <text class="order-type">{{ item.productNames?limitString(item.productNames,20,'...'):'' || '' }}</text> + </view> + </view> + <view class="second-line"> + <view class="coal-name"> + <view class="dispatch-dept">{{ item.carNo || '' }}</view> + <view class="black-bar"></view> + <view class="dispatch">{{ item.driver ||'' }}</view> + <view class="black-bar"></view> + <text>{{ item.phone || '' }}</text> + </view> + </view> + <view class="third-line"> + <view class="time-icon"> + <view + style="width: 24rpx;height: 24rpx;line-height: 24rpx;background: url('https://wrzs.czjlchem.com:9090/appimg/image/banner/clock.png') no-repeat;background-size: cover"> + </view> + </view> + <view class="send-date">{{ item.sendDate }} {{ item.startTime || '' }}-{{item.endTime || ""}}</view> + </view> + <view class="fourth-line"> + <view class="receive" + v-if="item.roadTransportId" + @click.stop="lookRoad(item)"> + <view class="button-image">鍓ф瘨杩愯緭璇�</view> + </view> + <view class="forward" + @click.stop="yuYueBtnClick(item)"> + <view class="button-image">妫�鏌�</view> + </view> + </view> </view> + </view> + </u-collapse-item> + </u-collapse> + <u-collapse + ref="myCollapse" + :value='["2"]' + > + <u-collapse-item + name='2' + class="collItem" + :title="'宸叉鏌ュ徃鏈�'"> + <view style="position: relative;top: -40px;"> + <u-empty mode="data" + icon="http://cdn.uviewui.com/uview/empty/data.png" + textSize="30" + iconSize="1000" + text="鏆傛棤杞﹁締" + v-if="driverBillOfLoadingDatas.length == 0"></u-empty> + </view> + <view class="collection-form" style="margin-bottom: 60px;"> + <view class="collection-form-item" + v-for="(item, index) in driverBillOfLoadingDatas" + :key="index"> + <view class="first-line"> + <view class="dispatch-receive"> + <view class="dispatch-dept">{{ item.code || '' }}</view> + <view class="black-bar"></view> + <view class="dispatch">{{ item.customerName ||'' }}</view> + </view> + <view class="point-number"> + <text class="order-type">{{ item.productNames?limitString(item.productNames,20,'...'):'' || '' }}</text> + </view> + </view> + <view class="second-line"> + <view class="coal-name"> + <view class="dispatch-dept">{{ item.carNo || '' }}</view> + <view class="black-bar"></view> + <view class="dispatch">{{ item.driver ||'' }}</view> + <view class="black-bar"></view> + <text>{{ item.phone || '' }}</text> + </view> + </view> + <view class="third-line"> + <view class="time-icon"> + <view + style="width: 24rpx;height: 24rpx;line-height: 24rpx;background: url('https://wrzs.czjlchem.com:9090/appimg/image/banner/clock.png') no-repeat;background-size: cover"> + </view> + </view> + <view class="send-date">{{ item.inTime?item.inTime.slice(10,19):null }} </view> + </view> + <view class="fourth-line"> + <view class="receive" + v-if="item.roadTransportId" + @click.stop="lookRoad(item)"> + <view class="button-image">鍓ф瘨杩愯緭璇�</view> + </view> + </view> + </view> + </view> + </u-collapse-item> + </u-collapse> + <u-popup :show="imgshow" + @close="closeimg" + @open="openimg" + mode="center" + round="10"> + <view class="imgrPopup"> + <u--image :showLoading="true" + :src="certificateImg != null ? BaseUrl + certificateImg : ''" + width="100%" + height="400rpx" + @click="imageClick(certificateImg)"> + <view slot="error" + style="font-size: 24rpx;">鍔犺浇澶辫触</view> + </u--image> + <view class="driveruser"> + <view>鍙告満锛歿{ysData.driverName}}</view> + </view> + <view class="driveruser"> + <view>鎶艰繍鍛橈細{{ysData.supercargoInfo?ysData.supercargoInfo.split("|")[0]:null}}</view> + <view>鎵嬫満鍙凤細{{ysData.supercargoInfo?ysData.supercargoInfo.split("|")[2]:null}}</view> + </view> + </view> + </u-popup> + <view class="previewImage-container"> + <u-popup :show="previewImageShow" + mode="center" + @close="previewImageClose" + @open="previewImageOpen"> + <u--image :src="previewImageSrc != null ? BaseUrl + previewImageSrc : ''" + width="750rpx" + height="800rpx"></u--image> + </u-popup> </view> <u-popup :show="show" @close="close" @@ -49,68 +163,106 @@ mode="center" round="10"> <view class="receiverPopup"> + <uni-table border + stripe + type="selection" + @selection-change="selectionChange" + emptyText="鏆傛棤鏇村鏁版嵁"> + <uni-tr> + <uni-th align="center">妫�娴嬮」</uni-th> + </uni-tr> + <uni-tr v-for="(item, index) in inspectData" + :key="item.id"> + <uni-td align="center">{{ item.title }}</uni-td> + </uni-tr> + </uni-table> <view class="receiverPopup__title"><text>纭畾妫�鏌ュ畬姣�</text></view> <view class="receiverPopup__btn"><u-button text="纭畾" type="primary" @click="popClick" - :disabled="canClick" :loading="ClickLoading"></u-button></view> </view> </u-popup> + <view class="logoutModel"> + <u-modal :show="logoutShow" + :title="logoutTitle" + showCancelButton + :content="logoutContent" + @confirm="logoutConfirm" + @cancel="logoutCancel"></u-modal> + </view> + <view class="falseModel"> + <u-modal :show="falseShow" + :title="logoutTitle" + showCancelButton + :content="logoutContent" + @confirm="falseConfirm" + @cancel="falseCancel"></u-modal> + </view> </view> </template> <script> + import { BaseUrl } from '@/api/publicInterface.js'; + import combinedTitle from '@/components/combined-title/combined-title.vue'; + import previewImage from '@/components/kxj-previewImage/kxj-previewImage.vue'; export default { components: { + previewImage, }, data() { return { show: false, // 寮瑰嚭鍏ㄩ儴棰嗗彇鎻愮ず driverBillOfLoadingData:[], + driverBillOfLoadingDatas:[], inspectData:[], isAllSelected:false, - isshow:false, - form:{}, - ClickLoading:false + form:{}, + BaseUrl, + carNo:'', + previewImageShow:false, + imgshow:false, + ClickLoading:false, + certificateImg:"", + logoutShow: false, + falseShow:false, + logoutTitle: '鎻愮ず', + logoutContent: '鏄惁妫�鏌ュ畬姣�', + previewImageSrc:"", + ysData:{} } }, onShow() { this.init(); }, methods: { - yuYueBtnClick(item){ - this.inspectData=JSON.parse(item.inspectedResult) - this.form=item - this.isshow=true + limitString(str, limit, suffix = '...') { + if (str.length <= limit) return str; + return str.slice(0, limit) + suffix; }, - selectionChange(items){ - const allIds = this.inspectData.map(item => item); - this.isAllSelected = items?.detail.index.length === allIds.length - }, - init() { - this.isAllSelected=false - this.TaskCoalList(); - this.form={} + falseConfirm(){ this.inspectData=[] - this.isshow=false + uni.showLoading({ title: '鍔犺浇涓�...' }); + this.$reqPost('addCheckLog',{ + carNo:this.form.carNo, + taskId:this.form.id, + taskcode:this.form.code, + }, 'json').then(res => { + if (res.code === 0) { + uni.$u.toast('妫�鏌ユ垚鍔�') + this.form={} + this.ClickLoading = false; + this.show = false; + this.TaskCoalList() + this.falseShow = false; + } else { + uni.$u.toast(res.msg ? res.msg : '妫�鏌ュけ璐�') + this.falseShow = false; + } + }) }, - toAppointmentClick(){ + logoutConfirm() { if(this.isAllSelected==true){ - let arr= this.driverBillOfLoadingData.map(i=>{ - return { - carNo:i.carNo, - taskId:i.id, - taskcode:i.code, - } - }) - this.show = true; - }else{ - uni.$u.toast('蹇呴』鍏ㄩ儴妫�娴�') - } - - }, - popClick() { this.ClickLoading = true; this.inspectData=this.inspectData.map(item=>{ return { @@ -131,38 +283,173 @@ this.ClickLoading = false; this.inspectData=[] this.show = false; - this.isshow=false + this.logoutShow = false; this.TaskCoalList() } else { uni.$u.toast(res.msg ? res.msg : '妫�鏌ュけ璐�') + this.logoutShow = false; } }) + }else{ + uni.$u.toast('蹇呴』鍏ㄩ儴妫�娴�') + } + }, + logoutCancel() { + this.logoutShow = false; + }, + falseCancel() { + this.falseShow = false; + }, + previewImageClose() { + this.previewImageShow = false; + }, + previewImageOpen() {}, + imageClick(data) { + this.previewImageSrc = data; + this.$nextTick(() => { + this.previewImageShow = true; + }); + }, + lookRoad(item){ + this.$reqGetId('getById', item.roadTransportId).then(res => { + this.certificateImg=res.data.certificateImg + this.ysData=res.data + this.imgshow=true + }); + }, + yuYueBtnClick(item){ + let char = "杩愯緭璇�"; + if (item.inspectedResult.includes(char)) { + if(item.roadTransportId){ + if(item.inspectedResult){ + this.inspectData=JSON.parse(item.inspectedResult) + this.form=item + this.show = true; + }else{ + this.inspectData=[] + this.form=item + uni.showLoading({ title: '鍔犺浇涓�...' }); + this.$reqPost('addCheckLog',{ + carNo:this.form.carNo, + taskId:this.form.id, + taskcode:this.form.code, + }, 'json').then(res => { + if (res.code === 0) { + uni.$u.toast('妫�鏌ユ垚鍔�') + this.form={} + this.ClickLoading = false; + this.show = false; + this.TaskCoalList() + } else { + uni.$u.toast(res.msg ? res.msg : '妫�鏌ュけ璐�') + } + }) + } + }else{ + uni.$u.toast('璇ュ徃鏈烘湭涓婁紶杩愯緭璇侊紒') + } + } else { + if(item.inspectedResult){ + this.inspectData=JSON.parse(item.inspectedResult) + this.form=item + this.show = true; + }else{ + this.falseShow = true; + this.form=item + } + } + + }, + selectionChange(items){ + const allIds = this.inspectData.map(item => item); + this.isAllSelected = items?.detail.index.length === allIds.length + }, + init() { + this.isAllSelected=false + this.TaskCoalList(); + this.form={} + this.inspectData=[] + this.certificateImg="" + }, + popClick() { + this.logoutShow = true; }, open() {}, close() { this.show = false; + }, + openimg() {}, + closeimg() { + this.imgshow = false; }, // 鍙告満棣栭〉鍒楄〃 TaskCoalList() { uni.showLoading({ title: '鍔犺浇涓�...' }); - this.$reqGet('getCheckTaskCoal',{flag:0}).then(res => { - uni.hideLoading(); - this.driverBillOfLoadingData = res.data; - }); - + if(!this.carNo){ + this.$reqGet('getCheckTaskCoal',{flag:0}).then(res => { + uni.hideLoading(); + this.driverBillOfLoadingData = res.data; + uni.stopPullDownRefresh(); + }); + }else{ + this.$reqGet('getCheckTaskCoal',{flag:0,carNo:this.carNo}).then(res => { + uni.hideLoading(); + this.driverBillOfLoadingData = res.data; + uni.stopPullDownRefresh(); + }); + } + if(!this.carNo){ + this.$reqGet('getAlreadyCheckTaskCoal',{flag:0}).then(res => { + uni.hideLoading(); + this.driverBillOfLoadingDatas = res.data; + uni.stopPullDownRefresh(); + }); + }else{ + this.$reqGet('getAlreadyCheckTaskCoal',{flag:0,carNo:this.carNo}).then(res => { + uni.hideLoading(); + this.driverBillOfLoadingDatas = res.data; + uni.stopPullDownRefresh(); + }); + } }, + change(res) { + }, + search(res) { + this.TaskCoalList() + }, + clear(res) { + this.carNo="" + }, + custom(res) { + } } }; </script> <style lang="scss" scoped> + .searchview{ + margin: 20rpx 0; + height: 100rpx; + u-search{ + width: 100rpx; + } + } + .imgrPopup{ + width: 80vw; + background-color: #ffffff; + .driveruser{ + display: flex; + justify-content: space-between + } + } .receiverPopup { - height: vww(110); - width: 300rpx; + height: vww(153); + width: 60vw; .receiverPopup__title { + font-size: 1.4vw; margin: vww(10) auto 0; width: 80%; text-align: center; @@ -178,10 +465,19 @@ } } } - .wait-collection { - width: 100%; - height: 600rpx; - } + /deep/.u-button { + width: 100%; + height: 28px !important; + line-height: 40px; + padding: 0 12px; + font-size: 28rpx; + font-weight: 300; + color: #ffffff; + background: #497bfb !important; + letter-spacing: 4rpx; + border-radius: 37rpx 37rpx 37rpx 37rpx !important; + box-shadow: 2rpx 3rpx 13rpx 0rpx rgba(43, 98, 239, 0.5), 0rpx 0rpx 9rpx 0rpx rgba(247, 250, 253, 0.29); + } ::v-deep.appointment { .appointment-description { margin: vww(8) 0; @@ -194,32 +490,7 @@ color: #252525; } } - @mixin fourthLine { - width: 64%; - height: vww(68); - display: flex; - align-items: center; - position: relative; - left: vww(102); - bottom: vww(3); - .button-img { - width: vww(122); - height: vww(41); - background: url('https://mx.jzeg.cn:9096/appimg/image/banner/button.png') no-repeat; - background-size: cover; - font-size: 28rpx; - font-weight: 300; - color: #ffffff; - text-align: center; - line-height: vww(40); - - } - } - .fourth-line { - @include fourthLine; - } - // 琛ㄦ牸 .uni-table-scroll { width: 100%; @@ -227,25 +498,29 @@ .uni-table { min-width: 0 !important; - + .checkbox { + background: #ffffff; + } .uni-table-tr { padding: 0; - font-size: vww(10); .uni-table-th { height: vww(32); line-height: vww(20); padding: vww(5) vww(10); color: #111111; + font-size: 2vw; font-weight: 550; - background: #f5f5f5; + background: #ffffff; } .uni-table-td { height: vww(32); line-height: vww(20); padding: vww(5) vww(5); + font-size: 1.5vw; color: #111111; + background: #ffffff; .u-button { height: vww(23); } @@ -254,4 +529,191 @@ } } } + .wait-appointment, + .Reserved { + position: relative; + top: vww(-120); + } + @mixin flex { + display: flex; + justify-content: space-between; + align-items: center; + } + .collection-form-item { + margin: 0 vww(15); + width: 95%; + height: 370rpx; + background: #ffffff; + box-shadow: 4rpx 6rpx 25rpx 0rpx rgba(73, 120, 240, 0.15); + border-radius: 20rpx; + overflow: hidden; + @include flex; + flex-direction: column; + position: relative; + align-items: flex-start; + margin-top: vww(10); + + .first-line { + width: 94%; + height: vww(30); + margin: vww(10) vww(16) 0 vww(16); + display: flex; + justify-content: space-between; + + + .dispatch-receive { + width: 70%; + display: flex; + justify-content: flex-start; + align-items: center; + + .dispatch-dept { + + display: flex; + align-items: center; + } + + .black-bar { + width: 2rpx; + height: 30rpx; + background: #515151; + margin-left: vww(12); + } + + .dispatch { + margin-left: vww(12); + min-width: vww(50); + } + + } + + .point-number { + width: 33%; + .order-type { + color: #035cfb; + border-radius: 4rpx; + text-align: center; + } + // text { + // font-size: 24rpx; + // font-weight: 400; + // color: #c78a64; + // } + + // .residue { + // font-size: 40rpx; + // font-weight: 400; + // color: #f81414; + // } + } + } + + .second-line { + width: 100%; + height: vww(30); + margin-left: vww(16); + display: flex; + align-items: center; + justify-content: flex-start; + + .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: 0 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 { + height: vww(30); + margin-left: vww(15); + display: flex; + justify-content: flex-start; + align-items: center; + + .send-date { + margin-left: vww(14); + height: 24rpx; + line-height: 24rpx; + font-size: 28rpx; + font-weight: 300; + color: #515151; + } + } + .fourth-line { + width: 100%; + height: vww(30); + @include flex; + justify-content: flex-start; + position: relative; + bottom: vww(10); + left: 30%; + + .receive, + .forward { + width: vww(123); + height: vww(48); + @include flex; + justify-content: center; + color: #ffffff; + font-size: 28rpx; + position: absolute; + + .button-image { + width: 100%; + height: 100%; + background: url('../../../static/image/banner/button.png') no-repeat; + background-size: cover; + font-size: 28rpx; + font-weight: 300; + color: #ffffff; + text-align: center; + line-height: vww(45); + } + } + + .receive { + left: vww(20); + } + + .forward { + width: vww(106); + left: vww(140); + + .button-image { + width: 100%; + height: 100%; + background: url('../../../static/image/banner/transpartent.png') no-repeat; + background-size: cover; + font-size: 28rpx; + font-weight: 300; + color: #3b56eb; + text-align: center; + line-height: vww(45); + } + } + } + + } </style> \ No newline at end of file -- Gitblit v1.9.1