From 68839c24479e5272f1bd5a29a5728aad5959568b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=B5=B5=E6=AF=85?= <1335909236@qq.com>
Date: Thu, 4 Sep 2025 11:37:37 +0800
Subject: [PATCH] =?UTF-8?q?=E8=BD=A6=E7=89=8C=E9=A2=9C=E8=89=B2=E6=A0=B9?=
 =?UTF-8?q?=E6=8D=AE=E9=80=89=E6=8B=A9=E7=9A=84=E9=A2=9C=E8=89=B2=E8=BF=9B?=
 =?UTF-8?q?=E8=A1=8C=E6=98=BE=E7=A4=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/park/index/index.css | 70 ++++++++++++++++++++++++++++++++++-
 packages/park/index/index.vue | 60 +++++++++++++++++++++++++++---
 2 files changed, 123 insertions(+), 7 deletions(-)

diff --git a/packages/park/index/index.css b/packages/park/index/index.css
index a289d36a..a9bef538 100644
--- a/packages/park/index/index.css
+++ b/packages/park/index/index.css
@@ -3,16 +3,25 @@ page {
   padding-top: 20rpx;
 }
 
-
 /* 车辆信息容器样式 */
+.container-box{
+  height: 83vh;
+  overflow-y: auto;
+}
+
 .car-info-container {
-  width: 100%;
+  width: 92%;
   background-color: #ffffff;
   padding: 30rpx;
   border-bottom: 1rpx solid #eeeeee;
   box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
 }
 
+.car-info{
+  display: flex;
+  justify-content: space-between;
+}
+
 /* 车牌样式 */
 .license-plate {
   display: flex;
@@ -27,6 +36,7 @@ page {
   border-radius: 8rpx;
 }
 
+
 .plate-type {
   background-color: #1890ff;
   color: white;
@@ -40,6 +50,62 @@ page {
   font-size: 32rpx;
   color: #333333;
   font-weight: 500;
+  display: flex;
+  align-items: center;
+  padding: 15rpx 30rpx;
+  border-radius: 10rpx;
+}
+
+/* 蓝色车牌样式 */
+.plate-color-blue {
+  background-color: #1890ff;
+  color: white;
+}
+
+/* 黄色车牌样式 */
+.plate-color-yellow {
+  background-color: #ffc53d;
+  color: black;
+}
+
+/* 黑色车牌样式 */
+.plate-color-black {
+  background-color: #333333;
+  color: white;
+}
+
+/* 白色车牌样式 */
+.plate-color-white {
+  background-color: white;
+  color: black;
+  border: 1rpx solid #dddddd;
+}
+
+/* 绿色车牌样式 */
+.plate-color-green {
+  background-color: #37bd75;
+  color: white;
+}
+
+/* 渐变绿底黑字车牌样式 */
+.plate-color-gradient-green {
+  background: linear-gradient(180deg, #ffffff 0%, #2fe259 100%);
+  color: black;
+}
+
+/* 黄绿双拼底黑字车牌样式 */
+.plate-color-yellow-green {
+  background: linear-gradient(90deg, #ffc53d 30%, #37bd75 0%);
+  color: black;
+}
+
+.plate-energy{
+  font-size: 24rpx;
+  padding: 7rpx 15rpx;
+  margin-left: 15rpx;
+  border-radius: 10rpx;
+  background-color: #f2f3f4;
+  color: #37bd75;
 }
 
 /* 添加车辆按钮样式 */
diff --git a/packages/park/index/index.vue b/packages/park/index/index.vue
index c7ac872a..76ef0698 100644
--- a/packages/park/index/index.vue
+++ b/packages/park/index/index.vue
@@ -1,12 +1,28 @@
 <template>
   <view class="container">
     <!-- 车辆信息区域 -->
-    <view class="car-info-container" v-for="(item, index) in carList" :key="index">
-      <view class="license-plate">
-        <view class="plate-type-box">
-          <text class="plate-type">{{ item.car_number_color }}</text>
+    <view class="container-box">
+      <view class="car-info-container" v-for="(item, index) in carList" :key="index">
+        <view class="car-info">
+          <view class="license-plate">
+            <view class="plate-type-box">
+              <text class="plate-type" :class="{
+                'plate-color-blue': item.car_number_color === '蓝色',
+                'plate-color-yellow': item.car_number_color === '黄色',
+                'plate-color-black': item.car_number_color === '黑色',
+                'plate-color-white': item.car_number_color === '白色',
+                'plate-color-green': item.car_number_color === '绿色',
+                'plate-color-gradient-green': item.car_number_color === '渐变绿底黑字',
+                'plate-color-yellow-green': item.car_number_color === '黄绿双拼底黑字'
+              }">{{ item.car_number_color }}</text>
+            </view>
+            <view class="plate-number">
+              {{ item.car_number }}
+              <view class="plate-energy" v-if="getActualCarNumberLength(item.car_number) > 7">新能源</view>
+            </view>
+          </view>
+          <u-icon name="trash" size="45rpx" @click="deleteCar(item)"></u-icon>
         </view>
-        <text class="plate-number">{{ item.car_number }}</text>
       </view>
     </view>
 
@@ -40,6 +56,40 @@ export default {
         this.carList = res.car_list;
       })
     },
+    // 计算车牌号的实际长度，去除所有不可见字符
+    getActualCarNumberLength(carNumber) {
+      if (!carNumber) return 0;
+      // 去除所有空格和不可见字符
+      const actualNumber = carNumber.replace(/\s/g, '');
+      return actualNumber.length;
+    },
+
+
+
+    deleteCar(item) {
+      uni.showModal({
+        title: '提示',
+        content: '确定删除该车辆吗？',
+        success: (res) => {
+          if (res.confirm) {
+            const params = {
+              user_id: uni.getStorageSync('userId'),
+              car_id: item.car_id
+            }
+            request(apiArr.deleteCar, "POST", params).then((res) => {
+              if (res.code == 200) {
+                uni.showToast({
+                  title: '删除成功',
+                  icon: 'success',
+                  duration: 2000
+                });
+                this.getCarList();
+              }
+            })
+          }
+        }
+      })
+    },
     addCar() {
       // 跳转到添加车辆页面
       uni.navigateTo({