b1d468f9
 李宇
1
|
1
|
<template>
|
|
93c8bac5
李宇
1
|
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
|
<div style="padding: 0 10px;background: #fff;margin: 0 10px;">
<div style="display: flex;" class="pending">
<div style="width: 30%;margin-right: 3%;text-align: center;padding: 20px 0;border-radius: 3px;border: 2px solid #eee;">
<div style="font-size: 14px;color: #a8abb2;">总金额</div>
<div style="font-size: 22px;margin-top: 10px;color: rgb(63, 155, 106);" v-if="alltoji">{{Number(alltoji.amount)/100 || 0}}</div>
</div>
</div>
<div class="pending">
<!-- 表格 -->
<div class="tableBox" v-if="alltoji && alltoji.shopCouponSubsidies">
<el-table
ref="multipleTable"
:data="alltoji.shopCouponSubsidies"
:header-cell-style="{fontSize: '14px',color:'#0009',fontWeight: 'normal',backgroundColor:'#F2F3F5'}"
tooltip-effect="dark"
>
<el-table-column label="优惠券名称" width="220">
<template slot-scope="scope">{{ scope.row.couponName }}</template>
</el-table-column>
<el-table-column label="类型" show-overflow-tooltip>
<template slot-scope="scope">
<span v-if="scope.row.couponType == 1">满减券</span>
<span v-if="scope.row.couponType == 2">折扣券</span>
</template>
</el-table-column>
<el-table-column label="商品">
<template slot-scope="scope">
<el-popover trigger="hover" placement="top">
<p style="max-width: 300px;">{{ scope.row.productName }}</p>
<div slot="reference" style="white-space: nowrap;overflow: hidden;text-overflow: ellipsis;width: 100%;" >
{{ scope.row.productName }}
</div>
</el-popover>
|
|
b1d468f9
李宇
1
|
37
|
</template>
|
|
93c8bac5
李宇
1
|
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
|
<!-- <template slot-scope="scope">{{ scope.row.productName }}</template> -->
</el-table-column>
<el-table-column label="用户手机号">
<template slot-scope="scope">{{ scope.row.userPhone }}</template>
</el-table-column>
<el-table-column label="订单金额">
<template slot-scope="scope">{{ Number(scope.row.orderAmount)/100 }}</template>
</el-table-column>
<el-table-column label="优惠金额">
<template slot-scope="scope">{{ Number(scope.row.discountAmount)/100 }}</template>
</el-table-column>
</el-table>
<div v-if="alltoji && alltoji.shopCouponSubsidies" style="display: flex;justify-content: space-between;margin-top: 30px;" class="bom">
<div style="font-size: 14px;">共 <span style="color: #3F9B6A;">{{alltoji.shopCouponSubsidies.length}}</span> 项数据</div>
<!-- <el-pagination :current-page="formInline.page" :page-sizes="[10, 20, 50, 100]" :page-size="10" background
|
|
b1d468f9
李宇
1
|
55
56
|
small layout="prev, pager, next" :total="total" @size-change="handleSizeChange"
@current-change="handleCurrentChange">
|
|
93c8bac5
李宇
1
|
57
|
</el-pagination> -->
|
|
b1d468f9
李宇
1
|
58
|
</div>
|
|
8db25941
李宇
2
|
59
60
|
</div>
</div>
|
|
b1d468f9
李宇
1
|
61
62
63
64
|
</div>
</template>
<script>
|
|
93c8bac5
李宇
1
|
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
|
import AddCoupon from '@/views/marketing/coupon/add.vue'
import { getCoupon, delCoupon, getCouponData, stopCoupon,getShopCouponSubsidy } from '@/api/marketing'
import activityMixin from '@/views/marketing/mixin/index.js'
function CouponQueryForm() {
this.couponName = '' // 优惠券名称
this.couponType = null // 优惠券类型
this.dates = [] // 创建时间数组
this.endTime = '' // 创建时间结束时间
this.page = 1 // 当前页
this.pageSize = 10 // 每页记录数
this.startTime = '' // 创建时间开始时间
this.state = null // 优惠券状态
}
export default {
name: 'Coupon',
components: {
AddCoupon
},
mixins: [activityMixin],
data() {
return {
info:{},
type:'2',
formInline: new CouponQueryForm(),
isDataVisible: false, // 数据效果展示
dataInfo: [], // 商品使用数据
total: 1,
tableData: [],
dataEffect: [],
alltoji:null
}
},
mounted() {
this.getAll(this.formInline)
},
methods: {
closeModal() {
this.activityId = null
this.$refs.addCoupon.resetData()
|
|
b1d468f9
李宇
1
|
105
|
},
|
|
93c8bac5
李宇
1
|
106
107
108
109
110
111
112
|
// 查询
search() {
this.total = 1
this.formInline.page = 1
if (this.formInline.dates.length !== 0) {
this.formInline.startTime = this.formInline.dates[0]
this.formInline.endTime = this.formInline.dates[1]
|
|
b1d468f9
李宇
1
|
113
|
}
|
|
93c8bac5
李宇
1
|
114
|
this.getAll(this.formInline)
|
|
b1d468f9
李宇
1
|
115
|
},
|
|
93c8bac5
李宇
1
|
116
117
118
119
|
// 清除
clear() {
this.formInline = new CouponQueryForm()
this.getAll(this.formInline)
|
|
b1d468f9
李宇
1
|
120
|
},
|
|
93c8bac5
李宇
1
|
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
|
handleSizeChange(val) {
this.formInline.pageSize = val
this.getAll(this.formInline)
},
handleCurrentChange(val) {
this.formInline.page = val
this.getAll(this.formInline)
},
// 停止优惠券活动
stopFn(id) {
let that = this
this.$confirm('是否将该优惠券停止?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
console.error(id)
stopCoupon({ shopCouponId: id }).then(res => {
if (res.code === '') {
that.$message.success('停止成功')
that.formInline.page = 1
that.getAll(that.formInline)
|
|
b1d468f9
李宇
1
|
143
|
} else {
|
|
93c8bac5
李宇
1
|
144
|
that.$message.error(res.message)
|
|
b1d468f9
李宇
1
|
145
|
}
|
|
b1d468f9
李宇
1
|
146
|
})
|
|
93c8bac5
李宇
1
|
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
|
}).catch(() => {
});
},
// 初始化查询所有数据
async getAll(formInline) {
formInline.type = 1
const res = await getCoupon(formInline)
this.total = res.data.total
this.tableData = res.data.list
getShopCouponSubsidy({usedMerchantId:'154'}).then(res => {
console.error(res)
this.alltoji = res.data
})
},
// 显示数据效果
showData(id) {
getCouponData({ shopCouponId: id }).then(res => {
if (res.code === '') {
this.dataInfo = res.data
} else {
this.$message.error(res.message)
|
|
b1d468f9
李宇
1
|
169
|
}
|
|
93c8bac5
李宇
1
|
170
171
172
173
174
175
176
177
178
179
180
181
|
})
this.isDataVisible = true
},
// 删除优惠券
delCouponFn(data) {
let that = this
this.$confirm('是否将该优惠券删除?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
delCoupon({ shopCouponId: data.shopCouponId }).then(res => {
|
|
b1d468f9
李宇
1
|
182
|
if (res.code === '') {
|
|
93c8bac5
李宇
1
|
183
184
185
|
that.$message.success('删除成功')
that.formInline.page = 1
that.getAll(that.formInline)
|
|
b1d468f9
李宇
1
|
186
|
} else {
|
|
93c8bac5
李宇
1
|
187
|
that.$message.error(res.message)
|
|
b1d468f9
李宇
1
|
188
|
}
|
|
93c8bac5
李宇
1
|
189
190
191
192
|
})
}).catch(() => {
});
|
|
b1d468f9
李宇
1
|
193
194
|
}
}
|
|
93c8bac5
李宇
1
|
195
|
}
|
|
b1d468f9
李宇
1
|
196
197
|
</script>
|
|
93c8bac5
李宇
1
|
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
|
<style lang='scss' scoped>
//@import url(); 引入公共css类
@import url("../../styles/elDialog.scss");
.pending {
padding: 0 20px 20px 20px;
background-color:#fff;
// min-height: calc(100vh - 50px - 20px);
}
.fenye {
margin-top: 20px;
display: flex;
justify-content: flex-end;
position: relative;
}
.dataEffect {
.couponTit {
margin: 20px 0;
|
|
b1d468f9
李宇
1
|
216
|
}
|
|
93c8bac5
李宇
1
|
217
218
219
220
221
222
223
224
225
226
227
|
.dataListBox {
display: flex;
justify-content: center;
margin: 30px 0;
.dataItem {
width: 220px;
height: 120px;
border-radius: 8px;
border: 1px solid #999999;
text-align: center;
margin: 0 10px;
|
|
b1d468f9
李宇
1
|
228
|
span {
|
|
93c8bac5
李宇
1
|
229
230
|
display: block;
margin-top: 35px;
|
|
b1d468f9
李宇
1
|
231
232
233
|
}
}
}
|
|
93c8bac5
李宇
1
|
234
235
|
.tabListInfo {
margin: 20px 0;
|
|
b1d468f9
李宇
1
|
236
237
|
}
|
|
93c8bac5
李宇
1
|
238
239
240
241
242
243
244
245
246
247
|
}
.formSearch {
display: flex;
width: 100%;
font-size: 14px;
justify-content: space-between;
}
::v-deep .el-pagination__total {
position: absolute;
left: 10px;
|
|
b1d468f9
李宇
1
|
248
|
}
|
|
93c8bac5
李宇
1
|
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
|
</style>
<style scoped>
.btnList /deep/ .delCls {
margin-left: 10px;
}
.group-dialog /deep/ .el-dialog__headerbtn .el-dialog__close {
color: #FFFFFF;
}
::v-deep .el-input__inner:focus {
border: #11be59 1px solid;
}
::v-deep .el-input__inner:hover {
border: #11be59 1px solid;
}
::v-deep .el-select .el-input.is-focus .el-input__inner{
border-color:#11be59
}
::v-deep .el-form-item__label{
font-weight: normal;
font-size: 14px;
}
::v-deep .btn .el-button:focus,
.el-button:hover {
border: 1px solid #3F9B6A;
}
::v-deep .el-button {
border: 1px solid #3F9B6A;
}
::v-deep .el-pagination.is-background .el-pager li:not(.disabled).active {
background-color: #3F9B6A;
|
|
b1d468f9
李宇
1
|
279
|
}
|
|
93c8bac5
李宇
1
|
280
281
|
.el-radio__input.is-checked+.el-radio__label{
color:#3F9B6A;
|
|
b1d468f9
李宇
1
|
282
283
|
}
|
|
93c8bac5
李宇
1
|
284
285
286
|
</style>
<style>
.el-select-dropdown__item.selected{
|
|
b1d468f9
李宇
1
|
287
288
|
color: #3F9B6A;
}
|
|
b1d468f9
李宇
1
|
289
|
</style>
|
