|
@@ -24,12 +24,7 @@
|
|
|
<el-col :span="8">
|
|
<el-col :span="8">
|
|
|
<el-form-item label="推文类别" prop="category">
|
|
<el-form-item label="推文类别" prop="category">
|
|
|
<el-select v-model="form.category" placeholder="请选择" clearable style="width: 100%">
|
|
<el-select v-model="form.category" placeholder="请选择" clearable style="width: 100%">
|
|
|
- <el-option
|
|
|
|
|
- v-for="item in purchaseCategoryOptions"
|
|
|
|
|
- :key="item.id"
|
|
|
|
|
- :label="item.categoryName"
|
|
|
|
|
- :value="String(item.id)"
|
|
|
|
|
- />
|
|
|
|
|
|
|
+ <el-option v-for="item in purchaseCategoryOptions" :key="item.id" :label="item.categoryName" :value="String(item.id)" />
|
|
|
</el-select>
|
|
</el-select>
|
|
|
</el-form-item>
|
|
</el-form-item>
|
|
|
</el-col>
|
|
</el-col>
|
|
@@ -37,12 +32,7 @@
|
|
|
<el-col :span="8">
|
|
<el-col :span="8">
|
|
|
<el-form-item label="适配场景" prop="adaptNo">
|
|
<el-form-item label="适配场景" prop="adaptNo">
|
|
|
<el-select v-model="form.adaptNo" placeholder="请选择" clearable style="width: 100%">
|
|
<el-select v-model="form.adaptNo" placeholder="请选择" clearable style="width: 100%">
|
|
|
- <el-option
|
|
|
|
|
- v-for="item in sceneOptions"
|
|
|
|
|
- :key="item.id"
|
|
|
|
|
- :label="item.sceneName"
|
|
|
|
|
- :value="String(item.id)"
|
|
|
|
|
- />
|
|
|
|
|
|
|
+ <el-option v-for="item in sceneOptions" :key="item.id" :label="item.sceneName" :value="String(item.id)" />
|
|
|
</el-select>
|
|
</el-select>
|
|
|
</el-form-item>
|
|
</el-form-item>
|
|
|
</el-col>
|
|
</el-col>
|
|
@@ -53,12 +43,7 @@
|
|
|
<el-col :span="8">
|
|
<el-col :span="8">
|
|
|
<el-form-item label="适配行业" prop="industry">
|
|
<el-form-item label="适配行业" prop="industry">
|
|
|
<el-select v-model="form.industry" placeholder="请选择" clearable style="width: 100%">
|
|
<el-select v-model="form.industry" placeholder="请选择" clearable style="width: 100%">
|
|
|
- <el-option
|
|
|
|
|
- v-for="item in industryOptions"
|
|
|
|
|
- :key="item.id"
|
|
|
|
|
- :label="item.industryCategoryName"
|
|
|
|
|
- :value="String(item.id)"
|
|
|
|
|
- />
|
|
|
|
|
|
|
+ <el-option v-for="item in industryOptions" :key="item.id" :label="item.industryCategoryName" :value="String(item.id)" />
|
|
|
</el-select>
|
|
</el-select>
|
|
|
</el-form-item>
|
|
</el-form-item>
|
|
|
</el-col>
|
|
</el-col>
|
|
@@ -66,23 +51,14 @@
|
|
|
<el-col :span="8">
|
|
<el-col :span="8">
|
|
|
<el-form-item label="标签" prop="label">
|
|
<el-form-item label="标签" prop="label">
|
|
|
<el-select v-model="form.label" placeholder="请选择" clearable style="width: 100%" @change="handleLabelChange">
|
|
<el-select v-model="form.label" placeholder="请选择" clearable style="width: 100%" @change="handleLabelChange">
|
|
|
- <el-option
|
|
|
|
|
- v-for="item in tagOptions"
|
|
|
|
|
- :key="item.id"
|
|
|
|
|
- :label="item.tagName"
|
|
|
|
|
- :value="String(item.id)"
|
|
|
|
|
- />
|
|
|
|
|
|
|
+ <el-option v-for="item in tagOptions" :key="item.id" :label="item.tagName" :value="String(item.id)" />
|
|
|
</el-select>
|
|
</el-select>
|
|
|
</el-form-item>
|
|
</el-form-item>
|
|
|
</el-col>
|
|
</el-col>
|
|
|
<!-- 显示设置 -->
|
|
<!-- 显示设置 -->
|
|
|
<el-col :span="8">
|
|
<el-col :span="8">
|
|
|
<el-form-item label="显示设置" prop="isShow">
|
|
<el-form-item label="显示设置" prop="isShow">
|
|
|
- <el-switch
|
|
|
|
|
- v-model="form.isShow"
|
|
|
|
|
- active-value="1"
|
|
|
|
|
- inactive-value="0"
|
|
|
|
|
- />
|
|
|
|
|
|
|
+ <el-switch v-model="form.isShow" active-value="1" inactive-value="0" />
|
|
|
</el-form-item>
|
|
</el-form-item>
|
|
|
</el-col>
|
|
</el-col>
|
|
|
</el-row>
|
|
</el-row>
|
|
@@ -97,12 +73,7 @@
|
|
|
<span class="ml-1">从图片库选择</span>
|
|
<span class="ml-1">从图片库选择</span>
|
|
|
</el-button>
|
|
</el-button>
|
|
|
<div v-if="form.coverImage" class="ml-4 flex items-center">
|
|
<div v-if="form.coverImage" class="ml-4 flex items-center">
|
|
|
- <el-image
|
|
|
|
|
- :src="coverImageUrl"
|
|
|
|
|
- style="width: 80px; height: 80px"
|
|
|
|
|
- fit="cover"
|
|
|
|
|
- :preview-src-list="[coverImageUrl]"
|
|
|
|
|
- />
|
|
|
|
|
|
|
+ <el-image :src="coverImageUrl" style="width: 80px; height: 80px" fit="cover" :preview-src-list="[coverImageUrl]" />
|
|
|
<el-button v-if="!isViewMode" link type="danger" class="ml-2" @click="clearCoverImage">
|
|
<el-button v-if="!isViewMode" link type="danger" class="ml-2" @click="clearCoverImage">
|
|
|
<el-icon><Delete /></el-icon>
|
|
<el-icon><Delete /></el-icon>
|
|
|
</el-button>
|
|
</el-button>
|
|
@@ -122,12 +93,7 @@
|
|
|
<span class="ml-1">从图片库选择</span>
|
|
<span class="ml-1">从图片库选择</span>
|
|
|
</el-button>
|
|
</el-button>
|
|
|
<div v-if="form.innerAdvert" class="ml-4 flex items-center">
|
|
<div v-if="form.innerAdvert" class="ml-4 flex items-center">
|
|
|
- <el-image
|
|
|
|
|
- :src="advertImageUrl"
|
|
|
|
|
- style="width: 80px; height: 80px"
|
|
|
|
|
- fit="cover"
|
|
|
|
|
- :preview-src-list="[advertImageUrl]"
|
|
|
|
|
- />
|
|
|
|
|
|
|
+ <el-image :src="advertImageUrl" style="width: 80px; height: 80px" fit="cover" :preview-src-list="[advertImageUrl]" />
|
|
|
<el-button v-if="!isViewMode" link type="danger" class="ml-2" @click="clearAdvertImage">
|
|
<el-button v-if="!isViewMode" link type="danger" class="ml-2" @click="clearAdvertImage">
|
|
|
<el-icon><Delete /></el-icon>
|
|
<el-icon><Delete /></el-icon>
|
|
|
</el-button>
|
|
</el-button>
|
|
@@ -141,27 +107,17 @@
|
|
|
<!-- 描述 -->
|
|
<!-- 描述 -->
|
|
|
<el-col :span="24">
|
|
<el-col :span="24">
|
|
|
<el-form-item label="描述" prop="describe">
|
|
<el-form-item label="描述" prop="describe">
|
|
|
- <el-input
|
|
|
|
|
- v-model="form.describe"
|
|
|
|
|
- type="textarea"
|
|
|
|
|
- :rows="5"
|
|
|
|
|
- placeholder="请输入描述内容"
|
|
|
|
|
- />
|
|
|
|
|
|
|
+ <el-input v-model="form.describe" type="textarea" :rows="5" placeholder="请输入描述内容" />
|
|
|
</el-form-item>
|
|
</el-form-item>
|
|
|
</el-col>
|
|
</el-col>
|
|
|
</el-row>
|
|
</el-row>
|
|
|
|
|
|
|
|
<!-- 添加商品区域 -->
|
|
<!-- 添加商品区域 -->
|
|
|
- <el-row :gutter="20" >
|
|
|
|
|
|
|
+ <el-row :gutter="20">
|
|
|
<el-col :span="24">
|
|
<el-col :span="24">
|
|
|
<el-form-item label="添加商品">
|
|
<el-form-item label="添加商品">
|
|
|
<div class="flex items-center gap-2">
|
|
<div class="flex items-center gap-2">
|
|
|
- <el-input
|
|
|
|
|
- v-model="productKeyword"
|
|
|
|
|
- placeholder="商品名称/商品编号"
|
|
|
|
|
- style="width: 200px"
|
|
|
|
|
- :disabled="isViewMode"
|
|
|
|
|
- />
|
|
|
|
|
|
|
+ <el-input v-model="productKeyword" placeholder="商品名称/商品编号" style="width: 200px" :disabled="isViewMode" />
|
|
|
<!-- <el-button @click="handleAddProduct" :disabled="isViewMode">
|
|
<!-- <el-button @click="handleAddProduct" :disabled="isViewMode">
|
|
|
<el-icon><Plus /></el-icon>
|
|
<el-icon><Plus /></el-icon>
|
|
|
<span class="ml-1">加入</span>
|
|
<span class="ml-1">加入</span>
|
|
@@ -320,12 +276,12 @@ const initFormData: ProgramForm = {
|
|
|
describe: undefined,
|
|
describe: undefined,
|
|
|
category: undefined,
|
|
category: undefined,
|
|
|
isShow: '1',
|
|
isShow: '1',
|
|
|
- coverImage: undefined,
|
|
|
|
|
|
|
+ coverImage: '',
|
|
|
content: undefined,
|
|
content: undefined,
|
|
|
industry: undefined,
|
|
industry: undefined,
|
|
|
adaptNo: undefined,
|
|
adaptNo: undefined,
|
|
|
label: undefined,
|
|
label: undefined,
|
|
|
- innerAdvert: undefined,
|
|
|
|
|
|
|
+ innerAdvert: '',
|
|
|
remark: undefined,
|
|
remark: undefined,
|
|
|
productIds: []
|
|
productIds: []
|
|
|
};
|
|
};
|
|
@@ -334,7 +290,8 @@ const form = ref<ProgramForm>({ ...initFormData });
|
|
|
|
|
|
|
|
// 表单验证规则
|
|
// 表单验证规则
|
|
|
const rules = reactive({
|
|
const rules = reactive({
|
|
|
- title: [{ required: true, message: '产品标题不能为空', trigger: 'blur' }]
|
|
|
|
|
|
|
+ title: [{ required: true, message: '产品标题不能为空', trigger: 'blur' }],
|
|
|
|
|
+ describe: [{ required: true, message: '描述不能为空', trigger: 'blur' }]
|
|
|
});
|
|
});
|
|
|
|
|
|
|
|
// 封面图URL计算
|
|
// 封面图URL计算
|
|
@@ -396,9 +353,9 @@ const getDetail = async (id: string | number) => {
|
|
|
const links: ProgramLinkVO[] = linkRes.rows || [];
|
|
const links: ProgramLinkVO[] = linkRes.rows || [];
|
|
|
console.log('已关联商品列表', links);
|
|
console.log('已关联商品列表', links);
|
|
|
if (links.length > 0) {
|
|
if (links.length > 0) {
|
|
|
- const results = await Promise.all(links.map(link => getBase(link.productId)));
|
|
|
|
|
|
|
+ const results = await Promise.all(links.map((link) => getBase(link.productId)));
|
|
|
productList.value = results
|
|
productList.value = results
|
|
|
- .map(r => r.data)
|
|
|
|
|
|
|
+ .map((r) => r.data)
|
|
|
.filter(Boolean)
|
|
.filter(Boolean)
|
|
|
.map((item: any) => ({
|
|
.map((item: any) => ({
|
|
|
id: item.id,
|
|
id: item.id,
|
|
@@ -452,7 +409,7 @@ const handleCoverSelected = (files: any[]) => {
|
|
|
|
|
|
|
|
/** 清除封面图 */
|
|
/** 清除封面图 */
|
|
|
const clearCoverImage = () => {
|
|
const clearCoverImage = () => {
|
|
|
- form.value.coverImage = undefined;
|
|
|
|
|
|
|
+ form.value.coverImage = '';
|
|
|
};
|
|
};
|
|
|
|
|
|
|
|
/** 处理广告图选择 */
|
|
/** 处理广告图选择 */
|
|
@@ -464,7 +421,7 @@ const handleAdvertSelected = (files: any[]) => {
|
|
|
|
|
|
|
|
/** 清除广告图 */
|
|
/** 清除广告图 */
|
|
|
const clearAdvertImage = () => {
|
|
const clearAdvertImage = () => {
|
|
|
- form.value.innerAdvert = undefined;
|
|
|
|
|
|
|
+ form.value.innerAdvert = '';
|
|
|
};
|
|
};
|
|
|
|
|
|
|
|
/** 添加商品 */
|
|
/** 添加商品 */
|
|
@@ -505,8 +462,8 @@ const handleConfirmImport = async () => {
|
|
|
const productNos = importForm.productNos
|
|
const productNos = importForm.productNos
|
|
|
.replace(/,/g, ',')
|
|
.replace(/,/g, ',')
|
|
|
.split(',')
|
|
.split(',')
|
|
|
- .map(no => no.trim())
|
|
|
|
|
- .filter(no => no);
|
|
|
|
|
|
|
+ .map((no) => no.trim())
|
|
|
|
|
+ .filter((no) => no);
|
|
|
|
|
|
|
|
if (productNos.length === 0) {
|
|
if (productNos.length === 0) {
|
|
|
proxy?.$modal.msgWarning('请输入有效的商品编号');
|
|
proxy?.$modal.msgWarning('请输入有效的商品编号');
|
|
@@ -548,7 +505,7 @@ const handleConfirmImport = async () => {
|
|
|
const addProductsToList = (products: BaseVO[]) => {
|
|
const addProductsToList = (products: BaseVO[]) => {
|
|
|
for (const product of products) {
|
|
for (const product of products) {
|
|
|
// 检查是否已存在
|
|
// 检查是否已存在
|
|
|
- const exists = productList.value.some(item => item.productNo === product.productNo);
|
|
|
|
|
|
|
+ const exists = productList.value.some((item) => item.productNo === product.productNo);
|
|
|
if (!exists) {
|
|
if (!exists) {
|
|
|
const productAny = product as any;
|
|
const productAny = product as any;
|
|
|
productList.value.push({
|
|
productList.value.push({
|
|
@@ -591,18 +548,15 @@ const handleSubmit = async () => {
|
|
|
// 获取已有关联,进行差异同步
|
|
// 获取已有关联,进行差异同步
|
|
|
const existRes = await listProgramLink({ programId, pageNum: 1, pageSize: 500 });
|
|
const existRes = await listProgramLink({ programId, pageNum: 1, pageSize: 500 });
|
|
|
const existLinks: ProgramLinkVO[] = existRes.data || [];
|
|
const existLinks: ProgramLinkVO[] = existRes.data || [];
|
|
|
- const existProductIds = existLinks.map(l => String(l.productId));
|
|
|
|
|
- const newProductIds = productList.value.map(item => String(item.id)).filter(Boolean);
|
|
|
|
|
|
|
+ const existProductIds = existLinks.map((l) => String(l.productId));
|
|
|
|
|
+ const newProductIds = productList.value.map((item) => String(item.id)).filter(Boolean);
|
|
|
|
|
|
|
|
// 需要删除的关联
|
|
// 需要删除的关联
|
|
|
- const toDelete = existLinks.filter(l => !newProductIds.includes(String(l.productId)));
|
|
|
|
|
|
|
+ const toDelete = existLinks.filter((l) => !newProductIds.includes(String(l.productId)));
|
|
|
// 需要新增的关联
|
|
// 需要新增的关联
|
|
|
- const toAdd = newProductIds.filter(pid => !existProductIds.includes(pid));
|
|
|
|
|
|
|
+ const toAdd = newProductIds.filter((pid) => !existProductIds.includes(pid));
|
|
|
|
|
|
|
|
- await Promise.all([
|
|
|
|
|
- ...toDelete.map(l => delProgramLink(l.id)),
|
|
|
|
|
- ...toAdd.map(pid => addProgramLink({ programId, productId: pid }))
|
|
|
|
|
- ]);
|
|
|
|
|
|
|
+ await Promise.all([...toDelete.map((l) => delProgramLink(l.id)), ...toAdd.map((pid) => addProgramLink({ programId, productId: pid }))]);
|
|
|
} else {
|
|
} else {
|
|
|
// 新增:先创建方案
|
|
// 新增:先创建方案
|
|
|
const addRes = await addProgram(form.value);
|
|
const addRes = await addProgram(form.value);
|
|
@@ -610,11 +564,9 @@ const handleSubmit = async () => {
|
|
|
programId = addData?.id || addData?.data?.id;
|
|
programId = addData?.id || addData?.data?.id;
|
|
|
|
|
|
|
|
// 新增所有关联商品
|
|
// 新增所有关联商品
|
|
|
- const newProductIds = productList.value.map(item => item.id).filter(Boolean);
|
|
|
|
|
|
|
+ const newProductIds = productList.value.map((item) => item.id).filter(Boolean);
|
|
|
if (programId && newProductIds.length > 0) {
|
|
if (programId && newProductIds.length > 0) {
|
|
|
- await Promise.all(
|
|
|
|
|
- newProductIds.map(pid => addProgramLink({ programId, productId: pid }))
|
|
|
|
|
- );
|
|
|
|
|
|
|
+ await Promise.all(newProductIds.map((pid) => addProgramLink({ programId, productId: pid })));
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
|
|
|
|
@@ -630,12 +582,7 @@ const handleSubmit = async () => {
|
|
|
/** 初始化 */
|
|
/** 初始化 */
|
|
|
onMounted(async () => {
|
|
onMounted(async () => {
|
|
|
// 加载下拉选项
|
|
// 加载下拉选项
|
|
|
- await Promise.all([
|
|
|
|
|
- getPurchaseCategoryList(),
|
|
|
|
|
- getSceneList(),
|
|
|
|
|
- getIndustryList(),
|
|
|
|
|
- getTagList()
|
|
|
|
|
- ]);
|
|
|
|
|
|
|
+ await Promise.all([getPurchaseCategoryList(), getSceneList(), getIndustryList(), getTagList()]);
|
|
|
|
|
|
|
|
// 如果有id参数,加载详情
|
|
// 如果有id参数,加载详情
|
|
|
const id = route.query.id;
|
|
const id = route.query.id;
|
|
@@ -643,6 +590,16 @@ onMounted(async () => {
|
|
|
await getDetail(id as string);
|
|
await getDetail(id as string);
|
|
|
}
|
|
}
|
|
|
});
|
|
});
|
|
|
|
|
+
|
|
|
|
|
+onActivated(async () => {
|
|
|
|
|
+ const id = route.query.id;
|
|
|
|
|
+ if (id) {
|
|
|
|
|
+ await getDetail(id as string);
|
|
|
|
|
+ } else {
|
|
|
|
|
+ form.value = { ...initFormData };
|
|
|
|
|
+ formRef.value?.resetFields();
|
|
|
|
|
+ }
|
|
|
|
|
+});
|
|
|
</script>
|
|
</script>
|
|
|
|
|
|
|
|
<style scoped>
|
|
<style scoped>
|