From f1950b48fec6421b50580f2a8899b360b314b73c Mon Sep 17 00:00:00 2001
From: yangan <yangan0921@163.com>
Date: 星期四, 10 四月 2025 15:29:33 +0800
Subject: [PATCH] feat：增加车牌号，和规格Bug修改
---
pages/public-page/historicalOrders/index.vue | 441 ++++++++++++++++++++++++++++++-------------------------
1 files changed, 240 insertions(+), 201 deletions(-)
diff --git a/pages/public-page/historicalOrders/index.vue b/pages/public-page/historicalOrders/index.vue
index cfe53d5..888b95e 100644
--- a/pages/public-page/historicalOrders/index.vue
+++ b/pages/public-page/historicalOrders/index.vue
@@ -1,78 +1,109 @@
<template>
<div>
<div class="warp">
- <div class="ingOrder" v-for="item,i in historyData" :key="i"
- @click="list3CardIconClick(item)"
- >
- <!-- 绗竴琛� -->
- <div class="firstLine">
- <div class="leftIcon">
- <div class="leftOneDiv">
- <span class="leftOne">瑁�</span>
- </div>
- <div class="leftLine"></div>
- <div class="rightDiv">
- <span class="rightone">鍗�</span>
- </div>
- </div>
- <div class="centerTitle">
- <view class="filedname exceedHide">
- <text
- v-if="item.orderType == '澶栭攢' || item.orderType == '鍐呴攢' ">{{ item.deptName }}</text>
- <text
- v-else-if="item.orderType == '澶栬喘' || item.orderType == '鍐呰喘' ">{{ item.customerName }}</text>
- <text v-else-if="item.orderType == '杞嚭'||item.orderType == '杞叆'">
- {{item.filedName}}
- </text>
- </view>
- <p class="centerLine"></p>
- <view class="filedname exceedHide">
- <text
- v-if="item.orderType == '澶栭攢' || item.orderType == '鍐呴攢' ">{{ item.customerName }}</text>
- <text
- v-else-if="item.orderType == '澶栬喘' || item.orderType == '鍐呰喘'">{{ item.deptName }}</text>
- <text v-else-if="item.orderType == '杞嚭'||item.orderType == '杞叆'">
- {{item.toFiledName}}
- </text>
- </view>
- </div>
- <div class="rightIcon">
- <u-icon name="map"
- color="#4978F0"
- @click.stop="skipMap(item)"
- size="40"></u-icon
- >
- <u-icon
- @click.stop="skipMap(item)"
- name="map"
- color="#4978F0"
- size="40"></u-icon>
- </div>
+ <div class="ingOrderDiv">
+ <div
+ class="ingOrder"
+ v-for="(item, i) in historyData"
+ :key="i"
+ @click="list3CardIconClick(item)"
+ >
+ <!-- 绗竴琛� -->
+ <div class="firstLine">
+ <div class="leftIcon">
+ <div class="leftOneDiv">
+ <span class="leftOne">瑁�</span>
</div>
- <div class="statusBox">
- <view class="status">
- <u-tag :text="coalStatus[item.statusWeigh] || ''"
- plain>
- </u-tag>
- </view>
+ <div class="leftLine"></div>
+ <div class="rightDiv">
+ <span class="rightone">鍗�</span>
</div>
-
- <div class="twoLine">
- <div class="twoleft">
- <view class="time-icon"><u-icon name="clock"
- color="#515151"
- size="25"></u-icon></view>
- <view class="send-date">{{ item.yuYueSection || item.yuYueTime }}</view>
- </div>
- <div class="twoRight">
- <u-tag :text="item.coalName" plain> </u-tag>
- <u-tag :text="item.orderType" plain> </u-tag>
- </div>
- </div>
- <!-- <div class="threeLine">
- <span class="more" @click="todoHistory">MORE>></span>
- </div> -->
+ </div>
+ <div class="centerTitle">
+ <view class="filedname exceedHide">
+ <text
+ v-if="item.orderType == '澶栭攢' || item.orderType == '鍐呴攢'"
+ >{{ item.deptName }}</text
+ >
+ <text
+ v-else-if="
+ item.orderType == '澶栬喘' || item.orderType == '鍐呰喘'
+ "
+ >{{ item.customerName }}</text
+ >
+ <text
+ v-else-if="
+ item.orderType == '杞嚭' || item.orderType == '杞叆'
+ "
+ >
+ {{ item.filedName }}
+ </text>
+ </view>
+ <p class="centerLine"></p>
+ <view class="filedname exceedHide">
+ <text
+ v-if="item.orderType == '澶栭攢' || item.orderType == '鍐呴攢'"
+ >{{ item.customerName }}</text
+ >
+ <text
+ v-else-if="
+ item.orderType == '澶栬喘' || item.orderType == '鍐呰喘'
+ "
+ >{{ item.deptName }}</text
+ >
+ <text
+ v-else-if="
+ item.orderType == '杞嚭' || item.orderType == '杞叆'
+ "
+ >
+ {{ item.toFiledName }}
+ </text>
+ </view>
+ </div>
+ <div class="rightIcon">
+ <u-icon
+ name="map"
+ color="#4978F0"
+ @click.stop="skipMap(item)"
+ size="40"
+ ></u-icon>
+ <u-icon
+ @click.stop="skipMap(item)"
+ name="map"
+ color="#4978F0"
+ size="40"
+ ></u-icon>
+ </div>
</div>
+ <div class="statusBox">
+ <div class="twoleft">
+ <view class="time-icon"
+ ><u-icon name="clock" color="#515151" size="25"></u-icon
+ ></view>
+ <view
+ class="send-date"
+ style="font-size: 13px; color: #1f4978f0"
+ >{{ item.yuYueSection || item.yuYueTime }}</view
+ >
+ </div>
+ <view class="status">
+ <u-tag :text="coalStatus[item.statusWeigh] || ''" plain>
+ </u-tag>
+ </view>
+ </div>
+
+ <div class="twoLine">
+ <div class="twoRight">
+ <view>
+ <u-tag :text="item.coalName" plain> </u-tag>
+ </view>
+ <view style="margin-left: 10rpx">
+ <u-tag :text="item.orderType" plain> </u-tag>
+ </view>
+ </div>
+ </div>
+ </div>
+ </div>
</div>
</div>
</template>
@@ -121,145 +152,153 @@
}
-} .ingOrder{
+}
+ .ingOrder {
+ width: 94%;
+ height: 370rpx;
+ margin: 0 auto;
+ 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;
+ display: flex;
+ flex-direction: column;
+ padding-top: 20rpx;
+ margin-bottom: 30rpx;
+ .statusBox {
width: 94%;
- height: 380rpx;
- margin: 0 auto;
- 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;
+ margin: 0 auto;
+ margin-top: 20rpx;
+ display: flex;
+ justify-content: space-between;
+ .twoleft {
+ display: flex;
+ justify-items: center;
+ align-items: center;
+ .time-icon {
+ margin-right: 10rpx;
+ display: flex;
+ align-items: center;
+ }
+ }
+ }
+ .status {
+ display: flex;
+ width: 150rpx;
+ }
+
+ .firstLine {
+ flex: 0 1 60%;
+ width: 92%;
+ margin: 0 auto;
+ display: flex;
+ justify-content: space-between;
+ .rightIcon {
+ display: flex;
+ height: 150rpx;
+ flex-direction: column;
+ justify-content: space-between;
+ }
+ .leftIcon {
+ display: flex;
+ height: 150rpx;
+ flex-direction: column;
+ justify-content: space-between;
+ .leftOneDiv {
+ width: 46rpx;
+ height: 46rpx;
+ background: #035cfb;
+ box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(255, 255, 255, 0.85);
+ border-radius: 5rpx;
+ text-align: center;
+ .leftOne {
+ width: 31rpx;
+ height: 31rpx;
+ font-size: 30rpx;
+ font-family: Microsoft YaHei;
+ font-weight: 400;
+ color: #ffffff;
+ }
+ }
+ .rightDiv {
+ width: 46rpx;
+ height: 46rpx;
+ background: #f1333c;
+ box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(255, 255, 255, 0.85);
+ border-radius: 5rpx;
+ text-align: center;
+ .rightone {
+ width: 29rpx;
+ height: 31rpx;
+ font-size: 30rpx;
+ font-family: Microsoft YaHei;
+ font-weight: 400;
+ color: #ffffff;
+ }
+ }
+ .leftLine {
+ width: 2rpx;
+ height: 43rpx;
+ border-right: 2px dotted #303030;
+ transform: translateX(15rpx);
+ }
+ }
+ }
+ .centerTitle {
display: flex;
flex-direction: column;
- padding-top: 20rpx;
- margin-bottom: 15rpx;
- margin-top: 10rpx;
- .statusBox{
- width: 94%;
- margin: 0 auto;
- margin-top: 20rpx;
+ justify-content: space-between;
+
+ height: 150rpx;
+ .centerLine {
+ width: 510rpx;
+ height: 1rpx;
+ border-bottom: solid 1px #ccc;
}
- .status{
- display: flex;
- width: 150rpx;
- }
-
- .firstLine{
- flex: 0 1 60%;
- width: 92%;
- margin: 0 auto;
- display: flex;
- justify-content: space-between;
- .rightIcon{
- display: flex;
- height: 150rpx;
- flex-direction: column;
- justify-content: space-between;
- }
- .leftIcon{
- display: flex;
- height: 150rpx;
- flex-direction: column;
- justify-content: space-between;
- .leftOneDiv{
- width: 46rpx;
- height: 46rpx;
- background: #035CFB;
- box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(255,255,255,0.85);
- border-radius: 5rpx;
- text-align: center;
- .leftOne{
- width: 31rpx;
- height: 31rpx;
- font-size: 30rpx;
- font-family: Microsoft YaHei;
- font-weight: 400;
- color: #FFFFFF;
- }
- }
- .rightDiv{
- width: 46rpx;
- height: 46rpx;
- background: #F1333C;
- box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(255,255,255,0.85);
- border-radius: 5rpx;
- text-align: center;
- .rightone{
- width: 29rpx;
- height: 31rpx;
- font-size: 30rpx;
- font-family: Microsoft YaHei;
- font-weight: 400;
- color: #FFFFFF;
- }
- }
- .leftLine{
- width: 2rpx;
- height: 43rpx;
- border-right: 2px dotted #303030;
- transform: translateX(15rpx);
- }
-
- }
-
- }
- .centerTitle{
- display: flex;
- flex-direction: column;
- justify-content: space-between;
- height: 150rpx;
- .centerLine{
- width: 510rpx;
- height: 1rpx;
- border-bottom: solid 1px #ccc;
- }
- }
+ }
- .twoLine{
- flex: 0 1 25%;
- width: 92%;
- margin: 20rpx auto;
- display: flex;
- justify-content: space-between;
- .twoleft{
- width: 325rpx;
- display: flex;
- justify-content: space-around;
- align-items: center;
- .send-date{
- font-size: 25rpx;
- font-family: Microsoft YaHei;
- font-weight: 300;
- color: #515151;
- }
- span{
- color: #515151;
- font-size: 30rpx;
- font-weight: 300;
- }
- }
- .twoRight{
- display: flex;
- justify-content: space-around;
- }
+ .twoLine {
+ flex: 0 1 25%;
+ width: 92%;
+ margin: 20rpx auto;
+ display: flex;
+ justify-content: space-between;
+ .twoleft {
+ display: flex;
+ justify-content: space-around;
+ align-items: center;
+ .send-date {
+ font-size: 25rpx;
+ font-family: Microsoft YaHei;
+ font-weight: 300;
+ color: #515151;
+ }
+ span {
+ color: #515151;
+ font-size: 30rpx;
+ font-weight: 300;
+ }
}
- .threeLine{
- flex: 0 1 25%;
- display: flex;
- justify-content: flex-end;
- height: 100rpx;
- margin-bottom: 20rpx;
- transform: translateY(-20rpx);
- .more{
- width: 106rpx;
- height: 20rpx;
- font-size: 24rpx;
- font-family: Microsoft YaHei;
- font-weight: 300;
- color: #494949;
- margin-right: 20rpx;
- }
+ .twoRight {
+ display: flex;
+ justify-content: space-around;
}
-
+ }
+ .threeLine {
+ flex: 0 1 25%;
+ display: flex;
+ justify-content: flex-end;
+ height: 100rpx;
+ .more {
+ width: 106rpx;
+ height: 20rpx;
+ font-size: 24rpx;
+ font-family: Microsoft YaHei;
+ font-weight: 300;
+ color: #494949;
+ margin-right: 20rpx;
+ }
+ }
}
--
Gitblit v1.9.1