hookehuyr

fix: 添加条件渲染防止未定义属性导致的显示错误

在订单管理和商品详情页中,为可能未定义的属性添加v-if条件渲染
避免当这些属性不存在时导致页面显示异常
<!--
* @Date: 2022-09-19 14:11:06
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2025-08-01 14:43:46
* @LastEditTime: 2025-08-04 14:29:21
* @FilePath: /jgdl/src/pages/myOrders/index.vue
* @Description: 订单管理页面
-->
......@@ -78,7 +78,7 @@
<view class="vehicle-details">
<text class="vehicle-name">{{ order.details.vehicle.brand }} {{ order.details.vehicle.model }}</text>
<text class="vehicle-specs">
<text>{{ order.details.vehicle.manufacture_year }}年 | </text>续航{{ order.details.vehicle.range_km }}km
<text v-if="order.details.vehicle.manufacture_year">{{ order.details.vehicle.manufacture_year }}年 | </text>续航{{ order.details.vehicle.range_km }}km
</text>
<text class="vehicle-battery">电池容量:{{ order.details.vehicle.battery_capacity_ah }}Ah</text>
<text v-if="order.details.vehicle.price" class="vehicle-price">¥{{ order.details.vehicle.price }}</text>
......
<!--
* @Date: 2022-09-19 14:11:06
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2025-08-01 14:35:15
* @LastEditTime: 2025-08-04 14:32:52
* @FilePath: /jgdl/src/pages/productDetail/index.vue
* @Description: 商品详情页
-->
......@@ -54,7 +54,7 @@
<view class="basic-info bg-white mt-2 p-4">
<text class="text-lg font-medium mb-3 block">基本信息</text>
<view class="grid grid-cols-2 gap-4">
<view class="flex items-center">
<view v-if="product?.manufacture_year" class="flex items-center">
<view class="w-8 h-8 bg-orange-100 rounded-full flex items-center justify-center mr-4">
<text class="text-orange-500">📅</text>
</view>
......@@ -63,7 +63,7 @@
<text class="text-sm block">{{ product.manufacture_year }}</text>
</view>
</view>
<view class="flex items-center">
<view v-if="product?.range_km" class="flex items-center">
<view class="w-8 h-8 bg-orange-100 rounded-full flex items-center justify-center mr-4">
<text class="text-orange-500">🔋</text>
</view>
......@@ -72,7 +72,7 @@
<text class="text-sm block">{{ product.range_km }}</text>
</view>
</view>
<view class="flex items-center">
<view v-if="product?.total_mileage_km" class="flex items-center">
<view class="w-8 h-8 bg-orange-100 rounded-full flex items-center justify-center mr-4">
<text class="text-orange-500" style="padding-bottom: 10rpx;">🛣️</text>
</view>
......@@ -81,7 +81,7 @@
<text class="text-sm block">{{ product.total_mileage_km }}</text>
</view>
</view>
<view class="flex items-center">
<view v-if="product?.max_speed_kmh" class="flex items-center">
<view class="w-8 h-8 bg-orange-100 rounded-full flex items-center justify-center mr-4">
<text class="text-orange-500">⚡</text>
</view>
......@@ -94,22 +94,22 @@
</view>
<!-- 车辆评估 -->
<view class="vehicle-condition bg-white mt-2 p-4">
<view v-if="product?.new_level || product?.brake_wear_level || product?.tire_wear_level" class="vehicle-condition bg-white mt-2 p-4">
<text class="text-lg font-medium mb-3 block">车辆评估</text>
<view class="space-y-3">
<view class="flex justify-between items-center">
<view v-if="product?.new_level" class="flex justify-between items-center">
<text>车辆成色</text>
<view class="flex">
<nut-rate v-model="product.new_level" active-color="orange" readonly size="14" />
</view>
</view>
<view class="flex justify-between items-center">
<view v-if="product?.brake_wear_level" class="flex justify-between items-center">
<text>刹车磨损度</text>
<view class="flex">
<nut-rate v-model="product.brake_wear_level" active-color="orange" readonly size="14" />
</view>
</view>
<view class="flex justify-between items-center">
<view v-if="product?.tire_wear_level" class="flex justify-between items-center">
<text>轮胎磨损度</text>
<view class="flex">
<nut-rate v-model="product.tire_wear_level" active-color="orange" readonly size="14" />
......