活动报名列表

This commit is contained in:
qiuyuan 2025-07-29 14:42:04 +08:00
parent 4f06cb9c78
commit 5e6b2eec02
6 changed files with 553 additions and 3 deletions

View File

@ -13,4 +13,6 @@ export const updateItem = (id, params) => request.basic.put(`/api/v1/activities/
// 删除数据 // 删除数据
export const delItem = (id) => request.basic.delete(`/api/v1/activities/${id}`) export const delItem = (id) => request.basic.delete(`/api/v1/activities/${id}`)
//获取活动报名列表 //获取活动报名列表
export const getActivityList=(params)=>request.basic.get('/api/v1/activity-details',params) export const getActivityList = (params) => request.basic.get('/api/v1/activity-registers', params)
// 导出文件
export const exportFile = (params) => request.basic.get('/api/v1/activity-registers/export', params, { responseType: 'blob' })

View File

@ -49,5 +49,6 @@ export default {
mettingRoom:'城市会客厅', mettingRoom:'城市会客厅',
mettingYuYue:'预约记录', mettingYuYue:'预约记录',
customer:'用户管理', customer:'用户管理',
aiHelper:'AI助手' aiHelper:'AI助手',
abbreviation:'活动报名'
} }

View File

@ -225,4 +225,16 @@ export default [
permission: '*', permission: '*',
}, },
}, },
{
path: 'abbreviation/index',
name: 'abbreviation',
component: 'pages/abbreviationList/index.vue',
meta: {
icon: 'icon-yonghu',
title: '活动报名',
isMenu: true,
keepAlive: true,
permission: '*',
},
},
] ]

View File

@ -20,9 +20,10 @@ const options = {
}, },
interceptorRequestCatch: () => {}, interceptorRequestCatch: () => {},
interceptorResponse: (response) => { interceptorResponse: (response) => {
const list=['/api/v1/activity-registers/export']
// 错误处理 // 错误处理
const { success, msg = 'Network Error' } = response.data || {} const { success, msg = 'Network Error' } = response.data || {}
if (![true].includes(success)) { if (![true].includes(success) && !list.includes(response.config.url)) {
message.error({ message.error({
content: msg, content: msg,
key: MSG_ERROR_KEY, key: MSG_ERROR_KEY,

View File

@ -0,0 +1,251 @@
<template>
<a-modal :open="modal.open" :title="modal.title" :width="640" :confirm-loading="modal.confirmLoading"
:after-close="onAfterClose" :cancel-text="cancelText" :ok-text="okText" @ok="handleOk" @cancel="handleCancel">
<a-spin :spinning="spining">
<a-form ref="formRef" :model="formData" :rules="formRules">
<a-card class="mb-8-2">
<a-tabs v-model:activeKey="activeKey">
<a-tab-pane key="1" tab="基本信息">
<a-row :gutter="12">
<a-col :span="24">
<a-form-item :label="'产品分类'" name="typeId">
<a-select ref="select" v-model:value="formData.typeId" style="width: 100%">
<a-select-option v-for="item in typeList" :value="item.value">{{
item.label }}</a-select-option>
</a-select>
</a-form-item>
</a-col>
<a-col :span="24">
<a-form-item :label="'产品排序'" name="sequence">
<a-input-number :placeholder="'请输入排序'" v-model:value="formData.sequence"
style="width: 100%;"></a-input-number>
</a-form-item>
</a-col>
<a-col :span="24">
<a-form-item :label="'门店名称'" name="storeName">
<a-input :placeholder="'请输入门店名称'" v-model:value="formData.storeName"></a-input>
</a-form-item>
</a-col>
<a-col :span="24">
<a-form-item :label="'营业时间'" name="openAt">
<a-input :placeholder="'请输入营业时间'" v-model:value="formData.openAt"></a-input>
</a-form-item>
</a-col>
<a-col :span="24">
<a-form-item :label="'联系电话'" name="openAt">
<a-input :placeholder="'请输入联系电话'" v-model:value="formData.concatPhone"></a-input>
</a-form-item>
</a-col>
<a-col :span="24">
<a-form-item :label="'标签'" name="labels">
<a-select v-model:value="formData.labels" mode="tags" style="width: 100%"
placeholder="输入标签然后回车"></a-select>
</a-form-item>
</a-col>
<a-col :span="24">
<a-form-item :label="'状态'" name="status">
<a-radio-group v-model:value="formData.status" :options="storeStatus.getAll()"
disabled></a-radio-group>
</a-form-item>
</a-col>
<a-col :span="24">
<a-form-item :label="'店铺描述'" name="content">
<a-textarea :placeholder="'请输入店铺描述'" v-model:value="formData.content"
:auto-size="{ minRows: 2, maxRows: 5 }"></a-textarea>
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item :label="'店铺封面'" name="storeCover">
<gx-upload v-model="formData.storeCover" accept-types=".jpg,.png,.webp"
:fileNumber="1" />
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item :label="'详情图片'" name="imgs">
<gx-upload v-model="formData.img" accept-types=".jpg,.png,.webp"
:fileNumber="10" />
</a-form-item>
</a-col>
</a-row>
</a-tab-pane>
<a-tab-pane key="2" tab="位置信息">
<a-row :gutter="12">
<a-col :span="12">
<a-form-item :label="'经度'" name="longitude">
<a-input :placeholder="'请输入经度'" v-model:value="formData.longitude"></a-input>
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item :label="'纬度'" name="latitude">
<a-input :placeholder="'请输入纬度'" v-model:value="formData.latitude"></a-input>
</a-form-item>
</a-col>
<a-col :span="24">
<a-form-item :label="'详细地址'" name="storeAddress">
<a-input :placeholder="'请输入详细地址'"
v-model:value="formData.storeAddress"></a-input>
</a-form-item>
</a-col>
<a-col :span="24">
<gx-map @handleGetLng="handleGetLng" />
</a-col>
</a-row>
</a-tab-pane>
</a-tabs>
</a-card>
</a-form>
</a-spin>
</a-modal>
</template>
<script setup>
import { cloneDeep } from 'lodash-es'
import { ref, onBeforeMount } from 'vue'
import { config } from '@/config'
import apis from '@/apis'
import { useForm, useModal, useSpining } from '@/hooks'
import { message } from 'ant-design-vue'
import { useI18n } from 'vue-i18n'
import { storeStatus } from '@/enums/index.js'
import { spliceUrl } from '@/utils/util'
import { init } from 'echarts'
const areaFormRef = ref()
const emit = defineEmits(['ok'])
const { t } = useI18n() // t
const { modal, showModal, hideModal, showLoading, hideLoading } = useModal()
const { formRecord, formData, formRef, formRules, resetForm } = useForm()
const { spining, showSpining, hideSpining } = useSpining()
const cancelText = ref(t('button.cancel'))
const okText = ref(t('button.confirm'))
const typeList = ref([])
const searchValue = ref('')
const activeKey = ref('1')
formRules.value = {
typeId: [{ required: true, message: '请选择产品类别名称', trigger: 'change' }],
sequence: { required: true, message: '请输入排序' },
storeName: { required: true, message: '请输入门店名称' },
longitude: { required: true, message: '请输入经度' },
latitude: { required: true, message: '请输入纬度' },
storeAddress: { required: true, message: '请输入门店地址' },
status: { required: true, message: '请选择状态', trigger: 'change' }
}
const initData = async () => {
try {
showSpining()
const { data, success } = await apis.serverType.getDataList({ pageSize: 99, current: 1 })
if (success) {
typeList.value = data.map(item => ({ value: item.id, label: item.label }))
hideSpining()
}
} catch (error) {
hideSpining()
}
}
/**
* 新建
*/
function handleCreate() {
showModal({
type: 'create',
title: '新增',
})
initData()
formData.value.status = 1
}
/**
* 编辑
*/
async function handleEdit(record = {}) {
showModal({
type: 'edit',
title: '编辑',
})
const { data, success } = await apis.serverList.getMenu(record.id).catch()
if (!success) {
hideModal()
return
}
formData.value = { ...data }
formData.value.storeCover = data.storeCover ? [config('http.apiBasic') + data.storeCover] : []
formData.value.img = data.imgs?.map(url => config('http.apiBasic') + url) || []
initData()
}
/**
* 确定
*/
function handleOk() {
formRef.value.validateFields().then(async (values) => {
try {
showLoading()
console.log(formData.value)
const params = {
...values,
storeCover: formData.value.storeCover ? spliceUrl(formData.value.storeCover[0]) : '',
imgs: formData.value.img?.map(url => spliceUrl(url)) || [],
latitude: parseFloat(formData.value.latitude),
longitude: parseFloat(formData.value.longitude),
status: 1
}
console.log("====",params)
let result = null
switch (modal.value.type) {
case 'create':
result = await apis.serverList.createMenu(params).catch((error) => {
throw new Error(error)
})
break
case 'edit':
result = await apis.serverList.updateMenu(formData.value.id, params).catch(() => {
throw new Error(error)
})
break
}
hideLoading()
if (config('http.code.success') === result?.success) {
hideModal()
emit('ok')
}
} catch (error) {
message.error({ content: error.message })
hideLoading()
}
})
.catch((e) => {
console.log(e)
hideLoading()
})
}
const handleGetLng = (obj = {}) => {
formData.value.longitude = obj.lng
formData.value.latitude = obj.lat
formData.value.storeAddress = obj.address
}
/**
* 取消
*/
function handleCancel() {
hideModal()
}
/**
* 关闭后
*/
function onAfterClose() {
resetForm()
hideLoading()
}
defineExpose({
handleCreate,
handleEdit,
})
</script>
<style lang="less" scoped></style>

View File

@ -0,0 +1,283 @@
<template>
<x-search-bar class="mb-8-2">
<template #default="{ gutter, colSpan }">
<a-form :model="searchFormData" layout="inline">
<a-row :gutter="12">
<a-col :span="12">
<a-form-item label="活动名称" name="name">
<a-select v-model:value="searchFormData.activityId">
<a-select-option v-for="item of activityList" :value="item.id">{{ item.title
}}</a-select-option>
</a-select>
</a-form-item>
</a-col>
<a-col class="align-right" :span="12">
<a-space>
<a-button @click="handleExport">导出文件</a-button>
<a-button @click="handleResetSearch">{{ $t('button.reset') }}</a-button>
<a-button ghost type="primary" @click="handleSearch">
{{ $t('button.search') }}
</a-button>
</a-space>
</a-col>
</a-row>
</a-form>
</template>
</x-search-bar>
<a-row :gutter="8" :wrap="false">
<a-col flex="auto">
<a-card type="flex">
<a-table :columns="columns" :data-source="listData" bordered="true" :loading="loading"
:pagination="paginationState" @change="onTableChange">
<template #bodyCell="{ column, record }">
<template v-if="'createdAt' === column.dataIndex">
{{ dayjs(record.createdAt).format('YYYY-MM-DD') }}
</template>
<template v-if="'ActivityCover' === column.dataIndex">
<a-image :width="60"
:src="record.ActivityCover ? config('http.apiBasic') + record.ActivityCover : errImg" />
</template>
</template>
</a-table>
</a-card>
</a-col>
</a-row>
<a-modal v-model:open="open" :title="'审核'" @ok="handleClick">
<a-card class="mb-8-2">
<a-form-item label="审核" name="">
<a-radio-group v-model:value="auditStatus">
<a-radio :value="2">通过</a-radio>
<a-radio :value="99">不通过</a-radio>
</a-radio-group>
</a-form-item>
<a-form-item label="备注" name="">
<a-textarea :placeholder="'请输入审核备注'" v-model:value="remark"
:auto-size="{ minRows: 2, maxRows: 5 }"></a-textarea>
</a-form-item>
</a-card>
</a-modal>
<a-modal v-model:open="imgOpen" :title="'图片/视频'" @ok="imgOpen = false">
<a-card class="mb-8-2">
<a-form-item :label="'图片'" name="images">
<template v-if="currentInfo.images && currentInfo.images.length > 0">
<a-image-preview-group>
<a-image v-for="item in currentInfo.images" :width="200"
:src="config('http.apiBasic') + item" />
</a-image-preview-group>
</template>
<template v-else>暂无</template>
</a-form-item>
<a-form-item label="视频" name="video">
<template v-if="currentInfo.videos && currentInfo.videos.length > 0">
<video width="320" height="240" controls>
<source v-for="item in currentInfo.videos" :src="config('http.apiBasic') + item">
</video>
</template>
<template>暂无</template>
</a-form-item>
</a-card>
</a-modal>
</template>
<script setup>
import { message, Modal } from 'ant-design-vue'
import { ref } from 'vue'
import apis from '@/apis'
import { config } from '@/config'
import { usePagination } from '@/hooks'
import dayjs from 'dayjs'
import EditDialog from './components/EditDialog.vue'
import { PlusOutlined, EditOutlined, DeleteOutlined } from '@ant-design/icons-vue'
import { useI18n } from 'vue-i18n'
import { orderStatus } from '@/enums/index.js'
import { status } from 'nprogress'
defineOptions({
name: 'orderList',
})
const { t } = useI18n() // t
const columns = [
{ title: '用户名', dataIndex: 'customerName' },
{ title: '联系方式', dataIndex: 'customerPhone' },
{ title: '报名时间', dataIndex: 'createdAt', width: 200, align: 'center' },
{ title: '活动名称', dataIndex: 'ActivityTitle' },
{ title: '活动封面图', dataIndex: 'ActivityCover', width: 200 },
]
const { listData, loading, showLoading, hideLoading, paginationState, resetPagination, searchFormData } = usePagination()
const remark = ref('')
const currentInfo = ref({})
const auditStatus = ref(2)
const editDialogRef = ref()
const open = ref(false)
const imgOpen = ref(false)
const activityList = ref([])
getPageList()
getActiveList()
/**
* 获取活动报名列表
* @returns {Promise<void>}
*/
async function getPageList() {
try {
showLoading()
const { pageSize, current } = paginationState
const { success, data, total } = await apis.activity
.getActivityList({
pageSize,
current: current,
...searchFormData.value,
})
.catch(() => {
throw new Error()
})
hideLoading()
if (config('http.code.success') === success) {
listData.value = data.map(item => ({
...item,
key: item.value,
}))
paginationState.total = total
}
} catch (error) {
hideLoading()
}
}
//
async function getActiveList() {
try {
showLoading()
const { success, data } = await apis.activity
.getProjectList({
pageSize: 99,
current: 1,
})
.catch(() => {
throw new Error()
})
hideLoading()
if (config('http.code.success') === success) {
activityList.value = data.map(item => ({ id: item.id, title: item.title }))
}
} catch (error) {
hideLoading()
}
}
/**
* 下载文件
*/
async function handleExport() {
try {
const activityId = searchFormData.value.activityId
if (!activityId) {
message.warning('请选择活动')
return
}
// { responseType: 'blob' }
const response = await apis.activity.exportFile({ activityId })
console.log(response)
const url = window.URL.createObjectURL(new Blob([response]))
const link = document.createElement('a')
link.href = url
link.setAttribute('download', '报名表.xlsx') //
document.body.appendChild(link)
link.click()
document.body.removeChild(link)
window.URL.revokeObjectURL(url)
} catch (error) {
// message.error('' + (error.message || ''))
// console.error(':', error)
}
}
const handleClick = async () => {
try {
const params = {
...currentInfo.value,
status: auditStatus.value,
remark: remark.value
}
const result = await apis.orderList.updateMenu(currentInfo.value.id, params).catch(() => {
throw new Error(error)
})
if (config('http.code.success') === result?.success) {
message.success('已审核')
open.value = false
getPageList()
}
} catch (error) {
message.error({ content: error.message })
hideLoading()
}
}
/**
* 删除
*/
function handleDelete(value) {
Modal.confirm({
title: '确定撤销该工单吗',
content: t('button.confirm'),
okText: t('button.confirm'),
onOk: () => {
return new Promise((resolve, reject) => {
; (async () => {
try {
const params = {
...value,
status: 98
}
console.log(params)
const { success } = await apis.orderList.updateMenu(value.id, params).catch(() => {
throw new Error()
})
if (config('http.code.success') === success) {
resolve()
message.success('撤销成功')
await getPageList()
}
} catch (error) {
reject()
}
})()
})
},
})
}
/**
* 分页
*/
function onTableChange({ current, pageSize }) {
paginationState.current = current
paginationState.pageSize = pageSize
getPageList()
}
/**
* 搜索
*/
function handleSearch() {
resetPagination()
getPageList()
}
/**
* 重置
*/
function handleResetSearch() {
searchFormData.value = {}
resetPagination()
getPageList()
}
/**
* 编辑完成
*/
async function onOk() {
await getPageList()
}
</script>
<style lang="less" scoped></style>