Hooke / jgdl

Go to a project
Toggle navigation Toggle navigation pinning
hookehuyr
8c8b3914 1 parent 1f7de325

feat: 添加车辆已售状态样式和禁用表单交互 

- 为已售车辆添加特殊样式和标签显示
- 增加表单禁用状态的样式和交互限制
- 优化订单剩余时间计算逻辑
- 更新测试环境的openid配置
Inline Side-by-side
Showing 6 changed files with 98 additions and 24 deletions
<!--
* @Date: 2022-09-19 14:11:06
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2025-07-14 16:51:45
* @LastEditTime: 2025-07-18 11:37:09
* @FilePath: /jgdl/src/pages/auth/index.vue
* @Description: 文件描述
-->
......@@ -90,7 +90,8 @@ export default {
// 测试环境下传递openid，正式环境不传递
if (process.env.NODE_ENV === 'development') {
requestData.openid = 'h-008';
// requestData.openid = 'h-008';
requestData.openid = 'oWbdFvkD5VtloC50wSNR9IWiU2q8';
}
request.post('/srv/?a=openid', requestData)
......
......@@ -176,6 +176,24 @@
font-size: 40rpx;
font-weight: bold;
color: #f97316;
display: flex;
align-items: center;
gap: 16rpx;
.sold-price {
text-decoration: line-through;
color: #999;
}
}
.sold-label {
font-size: 28rpx;
color: #ef4444;
// background: #fef2f2;
// border: 1rpx solid #fecaca;
// border-radius: 8rpx;
// padding: 4rpx 12rpx;
font-weight: normal;
}
.market-price {
......
<!--
* @Date: 2022-09-19 14:11:06
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2025-07-17 11:00:00
* @LastEditTime: 2025-07-18 12:20:28
* @FilePath: /jgdl/src/pages/myCar/index.vue
* @Description: 文件描述
-->
......@@ -40,7 +40,7 @@
<!-- 右侧：车辆信息 -->
<nut-col :span="18">
<view class="car-info">
<view class="car-title">{{ car.manufacture_year }}款 {{ car.brand }} {{ car.model }}</view>
<view class="car-title" @click="goToCarDetail(car.id)">{{ car.manufacture_year }}款 {{ car.brand }} {{ car.model }}</view>
<!-- 状态标识 -->
<view class="status-badges">
<view v-if="car.verification_status" class="status-badge" :class="getVerificationStatusClass(car.verification_status)">
......@@ -65,15 +65,18 @@
</nut-config-provider>
</view>
<view class="price-section">
<view v-if="car.price" class="current-price">¥{{ car.price }}</view>
<view v-if="car.market_price" class="market-price">市场价 ¥{{ car.market_price }}</view>
<view v-if="car.price" class="current-price">
<text :class="{ 'sold-price': car.is_sold }">¥{{ car.price }}</text>
<text v-if="car.is_sold" class="sold-label">已售出</text>
</view>
<view v-if="car.market_price && !car.is_sold" class="market-price">市场价 ¥{{ car.market_price }}</view>
</view>
</view>
</nut-col>
</nut-row>
<!-- 操作按钮 -->
<view class="action-buttons mt-2">
<!-- 操作按钮 只能修改未卖出的车 -->
<view v-if="!car.is_sold" class="action-buttons mt-2">
<nut-button size="small" type="default" @click="editCar(car.id)">编辑</nut-button>
<!-- 只有审核状态为3时才显示上架/下架按钮 -->
<nut-button
......@@ -82,7 +85,7 @@
:type="car.status === 5 ? 'success' : 'warning'"
@click="toggleOffline(car)"
>
{{ car.status === 5 && !car.is_sold ? '上架' : '下架' }}
{{ car.status === 5 ? '上架' : '下架' }}
</nut-button>
<nut-button
v-if="car.review_status === 5"
......@@ -345,7 +348,14 @@ const showToast = (message, type = 'success') => {
})
}
/**
* 跳转到车源详情页
*/
const goToCarDetail = (carId) => {
Taro.navigateTo({
url: `/pages/productDetail/index?id=${carId}`
})
}
// 页面加载时获取数据
useDidShow(() => {
......
<!--
* @Date: 2022-09-19 14:11:06
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2025-07-16 18:23:31
* @LastEditTime: 2025-07-18 12:23:09
* @FilePath: /jgdl/src/pages/myOrders/index.vue
* @Description: 订单管理页面
-->
......@@ -440,7 +440,11 @@ const loadOrderData = async (isLoadMore = false) => {
// TODO: 为待支付订单添加mock的倒计时时间（1800秒用于测试）
if (processedOrder.status === 3) {
processedOrder.remain_time = processedOrder.pay_time || 1800
// 计算剩余时间（毫秒）
const current_date = new Date(processedOrder.server_time);
const end_date = new Date(processedOrder.pay_deadline_time);
let time_left = end_date - current_date;
processedOrder.remain_time = time_left || 1800
}
return processedOrder
......
......@@ -149,10 +149,23 @@
font-weight: 500;
}
.form-value-disabled {
color: #d1d5db !important; /* 禁用状态文字颜色 */
}
.arrow-icon {
color: #9ca3af;
}
.arrow-icon-disabled {
color: #d1d5db !important; /* 禁用状态箭头颜色 */
}
.form-item-disabled {
opacity: 0.6; /* 禁用状态整体透明度 */
cursor: not-allowed;
}
.form-item-content {
display: flex;
justify-content: space-between;
......
......@@ -127,11 +127,11 @@
<!-- 品牌型号选择（新版） -->
<nut-form-item label-position="top" label="品牌型号选择" prop="brandModel">
<view class="form-item-content" @click="showBrandModelPicker">
<text class="form-value" :class="{ 'form-value-selected': formData.brand && formData.model, 'form-value-placeholder': !(formData.brand && formData.model) }">
<view class="form-item-content" :class="{ 'form-item-disabled': isVerified }" @click="showBrandModelPicker">
<text class="form-value" :class="{ 'form-value-selected': formData.brand && formData.model, 'form-value-placeholder': !(formData.brand && formData.model), 'form-value-disabled': isVerified }">
{{ formData.brand && formData.model ? `${formData.brand} ${formData.model}` : '请选择品牌型号' }}
</text>
<Right class="arrow-icon" />
<Right class="arrow-icon" :class="{ 'arrow-icon-disabled': isVerified }" />
</view>
</nut-form-item>
......@@ -163,7 +163,7 @@
<!-- 续航里程 -->
<nut-form-item label="续航里程" prop="range_km">
<nut-input v-model="formData.range_km" placeholder="请输入" type="number" input-align="right" @input="validateRangeInput">
<nut-input v-model="formData.range_km" placeholder="请输入" type="number" input-align="right" :disabled="isVerified" @click="validateRangeInput" @input="validateNumberInput($event, 'range_km', false)">
<template #right>
<text class="unit">公里</text>
</template>
......@@ -173,7 +173,7 @@
<!-- 最高时速 -->
<nut-form-item label="最高时速" prop="max_speed_kmh">
<nut-input v-model="formData.max_speed_kmh" placeholder="请输入" type="number"
input-align="right" @input="validateMaxSpeedInput">
input-align="right" :disabled="isVerified" @click="validateMaxSpeedInput" @input="validateNumberInput($event, 'max_speed_kmh', false)">
<template #right>
<text class="unit">km/h</text>
</template>
......@@ -320,7 +320,7 @@
</template>
<script setup>
import { ref, reactive, onMounted } from 'vue'
import { ref, reactive, onMounted, computed } from 'vue'
import { Plus, Right, Location, Close } from '@nutui/icons-vue-taro'
import Taro from '@tarojs/taro'
import BASE_URL from '@/utils/config';
......@@ -419,6 +419,22 @@ const tireWearValue = ref([])
// 年份选择器最大日期限制（当前年份的12月31日）
const maxYearDate = ref(new Date(new Date().getFullYear(), 11, 31))
// 计算属性：判断是否为已认证状态
const isVerified = computed(() => {
return isEditMode.value && formData.verification_status === 5
})
/**
* 显示已认证不能修改的提醒
*/
const showVerifiedTip = () => {
Taro.showToast({
title: '车辆已认证，该项不能修改',
icon: 'none',
duration: 2000
})
}
// 选择器选项数据
const schoolOptions = ref([])
const brandOptions = ref([])
......@@ -672,19 +688,27 @@ const validateMileageInput = (event) => {
}
/**
* 校验续航里程输入，只允许整数，范围0-99999
* @param {Object} event - 输入事件对象
* 校验续航里程输入权限
* @param {Object} event - 点击事件对象
*/
// eslint-disable-next-line no-unused-vars
const validateRangeInput = (event) => {
validateNumberInput(event, 'range_km', false)
if (isVerified.value) {
showVerifiedTip()
return
}
}
/**
* 校验最高时速输入，只允许整数，范围0-99999
* @param {Object} event - 输入事件对象
* 校验最高时速输入权限
* @param {Object} event - 点击事件对象
*/
// eslint-disable-next-line no-unused-vars
const validateMaxSpeedInput = (event) => {
validateNumberInput(event, 'max_speed_kmh', false)
if (isVerified.value) {
showVerifiedTip()
return
}
}
/**
......@@ -765,6 +789,10 @@ const onTireWearConfirm = ({ selectedValue }) => {
* 显示品牌型号选择器
*/
const showBrandModelPicker = () => {
if (isVerified.value) {
showVerifiedTip()
return
}
brandModelPickerRef.value?.show()
}
......