修改产品支持多城市
This commit is contained in:
@@ -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">
|
||||
|
||||
@@ -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;
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
@@ -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));
|
||||
}
|
||||
@@ -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>
|
||||
@@ -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: {
|
||||
|
||||
@@ -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;
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user