Browse Source
Merge branch 'lihuilin/feature-20251104102812-现金二期' into milestone-20251104-现金二期
zhangrenyuan/feature-20251104133449-现金管理二期
Merge branch 'lihuilin/feature-20251104102812-现金二期' into milestone-20251104-现金二期
zhangrenyuan/feature-20251104133449-现金管理二期
4 changed files with 443 additions and 2 deletions
-
4.env.development
-
6src/router/index.js
-
1src/utils/menuUtils.js
-
434src/views/activityManage/activity.vue
@ -0,0 +1,434 @@ |
|||||
|
<template> |
||||
|
<el-card> |
||||
|
<div class="condition"> |
||||
|
<div class="condition-item1"> |
||||
|
<el-text size="large">活动名称:</el-text> |
||||
|
<el-input v-model="searchForm.activityName" style="width: 10vw" placeholder="请输入活动名称" clearable /> |
||||
|
</div> |
||||
|
<div class="condition-item1"> |
||||
|
<el-text size="large">业绩归属:</el-text> |
||||
|
<!-- <el-cascader v-model="searchForm.businessBelong" :options="marketOptions" placeholder="请选择所属地区" clearable |
||||
|
style="width: 10vw" /> --> |
||||
|
<el-select v-model="searchForm.businessBelong" placeholder="请选择业绩归属" style="width: 10vw"> |
||||
|
<el-option label="客户归属地" value="客户归属地" /> |
||||
|
<el-option label="活动归属地" value="活动归属地" /> |
||||
|
</el-select> |
||||
|
</div> |
||||
|
<div class="condition-item2"> |
||||
|
<el-text size="large">开始时间:</el-text> |
||||
|
<el-date-picker v-model="searchForm.startTime" type="datetime" placeholder="请选择开始时间" |
||||
|
format="YYYY-MM-DD HH:mm:ss" :default-time="defaultStartTime" clearable /> |
||||
|
</div> |
||||
|
<div class="condition-item2"> |
||||
|
<el-text size="large">结束时间:</el-text> |
||||
|
<el-date-picker v-model="searchForm.endTime" type="datetime" placeholder="请选择结束时间" |
||||
|
format="YYYY-MM-DD HH:mm:ss" :default-time="defaultEndTime" clearable /> |
||||
|
</div> |
||||
|
<el-button type="primary" @click="getActivity">查询</el-button> |
||||
|
<el-button type="success" @click="reset">重置</el-button> |
||||
|
</div> |
||||
|
</el-card> |
||||
|
|
||||
|
<el-button type="success" @click="showAdd = true" style="margin-top: 1vh;">新增活动</el-button> |
||||
|
|
||||
|
<el-card style="margin-top: 1vh;"> |
||||
|
<el-table :data="tableData" style="width: 82vw;" :row-style="{ height: '50px' }"> |
||||
|
<el-table-column type="index" label="序号" width="100px" fixed="left"> |
||||
|
<template #default="scope"> |
||||
|
<span>{{ scope.$index + 1 + (pagination.pageNum - 1) * pagination.pageSize }}</span> |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
<el-table-column prop="activityName" label="活动名称" width="150px" show-overflow-tooltip /> |
||||
|
<el-table-column prop="businessBelong" label="业绩归属地" width="150px" /> |
||||
|
<el-table-column prop="areaName" label="归属地" width="150px" /> |
||||
|
<el-table-column prop="startTime" label="开始时间" width="200px"> |
||||
|
<template #default="scope"> |
||||
|
{{ moment(scope.row.startTime).format('YYYY-MM-DD HH:mm:ss') }} |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
<el-table-column prop="endTime" label="结束时间" width="200px"> |
||||
|
<template #default="scope"> |
||||
|
{{ |
||||
|
moment(scope.row.endTime).format('YYYY-MM-DD HH:mm:ss') |
||||
|
}} |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
<el-table-column prop="status" label="状态" width="150px"> |
||||
|
<template #default="scope"> |
||||
|
{{ scope.row.status === '0' ? '未开始' : |
||||
|
scope.row.status === '1' ? '进行中' : |
||||
|
scope.row.status === '2' ? '已结束' : scope.row.status |
||||
|
}} |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
<el-table-column prop="creatorName" label="添加人" width="150px" /> |
||||
|
<el-table-column prop="operation" label="操作" width="220px"> |
||||
|
<template #default="scope"> |
||||
|
<el-button type="primary" text @click="editOpen(scope.row)">编辑</el-button> |
||||
|
<el-button type="danger" text @click="openDel(scope.row)">删除</el-button> |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
</el-table> |
||||
|
</el-card> |
||||
|
|
||||
|
<el-dialog v-model="showAdd" width="20vw" draggable align-center style="background-color: rgb(243,250,254);"> |
||||
|
<div class="add-item"> |
||||
|
<el-text size="large">活动名称:</el-text> |
||||
|
<el-input v-model="addForm.activityName" style="width: 12vw" placeholder="请输入活动名称" clearable /> |
||||
|
</div> |
||||
|
<div class="add-item"> |
||||
|
<el-text size="large">业绩归属:</el-text> |
||||
|
<el-radio-group v-model="addForm.businessBelong" style="width: 12vw"> |
||||
|
<el-radio size="large" value="客户归属地">客户归属地</el-radio> |
||||
|
<el-radio size="large" value="活动归属地">活动归属地</el-radio> |
||||
|
</el-radio-group> |
||||
|
</div> |
||||
|
<div class="add-item" v-show="addForm.businessBelong === '活动归属地'"> |
||||
|
<el-text size="large">所属地区:</el-text> |
||||
|
<el-cascader v-model="addForm.area" :options="marketOptions" placeholder="请选择所属地区" clearable |
||||
|
style="width: 12vw" /> |
||||
|
</div> |
||||
|
<div class="add-item"> |
||||
|
<el-text size="large">开始时间:</el-text> |
||||
|
<el-date-picker v-model="addForm.startTime" type="datetime" placeholder="请选择付款时间" |
||||
|
:default-time="defaultStartTime" style="width: 12vw" /> |
||||
|
</div> |
||||
|
<div class="add-item"> |
||||
|
<el-text size="large">结束时间:</el-text> |
||||
|
<el-date-picker v-model="addForm.endTime" type="datetime" placeholder="请选择付款时间" |
||||
|
:default-time="defaultEndTime" style="width: 12vw" /> |
||||
|
</div> |
||||
|
<div style="display: flex; justify-content: center; margin-top: 5vh;"> |
||||
|
<el-button type="primary" @click="hideAdd">取消</el-button> |
||||
|
<el-button type="primary" @click="handleAdd">确定</el-button> |
||||
|
</div> |
||||
|
</el-dialog> |
||||
|
|
||||
|
<el-dialog v-model="showEdit" width="20vw" draggable align-center style="background-color: rgb(243,250,254);"> |
||||
|
<div class="edit-item"> |
||||
|
<el-text size="large">活动名称:</el-text> |
||||
|
<el-input v-model="editForm.activityName" style="width: 12vw" placeholder="请输入活动名称" clearable /> |
||||
|
</div> |
||||
|
|
||||
|
<div class="edit-item"> |
||||
|
<el-text size="large">业绩归属:</el-text> |
||||
|
<el-radio-group v-model="editForm.businessBelong" style="width: 12vw"> |
||||
|
<el-radio size="large" value="客户归属地">客户归属地</el-radio> |
||||
|
<el-radio size="large" value="活动归属地">活动归属地</el-radio> |
||||
|
</el-radio-group> |
||||
|
</div> |
||||
|
<div class="edit-item" v-show="editForm.businessBelong === '活动归属地'"> |
||||
|
<el-text size="large">所属地区:</el-text> |
||||
|
<el-cascader v-model="editForm.area" :options="marketOptions" placeholder="请选择所属地区" clearable |
||||
|
style="width: 12vw" /> |
||||
|
</div> |
||||
|
<div class="edit-item"> |
||||
|
<el-text size="large">开始时间:</el-text> |
||||
|
<el-date-picker v-model="editForm.startTime" type="datetime" placeholder="请选择付款时间" |
||||
|
:default-time="defaultStartTime" style="width: 12vw" /> |
||||
|
</div> |
||||
|
<div class="edit-item"> |
||||
|
<el-text size="large">结束时间:</el-text> |
||||
|
<el-date-picker v-model="editForm.endTime" type="datetime" placeholder="请选择付款时间" |
||||
|
:default-time="defaultEndTime" style="width: 12vw" /> |
||||
|
</div> |
||||
|
<div style="display: flex; justify-content: center; margin-top: 5vh;"> |
||||
|
<el-button type="primary" @click="hideEdit">取消</el-button> |
||||
|
<el-button type="primary" @click="handleEdit">确定</el-button> |
||||
|
</div> |
||||
|
</el-dialog> |
||||
|
|
||||
|
<ConfirmDialog v-model="showDel" message="删除该活动数据" @confirm="handleDel()" |
||||
|
@cancel="hideDel" @close="hideDel" /> |
||||
|
</template> |
||||
|
<script setup> |
||||
|
import { ElMessage, ElPagination } from 'element-plus'; |
||||
|
import { onMounted, ref } from 'vue' |
||||
|
import API from "@/util/http.js" |
||||
|
import moment from 'moment' |
||||
|
import { useAdminStore } from "@/store/index.js" |
||||
|
import { storeToRefs } from "pinia" |
||||
|
import { permissionMapping, hasMenuPermission } from "@/utils/menuTreePermission.js" |
||||
|
const adminStore = useAdminStore(); |
||||
|
const { adminData, menuTree } = storeToRefs(adminStore) |
||||
|
import ConfirmDialog from '@/components/dialogs/ConfirmDialog.vue' |
||||
|
|
||||
|
const tableData = ref([]) |
||||
|
const pagination = ref({ |
||||
|
pageNum: 1, |
||||
|
pageSize: 10, |
||||
|
total: 0 |
||||
|
}) |
||||
|
const searchForm = ref({ |
||||
|
activityName: '' |
||||
|
}) |
||||
|
const showAdd = ref(false) |
||||
|
const showEdit = ref(false) |
||||
|
const showDel = ref(false) |
||||
|
const currentDelRow = ref(null) |
||||
|
const addForm = ref({ |
||||
|
activityName: '', |
||||
|
area: [] |
||||
|
}) |
||||
|
const editForm = ref({ |
||||
|
activityName: '', |
||||
|
businessBelong: '', |
||||
|
area: [], |
||||
|
startTime: null, |
||||
|
endTime: null, |
||||
|
id: '' |
||||
|
}) |
||||
|
const marketOptions = ref([]) |
||||
|
|
||||
|
const getActivity = async function () { |
||||
|
const rechargeActivity = { |
||||
|
activityName: searchForm.value.activityName, |
||||
|
businessBelong: searchForm.value.businessBelong, |
||||
|
} |
||||
|
if (searchForm.value.startTime && moment(searchForm.value.startTime).isValid()) { |
||||
|
rechargeActivity.startTime = moment(searchForm.value.startTime).format('YYYY-MM-DD HH:mm:ss'); |
||||
|
} |
||||
|
|
||||
|
if (searchForm.value.endTime && moment(searchForm.value.endTime).isValid()) { |
||||
|
rechargeActivity.endTime = moment(searchForm.value.endTime).format('YYYY-MM-DD HH:mm:ss'); |
||||
|
} |
||||
|
const params = { |
||||
|
pageNum: pagination.value.pageNum, |
||||
|
pageSize: pagination.value.pageSize, |
||||
|
rechargeActivity |
||||
|
} |
||||
|
const res = await API({ |
||||
|
url: '/admin/coin/rechargeActivityCenter/queryActivity', |
||||
|
data: params |
||||
|
}) |
||||
|
if (res.code === 200) { |
||||
|
tableData.value = res.data.list |
||||
|
pagination.value.total = res.data.total |
||||
|
} |
||||
|
} |
||||
|
const handleAdd = async function () { |
||||
|
if (!addForm.value.activityName) { |
||||
|
ElMessage.error('请输入活动名称') |
||||
|
return |
||||
|
} |
||||
|
if (!addForm.value.businessBelong) { |
||||
|
ElMessage.error('请选择业绩归属') |
||||
|
return |
||||
|
} |
||||
|
if (addForm.value.businessBelong === '活动归属地' && addForm.value.area.length === 0) { |
||||
|
ElMessage.error('请选择所属地区') |
||||
|
return |
||||
|
} |
||||
|
if (!addForm.value.startTime) { |
||||
|
ElMessage.error('请选择开始时间') |
||||
|
return |
||||
|
} |
||||
|
if (!addForm.value.endTime) { |
||||
|
ElMessage.error('请选择结束时间') |
||||
|
return |
||||
|
} |
||||
|
|
||||
|
const params = { |
||||
|
activityName: addForm.value.activityName, |
||||
|
businessBelong: addForm.value.businessBelong, |
||||
|
area: addForm.value.area.length > 0 ? addForm.value.area.slice(-1)[0] : null, |
||||
|
startTime: moment(addForm.value.startTime).format('YYYY-MM-DD HH:mm:ss'), |
||||
|
endTime: moment(addForm.value.endTime).format('YYYY-MM-DD HH:mm:ss'), |
||||
|
creator: adminData.value.id |
||||
|
} |
||||
|
|
||||
|
const res = await API({ |
||||
|
url: '/admin/coin/rechargeActivityCenter/addActivity', |
||||
|
data: params |
||||
|
}) |
||||
|
if (res.code === 200) { |
||||
|
ElMessage.success('添加成功') |
||||
|
getActivity() |
||||
|
hideAdd() |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
const handleEdit = async function () { |
||||
|
if (!editForm.value.activityName) { |
||||
|
ElMessage.error('请输入活动名称') |
||||
|
return |
||||
|
} |
||||
|
if (!editForm.value.businessBelong) { |
||||
|
ElMessage.error('请选择业绩归属') |
||||
|
return |
||||
|
} |
||||
|
if (editForm.value.businessBelong === '活动归属地' && editForm.value.area.length === 0) { |
||||
|
ElMessage.error('请选择所属地区') |
||||
|
return |
||||
|
} |
||||
|
if (!editForm.value.startTime) { |
||||
|
ElMessage.error('请选择开始时间') |
||||
|
return |
||||
|
} |
||||
|
if (!editForm.value.endTime) { |
||||
|
ElMessage.error('请选择结束时间') |
||||
|
return |
||||
|
} |
||||
|
|
||||
|
const params = { |
||||
|
id: editForm.value.id, |
||||
|
activityName: editForm.value.activityName, |
||||
|
businessBelong: editForm.value.businessBelong, |
||||
|
area: editForm.value.area.length > 0 ? editForm.value.area.slice(-1)[0] : null, |
||||
|
startTime: moment(editForm.value.startTime).format('YYYY-MM-DD HH:mm:ss'), |
||||
|
endTime: moment(editForm.value.endTime).format('YYYY-MM-DD HH:mm:ss'), |
||||
|
creator: adminData.value.id |
||||
|
} |
||||
|
console.log('看看修改params', params) |
||||
|
const res = await API({ |
||||
|
url: '/admin/coin/rechargeActivityCenter/updateActivity', |
||||
|
data: params |
||||
|
}) |
||||
|
if (res.code === 200) { |
||||
|
ElMessage.success('修改成功') |
||||
|
getActivity() |
||||
|
hideEdit() |
||||
|
} |
||||
|
} |
||||
|
const handleDel = async function (row) { |
||||
|
if (!currentDelRow.value) { |
||||
|
ElMessage.error('当前选择无数据') |
||||
|
return |
||||
|
} |
||||
|
const res = await API({ |
||||
|
url: '/admin/coin/rechargeActivityCenter/deleteActivity', |
||||
|
data: { |
||||
|
id: currentDelRow.value.id, |
||||
|
} |
||||
|
}) |
||||
|
if (res.code === 200) { |
||||
|
ElMessage.success('删除成功') |
||||
|
getActivity() |
||||
|
showDel.value = false |
||||
|
} |
||||
|
} |
||||
|
const getmarkets = async function () { |
||||
|
try { |
||||
|
const result = await API({ |
||||
|
url: '/market/selectMarket', |
||||
|
}); |
||||
|
console.log('请求成功', result) |
||||
|
// 递归转换树形结构为级联选择器需要的格式(跳过第一级节点) |
||||
|
const transformTree = (nodes) => { |
||||
|
// 直接处理第一级节点的子节点 |
||||
|
const allChildren = nodes.flatMap(node => node.children || []); |
||||
|
return allChildren.map(child => { |
||||
|
const grandchildren = child.children && child.children.length |
||||
|
? transformTree([child]) // 递归处理子节点 |
||||
|
: null; |
||||
|
return { |
||||
|
value: child.id, |
||||
|
label: child.name, |
||||
|
children: grandchildren |
||||
|
} |
||||
|
}) |
||||
|
} |
||||
|
marketOptions.value = transformTree(result.data) |
||||
|
console.log('转换后的地区树', marketOptions.value) |
||||
|
} catch (error) { |
||||
|
console.log('请求失败', error) |
||||
|
} |
||||
|
} |
||||
|
const defaultStartTime = [ |
||||
|
new Date(2000, 1, 1, 0, 0, 0) |
||||
|
] |
||||
|
const defaultEndTime = [ |
||||
|
new Date(2000, 2, 1, 23, 59, 59) |
||||
|
] |
||||
|
const hideEdit = () => { |
||||
|
showEdit.value = false |
||||
|
editForm.value = { |
||||
|
activityName: '', |
||||
|
businessBelong: '', |
||||
|
area: [], |
||||
|
startTime: null, |
||||
|
endTime: null, |
||||
|
id: '' |
||||
|
} |
||||
|
} |
||||
|
const editOpen = (row) => { |
||||
|
editForm.value = { |
||||
|
id: row.id, |
||||
|
activityName: row.activityName, |
||||
|
businessBelong: row.businessBelong, |
||||
|
area: row.area ? [...row.area] : [] |
||||
|
} |
||||
|
|
||||
|
if (row.startTime) { |
||||
|
editForm.value.startTime = moment(row.startTime).toDate() |
||||
|
} |
||||
|
if (row.endTime) { |
||||
|
editForm.value.endTime = moment(row.endTime).toDate() |
||||
|
} |
||||
|
console.log('看看editForm', editForm.value) |
||||
|
showEdit.value = true |
||||
|
} |
||||
|
const openDel = (row) => { |
||||
|
currentDelRow.value = row |
||||
|
showDel.value = true |
||||
|
} |
||||
|
const hideDel = () => { |
||||
|
showDel.value = false |
||||
|
currentDelRow.value = null |
||||
|
} |
||||
|
const reset = () => { |
||||
|
searchForm.value = { |
||||
|
activityName: '', |
||||
|
businessBelong: '', |
||||
|
startTime: null, |
||||
|
endTime: null |
||||
|
} |
||||
|
getActivity() |
||||
|
} |
||||
|
const hideAdd = () => { |
||||
|
showAdd.value = false |
||||
|
addForm.value = { |
||||
|
activityName: '', |
||||
|
area: [], |
||||
|
startTime: null, |
||||
|
endTime: null |
||||
|
} |
||||
|
} |
||||
|
onMounted(() => { |
||||
|
getActivity() |
||||
|
getmarkets() |
||||
|
console.log('看看adminData', adminData.value) |
||||
|
}) |
||||
|
</script> |
||||
|
<style> |
||||
|
.condition { |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
} |
||||
|
|
||||
|
.condition-item1 { |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
width: 15vw; |
||||
|
} |
||||
|
|
||||
|
.condition-item2 { |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
width: 17vw; |
||||
|
} |
||||
|
|
||||
|
.add-item { |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
width: 17vw; |
||||
|
margin-bottom: 1vh; |
||||
|
} |
||||
|
|
||||
|
.edit-item { |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
width: 17vw; |
||||
|
margin-bottom: 1vh; |
||||
|
} |
||||
|
</style> |
||||
Write
Preview
Loading…
Cancel
Save
Reference in new issue