Skip to content

Commit 7f7220d

Browse files
YunaiVYunaiV
committed
promotion：实现部分优惠劵模板的前端列表
1 parent b9ec6bf commit 7f7220d

File tree

3 files changed

+77
-45
lines changed

3 files changed

+77
-45
lines changed

‎src/utils/constants.js

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -236,3 +236,31 @@ export const ProductSpuStatusEnum = {
236236
name: '上架'
237237
},
238238
}
239+
240+
/**
241+
* 优惠类型枚举
242+
*/
243+
export const PromotionDiscountTypeEnum = {
244+
PRICE: {
245+
type: 1,
246+
name: '满减'
247+
},
248+
PERCENT: {
249+
type: 2,
250+
name: '折扣'
251+
}
252+
}
253+
254+
/**
255+
* 优惠劵模板的有限期类型的枚举
256+
*/
257+
export const CouponTemplateValidityTypeEnum = {
258+
DATE: {
259+
type: 1,
260+
name: '固定日期可用'
261+
},
262+
TERM: {
263+
type: 2,
264+
name: '领取之后可用'
265+
}
266+
}

‎src/utils/dict.js

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -59,6 +59,9 @@ export const DICT_TYPE = {
5959

6060
// ========== MALL - PRODUCT 模块 ==========
6161
PRODUCT_SPU_STATUS: 'product_spu_status', // 商品 SPU 状态
62+
63+
// ========== MALL - PROMOTION 模块 ==========
64+
PROMOTION_DISCOUNT_TYPE: 'promotion_discount_type', // 优惠类型
6265
}
6366

6467
/**

‎src/views/promotion/couponTemplate/index.vue

Lines changed: 46 additions & 45 deletions
Original file line numberDiff line numberDiff line change
@@ -2,25 +2,19 @@
22
<div class="app-container">
33

44
<!-- 搜索工作栏 -->
5-
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
6-
<el-form-item label="优惠劵名" prop="name">
5+
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="82px">
6+
<el-form-item label="优惠券名称" prop="name">
77
<el-input v-model="queryParams.name" placeholder="请输入优惠劵名" clearable @keyup.enter.native="handleQuery"/>
88
</el-form-item>
9-
<el-form-item label="状态" prop="status">
10-
<el-select v-model="queryParams.status" placeholder="请选择状态" clearable size="small">
11-
<el-option v-for="dict in this.getDictDatas(DICT_TYPE.COMMON_STATUS)"
12-
:key="dict.value" :label="dict.label" :value="dict.value"/>
9+
<el-form-item label="优惠券类型" prop="discountType">
10+
<el-select v-model="queryParams.discountType" placeholder="请选择优惠券类型" clearable size="small">
11+
<el-option v-for="dict in this.getDictDatas(DICT_TYPE.PROMOTION_DISCOUNT_TYPE)"
12+
:key="dict.value" :label="dict.label" :value="dict.value"/>
1313
</el-select>
1414
</el-form-item>
15-
<el-form-item label="类型
16-
*
17-
* 1-优惠劵
18-
* 2-优惠码" prop="type">
19-
<el-select v-model="queryParams.type" placeholder="请选择类型
20-
*
21-
* 1-优惠劵
22-
* 2-优惠码" clearable size="small">
23-
<el-option v-for="dict in this.getDictDatas(DICT_TYPE.PRODUCT_SPU_STATUS)"
15+
<el-form-item label="优惠券状态" prop="status">
16+
<el-select v-model="queryParams.status" placeholder="请选择优惠券状态" clearable size="small">
17+
<el-option v-for="dict in this.getDictDatas(DICT_TYPE.COMMON_STATUS)"
2418
:key="dict.value" :label="dict.label" :value="dict.value"/>
2519
</el-select>
2620
</el-form-item>
@@ -48,45 +42,24 @@
4842
<el-table-column label="优惠券名称" align="center" prop="name" />
4943
<el-table-column label="优惠券类型" align="center" prop="discountType">
5044
<template slot-scope="scope">
51-
<dict-tag :type="DICT_TYPE.PRODUCT_SPU_STATUS" :value="scope.row.type" />
45+
<dict-tag :type="DICT_TYPE.PROMOTION_DISCOUNT_TYPE" :value="scope.row.discountType" />
5246
</template>
5347
</el-table-column>
54-
<el-table-column label="发行总量" align="center" prop="totalCount" />
55-
<el-table-column label="每人限领个数
56-
*
57-
* null - 则表示不限制" align="center" prop="takeLimitCount" />
58-
<el-table-column label="领取方式" align="center" prop="takeType" />
59-
<el-table-column label="是否设置满多少金额可用，单位：分" align="center" prop="usePrice" />
60-
<el-table-column label="商品范围" align="center" prop="productScope" />
61-
<el-table-column label="商品 SPU 编号的数组" align="center" prop="productSpuIds" />
62-
<el-table-column label="生效日期类型" align="center" prop="validityType" />
63-
<el-table-column label="固定日期-生效开始时间" align="center" prop="validStartTime" width="180">
48+
<el-table-column label="优惠金额 / 折扣" align="center" prop="discount" :formatter="discountFormat" />
49+
<el-table-column label="发放数量" align="center" prop="totalCount" />
50+
<el-table-column label="剩余数量" align="center" prop="totalCount" :formatter="row => (row.totalCount - row.takeCount)" />
51+
<el-table-column label="领取上限" align="center" prop="takeLimitCount" :formatter="takeLimitCountFormat" />
52+
<el-table-column label="有效期限" align="center" prop="validityType" width="180" :formatter="validityTypeFormat" />
53+
<el-table-column label="状态" align="center" prop="status">
6454
<template slot-scope="scope">
65-
<span>{{ parseTime(scope.row.validStartTime) }}</span>
66-
</template>
67-
</el-table-column>
68-
<el-table-column label="固定日期-生效结束时间" align="center" prop="validEndTime" width="180">
69-
<template slot-scope="scope">
70-
<span>{{ parseTime(scope.row.validEndTime) }}</span>
55+
<dict-tag :type="DICT_TYPE.COMMON_STATUS" :value="scope.row.status" />
7156
</template>
7257
</el-table-column>
73-
<el-table-column label="领取日期-开始天数" align="center" prop="fixedStartTerm" />
74-
<el-table-column label="领取日期-结束天数" align="center" prop="fixedEndTerm" />
75-
<el-table-column label="折扣百分比" align="center" prop="discountPercent" />
76-
<el-table-column label="优惠金额，单位：分" align="center" prop="discountPrice" />
77-
<el-table-column label="折扣上限" />
78-
<el-table-column label="领取优惠券的数量" align="center" prop="takeNum" />
79-
<el-table-column label="使用优惠券的次数" align="center" prop="useCount" />
8058
<el-table-column label="创建时间" align="center" prop="createTime" width="180">
8159
<template slot-scope="scope">
8260
<span>{{ parseTime(scope.row.createTime) }}</span>
8361
</template>
8462
</el-table-column>
85-
<el-table-column label="优惠券类型" align="center" prop="status">
86-
<template slot-scope="scope">
87-
<dict-tag :type="DICT_TYPE.COMMON_STATUS" :value="scope.row.status" />
88-
</template>
89-
</el-table-column>
9063
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
9164
<template slot-scope="scope">
9265
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
@@ -185,7 +158,8 @@
185158
</template>
186159

187160
<script>
188-
import { createCouponTemplate, updateCouponTemplate, deleteCouponTemplate, getCouponTemplate, getCouponTemplatePage, exportCouponTemplateExcel } from "@/api/promotion/couponTemplate";
161+
import { createCouponTemplate, updateCouponTemplate, deleteCouponTemplate, getCouponTemplate, getCouponTemplatePage } from "@/api/promotion/couponTemplate";
162+
import {CouponTemplateValidityTypeEnum, PromotionDiscountTypeEnum} from "@/utils/constants";
189163
190164
export default {
191165
name: "CouponTemplate",
@@ -340,6 +314,33 @@ export default {
340314
this.$modal.msgSuccess("删除成功");
341315
}).catch(() => {});
342316
},
317+
// 格式化【优惠金额/折扣】
318+
discountFormat(row, column) {
319+
if (row.discountType === PromotionDiscountTypeEnum.PRICE.type) {
320+
return `￥${(row.discountPrice / 100.0).toFixed(2)}`;
321+
}
322+
if (row.discountType === PromotionDiscountTypeEnum.PERCENT.type) {
323+
return `￥${(row.discountPrice / 100.0).toFixed(2)}`;
324+
}
325+
return '未知【' + row.discountType + '】';
326+
},
327+
// 格式化【领取上限】
328+
takeLimitCountFormat(row, column) {
329+
if (row.takeLimitCount === -1) {
330+
return '无领取限制';
331+
}
332+
return `${row.takeLimitCount} 张/人`
333+
},
334+
// 格式化【有效期限】
335+
validityTypeFormat(row, column) {
336+
if (row.validityType === CouponTemplateValidityTypeEnum.DATE.type) {
337+
return `${parseTime(row.validStartTime)} 至 ${parseTime(row.validEndTime)}`
338+
}
339+
if (row.validityType === CouponTemplateValidityTypeEnum.TERM.type) {
340+
return `领取后第 ${row.fixedStartTerm} - ${row.fixedEndTerm} 天内可用`
341+
}
342+
return '未知【' + row.validityType + '】';
343+
}
343344
}
344345
};
345346
</script>

0 commit comments

Comments
 (0)