修改产品支持多城市

This commit is contained in:
lcc
2025-06-22 13:55:25 +08:00
parent 6f4383e88f
commit fa7f76a60e
8 changed files with 411 additions and 31 deletions
+31 -1
View File
@@ -16,6 +16,18 @@
:toolkit="[]"
layout="total, prev, pager, next, jumper"
>
<template v-slot:toolbar>
<el-row :gutter="15">
<el-col :md="12">
<regions-select
v-model="city"
type="provinceCity"
placeholder="请选择省市"
class="ele-fluid"
/>
</el-col>
</el-row>
</template>
<template v-slot:toolkit>
<el-button size="mini" class="ele-btn-icon" @click="removeAll">
移除所有
@@ -43,9 +55,10 @@
<script>
import { pageBiz } from '@/api/biz';
import RegionsSelect from '@/components/RegionsSelect/index.vue';
export default {
components: {},
components: { RegionsSelect },
props: {
// 弹窗是否打开
visible: Boolean,
@@ -60,9 +73,11 @@
},
data() {
return {
city: [],
// 加载状态
loading: false,
allBiz: [],
allBizBack: [],
selectBiz: Object.values(this.value),
showSelectBiz: { ...this.showBiz },
columns: [
@@ -106,6 +121,7 @@
pageBiz()
.then((data) => {
this.allBiz = data;
this.allBizBack = data;
})
.catch((e) => {
this.$message.error(e.message);
@@ -158,6 +174,20 @@
selectBiz(value) {
this.$emit('input', value);
this.$emit('update:showBiz', this.showSelectBiz);
},
city(newVal) {
if (newVal && newVal[1]) {
let city_id = newVal[1];
this.allBiz = [];
this.allBizBack.forEach((biz) => {
if (parseInt(biz.city_id) === parseInt(city_id)) {
this.allBiz.push(biz);
}
});
} else {
this.allBiz = this.allBizBack;
}
console.log(this.allBiz);
}
}
};
@@ -84,6 +84,7 @@
v-model="form.provinceCity"
placeholder="全国"
type="provinceCity"
:props="{ multiple: true }"
class="ele-fluid"
/>
</el-form-item>
@@ -40,11 +40,13 @@
/>
</el-form-item>
<el-form-item label="使用规则:">
<tinymce-editor
:init="editoption"
v-model="form.rule"
placeholder="请输入使用规则"
/>
<div v-if="editVersion">
<tinymce-editor
:init="editoption"
v-model="form.rule"
placeholder="请输入使用规则"
/>
</div>
</el-form-item>
<el-form-item label="可用门店:">
<el-radio-group v-model="form.userType">
+35 -2
View File
@@ -115,6 +115,18 @@
删除
</el-button>
</template>
<template v-slot:cityName="{ row }">
{{ row.cityName[0] }}
<el-button
size="mini"
v-if="row.cityName.length > 1"
type="primary"
class="ele-btn-icon"
@click="showAllCityName(row)"
>
查看所有
</el-button>
</template>
<!-- 状态列 -->
<template v-slot:title="{ row }">
<div class="cell-content">
@@ -170,6 +182,20 @@
:visible.sync="showEditBrokerage"
@done="reload"
/>
<ele-modal
width="800px"
:visible.sync="showCityName"
:append-to-body="true"
:close-on-click-modal="true"
custom-class="ele-dialog-form"
title="推广范围"
>
<el-row style="padding-bottom: 20px">
<template v-for="(item, index) in cityNames">
<el-tag :key="index" type="info">{{ item }}</el-tag>
</template>
</el-row>
</ele-modal>
</div>
</template>
@@ -229,7 +255,8 @@
prop: 'cityName',
label: '推广范围',
showOverflowTooltip: true,
minWidth: 80
minWidth: 80,
slot: 'cityName'
},
{
prop: 'timeLaunch',
@@ -264,7 +291,9 @@
showEdit: false,
componentKey: 0,
// 佣金编辑框
showEditBrokerage: false
showEditBrokerage: false,
showCityName: false,
cityNames: []
};
},
created() {},
@@ -361,6 +390,10 @@
},
handleCarChange(carInfo) {
this.where.selectedCar = carInfo;
},
showAllCityName(row) {
this.showCityName = true;
this.cityNames = row.cityName;
}
}
};
+62
View File
@@ -0,0 +1,62 @@
import request from '@/utils/request';
/**
* 分页查询
* @param params 查询条件
*/
export async function pageProductCoupon(params) {
const res = await request.get('/car/productCoupon/page', {
params
});
if (res.data.code === 0) {
return res.data.data;
}
return Promise.reject(new Error(res.data.message));
}
/**
* @param data
*/
export async function addProductCoupon(data) {
const res = await request.post('/car/productCoupon', data);
if (res.data.code === 0) {
return res.data.message;
}
return Promise.reject(new Error(res.data.message));
}
/**
* @param data
*/
export async function updateProductCoupon(data) {
const res = await request.put('/car/productCoupon', data);
if (res.data.code === 0) {
return res.data.message;
}
return Promise.reject(new Error(res.data.message));
}
export async function updateProductCouponStatus(id, status) {
const res = await request.put('/car/productCoupon/status', {
id,
status
});
if (res.data.code === 0) {
return res.data.message;
}
return Promise.reject(new Error(res.data.message));
}
/**
* 批量删除
* @param ids id集合
*/
export async function removeProductCoupon(ids) {
const res = await request.delete('/car/productCoupon/delete', {
data: { ids }
});
if (res.data.code === 0) {
return res.data.message;
}
return Promise.reject(new Error(res.data.message));
}
+194
View File
@@ -0,0 +1,194 @@
<template>
<div class="ele-body">
<el-card shadow="never">
<!-- 搜索表单 -->
<el-form label-width="77px" class="ele-form-search">
<el-row :gutter="15">
<el-col :md="6" :sm="12">
<el-form-item label="名称:">
<el-input
placeholder="请输入优惠券名称"
clearable
v-model="where.title"
/>
</el-form-item>
</el-col>
<el-col :md="6" :sm="12">
<div class="ele-form-actions">
<el-button
type="primary"
icon="el-icon-search"
class="ele-btn-icon"
@click="reload"
>
查询
</el-button>
<el-button @click="reset">重置</el-button>
</div>
</el-col>
</el-row>
</el-form>
<!-- 数据表格 -->
<ele-pro-table
ref="table"
:columns="columns"
:datasource="datasource"
:selection.sync="selection"
cache-key="productTable"
>
<!-- 表头工具栏 -->
<template v-slot:toolbar></template>
<template v-slot:timeBetween="{ row }">
<div
>{{ row.timeStart.split(' ')[0] }}~{{
row.timeEnd.split(' ')[0]
}}</div
>
</template>
<template v-slot:showBiz="{ row }">
<template v-if="row.userType === 1">所有门店</template>
<template v-else>
<template v-for="(item, index) in row.selectBiz">
<el-tag style="margin: 5px" :key="index" type="warning">{{
item
}}</el-tag>
</template>
</template>
</template>
</ele-pro-table>
</el-card>
</div>
</template>
<script>
import { pageProductCoupon } from '@/api/car/coupon';
import { setPageTabTitle } from '@/utils/page-tab-util';
const ROUTE_PATH = '/car/product/coupon';
export default {
name: 'carProduct',
components: {},
data() {
return {
title: '',
where: {
title: '',
selectedCar: {
brandId: '',
seriesId: '',
modelId: ''
}
},
// 表格列配置
columns: [
{
columnKey: 'selection',
type: 'selection',
width: 45,
align: 'center',
fixed: 'left'
},
{
prop: 'id',
label: 'ID',
minWidth: 40,
align: 'center',
showOverflowTooltip: true,
fixed: 'left'
},
{
prop: 'title',
label: '标题',
showOverflowTooltip: true,
minWidth: 100
},
{
prop: 'price',
label: '优惠券金额',
showOverflowTooltip: true,
minWidth: 50
},
{
prop: 'timeBetween',
label: '有效期',
showOverflowTooltip: true,
slot: 'timeBetween',
minWidth: 100
},
{
prop: 'typeCn',
label: '类型',
align: 'center',
minWidth: 80,
resizable: false,
showOverflowTooltip: true
},
{
prop: 'showBiz',
label: '适用门店',
align: 'center',
minWidth: 200,
resizable: false,
// showOverflowTooltip: true,
slot: 'showBiz'
}
],
// 表格选中数据
selection: [],
// 当前编辑数据
current: null,
// 是否显示编辑弹窗
showEdit: false,
productId: 0
};
},
created() {},
methods: {
edit(row) {
this.current = row;
this.showEdit = true;
},
/* 表格数据源 */
datasource({ page, limit, where, order }) {
const productId = this.productId;
return pageProductCoupon({
...where,
...order,
page,
limit,
productId
});
},
/* 刷新表格 */
reload() {
this.$refs.table.reload({ page: 1, where: this.where });
},
/* 重置搜索 */
reset() {
this.where = {};
},
handleCarChange(carInfo) {
this.where.selectedCar = carInfo;
}
},
watch: {
$route: {
handler(route) {
const { path } = route;
if (path !== ROUTE_PATH) {
return;
}
this.title = this.$route.query.title;
this.productId = this.$route.query.id;
setPageTabTitle(this.title + '的优惠券');
if (this.$refs.table) {
this.$refs.table.reload({ page: 1 });
}
},
immediate: true
}
}
};
</script>
<style scoped></style>
+31 -10
View File
@@ -16,7 +16,23 @@
<el-row class="pd10">
<el-col :span="24"
>产品标签:
<template v-for="(item, index) in labels">
<template v-for="(item, index) in priceRange">
<el-tag
:key="index"
v-if="product.labels.includes(item.dictDataId)"
:type="randomTypeName()"
>{{ item.dictDataName }}</el-tag
>
</template>
<template v-for="(item, index) in productLevel">
<el-tag
:key="index"
v-if="product.labels.includes(item.dictDataId)"
:type="randomTypeName()"
>{{ item.dictDataName }}</el-tag
>
</template>
<template v-for="(item, index) in carProductLabel">
<el-tag
:key="index"
v-if="product.labels.includes(item.dictDataId)"
@@ -30,16 +46,13 @@
<el-col :span="24"><h2>优惠</h2></el-col>
</el-row>
<el-row class="pd10">
<el-col :span="6"
>优惠信息1:
<el-col :span="6">
<span class="ele-text-danger">{{ product.discounts }}</span></el-col
>
<el-col :span="6"
>优惠信息2:
<el-col :span="6">
<span class="ele-text-danger">{{ product.discounts2 }}</span></el-col
>
<el-col :span="6"
>优惠信息3:
<el-col :span="6">
<span class="ele-text-danger">{{ product.discounts3 }}</span></el-col
>
</el-row>
@@ -107,17 +120,25 @@
labels: []
},
crowdProfiling: [],
labels: [],
// 预定义的 CSS 类数组
availableClasses: ['', 'success', 'info', 'warning', 'danger']
availableClasses: ['', 'success', 'info', 'warning', 'danger'],
priceRange: [],
productLevel: [],
carProductLabel: []
};
},
created() {
listDictionaryData({ dictCode: 'crowdProfiling' }).then((data) => {
this.crowdProfiling = data;
});
listDictionaryData({ dictCode: 'priceRange' }).then((data) => {
this.priceRange = data;
});
listDictionaryData({ dictCode: 'productLevel' }).then((data) => {
this.productLevel = data;
});
listDictionaryData({ dictCode: 'carProductLabel' }).then((data) => {
this.labels = data;
this.carProductLabel = data;
});
},
methods: {
+50 -13
View File
@@ -41,11 +41,10 @@
:columns="columns"
:datasource="datasource"
:selection.sync="selection"
cache-key="syliveActivityTable"
cache-key="pingProductTable"
>
<!-- 表头工具栏 -->
<template v-slot:toolbar> </template>
<!-- 状态列 -->
<template v-slot:title="{ row }">
<div class="cell-content">
<el-image
@@ -62,6 +61,18 @@
>
</div>
</template>
<template v-slot:cityName="{ row }">
{{ row.cityName[0] }}
<el-button
size="mini"
v-if="row.cityName.length > 1"
type="primary"
class="ele-btn-icon"
@click="showAllCityName(row)"
>
查看所有
</el-button>
</template>
<template v-slot:timeBetween="{ row }">
<div>{{ row.timeStart.split(' ')[0] }}~</div>
<div>{{ row.timeEnd.split(' ')[0] }}</div>
@@ -86,9 +97,14 @@
>
海报
</el-link>
<el-link type="primary" :underline="false" @click="showCoupon(row)">
电子券
</el-link>
<!--
<el-link type="primary" :underline="false" @click="showPre(row)">
预览
</el-link>
-->
</template>
</ele-pro-table>
<!-- 推广文案 -->
@@ -128,6 +144,20 @@
title="产品预览"
:iframe-src="current.preview"
/>
<ele-modal
width="800px"
:visible.sync="showCityName"
:append-to-body="true"
:close-on-click-modal="true"
custom-class="ele-dialog-form"
title="推广范围"
>
<el-row style="padding-bottom: 20px">
<template v-for="(item, index) in cityNames">
<el-tag :key="index" type="info">{{ item }}</el-tag>
</template>
</el-row>
</ele-modal>
</el-card>
</div>
</template>
@@ -163,16 +193,8 @@
prop: 'cityName',
label: '推广范围',
showOverflowTooltip: true,
minWidth: 80
},
{
prop: 'status',
label: '上架状态',
align: 'center',
width: 80,
resizable: false,
slot: 'status',
showOverflowTooltip: true
minWidth: 80,
slot: 'cityName'
},
{
prop: 'timeBetween',
@@ -212,7 +234,9 @@
showPromotion: false,
componentKey: '',
dialogVisible: false,
showPoster: false
showPoster: false,
showCityName: false,
cityNames: []
};
},
created() {},
@@ -261,6 +285,19 @@
showPre(row) {
this.current = row;
this.dialogVisible = true;
},
showCoupon(row) {
const path = '/car/product/coupon';
this.$nextTick(() => {
this.$router.push({
path,
query: row ? { id: row.id, title: row.title } : undefined
});
});
},
showAllCityName(row) {
this.showCityName = true;
this.cityNames = row.cityName;
}
}
};