Skip to content

Commit 42f0bf0

Browse files
YunaiVYunaiV
committed
promotion：优化砍价活动的管理
1 parent 4c2eb3d commit 42f0bf0

File tree

6 files changed

+204
-192
lines changed

6 files changed

+204
-192
lines changed

‎src/views/mall/promotion/bargain/activity/BargainActivityForm.vue

Lines changed: 7 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,7 @@
3030
<el-table-column align="center" label="砍价底价(元)" min-width="168">
3131
<template #default="{ row: sku }">
3232
<el-input-number
33-
v-model="sku.productConfig.bargainPrice"
33+
v-model="sku.productConfig.bargainMinPrice"
3434
:min="0"
3535
:precision="2"
3636
:step="0.1"
@@ -86,7 +86,7 @@ const ruleConfig: RuleConfig[] = [
8686
message: '商品砍价起始价格不能小于 0 ！！！'
8787
},
8888
{
89-
name: 'productConfig.bargainPrice',
89+
name: 'productConfig.bargainMinPrice',
9090
rule: (arg) => arg >= 0,
9191
message: '商品砍价底价不能小于 0 ！！！'
9292
},
@@ -123,14 +123,14 @@ const getSpuDetails = async (
123123
spuId: spu.id!,
124124
skuId: sku.id!,
125125
bargainFirstPrice: 1,
126-
bargainPrice: 1,
126+
bargainMinPrice: 1,
127127
stock: 1
128128
}
129129
if (typeof products !== 'undefined') {
130130
const product = products.find((item) => item.skuId === sku.id)
131131
if (product) {
132132
product.bargainFirstPrice = formatToFraction(product.bargainFirstPrice)
133-
product.bargainPrice = formatToFraction(product.bargainPrice)
133+
product.bargainMinPrice = formatToFraction(product.bargainMinPrice)
134134
}
135135
config = product || config
136136
}
@@ -173,7 +173,7 @@ const open = async (type: string, id?: number) => {
173173
spuId: data.spuId!,
174174
skuId: data.skuId,
175175
bargainFirstPrice: data.bargainFirstPrice, // 砍价起始价格，单位分
176-
bargainPrice: data.bargainPrice, // 砍价底价
176+
bargainMinPrice: data.bargainMinPrice, // 砍价底价
177177
stock: data.stock // 活动库存
178178
}
179179
]
@@ -204,12 +204,13 @@ const submitForm = async () => {
204204
// 提交请求
205205
formLoading.value = true
206206
try {
207+
// TODO @puhui999: 这样要深克隆
207208
const data = formRef.value.formModel as BargainActivityApi.BargainActivityVO
208209
const products = spuAndSkuListRef.value.getSkuConfigs('productConfig')
209210
products.forEach((item: BargainProductVO) => {
210211
// 砍价价格元转分
211212
item.bargainFirstPrice = convertToInteger(item.bargainFirstPrice)
212-
item.bargainPrice = convertToInteger(item.bargainPrice)
213+
item.bargainMinPrice = convertToInteger(item.bargainMinPrice)
213214
})
214215
// 用户每次砍价金额分转元, 元转分
215216
data.randomMinPrice = convertToInteger(data.randomMinPrice)

‎src/views/mall/promotion/bargain/activity/bargainActivity.data.ts

Lines changed: 0 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -132,20 +132,6 @@ const crudSchemas = reactive<CrudSchema[]>([
132132
value: 0
133133
}
134134
},
135-
{
136-
label: '砍价成功数量',
137-
field: 'successCount',
138-
isSearch: false,
139-
isForm: false
140-
},
141-
{
142-
label: '活动状态',
143-
field: 'status',
144-
dictType: DICT_TYPE.COMMON_STATUS,
145-
dictClass: 'number',
146-
isSearch: true,
147-
isForm: false
148-
},
149135
{
150136
label: '拼团商品',
151137
field: 'spuId',
@@ -155,11 +141,6 @@ const crudSchemas = reactive<CrudSchema[]>([
155141
span: 24
156142
}
157143
}
158-
},
159-
{
160-
label: '操作',
161-
field: 'action',
162-
isForm: false
163144
}
164145
])
165146
export const { allSchemas } = useCrudSchemas(crudSchemas)

‎src/views/mall/promotion/bargain/activity/index.vue

Lines changed: 195 additions & 70 deletions
Original file line numberDiff line numberDiff line change
@@ -1,90 +1,195 @@
11
<template>
2-
<!-- 搜索工作栏 -->
32
<ContentWrap>
4-
<Search :schema="allSchemas.searchSchema" @reset="setSearchParams" @search="setSearchParams">
5-
<!-- 新增等操作按钮 -->
6-
<template #actionMore>
3+
<!-- 搜索工作栏 -->
4+
<el-form
5+
class="-mb-15px"
6+
:model="queryParams"
7+
ref="queryFormRef"
8+
:inline="true"
9+
label-width="68px"
10+
>
11+
<el-form-item label="活动名称" prop="name">
12+
<el-input
13+
v-model="queryParams.name"
14+
placeholder="请输入活动名称"
15+
clearable
16+
@keyup.enter="handleQuery"
17+
class="!w-240px"
18+
/>
19+
</el-form-item>
20+
<el-form-item label="活动状态" prop="status">
21+
<el-select
22+
v-model="queryParams.status"
23+
placeholder="请选择活动状态"
24+
clearable
25+
class="!w-240px"
26+
>
27+
<el-option
28+
v-for="dict in getIntDictOptions(DICT_TYPE.COMMON_STATUS)"
29+
:key="dict.value"
30+
:label="dict.label"
31+
:value="dict.value"
32+
/>
33+
</el-select>
34+
</el-form-item>
35+
<el-form-item>
36+
<el-button @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button>
37+
<el-button @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button>
738
<el-button
8-
v-hasPermi="['promotion:bargain-activity:create']"
9-
plain
1039
type="primary"
40+
plain
1141
@click="openForm('create')"
42+
v-hasPermi="['promotion:bargain-activity:create']"
1243
>
13-
<Icon class="mr-5px" icon="ep:plus" />
14-
新增
44+
<Icon icon="ep:plus" class="mr-5px" /> 新增
1545
</el-button>
16-
</template>
17-
</Search>
46+
</el-form-item>
47+
</el-form>
1848
</ContentWrap>
1949

2050
<!-- 列表 -->
2151
<ContentWrap>
22-
<Table
23-
v-model:currentPage="tableObject.currentPage"
24-
v-model:pageSize="tableObject.pageSize"
25-
:columns="allSchemas.tableColumns"
26-
:data="tableObject.tableList"
27-
:loading="tableObject.loading"
28-
:pagination="{
29-
total: tableObject.total
30-
}"
31-
>
32-
<template #spuId="{ row }">
33-
<el-image
34-
:src="row.picUrl"
35-
class="mr-5px h-30px w-30px align-middle"
36-
@click="imagePreview(row.picUrl)"
37-
/>
38-
<span class="align-middle">{{ row.spuName }}</span>
39-
</template>
40-
<template #action="{ row }">
41-
<el-button
42-
v-hasPermi="['promotion:bargain-activity:update']"
43-
link
44-
type="primary"
45-
@click="openForm('update', row.id)"
46-
>
47-
编辑
48-
</el-button>
49-
<el-button
50-
v-hasPermi="['promotion:bargain-activity:delete']"
51-
link
52-
type="danger"
53-
@click="handleDelete(row.id)"
54-
>
55-
删除
56-
</el-button>
57-
</template>
58-
</Table>
52+
<el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true">
53+
<el-table-column label="活动编号" prop="id" min-width="80" />
54+
<el-table-column label="活动名称" prop="name" min-width="140" />
55+
<el-table-column label="活动时间" min-width="210">
56+
<template #default="scope">
57+
{{ formatDate(scope.row.startTime, 'YYYY-MM-DD') }}
58+
~ {{ formatDate(scope.row.endTime, 'YYYY-MM-DD') }}
59+
</template>
60+
</el-table-column>
61+
<el-table-column label="商品图片" prop="spuName" min-width="80">
62+
<template #default="scope">
63+
<el-image
64+
:src="scope.row.picUrl"
65+
class="h-40px w-40px"
66+
:preview-src-list="[scope.row.picUrl]"
67+
preview-teleported
68+
/>
69+
</template>
70+
</el-table-column>
71+
<el-table-column label="商品标题" prop="spuName" min-width="300" />
72+
<el-table-column
73+
label="起始价格"
74+
prop="bargainFirstPrice"
75+
min-width="100"
76+
:formatter="fenToYuanFormat"
77+
/>
78+
<el-table-column
79+
label="砍价底价"
80+
prop="bargainMinPrice"
81+
min-width="100"
82+
:formatter="fenToYuanFormat"
83+
/>
84+
<el-table-column label="总砍价人数" prop="recordUserCount" min-width="100" />
85+
<el-table-column label="成功砍价人数" prop="recordSuccessUserCount" min-width="110" />
86+
<el-table-column label="助力人数" prop="helpUserCount" min-width="100" />
87+
<el-table-column label="活动状态" align="center" prop="status" min-width="100">
88+
<template #default="scope">
89+
<dict-tag :type="DICT_TYPE.COMMON_STATUS" :value="scope.row.status" />
90+
</template>
91+
</el-table-column>
92+
<el-table-column label="库存" align="center" prop="stock" min-width="80" />
93+
<el-table-column label="总库存" align="center" prop="totalStock" min-width="80" />
94+
<el-table-column
95+
label="创建时间"
96+
align="center"
97+
prop="createTime"
98+
:formatter="dateFormatter"
99+
width="180px"
100+
/>
101+
<el-table-column label="操作" align="center" width="150px" fixed="right">
102+
<template #default="scope">
103+
<el-button
104+
link
105+
type="primary"
106+
@click="openForm('update', scope.row.id)"
107+
v-hasPermi="['promotion:bargain-activity:update']"
108+
>
109+
编辑
110+
</el-button>
111+
<el-button
112+
link
113+
type="danger"
114+
@click="handleClose(scope.row.id)"
115+
v-if="scope.row.status === 0"
116+
v-hasPermi="['promotion:bargain-activity:close']"
117+
>
118+
关闭
119+
</el-button>
120+
<el-button
121+
link
122+
type="danger"
123+
@click="handleDelete(scope.row.id)"
124+
v-else
125+
v-hasPermi="['promotion:bargain-activity:delete']"
126+
>
127+
删除
128+
</el-button>
129+
</template>
130+
</el-table-column>
131+
</el-table>
132+
<!-- 分页 -->
133+
<Pagination
134+
:total="total"
135+
v-model:page="queryParams.pageNo"
136+
v-model:limit="queryParams.pageSize"
137+
@pagination="getList"
138+
/>
59139
</ContentWrap>
60140

61141
<!-- 表单弹窗：添加/修改 -->
62142
<BargainActivityForm ref="formRef" @success="getList" />
63143
</template>
64-
<script lang="ts" setup>
65-
import { allSchemas } from './bargainActivity.data'
144+
145+
<script setup lang="ts">
146+
import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
147+
import { dateFormatter } from '@/utils/formatTime'
66148
import * as BargainActivityApi from '@/api/mall/promotion/bargain/bargainActivity'
67149
import BargainActivityForm from './BargainActivityForm.vue'
68-
import { createImageViewer } from '@/components/ImageViewer'
69-
import { sortTableColumns } from '@/hooks/web/useCrudSchemas'
150+
import { formatDate } from '@/utils/formatTime'
151+
import { fenToYuanFormat } from '@/utils/formatter'
152+
import { fenToYuan } from '@/utils'
70153
71154
defineOptions({ name: 'PromotionBargainActivity' })
72155
73-
// tableObject：表格的属性对象，可获得分页大小、条数等属性
74-
// tableMethods：表格的操作对象，可进行获得分页、删除记录等操作
75-
// 详细可见：https://doc.iocoder.cn/vue3/crud-schema/
76-
const { tableObject, tableMethods } = useTable({
77-
getListApi: BargainActivityApi.getBargainActivityPage, // 分页接口
78-
delListApi: BargainActivityApi.deleteBargainActivity // 删除接口
156+
const message = useMessage() // 消息弹窗
157+
const { t } = useI18n() // 国际化
158+
159+
const loading = ref(true) // 列表的加载中
160+
const total = ref(0) // 列表的总页数
161+
const list = ref([]) // 列表的数据
162+
const queryParams = reactive({
163+
pageNo: 1,
164+
pageSize: 10,
165+
name: null,
166+
status: null
79167
})
80-
// 获得表格的各种操作
81-
const { getList, setSearchParams } = tableMethods
168+
const queryFormRef = ref() // 搜索的表单
169+
const exportLoading = ref(false) // 导出的加载中
82170
83-
/** 商品图预览 */
84-
const imagePreview = (imgUrl: string) => {
85-
createImageViewer({
86-
urlList: [imgUrl]
87-
})
171+
/** 查询列表 */
172+
const getList = async () => {
173+
loading.value = true
174+
try {
175+
const data = await BargainActivityApi.getBargainActivityPage(queryParams)
176+
list.value = data.list
177+
total.value = data.total
178+
} finally {
179+
loading.value = false
180+
}
181+
}
182+
183+
/** 搜索按钮操作 */
184+
const handleQuery = () => {
185+
queryParams.pageNo = 1
186+
getList()
187+
}
188+
189+
/** 重置按钮操作 */
190+
const resetQuery = () => {
191+
queryFormRef.value.resetFields()
192+
handleQuery()
88193
}
89194
90195
/** 添加/修改操作 */
@@ -93,15 +198,35 @@ const openForm = (type: string, id?: number) => {
93198
formRef.value.open(type, id)
94199
}
95200
201+
// TODO 芋艿：这里要改下
202+
/** 关闭按钮操作 */
203+
const handleClose = async (id: number) => {
204+
try {
205+
// 关闭的二次确认
206+
await message.confirm('确认关闭该秒杀活动吗？')
207+
// 发起关闭
208+
await BargainActivityApi.closeSeckillActivity(id)
209+
message.success('关闭成功')
210+
// 刷新列表
211+
await getList()
212+
} catch {}
213+
}
214+
96215
/** 删除按钮操作 */
97-
const handleDelete = (id: number) => {
98-
tableMethods.delList(id, false)
216+
const handleDelete = async (id: number) => {
217+
try {
218+
// 删除的二次确认
219+
await message.delConfirm()
220+
// 发起删除
221+
await BargainActivityApi.deleteBargainActivity(id)
222+
message.success(t('common.delSuccess'))
223+
// 刷新列表
224+
await getList()
225+
} catch {}
99226
}
100227
101228
/** 初始化 **/
102-
onMounted(() => {
103-
// 获得活动列表
104-
sortTableColumns(allSchemas.tableColumns, 'spuId')
105-
getList()
229+
onMounted(async () => {
230+
await getList()
106231
})
107232
</script>

0 commit comments

Comments
 (0)