wangxiangwen4
4 weeks ago
13 changed files with 446 additions and 348 deletions
-
117activitylink/package-lock.json
-
2activitylink/package.json
-
12activitylink/src/api/manage/activity.js
-
14activitylink/src/api/manage/gift.js
-
26activitylink/src/api/manage/level.js
-
8activitylink/src/api/manage/win.js
-
2activitylink/src/main.js
-
50activitylink/src/stone/activityStone.js
-
10activitylink/src/views/zhongchou/activity/index.vue
-
21activitylink/src/views/zhongchou/activity/set/index.vue
-
521activitylink/src/views/zhongchou/level/index.vue
-
2activitylink/src/views/zhongchou/winning/index.vue
-
9activitylink/vite.config.js
@ -1,9 +1,17 @@ |
|||
import request from '@/utils/request' |
|||
|
|||
export function deleteUser(id) { |
|||
// export function deleteUser(id) {
|
|||
// return request({
|
|||
// url: '/admin/prize/update',
|
|||
// method: 'post',
|
|||
// params: { id }
|
|||
// })
|
|||
// }
|
|||
|
|||
export function getGiftList(pageNum,pageSize) { |
|||
return request({ |
|||
url: '/admin/prize/update', |
|||
url: '/admin/prize/list', |
|||
method: 'post', |
|||
params: { id } |
|||
params: { pageNum,pageSize } |
|||
}) |
|||
} |
|||
@ -1,10 +1,30 @@ |
|||
|
|||
import request from '@/utils/request' |
|||
|
|||
export function deleteUser() { |
|||
export function deleteLevel() { |
|||
return request({ |
|||
url: '/admin/funding/getActivity', |
|||
method: 'get', |
|||
url: '/admin/grade/delete', |
|||
method: 'post', |
|||
|
|||
}) |
|||
} |
|||
|
|||
|
|||
export function getLevelList(pageNum,pageSize){ |
|||
return request({ |
|||
url: '/admin/grade/list', |
|||
method: 'post', |
|||
params: { |
|||
pageNum, |
|||
pageSize |
|||
} |
|||
}) |
|||
} |
|||
|
|||
export function addLevel(data) { |
|||
return request({ |
|||
url: '/admin/grade/add', |
|||
method: 'post', |
|||
data |
|||
}) |
|||
} |
|||
@ -1,21 +1,47 @@ |
|||
// src/stone/giftFixedListStone.js
|
|||
// src/stone/activityStone.js
|
|||
import { defineStore } from "pinia"; |
|||
import { ref } from 'vue'; |
|||
import localforage from 'localforage'; |
|||
|
|||
// 创建本地存储实例
|
|||
const activityStorage = localforage.createInstance({ |
|||
name: 'activityStore', |
|||
storeName: 'activityData' |
|||
}); |
|||
|
|||
export const useactivitytone = defineStore('activityStone', () => { |
|||
// 响应式属性
|
|||
const selectactivityId = ref(0); |
|||
// 尝试从本地存储恢复初始值，否则使用默认值
|
|||
const selectactivityId = ref(localStorage.getItem('selectactivityId') || 0); |
|||
|
|||
// 方法
|
|||
const setselectedactivityId = (name) => { |
|||
selectactivityId.value = name; |
|||
}; |
|||
// 方法
|
|||
const setselectedactivityId = (id) => { |
|||
selectactivityId.value = id; |
|||
// 同时保存到 localStorage 作为备份
|
|||
localStorage.setItem('selectactivityId', id); |
|||
}; |
|||
|
|||
// 在 store 初始化时从持久化存储恢复数据
|
|||
const initialize = async () => { |
|||
try { |
|||
const storedId = await activityStorage.getItem('selectactivityId'); |
|||
if (storedId !== null) { |
|||
selectactivityId.value = storedId; |
|||
} |
|||
} catch (error) { |
|||
console.warn('从 localforage 恢复数据失败，尝试从 localStorage 恢复'); |
|||
const localStorageId = localStorage.getItem('selectactivityId'); |
|||
if (localStorageId !== null) { |
|||
selectactivityId.value = localStorageId; |
|||
} |
|||
} |
|||
}; |
|||
|
|||
// 立即初始化
|
|||
initialize(); |
|||
|
|||
// 暴露出去
|
|||
return { |
|||
selectactivityId, |
|||
setselectedactivityId, |
|||
}; |
|||
// 暴露出去
|
|||
return { |
|||
selectactivityId, |
|||
setselectedactivityId, |
|||
}; |
|||
}); |
|||
@ -1,337 +1,242 @@ |
|||
<template> |
|||
<el-card style="margin-top: 50px; min-height: 90vh; max-height: 90vh; display: flex; flex-direction: column;"> |
|||
<div class="level-management-container" style="flex: 1; overflow-y: auto;"> |
|||
<h2>等级管理</h2> |
|||
<!-- 添加等级按钮 --> |
|||
<div class="action-buttons"> |
|||
<el-button type="primary" @click="showAddDialog">添加等级</el-button> |
|||
</div> |
|||
|
|||
<!-- 等级表格 --> |
|||
<div class="table-container"> |
|||
<el-table :data="currentPageData" style="width: 100%" :row-style="{ height: '55px' }"> |
|||
<el-table-column type="index" label="ID" width="150" align="center" /> |
|||
<el-table-column prop="gradeName" label="等级名称" width="200" align="center" /> |
|||
<el-table-column prop="num" label="数量" width="250" align="center" /> |
|||
<el-table-column prop="numPeople" label="每轮抽取人数" width="300" align="center" /> |
|||
<el-table-column prop="sort" label="排序" width="200" align="center" /> |
|||
<el-table-column fixed="right" label="操作" align="center"> |
|||
<template #default="scope"> |
|||
<div style="display: flex; gap: 10px; justify-content: center;"> |
|||
<el-button size="default" @click="editLevel(scope.row)">编辑</el-button> |
|||
<el-button size="default" @click=setmor>设置多个</el-button> |
|||
<el-button size="default" type="danger" @click="deleteLevel(scope.row)">删除</el-button> |
|||
</div> |
|||
</template> |
|||
</el-table-column> |
|||
</el-table> |
|||
</div> |
|||
<el-card style="margin-top: 50px; min-height: 90vh; max-height: 90vh; display: flex; flex-direction: column;"> |
|||
<div class="level-management-container" style="flex: 1; overflow-y: auto;"> |
|||
<h2>等级管理</h2> |
|||
<!-- 添加等级按钮 --> |
|||
<div class="action-buttons"> |
|||
<el-button type="primary" @click="showAddDialog">添加等级</el-button> |
|||
</div> |
|||
|
|||
<!-- 分页 --> |
|||
<el-pagination |
|||
class="pagination" |
|||
v-model:current-page="pagination.pageNum" |
|||
v-model:page-size="pagination.pageSize" |
|||
layout="total, sizes, prev, pager, next, jumper" |
|||
:total="tableData.length" |
|||
:page-sizes="[10, 20, 50, 100]" |
|||
@size-change="handleSizeChange" |
|||
@current-change="handleCurrentChange" |
|||
/> |
|||
|
|||
<!-- 添加/编辑等级对话框 --> |
|||
<el-dialog v-model="dialogVisible" :title="dialogTitle" width=400px @closed="resetForm"> |
|||
<el-form :model="form" label-width="120px"> |
|||
<el-form-item label="等级名称" align="center"> |
|||
<el-input v-model="form.gradeName" placeholder="请输入等级名称"></el-input> |
|||
</el-form-item> |
|||
<el-form-item label="数量" align="center"> |
|||
<el-input-number v-model="form.num" :precision="0" :min="0" placeholder="请输入数量" style="width: 100%;"></el-input-number> |
|||
</el-form-item> |
|||
<el-form-item label="每轮抽取人数" align="center"> |
|||
<el-input-number v-model="form.numPeople" :precision="0" :min="0" placeholder="请输入抽取人数" style="width: 100%;"></el-input-number> |
|||
</el-form-item> |
|||
<el-form-item label="排序" align="center"> |
|||
<el-input-number v-model="form.sort" :precision="0" :min="0" placeholder="请输入排序等级" style="width: 100%;"></el-input-number> |
|||
</el-form-item> |
|||
</el-form> |
|||
<template #footer> |
|||
<span class="dialog-footer"> |
|||
<el-button @click="dialogVisible = false">取消</el-button> |
|||
<el-button type="primary" @click="submitForm">确认</el-button> |
|||
</span> |
|||
</template> |
|||
</el-dialog> |
|||
|
|||
<!-- 设置多个对话框 --> |
|||
<!-- 添加/编辑等级对话框 --> |
|||
<el-dialog v-model="setmore" :title="setTitle" width=400px @closed="resetForm"> |
|||
<el-form :model="form" label-width="120px"> |
|||
<el-form-item label="等级名称" align="center"> |
|||
<el-input v-model="form.gradeName" placeholder="请输入等级名称"></el-input> |
|||
</el-form-item> |
|||
<el-form-item label="数量" align="center"> |
|||
<el-input-number v-model="form.num" :precision="0" :min="0" placeholder="请输入数量" style="width: 100%;"></el-input-number> |
|||
</el-form-item> |
|||
<el-form-item label="每轮抽取人数" align="center"> |
|||
<el-input-number v-model="form.numPeople" :precision="0" :min="0" placeholder="请输入抽取人数" style="width: 100%;"></el-input-number> |
|||
</el-form-item> |
|||
<el-form-item label="排序" align="center"> |
|||
<el-input-number v-model="form.sort" :precision="0" :min="0" placeholder="请输入排序等级" style="width: 100%;"></el-input-number> |
|||
</el-form-item> |
|||
</el-form> |
|||
<template #footer> |
|||
<span class="dialog-footer"> |
|||
<el-button @click="setmore = false">取消</el-button> |
|||
<el-button type="primary" @click="submitForm">确认</el-button> |
|||
</span> |
|||
</template> |
|||
</el-dialog> |
|||
</el-card> |
|||
</template> |
|||
|
|||
<script setup> |
|||
import { ref, computed,onMounted } from 'vue' |
|||
import { ElMessage, ElMessageBox } from 'element-plus' |
|||
// import { deleteUser } from '@/api/manage/level' |
|||
import { deleteUser } from '@/api/manage/level' |
|||
// import axios from 'axios'; |
|||
// 数据定义 |
|||
const tableData = ref([ |
|||
{ |
|||
id: 1, |
|||
gradeName: '等级一', |
|||
num: 100, |
|||
numPeople: 10, |
|||
sort: 1 |
|||
}, |
|||
{ |
|||
id: 2, |
|||
gradeName: '等级二', |
|||
num: 200, |
|||
numPeople: 20, |
|||
sort: 2 |
|||
}, |
|||
{ |
|||
id: 2, |
|||
gradeName: '等级二', |
|||
num: 200, |
|||
numPeople: 20, |
|||
sort: 2 |
|||
}, |
|||
{ |
|||
id: 2, |
|||
gradeName: '等级二', |
|||
num: 200, |
|||
numPeople: 20, |
|||
sort: 2 |
|||
}, |
|||
{ |
|||
id: 2, |
|||
gradeName: '等级二', |
|||
num: 200, |
|||
numPeople: 20, |
|||
sort: 2 |
|||
}, |
|||
{ |
|||
id: 2, |
|||
gradeName: '等级二', |
|||
num: 200, |
|||
numPeople: 20, |
|||
sort: 2 |
|||
}, |
|||
{ |
|||
id: 2, |
|||
gradeName: '等级二', |
|||
num: 200, |
|||
numPeople: 20, |
|||
sort: 2 |
|||
}, |
|||
{ |
|||
id: 2, |
|||
gradeName: '等级二', |
|||
num: 200, |
|||
numPeople: 20, |
|||
sort: 2 |
|||
}, |
|||
{ |
|||
id: 2, |
|||
gradeName: '等级二', |
|||
num: 200, |
|||
numPeople: 20, |
|||
sort: 2 |
|||
}, |
|||
{ |
|||
id: 2, |
|||
gradeName: '等级二', |
|||
num: 200, |
|||
numPeople: 20, |
|||
sort: 2 |
|||
}, |
|||
{ |
|||
id: 2, |
|||
gradeName: '等级二', |
|||
num: 200, |
|||
numPeople: 20, |
|||
sort: 2 |
|||
}, |
|||
{ |
|||
id: 2, |
|||
gradeName: '等级二', |
|||
num: 200, |
|||
numPeople: 20, |
|||
sort: 2 |
|||
} |
|||
]) |
|||
<!-- 等级表格 --> |
|||
<div class="table-container"> |
|||
<el-table :data="tableData" style="width: 100%" :row-style="{ height: '55px' }"> |
|||
<el-table-column type="index" label="ID" width="150" align="center"> |
|||
<template #default="scope"> |
|||
{{ (pagination.pageNum - 1) * pagination.pageSize + scope.$index + 1 }} |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column prop="gradeName" label="等级名称" width="200" align="center" /> |
|||
<el-table-column prop="amount" label="数量" width="250" align="center" /> |
|||
<el-table-column prop="perWin" label="每轮抽取人数" width="300" align="center" /> |
|||
<el-table-column prop="sort" label="排序" width="200" align="center" /> |
|||
<el-table-column fixed="right" label="操作" align="center"> |
|||
<template #default="scope"> |
|||
<div style="display: flex; gap: 10px; justify-content: center;"> |
|||
<el-button size="default" @click="editLevel(scope.row)">编辑</el-button> |
|||
<!-- <el-button size="default" @click="setmor">设置多个</el-button> --> |
|||
<el-button size="default" type="danger" @click="deleteLevel(scope.row)">删除</el-button> |
|||
</div> |
|||
</template> |
|||
</el-table-column> |
|||
</el-table> |
|||
</div> |
|||
</div> |
|||
|
|||
const setmore=ref(false) |
|||
|
|||
// 分页 |
|||
const pagination = ref({ |
|||
pageNum: 1, |
|||
pageSize: 10 |
|||
}) |
|||
|
|||
const currentPageData = computed(() => { |
|||
const start = (pagination.value.pageNum - 1) * pagination.value.pageSize |
|||
const end = start + pagination.value.pageSize |
|||
return tableData.value.slice(start, end) |
|||
}) |
|||
|
|||
const handleSizeChange = (val) => { |
|||
pagination.value.pageSize = val |
|||
pagination.value.pageNum = 1 |
|||
} |
|||
|
|||
onMounted(() => { |
|||
// 获取数据 |
|||
<!-- 分页 --> |
|||
<el-pagination |
|||
class="pagination" |
|||
v-model:current-page="pagination.pageNum" |
|||
v-model:page-size="pagination.pageSize" |
|||
layout="total, sizes, prev, pager, next, jumper" |
|||
:total="total" |
|||
:page-sizes="[10, 20, 50, 100]" |
|||
@size-change="handleSizeChange" |
|||
@current-change="handleCurrentChange" |
|||
/> |
|||
|
|||
<!-- 添加/编辑等级对话框 --> |
|||
<el-dialog v-model="dialogVisible" :title="dialogTitle" width="400px" @closed="resetForm"> |
|||
<el-form :model="form" label-width="120px"> |
|||
<el-form-item label="等级名称" align="center"> |
|||
<el-input v-model="form.gradeName" placeholder="请输入等级名称"></el-input> |
|||
</el-form-item> |
|||
<el-form-item label="数量" align="center"> |
|||
<el-input-number v-model="form.amount" :precision="0" :min="0" placeholder="请输入数量" style="width: 100%;"></el-input-number> |
|||
</el-form-item> |
|||
<el-form-item label="每轮抽取人数" align="center"> |
|||
<el-input-number v-model="form.perWin" :precision="0" :min="0" placeholder="请输入抽取人数" style="width: 100%;"></el-input-number> |
|||
</el-form-item> |
|||
<el-form-item label="排序" align="center"> |
|||
<el-input-number v-model="form.sort" :precision="0" :min="0" placeholder="请输入排序等级" style="width: 100%;"></el-input-number> |
|||
</el-form-item> |
|||
</el-form> |
|||
<template #footer> |
|||
<span class="dialog-footer"> |
|||
<el-button @click="dialogVisible = false">取消</el-button> |
|||
<el-button type="primary" @click="submitForm">确认</el-button> |
|||
</span> |
|||
</template> |
|||
</el-dialog> |
|||
|
|||
</el-card> |
|||
</template> |
|||
|
|||
deleteUser().then(response => { |
|||
console.log('删除成功:', response) |
|||
}).catch(error => { |
|||
console.error('删除失败:', error) |
|||
}) |
|||
}) |
|||
<script setup> |
|||
import { ref } from 'vue' |
|||
import { ElMessage, ElMessageBox } from 'element-plus' |
|||
import { getLevelList } from '@/api/manage/level' |
|||
|
|||
// 表格数据 |
|||
const tableData = ref([]) |
|||
|
|||
const handleCurrentChange = (val) => { |
|||
pagination.value.pageNum = val |
|||
} |
|||
|
|||
// 对话框相关 |
|||
const setTitle = ref('设置多个') |
|||
const setmor=()=>{ |
|||
setmore.value=true |
|||
// 分页数据 |
|||
const pagination = ref({ |
|||
pageNum: 1, |
|||
pageSize: 10 |
|||
}) |
|||
|
|||
// 总条数 |
|||
const total = ref(0) |
|||
|
|||
// 获取等级列表 |
|||
const fetchLevelList = async () => { |
|||
try { |
|||
const response = await getLevelList( |
|||
pagination.value.pageNum, |
|||
pagination.value.pageSize |
|||
) |
|||
|
|||
if (response.code === 200) { |
|||
tableData.value = response.data.list |
|||
total.value = response.data.total |
|||
} else { |
|||
ElMessage.error(response.message || '获取等级列表失败') |
|||
} |
|||
} catch (error) { |
|||
console.error('获取等级列表失败:', error) |
|||
ElMessage.error('请求失败，请重试') |
|||
} |
|||
} |
|||
|
|||
// 分页事件处理 |
|||
const handleSizeChange = (val) => { |
|||
pagination.value.pageSize = val |
|||
pagination.value.pageNum = 1 |
|||
fetchLevelList() |
|||
} |
|||
|
|||
const handleCurrentChange = (val) => { |
|||
pagination.value.pageNum = val |
|||
fetchLevelList() |
|||
} |
|||
|
|||
// 对话框相关 |
|||
const setmore = ref(false) |
|||
|
|||
const dialogVisible = ref(false) |
|||
const dialogTitle = ref('添加等级') |
|||
const form = ref({ |
|||
const setmor = () => { |
|||
setmore.value = true |
|||
} |
|||
|
|||
const dialogVisible = ref(false) |
|||
const dialogTitle = ref('添加等级') |
|||
const form = ref({ |
|||
id: null, |
|||
gradeName: '', |
|||
amount: null, |
|||
perWin: null, |
|||
sort: null |
|||
}) |
|||
|
|||
// 显示添加对话框 |
|||
const showAddDialog = () => { |
|||
dialogTitle.value = '添加等级' |
|||
form.value = { |
|||
id: null, |
|||
gradeName: '', |
|||
num: null, |
|||
numPeople: null, |
|||
amount: null, |
|||
perWin: null, |
|||
sort: null |
|||
}) |
|||
|
|||
// 显示添加对话框 |
|||
const showAddDialog = () => { |
|||
dialogTitle.value = '添加等级' |
|||
form.value = { |
|||
id: null, |
|||
gradeName: '', |
|||
num: null, |
|||
numPeople: null, |
|||
sort: null |
|||
} |
|||
dialogVisible.value = true |
|||
} |
|||
|
|||
// 显示编辑对话框 |
|||
const editLevel = (row) => { |
|||
dialogTitle.value = '编辑等级' |
|||
form.value = { ...row } |
|||
dialogVisible.value = true |
|||
dialogVisible.value = true |
|||
} |
|||
|
|||
// 显示编辑对话框 |
|||
const editLevel = (row) => { |
|||
dialogTitle.value = '编辑等级' |
|||
form.value = { ...row } |
|||
dialogVisible.value = true |
|||
} |
|||
|
|||
// 提交表单 |
|||
const submitForm = () => { |
|||
if (!form.value.gradeName || form.value.amount === null || form.value.sort === null) { |
|||
ElMessage.error('请填写完整信息') |
|||
return |
|||
} |
|||
|
|||
// 提交表单 |
|||
const submitForm = () => { |
|||
if (!form.value.gradeName || form.value.num === null || form.value.sort === null) { |
|||
ElMessage.error('请填写完整信息') |
|||
return |
|||
if (form.value.id) { |
|||
// 编辑 |
|||
// 这里应该调用API更新数据 |
|||
const index = tableData.value.findIndex(item => item.id === form.value.id) |
|||
if (index !== -1) { |
|||
tableData.value[index] = { ...form.value } |
|||
} |
|||
|
|||
if (form.value.id) { |
|||
// 编辑 |
|||
const index = tableData.value.findIndex(item => item.id === form.value.id) |
|||
if (index !== -1) { |
|||
tableData.value[index] = { ...form.value } |
|||
} |
|||
} else { |
|||
// 添加 |
|||
const newId = tableData.value.length > 0 ? Math.max(...tableData.value.map(item => item.id)) + 1 : 1 |
|||
tableData.value.push({ |
|||
id: newId, |
|||
...form.value |
|||
}) |
|||
} |
|||
|
|||
dialogVisible.value = false |
|||
ElMessage.success('操作成功') |
|||
} |
|||
|
|||
// 删除等级 |
|||
const deleteLevel = (row) => { |
|||
ElMessageBox.confirm('确定要删除该等级吗?', '提示', { |
|||
confirmButtonText: '确定', |
|||
cancelButtonText: '取消', |
|||
type: 'warning' |
|||
}).then(() => { |
|||
tableData.value = tableData.value.filter(item => item.id !== row.id) |
|||
ElMessage.success('删除成功') |
|||
}).catch(() => { |
|||
ElMessage.info('已取消删除') |
|||
} else { |
|||
// 添加 |
|||
// 这里应该调用API添加数据 |
|||
const newId = tableData.value.length > 0 ? Math.max(...tableData.value.map(item => item.id)) + 1 : 1 |
|||
tableData.value.push({ |
|||
id: newId, |
|||
...form.value |
|||
}) |
|||
} |
|||
|
|||
// 清空表单（关闭对话框时调用） |
|||
const resetForm = () => { |
|||
form.value = { |
|||
id: null, |
|||
gradeName: '', |
|||
num: null, |
|||
numPeople: null, |
|||
sort: null |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style scoped> |
|||
.level-management-container { |
|||
padding: 20px; |
|||
width: 100%; |
|||
box-sizing: border-box; |
|||
min-height: 80vh; |
|||
dialogVisible.value = false |
|||
ElMessage.success('操作成功') |
|||
} |
|||
|
|||
// 删除等级 |
|||
const deleteLevel = (row) => { |
|||
// 这里应该调用API删除数据 |
|||
ElMessageBox.confirm('确定要删除该等级吗?', '提示', { |
|||
confirmButtonText: '确定', |
|||
cancelButtonText: '取消', |
|||
type: 'warning' |
|||
}).then(() => { |
|||
tableData.value = tableData.value.filter(item => item.id !== row.id) |
|||
ElMessage.success('删除成功') |
|||
}).catch(() => { |
|||
ElMessage.info('已取消删除') |
|||
}) |
|||
} |
|||
|
|||
// 清空表单（关闭对话框时调用） |
|||
const resetForm = () => { |
|||
form.value = { |
|||
id: null, |
|||
gradeName: '', |
|||
amount: null, |
|||
perWin: null, |
|||
sort: null |
|||
} |
|||
|
|||
.pagination { |
|||
} |
|||
|
|||
// 组件挂载时获取数据 |
|||
fetchLevelList() |
|||
</script> |
|||
|
|||
<style scoped> |
|||
.level-management-container { |
|||
padding: 20px; |
|||
width: 100%; |
|||
box-sizing: border-box; |
|||
min-height: 80vh; |
|||
} |
|||
|
|||
.pagination { |
|||
padding: 10px 20px; |
|||
background-color: #fff; |
|||
border-top: 1px solid #ebeef5; |
|||
display: flex; |
|||
justify-content: flex-start; /* 改为左对齐 */ |
|||
} |
|||
|
|||
.action-buttons { |
|||
margin-bottom: 20px; |
|||
} |
|||
|
|||
.table-container { |
|||
max-height: 600px; |
|||
overflow-y: auto; |
|||
} |
|||
</style> |
|||
|
|||
.action-buttons { |
|||
margin-bottom: 20px; |
|||
} |
|||
|
|||
.table-container { |
|||
max-height: 600px; |
|||
overflow-y: auto; |
|||
} |
|||
</style> |
|||
Write
Preview
Loading…
Cancel
Save
Reference in new issue