hookehuyr

fix 编辑车源时,下拉框默认选中bug修复

......@@ -138,7 +138,7 @@
<!-- 车辆出厂年份 -->
<nut-form-item label-position="top" label="车辆出厂年份" prop="manufacture_year">
<view class="form-item-content" @click="showYearPicker">
<text class="form-value" :class="{ 'form-value-selected': formData.manufacture_year, 'form-value-placeholder': !formData.manufacture_year }">{{ formData.manufacture_year || '请选择' }}</text>
<text class="form-value" :class="{ 'form-value-selected': formData.manufacture_year, 'form-value-placeholder': !formData.manufacture_year }">{{ formData.manufacture_year ? formData.manufacture_year + '年' : '请选择' }}</text>
<Right class="arrow-icon" />
</view>
</nut-form-item>
......@@ -285,14 +285,8 @@
<!-- 年份选择 -->
<nut-popup v-model:visible="yearPickerVisible" position="bottom">
<nut-date-picker
v-model="yearValue"
title="选择出厂年份"
type="year-month"
:max-date="maxYearDate"
@confirm="onYearConfirm"
@cancel="yearPickerVisible = false"
/>
<nut-picker v-model="yearValue" :columns="yearOptions" title="选择出厂年份"
@confirm="onYearConfirm" @cancel="yearPickerVisible = false" />
</nut-popup>
<!-- 新旧程度选择 -->
......@@ -330,7 +324,7 @@
</template>
<script setup>
import { ref, reactive, onMounted, computed } from 'vue'
import { ref, reactive, onMounted, computed, nextTick } from 'vue'
import { Plus, Right, Location, Close } from '@nutui/icons-vue-taro'
import Taro, { useDidShow } from '@tarojs/taro'
import BASE_URL from '@/utils/config';
......@@ -359,9 +353,9 @@ const goBack = () => {
// 获取页面参数
const instance = Taro.getCurrentInstance()
const { id, mode, type, from } = instance.router?.params || {}
const isEditMode = ref(mode === 'edit' && id)
const isAuthMode = ref(type === 'auth' && id)
const isMyCarMode = ref(type === 'myCar' && id)
const isEditMode = ref(mode === 'edit' && !!id)
const isAuthMode = ref(type === 'auth' && !!id)
const isMyCarMode = ref(type === 'myCar' && !!id)
const carId = ref(id || '')
// 已上传图片的URL
......@@ -430,14 +424,14 @@ const brandModelPickerRef = ref(null)
const schoolValue = ref([])
const brandValue = ref([])
const modelValue = ref([])
const yearValue = ref(new Date())
const yearValue = ref([])
const conditionValue = ref([])
// const batteryWearValue = ref([])
const brakeWearValue = ref([])
const tireWearValue = ref([])
// 年份选择器最大日期限制(当前年份的12月31日
const maxYearDate = ref(new Date(new Date().getFullYear(), 11, 31))
// 年份选择器选项数据(当前年份往前10年
const yearOptions = ref([])
// 计算属性:判断是否为已认证状态
const isVerified = computed(() => {
......@@ -769,7 +763,8 @@ const onModelConfirm = ({ selectedValue }) => {
* 年份选择确认
*/
const onYearConfirm = ({ selectedValue }) => {
formData.manufacture_year = `${selectedValue[0]}年`
// selectedValue[0] 直接就是选中的年份值
formData.manufacture_year = selectedValue[0]
yearPickerVisible.value = false
}
......@@ -1091,6 +1086,13 @@ const loadCarData = async () => {
formData.right_photo = carData.right_photo || ''
formData.other_photo = carData.other_photo || ''
// 数据填充完成后设置各选择器默认值
setYearDefaultValue()
setConditionDefaultValue()
setBrakeWearDefaultValue()
setTireWearDefaultValue()
setSchoolDefaultValue()
Taro.hideLoading()
}
} catch (error) {
......@@ -1106,7 +1108,10 @@ const loadCarData = async () => {
/**
* 加载学校列表
*/
const loadSchools = async () => {
/**
* 初始化学校选项(仅加载选项,不设置默认值)
*/
const initSchoolOptions = async () => {
try {
const { code, data } = await getSchoolsAPI()
if (code && data) {
......@@ -1114,6 +1119,7 @@ const loadSchools = async () => {
text: school.name,
value: school.id
}))
console.log('学校选项初始化完成,共', schoolOptions.value.length, '个选项')
}
} catch (error) {
console.error('加载学校列表失败:', error)
......@@ -1181,16 +1187,152 @@ const checkUserPermission = async () => {
return true
}
/**
* 初始化年份选项数据(仅初始化选项,不设置默认值)
*/
const initYearOptions = () => {
const currentYear = new Date().getFullYear()
const years = []
// 生成当前年份往前10年的年份选项
for (let i = 0; i < 10; i++) {
const year = currentYear - i
years.push({
text: `${year}年`,
value: year
})
}
yearOptions.value = years
console.log('年份选项初始化完成:', years.length, '个选项')
}
/**
* 设置年份默认值(在数据加载后调用)
*/
const setYearDefaultValue = () => {
const currentYear = new Date().getFullYear()
// 如果是编辑模式且有原值,设置对应的选中项
if (isEditMode.value && formData.manufacture_year) {
// 原值已经是纯数字,直接使用
const originalYear = parseInt(formData.manufacture_year)
const yearExists = yearOptions.value.some(item => item.value === originalYear)
if (yearExists) {
// v-model应该是包含value值的数组
yearValue.value = [originalYear]
} else {
yearValue.value = []
}
console.log('编辑模式年份默认值设置:', yearValue.value, '原始年份:', originalYear)
} else {
// 发布模式设置默认为当前年份
yearValue.value = [currentYear]
console.log('发布模式年份默认值设置:', yearValue.value)
}
}
/**
* 设置新旧程度默认值(在数据加载后调用)
*/
const setConditionDefaultValue = () => {
// 如果是编辑模式且有原值,设置对应的选中项
if (isEditMode.value && formData.new_level) {
const originalCondition = formData.new_level
const conditionExists = conditionOptions.value.some(item => item.value === originalCondition)
if (conditionExists) {
conditionValue.value = [originalCondition]
} else {
conditionValue.value = []
}
console.log('编辑模式新旧程度默认值设置:', conditionValue.value, '原始值:', originalCondition)
} else {
// 发布模式设置默认为9成新
conditionValue.value = ['9成新']
console.log('发布模式新旧程度默认值设置:', conditionValue.value)
}
}
/**
* 设置刹车磨损度默认值(在数据加载后调用)
*/
const setBrakeWearDefaultValue = () => {
// 如果是编辑模式且有原值,设置对应的选中项
if (isEditMode.value && formData.brake_wear_level) {
const originalBrakeWear = formData.brake_wear_level
const brakeWearExists = wearLevelOptions.value.some(item => item.value === originalBrakeWear)
if (brakeWearExists) {
brakeWearValue.value = [originalBrakeWear]
} else {
brakeWearValue.value = []
}
console.log('编辑模式刹车磨损度默认值设置:', brakeWearValue.value, '原始值:', originalBrakeWear)
} else {
// 发布模式设置默认为全新
brakeWearValue.value = ['全新']
console.log('发布模式刹车磨损度默认值设置:', brakeWearValue.value)
}
}
/**
* 设置轮胎磨损度默认值(在数据加载后调用)
*/
const setTireWearDefaultValue = () => {
// 如果是编辑模式且有原值,设置对应的选中项
if (isEditMode.value && formData.tire_wear_level) {
const originalTireWear = formData.tire_wear_level
const tireWearExists = wearLevelOptions.value.some(item => item.value === originalTireWear)
if (tireWearExists) {
tireWearValue.value = [originalTireWear]
} else {
tireWearValue.value = []
}
console.log('编辑模式轮胎磨损度默认值设置:', tireWearValue.value, '原始值:', originalTireWear)
} else {
// 发布模式设置默认为全新
tireWearValue.value = ['全新']
console.log('发布模式轮胎磨损度默认值设置:', tireWearValue.value)
}
}
/**
* 设置学校选择器默认值
*/
const setSchoolDefaultValue = () => {
if (isEditMode.value) {
// 编辑模式:基于表单数据设置选择器值
if (formData.school_id && formData.school_name) {
const matchingOption = schoolOptions.value.find(option => option.value === formData.school_id)
if (matchingOption) {
schoolValue.value = [matchingOption.value]
console.log('学校选择器默认值设置为:', matchingOption.text)
}
}
} else {
// 发布模式:不设置默认值,保持用户手动选择
console.log('发布模式下学校选择器不设置默认值')
}
}
// 页面加载时执行
onMounted(async () => {
// 立即初始化年份选项(不设置默认值)
initYearOptions()
// 加载基础数据
await Promise.all([
loadSchools(),
initSchoolOptions(),
loadBrandsModels()
])
if (isEditMode.value) {
loadCarData()
} else {
// 发布模式下直接设置各选择器默认值
setYearDefaultValue()
setConditionDefaultValue()
setBrakeWearDefaultValue()
setTireWearDefaultValue()
}
// 默认权限检查逻辑
......