fix: 修复 OtherSettingsForm TODO 优化相关算法,解决上一版本遗留的bug
This commit is contained in:
puhui999
parent
9c06832d7e
commit
3c4a39df01
@ -1,32 +1,34 @@
|
||||
<template>
|
||||
<el-form ref="OtherSettingsFormRef" :model="formData" :rules="rules" label-width="120px">
|
||||
<el-row>
|
||||
<!-- TODO @puhui999：横着三个哈 -->
|
||||
<!-- TODO @puhui999：横着三个哈 fix-->
|
||||
<el-col :span="24">
|
||||
<el-col :span="8">
|
||||
<el-form-item label="商品排序" prop="sort">
|
||||
<el-input-number v-model="formData.sort" :min="0" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="赠送积分" prop="giveIntegral">
|
||||
<el-input-number v-model="formData.giveIntegral" :min="0" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="虚拟销量" prop="virtualSalesCount">
|
||||
<el-input-number
|
||||
v-model="formData.virtualSalesCount"
|
||||
:min="0"
|
||||
placeholder="请输入虚拟销量"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="8">
|
||||
<el-form-item label="商品排序" prop="sort">
|
||||
<el-input-number v-model="formData.sort" :min="0" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="赠送积分" prop="giveIntegral">
|
||||
<el-input-number v-model="formData.giveIntegral" :min="0" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="虚拟销量" prop="virtualSalesCount">
|
||||
<el-input-number
|
||||
v-model="formData.virtualSalesCount"
|
||||
:min="0"
|
||||
placeholder="请输入虚拟销量"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="商品推荐">
|
||||
<el-checkbox-group v-model="checkboxGroup" @change="onChangeGroup">
|
||||
<el-checkbox v-for="(item, index) in recommend" :key="index" :label="item.value">
|
||||
<el-checkbox v-for="(item, index) in recommendOptions" :key="index" :label="item.value">
|
||||
{{ item.name }}
|
||||
</el-checkbox>
|
||||
</el-checkbox-group>
|
||||
@ -51,7 +53,7 @@
|
||||
</el-form>
|
||||
</template>
|
||||
<script lang="ts" name="OtherSettingsForm" setup>
|
||||
import type { SpuType } from '@/api/mall/product/management/type/spuType'
|
||||
import type { SpuType } from '@/api/mall/product/spu'
|
||||
import { PropType } from 'vue'
|
||||
import { copyValueToTarget } from '@/utils'
|
||||
import { propTypes } from '@/utils/propTypes'
|
||||
@ -65,34 +67,7 @@ const props = defineProps({
|
||||
},
|
||||
activeName: propTypes.string.def('')
|
||||
})
|
||||
// 商品推荐选项 TODO @puhui999：这种叫 recommendOptions 会更合适哈
|
||||
const recommend = [
|
||||
{ name: '是否热卖', value: 'recommendHot' },
|
||||
{ name: '是否优惠', value: 'recommendBenefit' },
|
||||
{ name: '是否精品', value: 'recommendBest' },
|
||||
{ name: '是否新品', value: 'recommendNew' },
|
||||
{ name: '是否优品', value: 'recommendGood' }
|
||||
]
|
||||
const checkboxGroup = ref<string[]>(['recommendHot']) // 选中推荐选项
|
||||
/** 选择商品后赋值 */
|
||||
const onChangeGroup = () => {
|
||||
// TODO @puhui999：是不是可以遍历 recommend，然后进行是否选中；
|
||||
checkboxGroup.value.includes('recommendHot')
|
||||
? (formData.value.recommendHot = true)
|
||||
: (formData.value.recommendHot = false)
|
||||
checkboxGroup.value.includes('recommendBenefit')
|
||||
? (formData.value.recommendBenefit = true)
|
||||
: (formData.value.recommendBenefit = false)
|
||||
checkboxGroup.value.includes('recommendBest')
|
||||
? (formData.value.recommendBest = true)
|
||||
: (formData.value.recommendBest = false)
|
||||
checkboxGroup.value.includes('recommendNew')
|
||||
? (formData.value.recommendNew = true)
|
||||
: (formData.value.recommendNew = false)
|
||||
checkboxGroup.value.includes('recommendGood')
|
||||
? (formData.value.recommendGood = true)
|
||||
: (formData.value.recommendGood = false)
|
||||
}
|
||||
|
||||
const OtherSettingsFormRef = ref() // 表单Ref
|
||||
// 表单数据
|
||||
const formData = ref<SpuType>({
|
||||
@ -111,6 +86,23 @@ const rules = reactive({
|
||||
giveIntegral: [required],
|
||||
virtualSalesCount: [required]
|
||||
})
|
||||
// TODO @puhui999：这种叫 recommendOptions 会更合适哈 fix
|
||||
const recommendOptions = [
|
||||
{ name: '是否热卖', value: 'recommendHot' },
|
||||
{ name: '是否优惠', value: 'recommendBenefit' },
|
||||
{ name: '是否精品', value: 'recommendBest' },
|
||||
{ name: '是否新品', value: 'recommendNew' },
|
||||
{ name: '是否优品', value: 'recommendGood' }
|
||||
] // 商品推荐选项
|
||||
const checkboxGroup = ref<string[]>([]) // 选中的推荐选项
|
||||
|
||||
/** 选择商品后赋值 */
|
||||
const onChangeGroup = () => {
|
||||
// TODO @puhui999：是不是可以遍历 recommend，然后进行是否选中；fix
|
||||
recommendOptions.forEach(({ value }) => {
|
||||
formData.value[value] = checkboxGroup.value.includes(value) ? true : false
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 将传进来的值赋值给formData
|
||||
@ -120,13 +112,6 @@ watch(
|
||||
(data) => {
|
||||
if (!data) return
|
||||
copyValueToTarget(formData.value, data)
|
||||
// TODO 如果先修改其他设置的值，再改变商品详情或是商品信息会重置其他设置页面中的相关值 下一个版本修复
|
||||
checkboxGroup.value = []
|
||||
formData.value.recommendHot ? checkboxGroup.value.push('recommendHot') : ''
|
||||
formData.value.recommendBenefit ? checkboxGroup.value.push('recommendBenefit') : ''
|
||||
formData.value.recommendBest ? checkboxGroup.value.push('recommendBest') : ''
|
||||
formData.value.recommendNew ? checkboxGroup.value.push('recommendNew') : ''
|
||||
formData.value.recommendGood ? checkboxGroup.value.push('recommendGood') : ''
|
||||
},
|
||||
{
|
||||
deep: true,
|
||||
@ -154,4 +139,14 @@ const validate = async () => {
|
||||
})
|
||||
}
|
||||
defineExpose({ validate })
|
||||
onMounted(async () => {
|
||||
await nextTick()
|
||||
// TODO 如果先修改其他设置的值，再改变商品详情或是商品信息会重置其他设置页面中的相关值 fix:已修复，改为组件初始化时赋值
|
||||
checkboxGroup.value = []
|
||||
recommendOptions.forEach(({ value }) => {
|
||||
if (formData.value[value]) {
|
||||
checkboxGroup.value.push(value)
|
||||
}
|
||||
})
|
||||
})
|
||||
</script>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user