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/wdata/detail.vue | 467 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 467 insertions(+), 0 deletions(-)
diff --git a/h5/pages/wdata/detail.vue b/h5/pages/wdata/detail.vue
new file mode 100644
index 0000000..954b360
--- /dev/null
+++ b/h5/pages/wdata/detail.vue
@@ -0,0 +1,467 @@
+<template>
+ <view class="main_app">
+ <view class="head_bg"></view>
+ <view class="info">
+ <view class="head">
+ <view class="title">杩愯緭鍗曞彿锛歿{info.transportCode}}</view>
+ <view class="status">{{info.logisticsStatus == 0 ? '寰呮墽琛�' : info.logisticsStatus == 1 ? '鎵ц涓�(鍦ㄩ��)' : '瀹屾垚(鍒拌揣)'}}
+ </view>
+ </view>
+ <view class="content">
+ <view class="line">
+ <view class="la">鐗╄祫绫诲瀷</view>
+ <view class="val">{{ info.materialType == '1' ? '鎴愬搧' : '鎵樼洏' }}</view>
+ </view>
+ <view class="line">
+ <view class="la">涓氬姟绫诲瀷</view>
+ <view class="val" v-if="info.businessType == 1">鎴愬搧閿�鍞�</view>
+ <view class="val" v-if="info.businessType == 2">鎴愬搧绉诲簱</view>
+ <view class="val" v-if="info.businessType == 3">绌烘墭鐩�-宸ヤ笟璋冨墏</view>
+ <view class="val" v-if="info.businessType == 4">绌烘墭鐩�-鍟嗕笟鍥炴敹</view>
+ <view class="val" v-if="info.businessType == 5">绌烘墭鐩�-鎵樼洏甯﹀洖</view>
+ </view>
+ <view class="line">
+ <view class="la">鏄惁鎵樼洏鑱旇繍</view>
+ <view class="val">{{ info.isPalletTransport == 1 ? '鏄�' : '鍚�' }}</view>
+ </view>
+ <view class="line">
+ <view class="la">鍙戣揣鐐�</view>
+ <view class="val">{{ info.startCity }}</view>
+ </view>
+ <view class="line">
+ <view class="la">鍗歌揣鐐�</view>
+ <view class="val">{{ info.endCity }}</view>
+ </view>
+ <view class="line">
+ <view class="la">杞︾墝鍙�</view>
+ <view class="val">{{ info.plateNumber }}</view>
+ </view>
+ <view class="line">
+ <view class="la">鍙告満</view>
+ <view class="val">{{ info.driverName }}</view>
+ </view>
+ <view class="line">
+ <view class="la">浠诲姟涓嬭揪鏃堕棿</view>
+ <view class="val">{{ info.receiveDate }}</view>
+ </view>
+ </view>
+ </view>
+ <!-- -->
+ <view class="record">
+ <view class="title">鍝佽鏄庣粏</view>
+ <view class="table_scroll">
+ <view class="table">
+ <view class="head line">
+ <view class="ite con">鍚堝悓鍙�</view>
+ <view class="ite name">鍝佽鍚嶇О</view>
+ <view class="ite num">鏁伴噺</view>
+ <view class="ite time">鏈�鏃╁埌璐ф椂闂�</view>
+ <view class="ite time">鏈�杩熷埌璐ф椂闂�</view>
+ </view>
+ <view class="line" v-for="item in info.productDetails">
+ <view class="ite con">{{item.contractNumber}}</view>
+ <view class="ite name">{{item.productName}}</view>
+ <view class="ite num">{{item.packageSize}}</view>
+ <view class="ite time">{{item.earliestReachDate}}</view>
+ <view class="ite time">{{item.latestReachDate}}</view>
+ </view>
+ </view>
+ </view>
+ </view>
+ <!-- -->
+ <view class="flow_wrap">
+ <view class="title">浠诲姟娴佺▼</view>
+ <view class="list">
+ <view class="item" v-for="item,i in info.transportStops">
+ <view v-if="i < info.transportStops.length - 1" class="dian"></view>
+ <view class="top1">
+ <view class="left_icon">
+ <image v-if="(info.logisticsStatus == 1 && item.actualArrivedDate) || info.logisticsStatus == 2"
+ src="@/static/waybill/ic_daohuo_sel@2x.png" mode=""></image>
+ <image v-else src="@/static/waybill/ic_dingdan@2x.png" mode=""></image>
+ </view>
+ <view class="content">
+ <view class="name" :class="{primaryColor: (info.logisticsStatus == 1 && item.actualArrivedDate) || info.logisticsStatus == 2}">{{item.receiveLocation}}</view>
+ <view class="status">
+ <view v-if="info.logisticsStatus == 0" class="btn">鍒拌揣</view>
+ <view v-else-if="info.logisticsStatus == 1 && !item.actualArrivedDate" @click="startAri(item.stopNumber)"
+ class="btn pri">鍒拌揣</view>
+ <template v-else>
+ <image src="@/static/checkbox_sel@2x.png" mode="" class="icon"></image>
+ <text class="primaryColor">宸插埌璐�</text>
+ </template>
+ </view>
+ </view>
+ </view>
+ <view class="top1">
+ <view class="left_icon"></view>
+ <view class="time" v-if="item.actualArrivedDate">鍒拌揣鏃堕棿锛歿{ item.actualArrivedDate}}</view>
+ <view class="time" style="margin-top: -10rpx;" v-else>-</view>
+ </view>
+ </view>
+ </view>
+ </view>
+ <view v-if="info.logisticsStatus == 0" @click="startTrans" class="start_btn">鍚繍</view>
+ <!-- -->
+ <view v-if="showTip" class="tip_wrap">
+ <view class="title">鎻愮ず</view>
+ <view class="text">杞﹁締鍒氬惎杩愶紝鏆傛棤娉曡繘琛屽埌</view>
+ <view class="text">璐ф搷浣滐紝璇�5鍒嗛挓鍚庡啀璇�</view>
+ <view class="btn" @click="showTip = false">鎴戠煡閬撲簡</view>
+ </view>
+ <view v-if="showTip" class="shade"></view>
+ </view>
+</template>
+
+<script>
+ import {
+ putTaskDetail,
+ putDriverArrival,
+ putDriverStart,
+ } from '@/api'
+ export default {
+ data() {
+ return {
+ info: {
+ productDetails: [],
+ transportStop: []
+ },
+ showTip: false
+ };
+ },
+ onLoad(options) {
+ this.id = options.id
+ this.getDetail()
+ },
+ methods: {
+ getDetail() {
+ putTaskDetail({
+ id: this.id
+ }).then(res => {
+ this.info = res.data
+ })
+ },
+ startTrans() {
+ uni.showModal({
+ title: '鎻愮ず',
+ content: '纭鍚繍涔堬紵',
+ success: (res) => {
+ if (res.confirm) {
+ putDriverStart({
+ id: this.id,
+ optType: 0
+ }).then((ress) => {
+ if (ress.code == 200) {
+ const transportList = uni.getStorageSync('transportList') || []
+ transportList.push({ id: this.id, time: new Date().getTime() })
+ uni.setStorageSync('transportList', transportList)
+ this.showToast('鍚繍鎴愬姛')
+ this.getDetail()
+ }
+ })
+ }
+ }
+ });
+ },
+ startAri(stopNumber) {
+ uni.showModal({
+ title: '鎻愮ず',
+ content: '纭鍒拌揣涔堬紵',
+ success: (res) => {
+ if (res.confirm) {
+ const transportList = uni.getStorageSync('transportList') || []
+ const item = transportList.find(i => i.id == this.id)
+ if(item && item.id){
+ const timeN = new Date().getTime() - item.time
+ if(timeN < 5 * 60 * 1000){
+ this.showTip = true
+ return
+ }
+ }
+ putDriverArrival({
+ stopNumber,
+ optType: 1,
+ id: this.id
+ }).then(ress => {
+ if (ress.code == 200) {
+ this.showToast('鍒拌揣鎴愬姛')
+ this.getDetail()
+ }
+ })
+ }
+ }
+ });
+ }
+ }
+ }
+</script>
+
+<style lang="scss">
+ page {
+ background-color: #f7f7f7;
+ }
+ .shade{
+ width: 100vw;
+ height: 100vh;
+ background: #000000;
+ opacity: 0.4;
+ position: fixed;
+ left: 0;
+ top: 0;
+ z-index: 99;
+ }
+ .tip_wrap{
+ position: fixed;
+ top: 0;
+ left: 0;
+ bottom: 0;
+ right: 0;
+ margin: auto;
+ width: 560rpx;
+ height: 328rpx;
+ background: #FFFFFF;
+ border-radius: 24rpx;
+ text-align: center;
+ z-index: 999;
+ .title{
+ font-weight: 500;
+ font-size: 32rpx;
+ color: #111111;
+ margin: 40rpx 0 30rpx;
+ }
+ .text{
+ font-weight: 400;
+ font-size: 28rpx;
+ color: #333333;
+ }
+ .btn{
+ margin-top: 32rpx;
+ height: 100rpx;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ border-top: 1rpx solid #E5E5E5;
+ color: #279BAA;
+ font-size: 32rpx;
+ }
+ }
+ .head_bg {
+ width: 750rpx;
+ height: 240rpx;
+ background: linear-gradient(180deg, #279BAA 0%, rgba(39, 155, 170, 0) 100%);
+ position: absolute;
+ top: 0;
+ left: 0;
+ }
+
+ .info {
+ border-radius: 8rpx;
+ overflow: hidden;
+ margin-top: 30rpx;
+ background: #FFFFFF;
+ position: relative;
+ z-index: 1;
+ .head {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ height: 84rpx;
+ background: linear-gradient(270deg, #FEFEFF 0%, #E1F7FE 100%);
+ padding: 0 30rpx;
+
+ .title {
+ font-weight: 500;
+ font-size: 32rpx;
+ color: #222222;
+ }
+
+ .status {
+ font-size: 26rpx;
+ color: $uni-color-primary;
+ }
+ }
+
+ .content {
+ padding: 30rpx 30rpx 10rpx;
+ font-size: 30rpx;
+
+ .line {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ margin-bottom: 20rpx;
+
+ .la {
+ color: #666666;
+ }
+
+ .val {}
+ }
+ }
+ }
+
+ .record {
+ margin-top: 20rpx;
+ width: 690rpx;
+ background: #FFFFFF;
+ border-radius: 16rpx;
+ padding: 30rpx;
+
+ .title {
+ font-weight: 500;
+ font-size: 32rpx;
+ color: #222222;
+ margin-bottom: 24rpx;
+ }
+
+ .table_scroll {
+ width: 630rpx;
+ overflow-x: auto;
+
+ .table {
+ width: 960rpx;
+ color: #222222;
+
+ .line {
+ min-height: 68rpx;
+ align-items: center;
+ display: flex;
+ border-bottom: 1px solid #E5E5E5;
+ padding: 0 20rpx;
+
+ .ite {
+ width: 280rpx;
+ flex-shrink: 0;
+ overflow: hidden;
+ }
+
+ .con {
+ width: 160rpx;
+ }
+
+ .time {
+ width: 195rpx;
+ }
+
+ .num {
+ width: 100rpx;
+ }
+
+ }
+
+ .head {
+ font-weight: 500;
+ background: #F4F7FC;
+ border: none;
+ }
+
+ }
+ }
+ }
+
+ .flow_wrap {
+ background: #FFFFFF;
+ border-radius: 16rpx;
+ padding: 30rpx;
+ margin-top: 20rpx;
+ margin-bottom: 20rpx;
+ .title {
+ font-weight: 500;
+ font-size: 32rpx;
+ color: #222222;
+ margin-bottom: 24rpx;
+ }
+
+ .list {
+ .item {
+ position: relative;
+ padding-bottom: 24rpx;
+ &:nth-last-child(1){
+ padding-bottom: 0;
+ }
+ .dian {
+ border: 1rpx dashed #CCCCCC;
+ height: calc(100% - 48rpx);
+ width: 1rpx;
+ position: absolute;
+ top: 48rpx;
+ left: 22rpx;
+ }
+
+ .top1 {
+ display: flex;
+ .left_icon {
+ width: 78rpx;
+
+ image {
+ width: 48rpx;
+ height: 48rpx;
+ }
+ }
+
+ .content {
+ flex: 1;
+ display: flex;
+ justify-content: space-between;
+ // align-items: center;
+ margin-bottom: 12rpx;
+
+ .name {
+ font-weight: 600;
+ font-size: 32rpx;
+ overflow: hidden;
+ flex: 1;
+ }
+
+ .status {
+ display: flex;
+ // align-items: center;
+ font-size: 26rpx;
+
+ .btn {
+ color: #999999;
+ border-radius: 30rpx;
+ border: 1rpx solid #999999;
+ width: 116rpx;
+ height: 60rpx;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ }
+
+ .pri {
+ color: #fff;
+ background-color: $uni-color-primary;
+ border: 1rpx solid $uni-color-primary;
+ }
+
+ image {
+ width: 40rpx;
+ height: 40rpx;
+ margin-right: 10rpx;
+ }
+ }
+ }
+
+ .time {
+ font-size: 24rpx;
+ color: #999999;
+ }
+ }
+ }
+ }
+ }
+
+ .start_btn {
+ width: 690rpx;
+ height: 88rpx;
+ background: $uni-color-primary;
+ border-radius: 44rpx;
+ font-size: 32rpx;
+ color: #FFFFFF;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ margin: 30rpx auto;
+ }
+</style>
\ No newline at end of file
--
Gitblit v1.9.3