From d73c61eb5a8dcc4e40732b97d92d36edcf6b3d61 Mon Sep 17 00:00:00 2001
From: liukangdong <898885815@qq.com>
Date: 星期三, 11 十二月 2024 16:07:08 +0800
Subject: [PATCH] ll
---
h5/pages/waybill/waybillDetail.vue | 200 ++++++++++++++++++++++++++++---------------------
1 files changed, 114 insertions(+), 86 deletions(-)
diff --git a/h5/pages/waybill/waybillDetail.vue b/h5/pages/waybill/waybillDetail.vue
index da8e896..e507bac 100644
--- a/h5/pages/waybill/waybillDetail.vue
+++ b/h5/pages/waybill/waybillDetail.vue
@@ -1,47 +1,41 @@
<template>
<view class="main_app">
- <image src="@/static/driver/wuliuche_bg@2x.png" class="main_bg"></image>
- <view class="form_wrap">
- <view class="item">
- <view class="label">鍚堝悓缂栧彿</view>
- <view class="line">
- <view class="input_wrap"><input v-model="param.aa" placeholder="璇疯緭鍏ュ悎鍚岀紪鍙�" placeholder-class="place" type="text" /></view>
- </view>
+ <image class="bg" src="@/static/wuliuche_bg@2x.png" mode="widthFix"></image>
+ <view class="info">
+ <view class="head">
+ <view class="code">{{info.contractNumber}}</view>
+ <view class="status">{{info.orderStatus}}</view>
</view>
- <view class="item">
- <view class="label">闇�鏂圭紪鍙�</view>
+ <view class="content">
<view class="line">
- <view class="input_wrap"><input v-model="param.aa" placeholder="璇疯緭鍏ュ悎鍚屼腑闇�鏂圭紪鍙�" placeholder-class="place" type="text" /></view>
+ <view class="la">鍙戣揣鍦�</view>
+ <view class="val">{{info.fromRepertoty || '-'}}</view>
</view>
- </view>
- <view class="item">
- <view class="label">楠岃瘉鐮�</view>
<view class="line">
- <view class="input_wrap"><input v-model="param.aa" placeholder="璇疯緭鍏ラ獙璇佺爜" placeholder-class="place" type="text" /></view>
- <image src="" class="auth_code" mode=""></image>
+ <view class="la">鍒拌揣鍦�</view>
+ <view class="val">{{info.toRepertoty || '-'}}</view>
</view>
- </view>
- <view class="query">鏌ヨ</view>
- </view>
- <view class="title">鏌ヨ缁撴灉</view>
- <view class="drive_info">
- <view class="title">鍚堝悓缂栧彿</view>
- <view class="line">
- <view class="label">杩愯緭杞﹁締</view>
- <view class="val">11</view>
- </view>
- <view class="line">
- <view class="label">鍙告満淇℃伅</view>
- <view class="val">11</view>
- </view>
- <view class="line">
- <view class="label">杞﹁締浣嶇疆</view>
- <view class="val">11</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">{{ '-'}}</view>
+ </view>
+ <view class="line">
+ <view class="la">杞﹁締浣嶇疆</view>
+ <view class="val">{{ '-'}}</view>
+ </view>
+ <view class="line">
+ <view class="la">棰勮鍒拌揪</view>
+ <view class="val">{{'-'}}</view>
+ </view>
</view>
</view>
<view class="drive_info">
<view class="title">鐗╂祦淇℃伅</view>
- <view class="item">
+<!-- <view class="item">
<view class="h2">
<view class="icon_wrap"><image src="@/static/driver/ic_mostarted.png" class="icon"></image></view>
<view class="text">鍒拌揪鍗歌揣鍦�</view>
@@ -64,77 +58,58 @@
</view>
<view class="time">202422222222</view>
<view class="separate"></view>
- </view>
+ </view> -->
</view>
</view>
</template>
-<script>
+<script>
+ import { orderInfoTms } from '@/api'
export default {
data() {
return {
+ id: '',
+ info: {},
param: {}
};
+ },
+ onLoad(options) {
+ this.id = options.id
+ this.getDetail()
+ },
+ methods: {
+ getDetail() {
+ orderInfoTms({ contractNumber: this.id }).then(res => {
+ this.info = res.data
+ })
+ },
}
}
</script>
-<style lang="scss" scoped>
- .form_wrap {
- width: 690rpx;
- height: 646rpx;
- background: #FFFFFF;
- box-shadow: 0rpx 4rpx 20rpx 0rpx rgba(39,155,170,0.16);
- border-radius: 16rpx;
- padding: 10rpx 30rpx;
- margin-bottom: 40rpx;
- .item{
- height: 154rpx;
- padding: 30rpx 0 8rpx;
- border-bottom: 1rpx solid #E5E5E5;
- .label{}
- .line{
- display: flex;
- .input_wrap{
- padding: 18rpx 0;
- flex: 1;
- .place{
- color: #999999;
- font-size: 28rpx;
- }
- }
- .auth_code{
- width: 160rpx;
- height: 64rpx;
- border: 2px solid;
- }
- }
- }
- .query{
- width: 630rpx;
- height: 88rpx;
- background: $uni-color-primary;
- border-radius: 44rpx;
- margin-top: 40rpx;
- color: #fff;
- display: flex;
- justify-content: center;
- align-items: center;
- font-size: 30rpx;
- }
+<style lang="scss" scoped>
+ page{
+ background-color: #f7f7f7;
}
.main_app{
- padding-top: 218rpx;
- .title{
- font-weight: 500;
- font-size: 32rpx;
- margin-bottom: 30rpx;
+ padding-top: 120rpx;
+ .bg{
+ width: 750rpx;
+ position: absolute;
+ left: 0;
+ top: 0;
}
.drive_info{
- background: #F7F7F7;
+ background: #fff;
border-radius: 16rpx;
padding: 30rpx;
margin-bottom: 20rpx;
+ .title{
+ font-weight: 500;
+ font-size: 32rpx;
+ color: #222222;
+ margin-bottom: 20rpx;
+ }
.line{
display: flex;
margin-bottom: 24rpx;
@@ -183,8 +158,8 @@
}
.separate{
height: calc( 100% );
- width: 2rpx;
- border: 2rpx dashed red;
+ width: 1rpx;
+ border: 1rpx dashed #666666;
position: absolute;
left: 22rpx;
top: 24rpx;
@@ -195,6 +170,59 @@
}
}
}
+
+ .info {
+ border-radius: 12rpx;
+ margin-bottom: 20rpx;
+ padding: 0 30rpx;
+ background-color: #fff;
+ overflow: hidden;
+ position: relative;
+ z-index: 1;
+ .head {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ padding: 0 30rpx;
+ width: 690rpx;
+ height: 84rpx;
+ margin: 0 -30rpx;
+ background: linear-gradient( 270deg, #FEFEFF 0%, #E1F7FE 100%);
+
+ .code {
+ font-weight: 500;
+ font-size: 32rpx;
+ color: #222222;
+ }
+
+ .status {
+ color: $uni-color-primary;
+ }
+ }
+
+ .content {
+ padding: 20rpx 0rpx;
+ margin-bottom: 20rpx;
+
+ .line {
+ display: flex;
+ margin-bottom: 16rpx;
+ font-size: 26rpx;
+
+ .la {
+ color: #666666;
+ width: 140rpx;
+ }
+
+ .val {}
+
+ &:nth-last-child(1) {
+ margin-bottom: 0;
+ }
+ }
+ }
+
+ }
}
.main_bg {
position: absolute;
--
Gitblit v1.9.3