From a99403de8051b2506dd59097a50d70856b488721 Mon Sep 17 00:00:00 2001 From: yangan <yangan0921@163.com> Date: 星期五, 15 十一月 2024 16:31:10 +0800 Subject: [PATCH] feat:司机首页增加二维码展示 --- pages/driver-page/driver-index/driver-index.vue | 374 +++++++++++++++++++++++++++++++++++++++------------- 1 files changed, 277 insertions(+), 97 deletions(-) diff --git a/pages/driver-page/driver-index/driver-index.vue b/pages/driver-page/driver-index/driver-index.vue index 95d9614..ab1fc20 100644 --- a/pages/driver-page/driver-index/driver-index.vue +++ b/pages/driver-page/driver-index/driver-index.vue @@ -4,26 +4,21 @@ <view class="driver-index-body"> <!-- 寰呴鍙栨彁鐓ゅ崟 --> <view class="wait-collection" - style="background: url('https://mx.jzeg.cn:9095/appimg/image/banner/diverbanner.png') no-repeat;background-size:contain"> + style="background: url('https://mr1.res.jzeg.cn:9096/appimg/image/banner/diverbanner.png') no-repeat;background-size:contain"> </view> <!-- 寮曞椤� --> - <view class="noob-tour" - v-if="roleType===3&&isFirstLogin"> - <combined-title title="鎿嶄綔鎸囧紩"></combined-title> - <u-cell-group> - <u-cell title="鏂版墜鎸囧紩" - name='1' - :clickable="true" - @click="noobTour"> - <u-badge type="primary" - value="01" - slot='icon'></u-badge> - <u-icon slot="value" - name="arrow-right" - size="30" - color="#b8b8b8"></u-icon> - </u-cell> - </u-cell-group> + <noob-tour></noob-tour> + <!-- 鑷富閰嶉�佺晫闈� --> + <view class="self-deliver"> + <view class="self-deliver_text"> + 鍒涘缓鑷富閰嶉�佸崟 + </view> + <view class="self-deliver_btn"> + <u-button text="鍘诲垱寤�" + type="primary" + shape="cirle" + @click="selfDeliver"></u-button> + </view> </view> <view class="collection-form"> <view class="collection-form-item" @@ -79,11 +74,13 @@ <view class="fourth-line" @click="qiangDanBtn(item)" v-if="item.carNum - item.taskNum !== 0"> - <view class="button-img">绔嬪嵆鎶㈠崟</view> + <!-- <view class="button-img">绔嬪嵆鎺ュ崟</view> --> + <u-button type="primary" + class="button-img">绔嬪嵆鎺ュ崟</u-button> </view> </view> </view> - <!-- 鎶㈠崟鎻愮ず妯℃�佹 --> + <!-- 鎺ュ崟鎻愮ず妯℃�佹 --> <view class="qianDanModel"> <u-modal :show="qiangDanShow" :title="qiangDanTitle" @@ -92,7 +89,6 @@ @confirm="qiangDanConfirm" @cancel="qiangDanCancel"></u-modal> </view> - <!-- 寰呴绾︽彁鐓ゅ崟 --> <view class="wait-appointment"> <combined-title title="寰呴绾︽彁鐓ゅ崟"></combined-title> @@ -159,14 +155,52 @@ <!-- <view class="order-type">{{ item.orderType }}</view> --> </view> </view> - <view class="fourth-line" - @click="toAppointmentClick(item)"> - <view class="button-img">绔嬪嵆棰勭害</view> + <view class="fourth-line"> + <view class="button-img" + v-if="!(item.orderType === '鍐呰喘' ||item.orderType === '杞叆')" + @click.stop="cancelAppoint(item)"> + 璇锋眰閫�鍗� + </view> + <view class="button-img" + @click.stop="toAppointmentClick(item)">绔嬪嵆棰勭害</view> + </view> </view> </view> </view> + <!-- 璇锋眰閫�鍗曞脊绐� --> + <view class=""> + <u-modal :show="cancelAppointShow" + title="閫�鍗曠‘璁�" + showCancelButton + content="鏄惁纭閫�鍗�" + @confirm="cancelAppointConfirm" + @cancel="cancelAppointCancel"></u-modal> + </view> + <!-- 鍦哄唴鎺ュ崟寮圭獥 --> + <view class=""> + <u-modal :show="insideConnectShow" + title="鎺ュ崟閫夋嫨" + showCancelButton + cancel-text="姝e父鎺ュ崟" + confirm-text="鍦哄唴鎺ュ崟" + content="鍦哄唴鎺ュ崟鏃犻渶绉扮毊,鏄惁纭鎺ュ崟" + @confirm="insideConnectConfirm" + @cancel="insideConnectCancel"></u-modal> + </view> + <!-- 浜岀淮鐮佸脊绐� --> + <view class="qCodeModal"> + <u-modal :show="qCodeModalVisible" + :showConfirmButton="false" + :negativeTop="150" + @close="qCodeModalVisible = false" + closeOnClickOverlay + > + <uv-qrcode ref="qrcode" canvas-id="qrcode" :value="qCodeValue" size="500rpx" :loading="qCodeloading" + :options="options"></uv-qrcode> + </u-modal> + </view> <!-- 宸查绾︽彁鐓ゅ崟 --> <view class="Reserved"> <combined-title title="宸查绾︽彁鐓ゅ崟"></combined-title> @@ -236,15 +270,19 @@ <!-- <view class="order-type">{{ item.orderType }}</view> --> </view> </view> + <view class="fourth-line" + v-if="item.status<3 && !(item.orderType === '鍐呰喘' ||item.orderType === '杞叆')"> + <view class="button-img" + @click.stop="cancelAppoint(item)"> + 璇锋眰閫�鍗� + </view> + <view class="button-img" + v-if="item.qrCode == 1" + @click.stop="viewQcode(item)">鏌ョ湅浜岀淮鐮�</view> + </view> </view> </view> <view class="white-block"></view> - <!-- 鍥剧墖棰勮寮瑰嚭妗� --> - <view class="previewImage-container"> - <previewImage ref="previewImage" - :imgs="driverTourImgList" - :saveBtn='false'></previewImage> - </view> </view> </view> </view> @@ -255,12 +293,16 @@ import { customerId } from '@/utils/status'; import combinedTitle from '@/components/combined-title/combined-title.vue'; import previewImage from '@/components/kxj-previewImage/kxj-previewImage.vue'; + import noobTour from '@/components/noobTour/noobTour.vue' import { mapState } from 'vuex' import { BaseUrl } from '@/api/publicInterface.js' + import uvQrcode from '@/uni_modules/uv-qrcode/components/uv-qrcode/uv-qrcode.vue'; // 寮曞叆鐢熸垚浜岀淮鐮佺粍浠� export default { components: { combinedTitle, - previewImage + previewImage, + noobTour, + uvQrcode }, props: { indexdriverBillOfLoadingData: { @@ -285,21 +327,38 @@ }, data() { return { + qCodeValue:'', + qCodeloading:false, driverBillOfLoadingData: { list1: [], list2: [], list3: [] }, - // 鎶㈠崟妯℃�佹 + // 鎺ュ崟妯℃�佹 qiangDanShow: false, - qiangDanTitle: '鎶㈠崟鎻愮ず', + qiangDanTitle: '鎺ュ崟鎻愮ず', + qCodeModalVisible:false, qiangDanContent: '', qiangDanOrderPlanId: null, - fleetId: '', - xsUserId: '', - customerId: '', isFirstLogin: true, //鏄惁鏄涓�娆$櫥褰� - phone: "" + phone: "", + isFirstTime: false, //鏄惁鏄櫥褰曡繘鍏ラ椤碉紝杩樻槸鍒殑椤甸潰杩斿洖 false鏄櫥褰� true鏄埆鐨勯〉闈� + cancelAppointShow: false, //纭閫�鍗曞脊绐楁帶鍒� + cancelAppointId: '', + insideConnectShow: false, + orderPlanId: '', + fleetId: '', + customerId: '', + xsUserId: '', + filedId: '', + options: { + useDynamicSize: false, + errorCorrectLevel: 'Q', + margin: 10, + areaColor: "#fff", + // 鎸囧畾浜岀淮鐮佸墠鏅紝涓�鑸彲鍦ㄤ腑闂存斁logo + foregroundImageSrc: '', + } }; }, onShow() { @@ -316,7 +375,6 @@ }, init() { this.qiangDanList(); - this.getLogOn() }, // 鍙告満棣栭〉鍒楄〃 qiangDanList() { @@ -328,21 +386,31 @@ this.driverBillOfLoadingData = res.data; }); }, - // 鎶㈠崟鎸夐挳 + // 鎺ュ崟鎸夐挳 qiangDanBtn(value) { - if (value.tmcCount == '0') { - this.qiangDan(value.orderPlanId, value.fleetId, value.customerId === null ? '0' : value.customerId, - value.xsUserId === null ? '0' : value.xsUserId); + //鏄惁鍙互鍦哄唴鎺ュ崟锛�1 鍙互2涓嶅彲浠� + if (value.isInsideConnect === 1) { + this.insideConnectShow = true + this.orderPlanId = value.orderPlanId + this.fleetId = value.fleetId + this.customerId = !value.customerId ? '0' : value.customerId + this.xsUserId = !value.xsUserId ? '0' : value.xsUserId + this.filedId = value.filedId } else { - this.qiangDanOrderPlanId = value.orderPlanId; - this.fleetId = value.fleetId; - this.customerId = value.customerId === null ? '0' : value.customerId; - this.xsUserId = value.xsUserId === null ? '0' : value.xsUserId; - this.qiangDanShow = true; - this.qiangDanContent = `宸叉姠${value.tmcCount}鍗曪紝纭畾鎶㈠崟锛焋; + if (value.tmcCount == '0') { + this.qiangDan(value.orderPlanId, value.fleetId, !value.customerId ? '0' : value.customerId, + !value.xsUserId ? '0' : value.xsUserId); + } else { + this.qiangDanOrderPlanId = value.orderPlanId; + this.fleetId = value.fleetId; + this.customerId = !value.customerId ? '0' : value.customerId; + this.xsUserId = !value.xsUserId ? '0' : value.xsUserId; + this.qiangDanShow = true; + this.qiangDanContent = `宸叉帴${value.tmcCount}鍗曪紝纭畾鎺ュ崟锛焋; + } } }, - // 鎶㈠崟妯℃�佹 + // 鎺ュ崟妯℃�佹 qiangDanConfirm() { this.qiangDanContent = ''; this.qiangDanShow = false; @@ -351,8 +419,11 @@ qiangDanCancel() { this.qiangDanShow = false; }, - // 鎶㈠崟璇锋眰 + // 鎺ュ崟璇锋眰 qiangDan(id, fleetId, customerId, xsUserId) { + uni.showLoading({ + title: '鍔犺浇涓�' + }) this.$reqPost('qiangDan', { orderPlanId: id, fleetId: fleetId, @@ -360,17 +431,39 @@ xsUserId: xsUserId }, 'params') .then(res => { + uni.hideLoading() if (res.code == 0) { - this.$u.toast('鎶㈠崟鎴愬姛'); + this.$u.toast('鎺ュ崟姝e湪澶勭悊涓�...'); } else { - this.$u.toast(res.msg ? res.msg : '鎶㈠崟澶辫触'); + this.$u.toast(res.msg ? res.msg : '鎺ュ崟澶辫触'); } }) .then(() => { setTimeout(() => { this.qiangDanList(); - }, 1000); - }); + }, 1500); + }).catch(e => { + uni.hideLoading() + }) + }, + insideConnectHandle(orderPlanId, fleetId, customerId, xsUserId, filedId) { + uni.showLoading({ + title: '鍔犺浇涓�' + }) + this.$reqPost('insideConnect', { + orderPlanId, + fleetId, + customerId, + xsUserId, + filedId + }, 'params').then(res => { + uni.hideLoading() + if (res.code == 0) { + this.$u.toast('鍦哄唴鎺ュ崟鎴愬姛'); + } else { + this.$u.toast(res.msg ? res.msg : '鍦哄唴鎺ュ崟澶辫触'); + } + }) }, list3CardIconClick(value) { uni.navigateTo({ @@ -383,34 +476,96 @@ url: `/pages/driver-page/driver-index/bill-of-lading-details/bill-of-lading-details?orderPlanId=${name}` }); }, + // 璇锋眰閫�鍗� + cancelAppoint(item) { + if (item.status >= 3) { + this.$u.toast('褰撳墠鐘舵�佷笉鍙��鍗�') + return + } + this.cancelAppointShow = true + this.cancelAppointId = item.id + }, + // 閫�鍗曞脊绐楃‘璁� + cancelAppointConfirm() { + this.cancelAppointShow = false + uni.showLoading({ + title: '鍔犺浇涓�' + }) + this.$reqPost('cancelAppoint', { takeCoalId: this.cancelAppointId }, 'params').then(res => { + uni.hideLoading() + if (res.code == 0) { + this.$u.toast('閫�鍗曟垚鍔�'); + } else { + this.$u.toast(res.msg ? res.msg : '閫�鍗曞け璐�'); + } + }).then(() => { + setTimeout(() => { + this.qiangDanList(); + }, 1000); + }).catch(e => { + uni.hideLoading() + }) + }, + // 閫�鍗曞脊绐楀彇娑� + cancelAppointCancel() { + this.cancelAppointShow = false + }, + insideConnectCancel() { + this.insideConnectShow = false + this.qiangDan(this.orderPlanId, this.fleetId, this.customerId, this.xsUserId) + }, + // 鍦哄唴鎺ュ崟 + insideConnectConfirm() { + this.insideConnectShow = false + this.insideConnectHandle(this.orderPlanId, this.fleetId, this.customerId, this.xsUserId, this.filedId) + }, // 鍘婚绾� toAppointmentClick(value) { + // 鐢变簬鑷富閰嶉�佸崟 鏄璐崟 浣嗘槸涓嶉渶瑕佸~鍐欏師鍙戜负1涓嶉渶瑕佸~鍐欏師鍙� + uni.setStorageSync('isNeedOrigin', value.orderType === '澶栬喘' && value.isSpecial === 1 ? 1 : 0) + if (value.orderType === '澶栬喘') { + uni.navigateTo({ + url: `/pages/driver-page/driver-index/bill-of-lading-details/originInfo/originInfo?orderPlanId=${value.id}&filedId=${value.filedId}&deptId=${value.deptId}&sendDate=${value.sendDate}&isSpecial=${value.isSpecial}&coalName=${value.coalName}` + }); + } else { + uni.navigateTo({ + url: `/pages/driver-page/appointment/appointment?takeCoalId=${value.id}&filedId=${value.filedId}&deptId=${value.deptId}&sendDate=${value.sendDate}&coalName=${value.coalName}` + }); + } + }, + // 鑷富閰嶉�� + selfDeliver() { uni.navigateTo({ - url: `/pages/driver-page/appointment/appointment?takeCoalId=${value.id}&filedId=${value.filedId}&deptId=${value.deptId}&sendDate=${value.sendDate}` - }); + url: '/pages/driver-page/driver-index/SelfDelivery/SelfDelivery' + }) }, - noobTour() { - this.$refs.previewImage.open('https://mx.jzeg.cn:9096/appimg/image/tour/driver/sj1.png') - }, - getLogOn() { - this.$reqGet('getUserEntity').then(res => { - this.phone = res.data.phone - }).then(() => { - uni.request({ - url: `${BaseUrl}/admin/log/getLogOnType?phone=${this.phone}`, - success: res => { - // res.data.data 涓�1 浠h〃绗竴娆$櫥褰� 涓�0鍙栨秷瀛︿範鎸囧紩 涓�2 浠h〃瀛樺湪 - if (res.data.data === 1) { - this.noobTour() - } else if (res.data.data === 2) { - this.isFirstLogin = true - } else { - this.isFirstLogin = false - } + //鏌ョ湅浜岀淮鐮� + viewQcode(item){ + console.log('鏌ョ湅浜岀淮鐮�') + + this.$reqGet('showQRCode',{code:item.code}).then(res=>{ + console.log(res,'ress') + if(res.data){ + this.qCodeModalVisible = true; + this.qCodeValue = res.data; + this.$nextTick(() => { + this.$refs.qrcode.remake({ + success: () => { + console.log('鐢熸垚鎴愬姛'); + }, + fail: err => { + console.log(err) } }); }) - }, + }else{ + this.$u.toast(res.msg || '鐢熸垚澶辫触') + } + + }) + + + } } }; </script> @@ -473,25 +628,40 @@ } @mixin fourthLine { - width: 34%; + width: 64%; height: vww(68); display: flex; align-items: center; position: relative; - left: vww(203); + left: vww(102); bottom: vww(3); .button-img { - width: 100%; - height: 100%; - background: url('https://mx.jzeg.cn:9095/appimg/image/banner/button.png') no-repeat; + width: vww(122); + height: vww(41); + background: url('https://mr1.res.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); + } + } + + /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); } .exceedHide { @@ -512,6 +682,20 @@ .wait-collection { width: 100%; height: 600rpx; + } + + // 鑷富閰嶉�� + .self-deliver { + position: relative; + top: vww(-120); + width: 88%; + height: vww(50); + margin: vww(8) auto; + padding: 0 vww(8); + 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; } .collection-form { @@ -560,7 +744,7 @@ 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: url('https://mr1.res.jzeg.cn:9096/appimg/image/banner/blueblock.png') no-repeat; background-size: contain; font-size: 30rpx; font-weight: 400; @@ -603,7 +787,7 @@ 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: url('https://mr1.res.jzeg.cn:9096/appimg/image/banner/redblock.png') no-repeat; background-size: contain; font-size: 30rpx; font-weight: 400; @@ -705,27 +889,17 @@ } } + // 寰呴绾� .fourth-line { width: 30%; height: vww(68); margin-left: vww(15); + margin-top: vww(5); display: flex; justify-content: flex-end; position: relative; left: vww(203); bottom: vww(3); - - .button-img { - width: 100%; - height: 100%; - background: url('https://mx.jzeg.cn:9095/appimg/image/banner/button.png') no-repeat; - background-size: cover; - font-size: 28rpx; - font-weight: 300; - color: #ffffff; - text-align: center; - line-height: vww(33); - } } } } @@ -771,7 +945,7 @@ 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: url('https://mr1.res.jzeg.cn:9096/appimg/image/banner/blueblock.png') no-repeat; background-size: contain; font-size: 30rpx; font-weight: 400; @@ -807,7 +981,7 @@ 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: url('https://mr1.res.jzeg.cn:9096/appimg/image/banner/redblock.png') no-repeat; background-size: contain; font-size: 30rpx; font-weight: 400; @@ -845,7 +1019,7 @@ 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: url('https://mr1.res.jzeg.cn:9096/appimg/image/banner/redblock.png') no-repeat; background-size: contain; font-size: 30rpx; font-weight: 400; @@ -917,6 +1091,12 @@ } .Reserved { + .fourth-line { + justify-content: flex-end; + letter-spacing: vww(2); + left: 223rpx !important; + } + .white-block { width: 100%; height: vww(50); -- Gitblit v1.9.1