generated from Leo_Ding/web-template
修改产品部分内容--功能特点
This commit is contained in:
qingyu
parent
c80ec21465
commit
c514f7a1c0
@ -20,7 +20,7 @@
|
||||
<!-- <a-input :placeholder="'请输入产品类别名称'" v-model:value="formData.categoryID"></a-input>-->
|
||||
<div style="display: flex;justify-content: space-between;">
|
||||
<a-select v-model:value="formData.categoryID" allowClear>
|
||||
<a-select-option v-for="item in areaList" :value="item.value">{{ item.value }}</a-select-option>
|
||||
<a-select-option v-for="item in areaList" :value="item.value">{{ item.categoryIDName }}</a-select-option>
|
||||
</a-select>
|
||||
<!-- <a-button type="primary" @click="childOpen = true">新增产品类别</a-button>-->
|
||||
</div>
|
||||
@ -51,17 +51,55 @@
|
||||
<!-- </a-form-item>-->
|
||||
<!-- </a-col>-->
|
||||
<a-col :span="24">
|
||||
<a-form-item :label="'功能特点'" name="feature">
|
||||
<a-form-item
|
||||
v-for="(item, index) in formData.feature"
|
||||
:key="index"
|
||||
:label="`产品功能特点 ${index + 1}`">
|
||||
<a-input
|
||||
v-model:value="item.label"
|
||||
placeholder="请输入功能特点标题"
|
||||
class="inputPhone"
|
||||
/>
|
||||
<!-- <a-input-->
|
||||
<!-- v-model:value="item.data"-->
|
||||
<!-- placeholder="请输入功能特点"-->
|
||||
<!-- class="inputPhone"-->
|
||||
<!-- />-->
|
||||
<a-select
|
||||
v-model:value="formData.feature"
|
||||
v-model:value="item.data"
|
||||
mode="tags"
|
||||
:placeholder="'请输入功能特点，按回车分隔'"
|
||||
:token-separators="[',']"
|
||||
style="width: 100%;"
|
||||
/>
|
||||
<a-button
|
||||
danger
|
||||
@click="removeFeature(index)"
|
||||
size="small"
|
||||
style="margin-top: 8px">
|
||||
删除
|
||||
</a-button>
|
||||
</a-form-item>
|
||||
|
||||
<a-form-item>
|
||||
<a-button type="dashed" block @click="addFeature">
|
||||
新增产品功能特点
|
||||
</a-button>
|
||||
</a-form-item>
|
||||
|
||||
</a-col>
|
||||
<!-- <a-col :span="24">-->
|
||||
<!-- <a-form-item :label="'功能特点'" name="feature">-->
|
||||
<!-- <a-select-->
|
||||
<!-- v-model:value="formData.feature"-->
|
||||
<!-- mode="tags"-->
|
||||
<!-- :placeholder="'请输入功能特点，按回车分隔'"-->
|
||||
<!-- :token-separators="[',']"-->
|
||||
<!-- style="width: 100%;"-->
|
||||
<!-- />-->
|
||||
<!-- </a-form-item>-->
|
||||
|
||||
<!-- </a-col>-->
|
||||
<a-col :span="24">
|
||||
<a-form-item
|
||||
v-for="(item, index) in formData.standard"
|
||||
@ -113,11 +151,11 @@
|
||||
<!-- </a-form-item>-->
|
||||
|
||||
<!-- </a-col>-->
|
||||
<a-form-item :label="'产品主图'" name="mainImage">
|
||||
<a-form-item :label="'产品主图'" >
|
||||
<gx-upload v-model="formData.mainImage" :fileNumber="1" />
|
||||
</a-form-item>
|
||||
|
||||
<a-form-item :label="'内容物图'" name="contentImage">
|
||||
<a-form-item :label="'内容物图'" >
|
||||
<gx-upload v-model="formData.contentImage" :fileNumber="1" />
|
||||
</a-form-item>
|
||||
<!-- <a-col :span="24">-->
|
||||
@ -186,6 +224,7 @@ import apis from '@/apis'
|
||||
import { useForm, useModal,useSpining } from '@/hooks'
|
||||
import { message } from 'ant-design-vue'
|
||||
import { useI18n } from 'vue-i18n'
|
||||
|
||||
import dayjs from 'dayjs'
|
||||
import {
|
||||
createProductCategory,
|
||||
@ -194,6 +233,7 @@ import {
|
||||
getProductObj,
|
||||
getProductsItem, updateProductsItem,
|
||||
} from '@/apis/modules/products'
|
||||
import { spliceUrl } from '@/utils/util'
|
||||
const areaFormRef = ref()
|
||||
const emit = defineEmits(['ok'])
|
||||
const { t } = useI18n() // 解构出t方法
|
||||
@ -207,6 +247,8 @@ const roles = ref([])
|
||||
const imgUrl = ref('')
|
||||
const areaList = ref([])
|
||||
const images = ref([])
|
||||
const mainImage = ref([])
|
||||
const contentImage = ref([])
|
||||
const childOpen = ref(false)
|
||||
const formArea = ref({ name: '', status: 'enabled' })
|
||||
formRules.value = {
|
||||
@ -219,7 +261,7 @@ formRules.value = {
|
||||
standard: [{ required: true, message: '请输入产品标准' }],
|
||||
images: [{ required: true, message: '请上传产品图片' }],
|
||||
mainImage: { required: true, message: '请上传产品图片' },
|
||||
contentImage: { required: true, message: '请上传产品内容图片' },
|
||||
contentImage: { required: false, message: '请上传产品内容图片' },
|
||||
sequence: [{ required: true, message: '请输入产品排序' }],
|
||||
status: [{ required: true, message: '请选择状态', trigger: 'change' }],
|
||||
}
|
||||
@ -247,6 +289,7 @@ const initDataBatch = async (configs) => {
|
||||
})
|
||||
|
||||
areaList.value = [...areaList.value, ...mapped]
|
||||
console.log(areaList.value)
|
||||
console.log('after merge:', areaList.value)
|
||||
}
|
||||
})
|
||||
@ -284,7 +327,12 @@ function handleCreate() {
|
||||
categoryID: '',
|
||||
compose: '',
|
||||
target: '',
|
||||
feature: [],
|
||||
feature: [{
|
||||
label:'功能特点',
|
||||
data:[{
|
||||
msg:[''],
|
||||
}]
|
||||
}],
|
||||
standard: [{
|
||||
label: '',
|
||||
val: '' ,
|
||||
@ -364,11 +412,19 @@ async function handleEdit(record = {}) {
|
||||
fu_hoao: '' ,
|
||||
prx: '' ,
|
||||
}],
|
||||
feature:data.feature|| [{
|
||||
label:'功能特点',
|
||||
data:[{
|
||||
msg:[''],
|
||||
}]
|
||||
}],
|
||||
// images:data.images || [''],
|
||||
mainImage: data.images?.[0] || '',
|
||||
contentImage: data.images?.[1] || '',
|
||||
mainImage: data.images?[config('http.apiBasic')+data.images[0]]:[''],
|
||||
contentImage:data.images?[config('http.apiBasic')+data.images[1]]:[''],
|
||||
}
|
||||
imgUrl.value = config('http.apiBasic') + data.img
|
||||
// imgUrl.value = config('http.apiBasic') + data.img
|
||||
mainImage.value = config('http.apiBasic') + data.images?.[0] ,
|
||||
contentImage.value = config('http.apiBasic') + data.images?.[1] ,
|
||||
console.log('编辑产品数据：',formData.value);
|
||||
}
|
||||
|
||||
@ -382,23 +438,29 @@ function handleOk() {
|
||||
showLoading()
|
||||
const params = {
|
||||
...values,
|
||||
standard:formData.value.standard||
|
||||
standard:formData.value.standard ||
|
||||
[{
|
||||
label: '',
|
||||
val: '' ,
|
||||
fu_hoao: '' ,
|
||||
prx: '' ,
|
||||
}],
|
||||
feature:formData.value.feature|| [{
|
||||
label:'功能特点',
|
||||
data:[{
|
||||
msg:[''],
|
||||
}]
|
||||
}],
|
||||
images: [
|
||||
...(Array.isArray(formData.value.mainImage)
|
||||
? formData.value.mainImage
|
||||
: [formData.value.mainImage]
|
||||
).filter(Boolean).map(item => String(item)),
|
||||
).filter(Boolean).map(item => spliceUrl(item)),
|
||||
|
||||
...(Array.isArray(formData.value.contentImage)
|
||||
? formData.value.contentImage
|
||||
: [formData.value.contentImage]
|
||||
).filter(Boolean).map(item => String(item))
|
||||
).filter(Boolean).map(item => spliceUrl(item))
|
||||
],
|
||||
}
|
||||
let result = null
|
||||
@ -463,7 +525,17 @@ function removeStandard(index) {
|
||||
formData.value.standard.splice(index, 1)
|
||||
}
|
||||
}
|
||||
// 添加标准
|
||||
function addFeature() {
|
||||
formData.value.feature.push({ label: '', value: '' })
|
||||
}
|
||||
|
||||
// 删除标准
|
||||
function removeFeature(index) {
|
||||
if (formData.value.feature.length > 1) {
|
||||
formData.value.feature.splice(index, 1)
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user