Skip to content

Commit 2e96b1c

Browse files
author
puhui999
committed
feat: mall CombinationActivity
1 parent 341303b commit 2e96b1c

File tree

5 files changed

+385
-0
lines changed

5 files changed

+385
-0
lines changed

‎src/api/mall/promotion/combination/combinationactivity.ts

Lines changed: 48 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,48 @@
1+
import request from '@/config/axios'
2+
3+
export interface CombinationActivityVO {
4+
id: number
5+
name: string
6+
spuId: number
7+
totalLimitCount: number
8+
singleLimitCount: number
9+
startTime: Date
10+
endTime: Date
11+
userSize: number
12+
totalNum: number
13+
successNum: number
14+
orderUserCount: number
15+
virtualGroup: number
16+
status: number
17+
limitDuration: number
18+
}
19+
20+
// 查询拼团活动列表
21+
export const getCombinationActivityPage = async (params) => {
22+
return await request.get({ url: '/promotion/combination-activity/page', params })
23+
}
24+
25+
// 查询拼团活动详情
26+
export const getCombinationActivity = async (id: number) => {
27+
return await request.get({ url: '/promotion/combination-activity/get?id=' + id })
28+
}
29+
30+
// 新增拼团活动
31+
export const createCombinationActivity = async (data: CombinationActivityVO) => {
32+
return await request.post({ url: '/promotion/combination-activity/create', data })
33+
}
34+
35+
// 修改拼团活动
36+
export const updateCombinationActivity = async (data: CombinationActivityVO) => {
37+
return await request.put({ url: '/promotion/combination-activity/update', data })
38+
}
39+
40+
// 删除拼团活动
41+
export const deleteCombinationActivity = async (id: number) => {
42+
return await request.delete({ url: '/promotion/combination-activity/delete?id=' + id })
43+
}
44+
45+
// 导出拼团活动 Excel
46+
export const exportCombinationActivity = async (params) => {
47+
return await request.download({ url: '/promotion/combination-activity/export-excel', params })
48+
}

‎src/utils/formatTime.ts

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,13 @@ export function formatDate(date: Date, format?: string): string {
2323
return dayjs(date).format(format)
2424
}
2525

26+
/**
27+
* 获取当前的日期+时间
28+
*/
29+
export function getNowDateTime() {
30+
return dayjs().format('YYYY-MM-DD HH:mm:ss')
31+
}
32+
2633
/**
2734
* 获取当前日期是第几周
2835
* @param dateTime 当前传入的日期值

‎src/views/mall/promotion/combination/activity/CombinationActivityForm.vue

Lines changed: 74 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,74 @@
1+
<template>
2+
<Dialog v-model="dialogVisible" :title="dialogTitle">
3+
<Form
4+
ref="formRef"
5+
v-loading="formLoading"
6+
:is-col="true"
7+
:rules="rules"
8+
:schema="allSchemas.formSchema"
9+
/>
10+
<template #footer>
11+
<el-button :disabled="formLoading" type="primary" @click="submitForm">确 定</el-button>
12+
<el-button @click="dialogVisible = false">取 消</el-button>
13+
</template>
14+
</Dialog>
15+
</template>
16+
<script lang="ts" setup>
17+
import * as CombinationActivityApi from '@/api/mall/promotion/combination/combinationactivity'
18+
import { allSchemas, rules } from './combinationActivity.data'
19+
20+
defineOptions({ name: 'PromotionCombinationActivityForm' })
21+
22+
const { t } = useI18n() // 国际化
23+
const message = useMessage() // 消息弹窗
24+
25+
const dialogVisible = ref(false) // 弹窗的是否展示
26+
const dialogTitle = ref('') // 弹窗的标题
27+
const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
28+
const formType = ref('') // 表单的类型：create - 新增；update - 修改
29+
const formRef = ref() // 表单 Ref
30+
31+
/** 打开弹窗 */
32+
const open = async (type: string, id?: number) => {
33+
dialogVisible.value = true
34+
dialogTitle.value = t('action.' + type)
35+
formType.value = type
36+
// 修改时，设置数据
37+
if (id) {
38+
formLoading.value = true
39+
try {
40+
const data = await CombinationActivityApi.getCombinationActivity(id)
41+
formRef.value.setValues(data)
42+
} finally {
43+
formLoading.value = false
44+
}
45+
}
46+
}
47+
defineExpose({ open }) // 提供 open 方法，用于打开弹窗
48+
49+
/** 提交表单 */
50+
const emit = defineEmits(['success']) // 定义 success 事件，用于操作成功后的回调
51+
const submitForm = async () => {
52+
// 校验表单
53+
if (!formRef) return
54+
const valid = await formRef.value.getElFormRef().validate()
55+
if (!valid) return
56+
// 提交请求
57+
formLoading.value = true
58+
try {
59+
const data = formRef.value.formModel as CombinationActivityApi.CombinationActivityVO
60+
if (formType.value === 'create') {
61+
await CombinationActivityApi.createCombinationActivity(data)
62+
message.success(t('common.createSuccess'))
63+
} else {
64+
await CombinationActivityApi.updateCombinationActivity(data)
65+
message.success(t('common.updateSuccess'))
66+
}
67+
dialogVisible.value = false
68+
// 发送操作成功的事件
69+
emit('success')
70+
} finally {
71+
formLoading.value = false
72+
}
73+
}
74+
</script>

‎src/views/mall/promotion/combination/activity/combinationActivity.data.ts

Lines changed: 168 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,168 @@
1+
import type { CrudSchema } from '@/hooks/web/useCrudSchemas'
2+
import { dateFormatter, getNowDateTime } from '@/utils/formatTime'
3+
4+
// 表单校验
5+
export const rules = reactive({
6+
name: [required],
7+
totalLimitCount: [required],
8+
singleLimitCount: [required],
9+
startTime: [required],
10+
endTime: [required],
11+
userSize: [required],
12+
totalNum: [required],
13+
successNum: [required],
14+
orderUserCount: [required],
15+
virtualGroup: [required],
16+
status: [required],
17+
limitDuration: [required]
18+
})
19+
20+
// CrudSchema https://doc.iocoder.cn/vue3/crud-schema/
21+
const crudSchemas = reactive<CrudSchema[]>([
22+
{
23+
label: '拼团名称',
24+
field: 'name',
25+
isSearch: true,
26+
isTable: false,
27+
form: {
28+
colProps: {
29+
span: 24
30+
}
31+
}
32+
},
33+
{
34+
label: '活动时间',
35+
field: 'activityTime',
36+
formatter: dateFormatter,
37+
search: {
38+
show: true,
39+
component: 'DatePicker',
40+
componentProps: {
41+
valueFormat: 'YYYY-MM-DD HH:mm:ss',
42+
type: 'datetimerange'
43+
}
44+
},
45+
form: {
46+
component: 'DatePicker',
47+
componentProps: {
48+
valueFormat: 'YYYY-MM-DD HH:mm:ss',
49+
type: 'datetimerange'
50+
},
51+
value: [getNowDateTime(), getNowDateTime()],
52+
colProps: {
53+
span: 24
54+
}
55+
}
56+
},
57+
{
58+
label: '参与人数',
59+
field: 'orderUserCount',
60+
isSearch: false,
61+
form: {
62+
component: 'InputNumber',
63+
labelMessage: '参与人数不能少于两人',
64+
value: 2
65+
}
66+
},
67+
{
68+
label: '限制时长',
69+
field: 'limitDuration',
70+
isSearch: false,
71+
isTable: false,
72+
form: {
73+
component: 'InputNumber',
74+
labelMessage: '限制时长(小时)',
75+
componentProps: {
76+
placeholder: '请输入限制时长(小时)'
77+
}
78+
}
79+
},
80+
{
81+
label: '总限购数量',
82+
field: 'totalLimitCount',
83+
isSearch: false,
84+
isTable: false,
85+
form: {
86+
component: 'InputNumber',
87+
value: 0
88+
}
89+
},
90+
{
91+
label: '单次限购数量',
92+
field: 'singleLimitCount',
93+
isSearch: false,
94+
isTable: false,
95+
form: {
96+
component: 'InputNumber',
97+
value: 0
98+
}
99+
},
100+
{
101+
label: '购买人数',
102+
field: 'userSize',
103+
isSearch: false,
104+
isForm: false
105+
},
106+
{
107+
label: '开团组数',
108+
field: 'totalNum',
109+
isSearch: false,
110+
isForm: false
111+
},
112+
{
113+
label: '成团组数',
114+
field: 'successNum',
115+
isSearch: false,
116+
isForm: false
117+
},
118+
{
119+
label: '虚拟成团',
120+
field: 'virtualGroup',
121+
isSearch: false,
122+
isTable: false,
123+
form: {
124+
component: 'InputNumber',
125+
value: 0
126+
}
127+
},
128+
{
129+
label: '活动状态',
130+
field: 'status',
131+
dictType: DICT_TYPE.COMMON_STATUS,
132+
dictClass: 'number',
133+
isSearch: true,
134+
isForm: false
135+
},
136+
{
137+
label: '创建时间',
138+
field: 'createTime',
139+
formatter: dateFormatter,
140+
isSearch: false,
141+
isTable: false,
142+
search: {
143+
component: 'DatePicker',
144+
componentProps: {
145+
valueFormat: 'YYYY-MM-DD HH:mm:ss',
146+
type: 'daterange',
147+
defaultTime: [new Date('1 00:00:00'), new Date('1 23:59:59')]
148+
}
149+
},
150+
isForm: false
151+
},
152+
{
153+
label: '拼团商品',
154+
field: 'spuId',
155+
isSearch: false,
156+
form: {
157+
colProps: {
158+
span: 24
159+
}
160+
}
161+
},
162+
{
163+
label: '操作',
164+
field: 'action',
165+
isForm: false
166+
}
167+
])
168+
export const { allSchemas } = useCrudSchemas(crudSchemas)

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

Lines changed: 88 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,88 @@
1+
<template>
2+
<!-- 搜索工作栏 -->
3+
<ContentWrap>
4+
<Search :schema="allSchemas.searchSchema" @reset="setSearchParams" @search="setSearchParams">
5+
<!-- 新增等操作按钮 -->
6+
<template #actionMore>
7+
<el-button
8+
v-hasPermi="['promotion:combination-activity:create']"
9+
plain
10+
type="primary"
11+
@click="openForm('create')"
12+
>
13+
<Icon class="mr-5px" icon="ep:plus" />
14+
新增
15+
</el-button>
16+
</template>
17+
</Search>
18+
</ContentWrap>
19+
20+
<!-- 列表 -->
21+
<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 #action="{ row }">
33+
<el-button
34+
v-hasPermi="['promotion:combination-activity:update']"
35+
link
36+
type="primary"
37+
@click="openForm('update', row.id)"
38+
>
39+
编辑
40+
</el-button>
41+
<el-button
42+
v-hasPermi="['promotion:combination-activity:delete']"
43+
link
44+
type="danger"
45+
@click="handleDelete(row.id)"
46+
>
47+
删除
48+
</el-button>
49+
</template>
50+
</Table>
51+
</ContentWrap>
52+
53+
<!-- 表单弹窗：添加/修改 -->
54+
<CombinationActivityForm ref="formRef" @success="getList" />
55+
</template>
56+
<script lang="ts" setup>
57+
import { allSchemas } from './combinationActivity.data'
58+
import * as CombinationActivityApi from '@/api/mall/promotion/combination/combinationactivity'
59+
import CombinationActivityForm from './CombinationActivityForm.vue'
60+
61+
defineOptions({ name: 'PromotionCombinationActivity' })
62+
63+
// tableObject：表格的属性对象，可获得分页大小、条数等属性
64+
// tableMethods：表格的操作对象，可进行获得分页、删除记录等操作
65+
// 详细可见：https://doc.iocoder.cn/vue3/crud-schema/
66+
const { tableObject, tableMethods } = useTable({
67+
getListApi: CombinationActivityApi.getCombinationActivityPage, // 分页接口
68+
delListApi: CombinationActivityApi.deleteCombinationActivity // 删除接口
69+
})
70+
// 获得表格的各种操作
71+
const { getList, setSearchParams } = tableMethods
72+
73+
/** 添加/修改操作 */
74+
const formRef = ref()
75+
const openForm = (type: string, id?: number) => {
76+
formRef.value.open(type, id)
77+
}
78+
79+
/** 删除按钮操作 */
80+
const handleDelete = (id: number) => {
81+
tableMethods.delList(id, false)
82+
}
83+
84+
/** 初始化 **/
85+
onMounted(() => {
86+
getList()
87+
})
88+
</script>

0 commit comments

Comments
 (0)