From 69a1b3bf45738f048361ee4ccb6bdc64fce35720 Mon Sep 17 00:00:00 2001
From: MrShi <1878285526@qq.com>
Date: 星期三, 12 三月 2025 11:31:46 +0800
Subject: [PATCH] 更新
---
h5/pages/driver/taskConfirm.vue | 502 +++++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 502 insertions(+), 0 deletions(-)
diff --git a/h5/pages/driver/taskConfirm.vue b/h5/pages/driver/taskConfirm.vue
new file mode 100644
index 0000000..966c2c5
--- /dev/null
+++ b/h5/pages/driver/taskConfirm.vue
@@ -0,0 +1,502 @@
+<template>
+ <view class="main_app">
+ <view class="status_wrap">
+ <image class="bg" src="../../static/driver/bg_renwu@2x.png" mode=""></image>
+ <view class="name">璇风‘璁や换鍔�</view>
+ <view class="id_card">{{ param.carCodeFront }}</view>
+ <view class="status">浠诲姟寰呯‘璁�</view>
+ </view>
+ <!-- -->
+ <view class="main_content">
+ <view class="line">
+ <view class="label">鍙告満濮撳悕</view>
+ <view class="value">{{ param.driverName }}</view>
+ </view>
+ <view class="line">
+ <view class="label">鎵嬫満鍙�</view>
+ <view class="value">{{ param.drivierPhone }}</view>
+ </view>
+ <view class="line" v-if="param.billCode">
+ <view class="label">杩愯緭鍗曞彿</view>
+ <view class="value" @click="wmsDetail">
+ <text class="waybill_num">{{ param.billCode }}</text>
+ <text class="btn">杩愬崟璇︽儏</text>
+ </view>
+ </view>
+ <view class="line" v-else>
+ <view class="label">鍚堝悓缂栧彿</view>
+ <view class="value">{{param.contractNum}}</view>
+ </view>
+ <view class="line" v-if="type != 4">
+ <view class="label">浣滀笟绫诲瀷</view>
+ <view class="value" v-if="param.type == 0">鑷湁杞﹀嵏璐�</view>
+ <view class="value" v-if="param.type == 1">鑷湁杞﹁璐�</view>
+ <view class="value" v-if="param.type == 2">澶栧崗杞﹀嵏璐�</view>
+ <view class="value" v-if="param.type == 3">澶栧崗杞﹁璐�</view>
+ </view>
+ <view class="line" v-if="type == 4">
+ <view class="label">鍏ュ簱绫诲瀷</view>
+ <view class="value" v-if="param.inType == 0">鏁存墭鐩�</view>
+ <view class="value" v-if="param.inType == 1">浠剁儫</view>
+ </view>
+ <view class="empty"></view>
+ <!-- -->
+ <view class="line">
+ <view class="label">鍒板満鏃ユ湡<text class="red ml6">*</text></view>
+ <view class="value" @click="showDate = true">
+ <view :class="param.date ? '' : 'placeholder9'">{{ param.date ? param.date : '璇烽�夋嫨' }}</view>
+ <u-icon color="#999999" name="arrow-right"></u-icon>
+ </view>
+ </view>
+ <view class="line">
+ <view class="label">杞﹀墠鐗岀収鍙�</view>
+ <view class="value" @click="openInput(1)">
+ <text :style="{ color: param.carCodeFront ? '#000000' : '#999999' }">{{ param.carCodeFront ? param.carCodeFront : '璇疯緭鍏ヨ溅鍓嶇墝鐓у彿' }}</text>
+ </view>
+ </view>
+ <view class="line">
+ <view class="label">杞﹀悗鐗岀収鍙�<text class="red ml6">*</text></view>
+ <view class="value">
+ <text @click="openInput(2)" :style="{ color: param.carCodeBack ? '#000000' : '#999999' }">{{ param.carCodeBack ? param.carCodeBack : '璇疯緭鍏ヨ溅鍚庣墝鐓у彿' }}</text>
+ <text class="copy" @click="copy">澶嶅埗杞﹀墠鐗岀収鍙�</text>
+ </view>
+ </view>
+ <!-- -->
+ </view>
+ <view class="space"></view>
+ <!-- 绛夊緟鍙彿 -->
+ <view class="sub_wrap"><view class="btn check" @click="onSubmit">纭浠诲姟</view></view>
+
+ <!-- modal -->
+ <u-popup :show="showDetail" :round="10" :safeAreaInsetBottom="true" closeOnClickOverlay :closeable="true" mode="bottom" @close="showDetail = false">
+ <view class="detail_modal">
+ <view class="modal_title">杩愬崟璇︽儏</view>
+ <view v-if="wmsInfo.plateNumber" class="id_card">
+ <text>{{ wmsInfo.plateNumber.slice(0, 1) }}</text>
+ <text>{{ wmsInfo.plateNumber.slice(1, 2) }}</text>
+ <text>路</text>
+ <text>{{ wmsInfo.plateNumber.slice(2) }}</text>
+ </view>
+ <!-- -->
+ <view class="info">
+ <view class="line">
+ <view class="label">杩愯緭鍗曞彿</view>
+ <view class="value">{{ wmsInfo.carryBillCode }}</view>
+ </view>
+ <view class="line">
+ <view class="label">椹鹃┒鍛�</view>
+ <view class="value">{{ wmsInfo.driverName }} {{ wmsInfo.driverPhone }}</view>
+ </view>
+ <view class="line">
+ <view class="label">鎬昏繍杈撻噺</view>
+ <view class="value">{{ wmsInfo.ioQty }}涓囨敮</view>
+ </view>
+ <view class="line">
+ <view class="label">杩愯緭鍏徃</view>
+ <view class="value">{{ wmsInfo.carrierName }}</view>
+ </view>
+ </view>
+ <view class="separate"></view>
+ <view class="contract_wrap">
+ <view class="contract_list" v-for="item in wmsInfo.wmsJobContractVOList">
+ <view class="title">鍚堝悓鍙凤細{{ item.contractCode }}</view>
+ <view class="address">鏀惰揣鍦帮細{{ item.address }}</view>
+ <view class="list">
+ <view class="item" v-for="line in item.platformWmsDetailList">
+ <view class="line">
+ <view class="label">鐗╂枡锛�</view>
+ <view class="value">{{ line.materialName }}</view>
+ </view>
+ <view class="line">
+ <view class="label">鏁伴噺锛�</view>
+ <view class="value">{{ line.ioQty }}涓囨敮</view>
+ </view>
+ </view>
+ </view>
+ </view>
+ </view>
+ </view>
+ </u-popup>
+ <u-datetime-picker :show="showDate" v-model="param.date" :minDate="minDate" @confirm="dateEnter" @cancel="showDate = false" mode="datetime"></u-datetime-picker>
+ <keyboardInput ref="keyboard" @export="setPlate" @close="closeInput" />
+ </view>
+ <!-- -->
+</template>
+
+<script>
+import keyboardInput from '@/components/keyboard-input/keyboard-input.vue';
+import { driverTaskJobDetail, driverConfirmTask, wmsJobDetail } from '@/api';
+import dayjs from 'dayjs'
+export default {
+ components: {
+ keyboardInput
+ },
+ data() {
+ return {
+ param: {},
+ wmsInfo: {},
+ showDate: false,
+ showDetail: false,
+ minDate: '',
+
+ inputType: ''
+ };
+ },
+ onLoad(option) {
+ this.getDetail(option.id);
+ this.minDate = new Date().getTime()
+ },
+ methods: {
+ onSubmit(){
+ const { param } = this
+ if(!param.date) return this.showToast('璇烽�夋嫨鍒板満鏃ユ湡')
+ if(!param.carCodeBack) return this.showToast('璇疯緭鍏ヨ溅鍚庣墝鐓у彿')
+ driverConfirmTask({
+ id: param.id,
+ carCodeBack: param.carCodeBack,
+ arriveDate: param.date + ':59'
+ }).then(res =>{
+ if(res && res.code == 200){
+ this.showToast('纭鎴愬姛')
+ this.$goBack()
+ }
+ })
+ },
+ getDetail(jobId) {
+ driverTaskJobDetail({
+ jobId
+ }).then(ress => {
+ this.param = { ...ress.data, carCodeBack: '' };
+ });
+ },
+ wmsDetail() {
+ const { param } = this
+ wmsJobDetail({ id: param.id }).then(res => {
+ this.wmsInfo = res.data
+ this.showDetail = true
+ })
+ },
+ dateEnter(e) {
+ setTimeout(() => {
+ this.$set(this.param, 'date', dayjs(e.value).format('YYYY-MM-DD HH:mm'))
+ })
+ this.showDate = false
+ },
+ openInput(type) {
+ this.inputType = type;
+ this.$refs.keyboard.open();
+ },
+ copy() {
+ if (this.param.carCodeFront) {
+ this.$set(this.param, 'carCodeBack', this.param.carCodeFront);
+ this.showToast('澶嶅埗鎴愬姛');
+ }
+ },
+ setPlate(e) {
+ if (this.inputType === 1) {
+ this.$set(this.param, 'carCodeFront', e);
+ } else if (this.inputType === 2) {
+ this.$set(this.param, 'carCodeBack', e);
+ }
+ this.$forceUpdate();
+ this.closeInput();
+ },
+ closeInput() {
+ this.$refs.keyboard.close();
+ }
+ }
+};
+</script>
+
+<style lang="scss">
+page {
+ background-color: #f7f7f7;
+}
+
+.main_app {
+ padding: 0;
+
+ .main_content {
+ background: #ffffff;
+ border-radius: 20rpx 20rpx 0rpx 0rpx;
+ padding: 16rpx 30rpx;
+ position: relative;
+ bottom: 32rpx;
+ z-index: 999;
+ .line {
+ padding: 24rpx 0 28rpx;
+ border-bottom: 1rpx solid #e5e5e5;
+
+ .label {
+ font-size: 26rpx;
+ color: #666666;
+ margin-bottom: 20rpx;
+ }
+
+ .value {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ font-size: 30rpx;
+
+ .waybill_num {
+ flex: 1;
+ }
+
+ .copy {
+ font-size: 26rpx;
+ color: $uni-color-primary;
+ }
+
+ .btn {
+ font-size: 28rpx;
+ color: $uni-color-primary;
+ display: flex;
+ }
+ }
+ }
+ .empty {
+ width: 750rpx;
+ height: 20rpx;
+ background-color: #f7f7f7;
+ margin: 0 -30rpx;
+ }
+ .warnning {
+ display: flex;
+ color: #ed4545;
+ align-items: center;
+ margin: 40rpx 0;
+ }
+
+ .signIn_wrap {
+ margin: 80rpx auto;
+ width: 260rpx;
+ height: 260rpx;
+ position: relative;
+ color: #fff;
+ z-index: 1;
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ align-items: center;
+
+ .handle {
+ font-weight: 600;
+ font-size: 40rpx;
+ line-height: 56rpx;
+ }
+
+ .time {
+ color: rgba(255, 255, 255, 0.7);
+ }
+
+ .img {
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 100%;
+ z-index: -1;
+ }
+ }
+ }
+
+ .status_wrap {
+ height: 200rpx;
+ width: 100%;
+ padding: 30rpx;
+ position: relative;
+ z-index: 99;
+ color: #fff;
+ .bg {
+ width: 100%;
+ height: 100%;
+ position: absolute;
+ top: 0;
+ left: 0;
+ z-index: -1;
+ }
+
+ .name {
+ font-weight: 600;
+ font-size: 40rpx;
+ line-height: 56rpx;
+ margin-bottom: 12rpx;
+ }
+
+ .id_card {
+ color: rgba(255, 255, 255, 0.8);
+ }
+ .status {
+ position: absolute;
+ right: 0;
+ top: 30rpx;
+ height: 68rpx;
+ line-height: 68rpx;
+ background: #ffffff;
+ padding: 0 24rpx;
+ border-radius: 34rpx 0rpx 0rpx 34rpx;
+ font-size: 26rpx;
+ color: $uni-color-primary;
+ }
+ }
+
+ .space {
+ width: 750rpx;
+ height: 200rpx;
+ }
+
+ .sub_wrap {
+ position: fixed;
+ padding: 16rpx 30rpx 64rpx;
+ bottom: 0;
+ left: 0;
+ width: 100%;
+ display: flex;
+ z-index: 1;
+ justify-content: space-between;
+ background-color: #fff;
+ .btn {
+ height: 96rpx;
+ line-height: 96rpx;
+ text-align: center;
+ width: 690rpx;
+ font-size: 36rpx;
+ color: #333333;
+ background: #ffffff;
+ border-radius: 48rpx;
+ border: 1rpx solid #999999;
+ }
+
+ .check {
+ background: $uni-color-primary;
+ border: 1rpx solid $uni-color-primary;
+ color: #fff;
+ }
+ }
+}
+
+.detail_modal {
+ height: calc( 100vh - 88rpx );
+ padding: 36rpx 30rpx;
+ border-radius: 12rpx;
+ box-shadow: 0 0 6rpx rgba(0, 0, 0, 0.5);
+ .modal_title {
+ font-weight: 600;
+ font-size: 32rpx;
+ color: #222222;
+ line-height: 44rpx;
+ text-align: center;
+ margin-bottom: 36rpx;
+ }
+ .contract_wrap{
+ height: calc( 100% - 400rpx );
+ overflow-y: auto;
+ }
+ .contract_list {
+ border-top: 1rpx solid #E5E5E5;
+ margin-bottom: 30rpx;
+ padding-top: 30rpx;
+ &:nth-last-child(1){
+ margin-bottom: 0;
+ }
+ .list {
+ background: #f7f7f7;
+ border-radius: 8rpx;
+ padding: 20rpx;
+ .item{
+ border-bottom: 1rpx solid #e5e5e5;
+ padding-bottom: 20rpx;
+ margin-bottom: 20rpx;
+ &:nth-last-child(1){
+ border: none;
+ padding-bottom: 0;
+ margin-bottom: 0;
+ }
+ }
+ .line {
+ display: flex;
+ margin-bottom: 20rpx;
+ &:nth-last-child(1){
+ margin-bottom: 0rpx;
+ }
+ .label {
+ color: #666666;
+ width: 92rpx;
+ }
+
+ .value {
+ flex: 1;
+ color: #222222;
+ }
+ }
+ }
+
+ .title {
+ font-weight: 600;
+ font-size: 30rpx;
+ color: $uni-color-primary;
+ margin-bottom: 12rpx;
+ }
+
+ .address {
+ font-size: 26rpx;
+ color: #666666;
+ margin-bottom: 20rpx;
+ }
+ }
+
+ .info {
+ .line {
+ display: flex;
+ margin-bottom: 20rpx;
+
+ .label {
+ font-size: 30rpx;
+ color: #666666;
+ width: 150rpx;
+ }
+
+ .value {
+ flex: 1;
+ font-size: 30rpx;
+ color: #222222;
+ }
+ }
+ }
+
+ .separate {
+ width: 750rpx;
+ height: 2rpx;
+ margin: 30rpx -30rpx;
+ border: 1rpx solid #e5e5e5;
+ }
+
+ .id_card {
+ display: flex;
+ font-weight: 600;
+ height: 60rpx;
+ line-height: 60rpx;
+ font-size: 32rpx;
+ color: #111111;
+ border-radius: 8rpx;
+ border: 1rpx solid #dfdede;
+ width: 220rpx;
+ margin-bottom: 15rpx;
+
+ text {
+ &:nth-of-type(1) {
+ background: #e9f5f6;
+ padding: 0 12rpx;
+ }
+
+ &:nth-of-type(2) {
+ padding-left: 10rpx;
+ }
+
+ &:nth-of-type(4) {
+ padding-right: 6rpx;
+ }
+ }
+ }
+ }
+</style>
--
Gitblit v1.9.3