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