22 changed files with 2277 additions and 11 deletions
|
Before Width: | Height: | Size: 2.4 KiB After Width: | Height: | Size: 364 KiB |
|
After Width: | Height: | Size: 2.4 KiB |
@ -0,0 +1,70 @@
|
||||
import request from '/@/utils/request'; |
||||
|
||||
/** |
||||
* 登录api接口集合 |
||||
* @method signIn 用户登录 |
||||
*/ |
||||
export function gameRoleList(params: object){ |
||||
return request({ |
||||
url: '/api/v1/game/basicinfo/rolelist', |
||||
method: 'get', |
||||
params: params, |
||||
}); |
||||
} |
||||
|
||||
export function gameMailList(params: object){ |
||||
return request({ |
||||
url: '/api/v1/game/mail/list', |
||||
method: 'get', |
||||
params: params, |
||||
}); |
||||
} |
||||
|
||||
export function gameMailSend(params: object){ |
||||
return request({ |
||||
url: '/api/v1/game/mail/send', |
||||
method: 'post', |
||||
params: params, |
||||
}); |
||||
} |
||||
|
||||
export function gameOrderList(params: object){ |
||||
return request({ |
||||
url: '/api/v1/game/order/list', |
||||
method: 'get', |
||||
params: params, |
||||
}); |
||||
} |
||||
|
||||
export function gameOnlineList(params: object){ |
||||
return request({ |
||||
url: '/api/v1/game/basicinfo/online', |
||||
method: 'get', |
||||
params: params, |
||||
}); |
||||
} |
||||
|
||||
export function gameAccountList(params: object){ |
||||
return request({ |
||||
url: '/api/v1/game/basicinfo/account', |
||||
method: 'get', |
||||
params: params, |
||||
}); |
||||
} |
||||
|
||||
export function gameAddCoin(params: object){ |
||||
return request({ |
||||
url: '/api/v1/game/order/addcoin', |
||||
method: 'post', |
||||
params: params, |
||||
}); |
||||
} |
||||
|
||||
export function gameDeposit(params: object){ |
||||
return request({ |
||||
url: '/api/v1/game/order/deposit', |
||||
method: 'post', |
||||
params: params, |
||||
}); |
||||
} |
||||
|
||||
|
After Width: | Height: | Size: 364 KiB |
|
Before Width: | Height: | Size: 8.0 KiB After Width: | Height: | Size: 8.0 KiB |
@ -0,0 +1,122 @@
|
||||
|
||||
export const ServerList = [ |
||||
{ |
||||
value: '1', |
||||
label: '一区：桃花源记', |
||||
}, |
||||
{ |
||||
value: '2', |
||||
label: '二区：世外桃源', |
||||
}, |
||||
{ |
||||
value: '3', |
||||
label: '三区：陶渊明', |
||||
}, |
||||
{ |
||||
value: '4', |
||||
label: '四区：桃花谷', |
||||
}, |
||||
{ |
||||
value: '5', |
||||
label: '五区：归园田居', |
||||
}, |
||||
{ |
||||
value: '6', |
||||
label: '六区：渔舟唱晚', |
||||
}, |
||||
{ |
||||
value: '7', |
||||
label: '七区：乱世佳谷', |
||||
}, |
||||
{ |
||||
value: '8', |
||||
label: '八区：一曲山溪', |
||||
}, |
||||
{ |
||||
value: '9', |
||||
label: '九区：百里桃园', |
||||
}, |
||||
{ |
||||
value: '10', |
||||
label: '十区：避乱之地', |
||||
}, |
||||
{ |
||||
value: '11', |
||||
label: '十一区：桃花源记', |
||||
}, |
||||
{ |
||||
value: '12', |
||||
label: '十二区：先遣服', |
||||
}, |
||||
{ |
||||
value: '13', |
||||
label: '十三区：武陵人', |
||||
}, |
||||
{ |
||||
value: '14', |
||||
label: '十四区：桃谷沃野', |
||||
}, |
||||
{ |
||||
value: '15', |
||||
label: '十五区：桃源春色', |
||||
}, |
||||
{ |
||||
value: '16', |
||||
label: '十六区：桃源先遣服', |
||||
}, |
||||
] |
||||
|
||||
export const ChannelList=[ |
||||
{ |
||||
value: '26337', |
||||
label: '淘金互动', |
||||
}, |
||||
{ |
||||
value: '2258', |
||||
label: '好游快爆', |
||||
}, |
||||
{ |
||||
value: '24', |
||||
label: '华为', |
||||
}, |
||||
{ |
||||
value: '23', |
||||
label: 'oppo', |
||||
}, |
||||
{ |
||||
value: '15', |
||||
label: '小米', |
||||
}, |
||||
{ |
||||
value: '17', |
||||
label: 'VIVO', |
||||
}, |
||||
{ |
||||
value: '27', |
||||
label: '4399盒子', |
||||
}, |
||||
{ |
||||
value: '9', |
||||
label: '九游', |
||||
}, |
||||
{ |
||||
value: '114', |
||||
label: 'B站', |
||||
}, |
||||
{ |
||||
value: '1319', |
||||
label: '233平台', |
||||
}, |
||||
{ |
||||
value: '1003', |
||||
label: '雷电模拟器', |
||||
}, |
||||
{ |
||||
value: '26404', |
||||
label: '淘金互动-先行服', |
||||
}, |
||||
{ |
||||
value: '26396', |
||||
label: 'B站先遣服', |
||||
}, |
||||
] |
||||
@ -0,0 +1,264 @@
|
||||
<template> |
||||
<div class="system-edit-role-container"> |
||||
<el-dialog :title="(formData.id===0?'添加':'修改')+'角色'" v-model="isShowDialog" width="769px"> |
||||
<el-form ref="formRef" :model="formData" :rules="rules" size="default" label-width="90px"> |
||||
<el-row :gutter="35"> |
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> |
||||
<el-form-item label="角色名称" prop="name"> |
||||
<el-input v-model="formData.name" placeholder="请输入角色名称" clearable></el-input> |
||||
</el-form-item> |
||||
</el-col> |
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> |
||||
<el-form-item label="排序"> |
||||
<el-input-number v-model="formData.listOrder" :min="0" controls-position="right" placeholder="请输入排序" class="w100" /> |
||||
</el-form-item> |
||||
</el-col> |
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> |
||||
<el-form-item label="角色状态"> |
||||
<el-switch v-model="formData.status" :active-value="1" :inactive-value="0" inline-prompt active-text="启" inactive-text="禁"></el-switch> |
||||
</el-form-item> |
||||
</el-col> |
||||
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
||||
<el-form-item label="角色描述"> |
||||
<el-input v-model="formData.remark" type="textarea" placeholder="请输入角色描述" maxlength="150"></el-input> |
||||
</el-form-item> |
||||
</el-col> |
||||
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
||||
<el-form-item label="菜单权限"> |
||||
<el-row :gutter="35"> |
||||
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24"> |
||||
<el-checkbox v-model="menuExpand" @change="handleCheckedTreeExpand($event)">展开/折叠</el-checkbox> |
||||
<el-checkbox v-model="menuNodeAll" @change="handleCheckedTreeNodeAll($event)">全选/全不选</el-checkbox> |
||||
<el-checkbox v-model="menuCheckStrictly" @change="handleCheckedTreeConnect($event)">父子联动</el-checkbox> |
||||
</el-col> |
||||
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
||||
<el-tree |
||||
:data="menuData" |
||||
ref="menuRef" |
||||
:props="menuProps" |
||||
:default-checked-keys="formData.menuIds" |
||||
node-key="id" |
||||
show-checkbox class="menu-data-tree tree-border" |
||||
:check-strictly="!menuCheckStrictly"/> |
||||
</el-col> |
||||
</el-row> |
||||
</el-form-item> |
||||
</el-col> |
||||
</el-row> |
||||
</el-form> |
||||
<template #footer> |
||||
<span class="dialog-footer"> |
||||
<el-button @click="onCancel" size="default">取 消</el-button> |
||||
<el-button type="primary" @click="onSubmit" size="default" :loading="loading">{{formData.id===0?'新 增':'修 改'}}</el-button> |
||||
</span> |
||||
</template> |
||||
</el-dialog> |
||||
</div> |
||||
</template> |
||||
|
||||
<script lang="ts"> |
||||
import { reactive, toRefs, defineComponent,ref,getCurrentInstance,unref } from 'vue'; |
||||
import {addRole, editRole, getRole, getRoleParams} from "/@/api/system/role"; |
||||
import {ElMessage} from "element-plus"; |
||||
import {getBackEndControlRoutes} from "/@/router/backEnd"; |
||||
|
||||
|
||||
// 定义接口来定义对象的类型 |
||||
interface MenuDataTree { |
||||
id: number; |
||||
pid:number; |
||||
title: string; |
||||
children?: MenuDataTree[]; |
||||
} |
||||
interface DialogRow { |
||||
id:number; |
||||
name: string; |
||||
status: number; |
||||
listOrder: number; |
||||
remark: string; |
||||
menuIds:Array<number> |
||||
} |
||||
interface RoleState { |
||||
loading:boolean; |
||||
isShowDialog: boolean; |
||||
formData: DialogRow; |
||||
menuData: Array<MenuDataTree>; |
||||
menuExpand:boolean; |
||||
menuNodeAll:boolean; |
||||
menuCheckStrictly:boolean; |
||||
menuProps: { |
||||
children: string; |
||||
label: string; |
||||
}; |
||||
rules: object; |
||||
} |
||||
|
||||
export default defineComponent({ |
||||
name: 'systemEditRole', |
||||
setup(props,{emit}) { |
||||
const {proxy} = getCurrentInstance() as any; |
||||
const formRef = ref<HTMLElement | null>(null); |
||||
const menuRef = ref(); |
||||
const state = reactive<RoleState>({ |
||||
loading:false, |
||||
isShowDialog: false, |
||||
formData: { |
||||
id:0, |
||||
name: '', |
||||
status: 1, |
||||
listOrder: 0, |
||||
remark: '', |
||||
menuIds:[] |
||||
}, |
||||
// 表单校验 |
||||
rules: { |
||||
name:[ |
||||
{required: true, message: "角色名称不能为空", trigger: "blur"}, |
||||
] |
||||
}, |
||||
menuData: [], |
||||
menuExpand:false, |
||||
menuNodeAll:false, |
||||
menuCheckStrictly:false, |
||||
menuProps: { |
||||
children: 'children', |
||||
label: 'title', |
||||
}, |
||||
}); |
||||
// 打开弹窗 |
||||
const openDialog = (row?: DialogRow) => { |
||||
resetForm(); |
||||
getMenuData(); |
||||
if(row) { |
||||
getRole(row.id).then((res:any)=>{ |
||||
if(res.data.role){ |
||||
state.formData = res.data.role; |
||||
state.formData.menuIds = res.data.menuIds??[] |
||||
} |
||||
}) |
||||
} |
||||
state.isShowDialog = true; |
||||
}; |
||||
// 关闭弹窗 |
||||
const closeDialog = () => { |
||||
state.isShowDialog = false; |
||||
}; |
||||
// 取消 |
||||
const onCancel = () => { |
||||
closeDialog(); |
||||
}; |
||||
// 新增 |
||||
const onSubmit = () => { |
||||
const formWrap = unref(formRef) as any; |
||||
if (!formWrap) return; |
||||
formWrap.validate((valid: boolean) => { |
||||
if (valid) { |
||||
state.loading = true; |
||||
state.formData.menuIds = getMenuAllCheckedKeys(); |
||||
if(state.formData.id===0){ |
||||
//添加 |
||||
addRole(state.formData).then(()=>{ |
||||
ElMessage.success('角色添加成功'); |
||||
closeDialog(); // 关闭弹窗 |
||||
resetMenuSession() |
||||
emit('getRoleList') |
||||
}).finally(()=>{ |
||||
state.loading = false; |
||||
}) |
||||
}else{ |
||||
//修改 |
||||
editRole(state.formData).then(()=>{ |
||||
ElMessage.success('角色修改成功'); |
||||
closeDialog(); // 关闭弹窗 |
||||
resetMenuSession() |
||||
emit('getRoleList') |
||||
}).finally(()=>{ |
||||
state.loading = false; |
||||
}) |
||||
} |
||||
} |
||||
}); |
||||
}; |
||||
// 获取菜单结构数据 |
||||
const getMenuData = () => { |
||||
getRoleParams().then((res:any)=>{ |
||||
state.menuData = proxy.handleTree(res.data.menu, "id","pid"); |
||||
}) |
||||
}; |
||||
const resetForm = ()=>{ |
||||
state.menuCheckStrictly=false; |
||||
state.menuExpand = false; |
||||
state.menuNodeAll = false; |
||||
state.formData = { |
||||
id:0, |
||||
name: '', |
||||
status: 1, |
||||
listOrder: 0, |
||||
remark: '', |
||||
menuIds:[] |
||||
} |
||||
}; |
||||
/** 树权限（展开/折叠）*/ |
||||
const handleCheckedTreeExpand = (value:any) => { |
||||
let treeList = state.menuData; |
||||
for (let i = 0; i < treeList.length; i++) { |
||||
menuRef.value.store.nodesMap[treeList[i].id].expanded = value; |
||||
} |
||||
} |
||||
|
||||
/** 树权限（全选/全不选） */ |
||||
const handleCheckedTreeNodeAll = (value:any) => { |
||||
menuRef.value.setCheckedNodes(value ? state.menuData : []); |
||||
} |
||||
|
||||
/** 树权限（父子联动） */ |
||||
const handleCheckedTreeConnect = (value:any) => { |
||||
state.menuCheckStrictly = value ? true : false; |
||||
} |
||||
|
||||
/** 所有菜单节点数据 */ |
||||
function getMenuAllCheckedKeys() { |
||||
// 目前被选中的菜单节点 |
||||
let checkedKeys = menuRef.value.getCheckedKeys(); |
||||
// 半选中的菜单节点 |
||||
let halfCheckedKeys = menuRef.value.getHalfCheckedKeys(); |
||||
checkedKeys.unshift.apply(checkedKeys, halfCheckedKeys); |
||||
return checkedKeys; |
||||
} |
||||
|
||||
// 重置菜单session |
||||
const resetMenuSession = () => { |
||||
getBackEndControlRoutes(); |
||||
}; |
||||
return { |
||||
openDialog, |
||||
closeDialog, |
||||
onCancel, |
||||
onSubmit, |
||||
menuRef, |
||||
formRef, |
||||
handleCheckedTreeExpand, |
||||
handleCheckedTreeNodeAll, |
||||
handleCheckedTreeConnect, |
||||
resetMenuSession, |
||||
...toRefs(state), |
||||
}; |
||||
}, |
||||
}); |
||||
</script> |
||||
|
||||
<style scoped lang="scss"> |
||||
.tree-border { |
||||
margin-top: 5px; |
||||
border: 1px solid #e5e6e7!important; |
||||
background: #fff none!important; |
||||
border-radius: 4px; |
||||
} |
||||
.system-edit-role-container { |
||||
.menu-data-tree { |
||||
border: var(--el-input-border, var(--el-border-base)); |
||||
border-radius: var(--el-input-border-radius, var(--el-border-radius-base)); |
||||
padding: 5px; |
||||
} |
||||
} |
||||
</style> |
||||
@ -0,0 +1,198 @@
|
||||
<template> |
||||
<div class="system-role-container"> |
||||
<el-card shadow="hover"> |
||||
<div class="system-user-search mb15"> |
||||
<el-form :inline="true"> |
||||
<el-form-item label="玩家uid"> |
||||
<el-input size="default" v-model="tableData.param.uid" placeholder="请输入玩家uid" class="w-50 m-2" clearable/> |
||||
</el-form-item> |
||||
<el-form-item label="区服"> |
||||
<el-input size="default" v-model="tableData.param.serverId" placeholder="请输入区服" class="w-50 m-2" clearable/> |
||||
</el-form-item> |
||||
|
||||
<el-form-item> |
||||
<el-button size="default" type="primary" class="ml10" @click="mailList"> |
||||
<el-icon> |
||||
<ele-Search /> |
||||
</el-icon> |
||||
查询 |
||||
</el-button> |
||||
|
||||
</el-form-item> |
||||
</el-form> |
||||
</div> |
||||
<el-table :data="tableData.data" style="width: 100%"> |
||||
<el-table-column type="index" label="序号" width="60" /> |
||||
<!-- <el-table-column prop="id" label="邮件ID" show-overflow-tooltip></el-table-column>--> |
||||
<el-table-column prop="c_date" label="创建时间" width="180"></el-table-column> |
||||
<el-table-column prop="to" label="发送对象" show-overflow-tooltip></el-table-column> |
||||
<el-table-column prop="gmName" label="发送者" show-overflow-tooltip></el-table-column> |
||||
<el-table-column prop="type" label="邮件类型" show-overflow-tooltip></el-table-column> |
||||
<el-table-column prop="expired" label="过期时间" show-overflow-tooltip></el-table-column> |
||||
<el-table-column prop="time" label="生效时间" show-overflow-tooltip></el-table-column> |
||||
<el-table-column prop="newGet" label="新玩家是否可领" show-overflow-tooltip></el-table-column> |
||||
<el-table-column prop="repeatedCollection" label="是否可以重复领" show-overflow-tooltip></el-table-column> |
||||
<el-table-column prop="title" label="标题" show-overflow-tooltip></el-table-column> |
||||
<el-table-column prop="content" label="内容" show-overflow-tooltip></el-table-column> |
||||
<el-table-column prop="drops" label="赠送物品" ></el-table-column> |
||||
<el-table-column prop="remark" label="发送理由" ></el-table-column> |
||||
|
||||
<!-- <el-table-column label="操作" width="100">--> |
||||
<!-- <template #default="scope">--> |
||||
<!-- <el-button size="small" type="text" @click="onOpenEditRole(scope.row)">修改</el-button>--> |
||||
<!-- <el-button size="small" type="text" @click="onRowDel(scope.row)">删除</el-button>--> |
||||
<!-- </template>--> |
||||
<!-- </el-table-column>--> |
||||
</el-table> |
||||
<pagination |
||||
v-show="tableData.total>0" |
||||
:total="tableData.total" |
||||
v-model:page="tableData.param.pageNum" |
||||
v-model:limit="tableData.param.pageSize" |
||||
@pagination="mailList" |
||||
/> |
||||
</el-card> |
||||
<EditRole ref="editRoleRef" @getMailList="mailList"/> |
||||
</div> |
||||
</template> |
||||
|
||||
<script lang="ts"> |
||||
import {toRefs, reactive, onMounted, defineComponent,} from 'vue'; |
||||
//import { ElMessageBox, ElMessage } from 'element-plus'; |
||||
import EditRole from '/@/views/system/role/component/editRole.vue'; |
||||
import { gameMailList} from "/@/api/game/index"; |
||||
// 定义接口来定义对象的类型 |
||||
interface TableData { |
||||
id:string; |
||||
c_date: string; |
||||
to: string; |
||||
from: string; |
||||
gmName: string; |
||||
type:string |
||||
expired:string |
||||
time:string |
||||
newGet:string |
||||
repeatedCollection:string |
||||
title:string |
||||
content:string |
||||
drops:string |
||||
remark:string |
||||
|
||||
} |
||||
interface TableDataState { |
||||
tableData: { |
||||
data: Array<TableData>; |
||||
total: number; |
||||
loading: boolean; |
||||
param: { |
||||
uid:string; |
||||
serverId:string |
||||
lowTime:number; |
||||
UpperTime: number; |
||||
}; |
||||
}; |
||||
} |
||||
|
||||
export default defineComponent({ |
||||
name: 'apiV1SystemRoleList', |
||||
components: {EditRole}, |
||||
setup() { |
||||
// const {proxy} = getCurrentInstance() as any; |
||||
|
||||
const state = reactive<TableDataState>({ |
||||
tableData: { |
||||
data: [], |
||||
total: 0, |
||||
loading: false, |
||||
param: { |
||||
uid:'', |
||||
serverId:"", |
||||
lowTime:0, |
||||
UpperTime: 0, |
||||
}, |
||||
}, |
||||
}); |
||||
// 初始化表格数据 |
||||
// const initTableData = () => { |
||||
// roleList() |
||||
// }; |
||||
function getMailType(t:string){ |
||||
if (t==="1"){ |
||||
return "活动" |
||||
}else if(t==="2"){ |
||||
return "奖励" |
||||
}else if(t==="3"){ |
||||
return "公告" |
||||
} |
||||
return "" |
||||
} |
||||
|
||||
const mailList = ()=>{ |
||||
const data: Array<TableData> = []; |
||||
gameMailList(state.tableData.param).then(res=>{ |
||||
const list = res.data.mails??[] |
||||
list.map((item:TableData)=>{ |
||||
data.push({ |
||||
id:item.id, |
||||
c_date: new Date(item.c_date).toLocaleString(), |
||||
to: item.to, |
||||
from: item.from, |
||||
gmName: item.gmName, |
||||
type:getMailType(item.type), |
||||
expired: new Date(item.expired).toLocaleString() , |
||||
time: new Date(item.time).toLocaleString(), |
||||
newGet: item.newGet, |
||||
repeatedCollection:item.repeatedCollection, |
||||
title: item.title, |
||||
content: item.content, |
||||
drops:item.drops, |
||||
remark: item.remark, |
||||
}); |
||||
}) |
||||
state.tableData.data = data; |
||||
state.tableData.total = res.data.total; |
||||
}) |
||||
}; |
||||
|
||||
// 删除角色 |
||||
// const onRowDel = (row: any) => { |
||||
// ElMessageBox.confirm(`此操作将永久删除角色：“${row.name}”，是否继续?`, '提示', { |
||||
// confirmButtonText: '确认', |
||||
// cancelButtonText: '取消', |
||||
// type: 'warning', |
||||
// }) |
||||
// .then(() => { |
||||
// deleteRole(row.id).then(()=>{ |
||||
// ElMessage.success('删除成功'); |
||||
// proxy.$refs['editRoleRef'].resetMenuSession(); |
||||
// roleList(); |
||||
// }) |
||||
// }) |
||||
// .catch(() => {}); |
||||
// }; |
||||
// // 分页改变 |
||||
// const onHandleSizeChange = (val: number) => { |
||||
// state.tableData.param.pageSize = val; |
||||
// }; |
||||
// // 分页改变 |
||||
// const onHandleCurrentChange = (val: number) => { |
||||
// state.tableData.param.pageNum = val; |
||||
// }; |
||||
// 页面加载时 |
||||
onMounted(() => { |
||||
// initTableData(); |
||||
}); |
||||
return { |
||||
// addRoleRef, |
||||
// editRoleRef, |
||||
// onOpenAddRole, |
||||
// onOpenEditRole, |
||||
//onRowDel, |
||||
//onHandleSizeChange, |
||||
//onHandleCurrentChange, |
||||
mailList, |
||||
...toRefs(state), |
||||
}; |
||||
}, |
||||
}); |
||||
</script> |
||||
@ -0,0 +1,218 @@
|
||||
<template> |
||||
<div class="system-edit-post-container"> |
||||
|
||||
<el-form ref="formRef" :model="mailData" :rules="rules" size="default" label-width="90px"> |
||||
<el-form-item label="邮件类型" prop="type"> |
||||
<el-radio-group v-model="mailData.type"> |
||||
<el-radio :label="1">奖励</el-radio> |
||||
<el-radio :label="2">活动</el-radio> |
||||
<el-radio :label="3">公告</el-radio> |
||||
</el-radio-group> |
||||
</el-form-item> |
||||
<el-form-item label="重复类型" prop="type"> |
||||
<el-radio-group v-model="mailData.repeatedCollection"> |
||||
<el-radio :label="0">重启重新领取</el-radio> |
||||
<el-radio :label="1">只能领取一次</el-radio> |
||||
</el-radio-group> |
||||
</el-form-item> |
||||
<el-form-item label="新账号领取" prop="newGet"> |
||||
<el-radio-group v-model="mailData.newGet"> |
||||
<el-radio :label="0">新账号可领取</el-radio> |
||||
<el-radio :label="1">新账号不能领取</el-radio> |
||||
</el-radio-group> |
||||
</el-form-item> |
||||
<el-form-item label="标题" prop="title" > |
||||
<el-input v-model="mailData.title" placeholder="请输入邮件标题" /> |
||||
</el-form-item> |
||||
<el-form-item label="发件人署名" prop="from"> |
||||
<el-input v-model="mailData.from" placeholder="请输入发件人署名" /> |
||||
</el-form-item> |
||||
<el-form-item label="发送区服" prop="serverId"> |
||||
<el-select v-model="mailData.serverId" class="m-2" placeholder="选择服务器" size="large"> |
||||
<el-option v-for="item in servers" :key="item.value" :label="item.label" :value="item.value" /> |
||||
</el-select> |
||||
</el-form-item> |
||||
<el-form-item label="收件人UID" prop="to"> |
||||
<el-input v-model="mailData.to" placeholder="请输入发件人UID,全服填0,多人格式uid;uid" /> |
||||
</el-form-item> |
||||
<el-form-item label="内容" prop="content"> |
||||
<el-input v-model="mailData.content" type="textarea" /> |
||||
</el-form-item> |
||||
<el-form-item label="奖励(不能用中文标点）" prop="content"> |
||||
<el-input v-model="mailData.drops" type="textarea" placeholder="格式: id:num,id:num"/> |
||||
</el-form-item> |
||||
|
||||
<el-form-item label="过期时间" prop="expired"> |
||||
<el-date-picker type="datetime" size="large" v-model="mailData.expired" placeholder="默认10天后过期删除" format="YYYY/MM/DD HH:mm:ss" value-format="x" /> |
||||
</el-form-item> |
||||
|
||||
<el-form-item label="生效时间" prop="time"> |
||||
<el-date-picker type="datetime" v-model="mailData.time" placeholder="默认立即生效" format="YYYY/MM/DD HH:mm:ss" value-format="x" /> |
||||
</el-form-item> |
||||
|
||||
<el-form-item label="备注" prop="remark"> |
||||
<el-input v-model="mailData.remark" type="textarea" placeholder="请输入内容" /> |
||||
</el-form-item> |
||||
<el-form-item> |
||||
<el-button size="default" type="primary" class="ml10" @click="onSubmit"> |
||||
发送邮件 |
||||
</el-button> |
||||
</el-form-item> |
||||
</el-form> |
||||
|
||||
|
||||
</div> |
||||
</template> |
||||
|
||||
<script lang="ts"> |
||||
import { reactive, toRefs, defineComponent,ref,unref } from 'vue'; |
||||
import {ElMessage} from "element-plus"; |
||||
import { gameMailSend } from '/@/api/game'; |
||||
import {ServerList} from "/@/utils/game"; |
||||
import { Session } from '/@/utils/storage'; |
||||
|
||||
|
||||
|
||||
interface MailData{ |
||||
serverId:string |
||||
to:string |
||||
gmName:string |
||||
type:string |
||||
time:number |
||||
expired:number |
||||
newGet:string |
||||
repeatedCollection:number |
||||
title:string |
||||
content:string |
||||
drops:string |
||||
remark:string |
||||
|
||||
} |
||||
|
||||
interface TableDataState{ |
||||
mailData:MailData; |
||||
rules: object; |
||||
servers:object; |
||||
} |
||||
export default defineComponent({ |
||||
name: 'systemEditPost', |
||||
setup() { |
||||
const formRef = ref<HTMLElement | null>(null); |
||||
const menuRef = ref(); |
||||
const state = reactive<TableDataState>({ |
||||
mailData: { |
||||
serverId:"", |
||||
to:"", |
||||
gmName:Session.get("userInfo").userName, |
||||
type:"", |
||||
time:0, |
||||
expired:0, |
||||
newGet:"", |
||||
repeatedCollection:0, |
||||
title:"", |
||||
content:"", |
||||
drops:"", |
||||
remark:"" |
||||
}, |
||||
// 表单校验 |
||||
rules: { |
||||
serverId: [ |
||||
{ required: true, message: "区服不能为空", trigger: "blur" } |
||||
], |
||||
type: [ |
||||
{ required: true, message: "邮件类型不能为空", trigger: "blur" } |
||||
], |
||||
repeatedCollection: [ |
||||
{ required: true, message: "重复领取类型不能为空", trigger: "blur" } |
||||
], |
||||
newGet: [ |
||||
{ required: true, message: "新手领取类型不能为空", trigger: "blur" } |
||||
], |
||||
title: [ |
||||
{ required: true, message: "标题不能为空", trigger: "blur" } |
||||
], |
||||
remark: [ |
||||
{ required: true, message: "备注不能为空", trigger: "blur" } |
||||
], |
||||
drops:[ |
||||
{pattern: /^[0-9:,]+$/,message: "只能0-9,:", trigger: "blur" } |
||||
], |
||||
}, |
||||
servers:ServerList |
||||
|
||||
}); |
||||
|
||||
|
||||
// 新增 |
||||
const onSubmit = () => { |
||||
const formWrap = unref(formRef) as any; |
||||
if (!formWrap) return; |
||||
formWrap.validate((valid: boolean) => { |
||||
if (valid) { |
||||
//添加 |
||||
if(state.mailData.drops.length>0){ |
||||
if (state.mailData.drops.includes("：")||state.mailData.drops.includes("，")){ |
||||
ElMessage.error('奖励不能包含中文标点'); |
||||
return |
||||
} |
||||
var ss=state.mailData.drops.split(",") |
||||
for(var i=0;i<ss.length;i++){ |
||||
var drop=ss[i].split(":") |
||||
if (drop.length!=2){ |
||||
ElMessage.error('奖励格式不对'); |
||||
return |
||||
} |
||||
} |
||||
|
||||
} |
||||
gameMailSend(state.mailData).then(()=>{ |
||||
ElMessage.success('邮件发送成功'); |
||||
}).finally(()=>{ |
||||
// state.loading = false; |
||||
}) |
||||
|
||||
} |
||||
}); |
||||
}; |
||||
// const resetForm = ()=>{ |
||||
// |
||||
// state.mailData = { |
||||
// to:"", |
||||
// gaName:"", |
||||
// type:"", |
||||
// time:0, |
||||
// expired:0, |
||||
// newGet:"", |
||||
// repeatedCollection:0, |
||||
// title:"", |
||||
// content:"", |
||||
// drops:"", |
||||
// remark:"" |
||||
// } |
||||
// }; |
||||
|
||||
return { |
||||
onSubmit, |
||||
menuRef, |
||||
formRef, |
||||
...toRefs(state), |
||||
}; |
||||
}, |
||||
}); |
||||
</script> |
||||
|
||||
<style scoped lang="scss"> |
||||
.tree-border { |
||||
margin-top: 5px; |
||||
border: 1px solid #e5e6e7!important; |
||||
background: #fff none!important; |
||||
border-radius: 4px; |
||||
} |
||||
.system-edit-post-container { |
||||
.menu-data-tree { |
||||
border: var(--el-input-border, var(--el-border-base)); |
||||
border-radius: var(--el-input-border-radius, var(--el-border-radius-base)); |
||||
padding: 5px; |
||||
} |
||||
} |
||||
</style> |
||||
@ -0,0 +1,177 @@
|
||||
<template> |
||||
<div class="game-order-container"> |
||||
<el-card shadow="hover"> |
||||
<div class="game-order-search mb15" > |
||||
<el-form label-position="right" label-width="300px" |
||||
:model="formLabelAlign" |
||||
style="max-width: 520px"> |
||||
<el-form-item label="UID"> |
||||
<el-input v-model="tableData.param.uid" placeholder="" class="w-50 m-2" size="large" clearable/> |
||||
</el-form-item> |
||||
<el-form-item label="修改金额（差值）"> |
||||
<el-input v-model="tableData.param.amount" placeholder="" class="w-50 m-2" size="large" clearable/> |
||||
</el-form-item> |
||||
<el-form-item label="选择货币类型" > |
||||
<el-select v-model="tableData.param.amountType" class="w-50 m-2" placeholder="选择渠道" size="large"> |
||||
<el-option v-for="item in amountTypes" :key="item.value" :label="item.label" :value="item.value" /> |
||||
</el-select> |
||||
</el-form-item> |
||||
<el-form-item> |
||||
<el-button size="large" type="primary" class="ml10" @click="changeGameCoin"> |
||||
修改游戏币 |
||||
</el-button> |
||||
</el-form-item> |
||||
</el-form> |
||||
|
||||
</div> |
||||
|
||||
</el-card> |
||||
</div> |
||||
<div class="game-order-container" > |
||||
<el-card shadow="hover"> |
||||
<div class="game-order-search mb15"> |
||||
|
||||
<el-form label-position="right" label-width="300px" |
||||
:model="formLabelAlign" |
||||
style="max-width: 520px"> |
||||
|
||||
<el-form-item label="账号"> |
||||
<el-input size="large" v-model="tableData.param.uid" placeholder="" class="w-50 m-2" clearable/> |
||||
</el-form-item> |
||||
<el-form-item label="充值ID" > |
||||
<el-select v-model="tableData.paramDeposit.depositId" class="w-50 m-2" placeholder="" size="large"> |
||||
<el-option v-for="item in depositIds" :key="item.value" :label="item.label" :value="item.value" /> |
||||
</el-select> |
||||
</el-form-item> |
||||
<el-form-item label="选择区服" prop="serverId"> |
||||
<el-select v-model="tableData.paramDeposit.serverId" class="m-2" placeholder="" size="large"> |
||||
<el-option v-for="item in servers" :key="item.value" :label="item.label" :value="item.value" /> |
||||
</el-select> |
||||
</el-form-item> |
||||
<el-form-item> |
||||
<el-button size="large" type="primary" class="ml10" @click="deposit"> |
||||
确认充值 |
||||
</el-button> |
||||
</el-form-item> |
||||
</el-form> |
||||
</div> |
||||
|
||||
</el-card> |
||||
</div> |
||||
</template> |
||||
|
||||
<script lang="ts"> |
||||
import {toRefs, reactive, onMounted, defineComponent, } from 'vue'; |
||||
//import { ElMessageBox, ElMessage } from 'element-plus'; |
||||
import {gameAddCoin, gameDeposit} from "/@/api/game"; |
||||
import {ServerList} from "/@/utils/game"; |
||||
import {ElMessage} from "element-plus/es"; |
||||
|
||||
|
||||
interface TableDataState { |
||||
tableData: { |
||||
param: { |
||||
uid:number |
||||
amount:number |
||||
amountType:number |
||||
}; |
||||
paramDeposit:{ |
||||
account:string |
||||
depositId:number |
||||
serverId:number |
||||
} |
||||
|
||||
}; |
||||
servers:object; |
||||
amountTypes:object |
||||
depositIds:object |
||||
} |
||||
|
||||
export default defineComponent({ |
||||
name: 'apiV1GameOrderOrderList', |
||||
setup() { |
||||
// const {proxy} = getCurrentInstance() as any; |
||||
|
||||
const state = reactive<TableDataState>({ |
||||
tableData: { |
||||
param:{ |
||||
uid:0, |
||||
amount:0, |
||||
amountType:0 |
||||
}, |
||||
paramDeposit:{ |
||||
account:"", |
||||
depositId:0, |
||||
serverId:0 |
||||
} |
||||
|
||||
}, |
||||
servers:ServerList, |
||||
amountTypes:[ |
||||
{ |
||||
value: 1, |
||||
label: '金币', |
||||
}, |
||||
{ |
||||
value: 2, |
||||
label: '铜币', |
||||
}, |
||||
], |
||||
depositIds:[ |
||||
{ |
||||
value: 1001, |
||||
label: '6块充值', |
||||
}, |
||||
{ |
||||
value: 1002, |
||||
label: '30充值', |
||||
}, |
||||
{ |
||||
value: 1003, |
||||
label: '68充值', |
||||
}, |
||||
] |
||||
}); |
||||
const changeGameCoin=()=>{ |
||||
gameAddCoin(state.tableData.param).then(()=>{ |
||||
ElMessage.success('赠送金币成功'); |
||||
}).finally(()=>{ |
||||
// state.loading = false; |
||||
}) |
||||
} |
||||
const deposit=()=>{ |
||||
gameDeposit(state.tableData.paramDeposit).then(()=>{ |
||||
ElMessage.success('充值成功'); |
||||
}).finally(()=>{ |
||||
// state.loading = false; |
||||
}) |
||||
} |
||||
|
||||
|
||||
// function GetStateStr(s:number){ |
||||
// if (s==2){ |
||||
// return "成功" |
||||
// } |
||||
// return "失败(错误id="+s+")" |
||||
// } |
||||
|
||||
// // 分页改变 |
||||
// const onHandleSizeChange = (val: number) => { |
||||
// state.tableData.param.pageSize = val; |
||||
// }; |
||||
// // 分页改变 |
||||
// const onHandleCurrentChange = (val: number) => { |
||||
// state.tableData.param.pageNum = val; |
||||
// }; |
||||
// 页面加载时 |
||||
onMounted(() => { |
||||
// initTableData(); |
||||
}); |
||||
return { |
||||
changeGameCoin, |
||||
deposit, |
||||
...toRefs(state), |
||||
}; |
||||
}, |
||||
}); |
||||
</script> |
||||
@ -0,0 +1,148 @@
|
||||
<template> |
||||
<div class="game-resetpwd-container"> |
||||
<el-card shadow="hover"> |
||||
<div class="game-order-search mb15" > |
||||
<el-form label-position="right" label-width="300px" |
||||
:model="formLabelAlign" |
||||
style="max-width: 520px"> |
||||
<el-form-item label="UID"> |
||||
<el-input v-model="tableData.param.uid" placeholder="" class="w-50 m-2" size="large" clearable/> |
||||
</el-form-item> |
||||
<el-form-item label="修改金额（差值）"> |
||||
<el-input v-model="tableData.param.amount" placeholder="" class="w-50 m-2" size="large" clearable/> |
||||
</el-form-item> |
||||
<el-form-item label="选择货币类型" > |
||||
<el-select v-model="tableData.param.amountType" class="w-50 m-2" placeholder="选择渠道" size="large"> |
||||
<el-option v-for="item in amountTypes" :key="item.value" :label="item.label" :value="item.value" /> |
||||
</el-select> |
||||
</el-form-item> |
||||
<el-form-item> |
||||
<el-button size="large" type="primary" class="ml10" @click="changeGameCoin"> |
||||
修改游戏币 |
||||
</el-button> |
||||
</el-form-item> |
||||
</el-form> |
||||
|
||||
</div> |
||||
|
||||
</el-card> |
||||
</div> |
||||
|
||||
|
||||
</template> |
||||
|
||||
<script lang="ts"> |
||||
import {toRefs, reactive, onMounted, defineComponent, } from 'vue'; |
||||
//import { ElMessageBox, ElMessage } from 'element-plus'; |
||||
import {gameAddCoin, gameDeposit} from "/@/api/game"; |
||||
import {ServerList} from "/@/utils/game"; |
||||
import {ElMessage} from "element-plus/es"; |
||||
|
||||
|
||||
interface TableDataState { |
||||
tableData: { |
||||
param: { |
||||
uid:number |
||||
amount:number |
||||
amountType:number |
||||
}; |
||||
paramDeposit:{ |
||||
account:string |
||||
depositId:number |
||||
serverId:number |
||||
} |
||||
|
||||
}; |
||||
servers:object; |
||||
amountTypes:object |
||||
depositIds:object |
||||
} |
||||
|
||||
export default defineComponent({ |
||||
name: 'apiV1GameOrderOrderList', |
||||
setup() { |
||||
// const {proxy} = getCurrentInstance() as any; |
||||
|
||||
const state = reactive<TableDataState>({ |
||||
tableData: { |
||||
param:{ |
||||
uid:0, |
||||
amount:0, |
||||
amountType:0 |
||||
}, |
||||
paramDeposit:{ |
||||
account:"", |
||||
depositId:0, |
||||
serverId:0 |
||||
} |
||||
|
||||
}, |
||||
servers:ServerList, |
||||
amountTypes:[ |
||||
{ |
||||
value: 1, |
||||
label: '金币', |
||||
}, |
||||
{ |
||||
value: 2, |
||||
label: '铜币', |
||||
}, |
||||
], |
||||
depositIds:[ |
||||
{ |
||||
value: 1001, |
||||
label: '6块充值', |
||||
}, |
||||
{ |
||||
value: 1002, |
||||
label: '30充值', |
||||
}, |
||||
{ |
||||
value: 1003, |
||||
label: '68充值', |
||||
}, |
||||
] |
||||
}); |
||||
const changeGameCoin=()=>{ |
||||
gameAddCoin(state.tableData.param).then(()=>{ |
||||
ElMessage.success('赠送金币成功'); |
||||
}).finally(()=>{ |
||||
// state.loading = false; |
||||
}) |
||||
} |
||||
const deposit=()=>{ |
||||
gameDeposit(state.tableData.paramDeposit).then(()=>{ |
||||
ElMessage.success('充值成功'); |
||||
}).finally(()=>{ |
||||
// state.loading = false; |
||||
}) |
||||
} |
||||
|
||||
|
||||
// function GetStateStr(s:number){ |
||||
// if (s==2){ |
||||
// return "成功" |
||||
// } |
||||
// return "失败(错误id="+s+")" |
||||
// } |
||||
|
||||
// // 分页改变 |
||||
// const onHandleSizeChange = (val: number) => { |
||||
// state.tableData.param.pageSize = val; |
||||
// }; |
||||
// // 分页改变 |
||||
// const onHandleCurrentChange = (val: number) => { |
||||
// state.tableData.param.pageNum = val; |
||||
// }; |
||||
// 页面加载时 |
||||
onMounted(() => { |
||||
// initTableData(); |
||||
}); |
||||
return { |
||||
changeGameCoin, |
||||
deposit, |
||||
...toRefs(state), |
||||
}; |
||||
}, |
||||
}); |
||||
</script> |
||||
@ -0,0 +1,157 @@
|
||||
<template> |
||||
<div class="game-order-count-container"> |
||||
<el-card shadow="hover"> |
||||
<div class="system-user-search mb15"> |
||||
<el-form :inline="true"> |
||||
<el-form-item label="充值金额"> |
||||
<el-input size="default" v-model="tableData.param.amount" placeholder="请输金额" class="input-with-select" clearable> |
||||
<template #prepend> |
||||
<el-select v-model="tableData.param.compareType" class="m-2" placeholder="" size="default" style="width: 60px"> |
||||
<el-option v-for="item in tableData.compareType" :key="item.value" :label="item.label" |
||||
:value="item.value"/> |
||||
</el-select> |
||||
</template> |
||||
</el-input> |
||||
|
||||
</el-form-item> |
||||
<el-form-item label="性别"> |
||||
<el-radio-group v-model="tableData.param.gender"> |
||||
<el-radio :label=1>男</el-radio> |
||||
<el-radio :label=2>女</el-radio> |
||||
</el-radio-group> |
||||
</el-form-item> |
||||
|
||||
<el-form-item> |
||||
<el-button size="default" type="primary" class="ml10" @click="countList"> |
||||
<el-icon> |
||||
<ele-Search/> |
||||
</el-icon> |
||||
查询 |
||||
</el-button> |
||||
</el-form-item> |
||||
</el-form> |
||||
</div> |
||||
<el-table :data="tableData.data" style="width: 100%"> |
||||
<el-table-column type="index" label="序号" width="60"/> |
||||
<el-table-column prop="server" label="区服" show-overflow-tooltip></el-table-column> |
||||
<el-table-column prop="num" label="充值人数" show-overflow-tooltip></el-table-column> |
||||
<el-table-column prop="times" label="充值笔数" show-overflow-tooltip></el-table-column> |
||||
<el-table-column prop="allMoney" label="充值金额" show-overflow-tooltip></el-table-column> |
||||
<el-table-column prop="totalNum" label="总充值人数" show-overflow-tooltip></el-table-column> |
||||
<el-table-column prop="totalTimes" label="总充值笔数" show-overflow-tooltip></el-table-column> |
||||
<el-table-column prop="totalMoney" label="总金额" show-overflow-tooltip></el-table-column> |
||||
</el-table> |
||||
</el-card> |
||||
<EditRole ref="editRoleRef" @getRoleList="countList"/> |
||||
</div> |
||||
</template> |
||||
|
||||
<script lang="ts"> |
||||
import {toRefs, reactive, onMounted, defineComponent} from 'vue'; |
||||
//import { ElMessageBox, ElMessage } from 'element-plus'; |
||||
import {gameRoleList} from "/@/api/game"; |
||||
|
||||
// 定义接口来定义对象的类型 |
||||
interface TableData { |
||||
serverId: number; |
||||
num: number; |
||||
times: number; |
||||
allMoney: number; |
||||
totalNum: number; |
||||
totalTimes: number; |
||||
totalMoney: number; |
||||
} |
||||
|
||||
interface TableDataState { |
||||
tableData: { |
||||
data: Array<TableData>; |
||||
param: { |
||||
amount: number; |
||||
compareType: number; |
||||
gender: number; |
||||
lowAge: number; |
||||
upAge: number; |
||||
serverId: number; |
||||
} |
||||
compareType: object |
||||
}; |
||||
} |
||||
|
||||
export default defineComponent({ |
||||
name: 'apiV1SystemRoleList', |
||||
setup() { |
||||
|
||||
const state = reactive<TableDataState>({ |
||||
tableData: { |
||||
data: [], |
||||
param: { |
||||
amount: 0, |
||||
compareType: 0, |
||||
gender: 0, |
||||
lowAge: 0, |
||||
upAge: 0, |
||||
serverId: 0, |
||||
}, |
||||
compareType: [ |
||||
{ |
||||
value: 1, |
||||
label: '=', |
||||
}, { |
||||
value: 2, |
||||
label: '<=', |
||||
}, |
||||
{ |
||||
value: 3, |
||||
label: '<', |
||||
}, |
||||
{ |
||||
value: 4, |
||||
label: '>', |
||||
}, |
||||
{ |
||||
value: 5, |
||||
label: '>=', |
||||
} |
||||
] |
||||
}, |
||||
}); |
||||
|
||||
|
||||
// 初始化表格数据 |
||||
// const initTableData = () => { |
||||
// roleList() |
||||
// }; |
||||
const countList = () => { |
||||
const data: Array<TableData> = []; |
||||
gameRoleList(state.tableData.param).then(res => { |
||||
const list = res.data.list ?? [] |
||||
list.map((item: TableData) => { |
||||
data.push({ |
||||
serverId: item.serverId, |
||||
num: item.num, |
||||
times: item.times, |
||||
allMoney: item.allMoney, |
||||
totalMoney: item.totalMoney, |
||||
totalNum: item.totalNum, |
||||
totalTimes: item.totalTimes, |
||||
}); |
||||
}) |
||||
state.tableData.data = data; |
||||
}) |
||||
}; |
||||
|
||||
|
||||
|
||||
onMounted(() => { |
||||
// initTableData(); |
||||
}); |
||||
return { |
||||
|
||||
//onHandleSizeChange, |
||||
//onHandleCurrentChange, |
||||
countList, |
||||
...toRefs(state), |
||||
}; |
||||
}, |
||||
}); |
||||
</script> |
||||
@ -0,0 +1,177 @@
|
||||
<template> |
||||
<div class="game-order-container"> |
||||
<el-card shadow="hover"> |
||||
<div class="game-order-search mb15" > |
||||
<el-form label-position="right" label-width="300px" |
||||
:model="formLabelAlign" |
||||
style="max-width: 520px"> |
||||
<el-form-item label="UID"> |
||||
<el-input v-model="tableData.param.uid" placeholder="" class="w-50 m-2" size="large" clearable/> |
||||
</el-form-item> |
||||
<el-form-item label="修改金额（差值）"> |
||||
<el-input v-model="tableData.param.amount" placeholder="" class="w-50 m-2" size="large" clearable/> |
||||
</el-form-item> |
||||
<el-form-item label="选择货币类型" > |
||||
<el-select v-model="tableData.param.amountType" class="w-50 m-2" placeholder="选择渠道" size="large"> |
||||
<el-option v-for="item in amountTypes" :key="item.value" :label="item.label" :value="item.value" /> |
||||
</el-select> |
||||
</el-form-item> |
||||
<el-form-item> |
||||
<el-button size="large" type="primary" class="ml10" @click="changeGameCoin"> |
||||
修改游戏币 |
||||
</el-button> |
||||
</el-form-item> |
||||
</el-form> |
||||
|
||||
</div> |
||||
|
||||
</el-card> |
||||
</div> |
||||
<div class="game-order-container" > |
||||
<el-card shadow="hover"> |
||||
<div class="game-order-search mb15"> |
||||
|
||||
<el-form label-position="right" label-width="300px" |
||||
:model="formLabelAlign" |
||||
style="max-width: 520px"> |
||||
|
||||
<el-form-item label="账号"> |
||||
<el-input size="large" v-model="tableData.param.uid" placeholder="" class="w-50 m-2" clearable/> |
||||
</el-form-item> |
||||
<el-form-item label="充值ID" > |
||||
<el-select v-model="tableData.paramDeposit.depositId" class="w-50 m-2" placeholder="" size="large"> |
||||
<el-option v-for="item in depositIds" :key="item.value" :label="item.label" :value="item.value" /> |
||||
</el-select> |
||||
</el-form-item> |
||||
<el-form-item label="选择区服" prop="serverId"> |
||||
<el-select v-model="tableData.paramDeposit.serverId" class="m-2" placeholder="" size="large"> |
||||
<el-option v-for="item in servers" :key="item.value" :label="item.label" :value="item.value" /> |
||||
</el-select> |
||||
</el-form-item> |
||||
<el-form-item> |
||||
<el-button size="large" type="primary" class="ml10" @click="deposit"> |
||||
确认充值 |
||||
</el-button> |
||||
</el-form-item> |
||||
</el-form> |
||||
</div> |
||||
|
||||
</el-card> |
||||
</div> |
||||
</template> |
||||
|
||||
<script lang="ts"> |
||||
import {toRefs, reactive, onMounted, defineComponent, } from 'vue'; |
||||
//import { ElMessageBox, ElMessage } from 'element-plus'; |
||||
import {gameAddCoin, gameDeposit} from "/@/api/game"; |
||||
import {ServerList} from "/@/utils/game"; |
||||
import {ElMessage} from "element-plus/es"; |
||||
|
||||
|
||||
interface TableDataState { |
||||
tableData: { |
||||
param: { |
||||
uid:number |
||||
amount:number |
||||
amountType:number |
||||
}; |
||||
paramDeposit:{ |
||||
account:string |
||||
depositId:number |
||||
serverId:number |
||||
} |
||||
|
||||
}; |
||||
servers:object; |
||||
amountTypes:object |
||||
depositIds:object |
||||
} |
||||
|
||||
export default defineComponent({ |
||||
name: 'apiV1GameOrderOrderList', |
||||
setup() { |
||||
// const {proxy} = getCurrentInstance() as any; |
||||
|
||||
const state = reactive<TableDataState>({ |
||||
tableData: { |
||||
param:{ |
||||
uid:0, |
||||
amount:0, |
||||
amountType:0 |
||||
}, |
||||
paramDeposit:{ |
||||
account:"", |
||||
depositId:0, |
||||
serverId:0 |
||||
} |
||||
|
||||
}, |
||||
servers:ServerList, |
||||
amountTypes:[ |
||||
{ |
||||
value: 1, |
||||
label: '金币', |
||||
}, |
||||
{ |
||||
value: 2, |
||||
label: '铜币', |
||||
}, |
||||
], |
||||
depositIds:[ |
||||
{ |
||||
value: 1001, |
||||
label: '6块充值', |
||||
}, |
||||
{ |
||||
value: 1002, |
||||
label: '30充值', |
||||
}, |
||||
{ |
||||
value: 1003, |
||||
label: '68充值', |
||||
}, |
||||
] |
||||
}); |
||||
const changeGameCoin=()=>{ |
||||
gameAddCoin(state.tableData.param).then(()=>{ |
||||
ElMessage.success('赠送金币成功'); |
||||
}).finally(()=>{ |
||||
// state.loading = false; |
||||
}) |
||||
} |
||||
const deposit=()=>{ |
||||
gameDeposit(state.tableData.paramDeposit).then(()=>{ |
||||
ElMessage.success('充值成功'); |
||||
}).finally(()=>{ |
||||
// state.loading = false; |
||||
}) |
||||
} |
||||
|
||||
|
||||
// function GetStateStr(s:number){ |
||||
// if (s==2){ |
||||
// return "成功" |
||||
// } |
||||
// return "失败(错误id="+s+")" |
||||
// } |
||||
|
||||
// // 分页改变 |
||||
// const onHandleSizeChange = (val: number) => { |
||||
// state.tableData.param.pageSize = val; |
||||
// }; |
||||
// // 分页改变 |
||||
// const onHandleCurrentChange = (val: number) => { |
||||
// state.tableData.param.pageNum = val; |
||||
// }; |
||||
// 页面加载时 |
||||
onMounted(() => { |
||||
// initTableData(); |
||||
}); |
||||
return { |
||||
changeGameCoin, |
||||
deposit, |
||||
...toRefs(state), |
||||
}; |
||||
}, |
||||
}); |
||||
</script> |
||||
@ -0,0 +1,210 @@
|
||||
<template> |
||||
<div class="game-order-container"> |
||||
<el-card shadow="hover"> |
||||
<div class="game-order-search mb15"> |
||||
<el-form> |
||||
<el-form-item label="查询类型:" prop="type"> |
||||
<el-radio-group v-model="tableData.param.searchType"> |
||||
<el-radio :label=1>账号查询</el-radio> |
||||
<el-radio :label=2>桃谷uid查询</el-radio> |
||||
<el-radio :label=3>时间段查询</el-radio> |
||||
<el-radio :label=4>渠道订单号查询</el-radio> |
||||
</el-radio-group> |
||||
</el-form-item> |
||||
</el-form> |
||||
<el-form :inline="true" v-if="tableData.param.searchType==1"> |
||||
<el-form-item label="账号"> |
||||
<el-input size="default" v-model="tableData.param.account" placeholder="请输入账号" class="w-50 m-2" clearable/> |
||||
</el-form-item> |
||||
<el-form-item label="选择渠道" prop="serverId"> |
||||
<el-select v-model="tableData.param.channel" class="m-2" placeholder="选择渠道" size="large"> |
||||
<el-option v-for="item in channels" :key="item.value" :label="item.label" :value="item.value" /> |
||||
</el-select> |
||||
</el-form-item> |
||||
</el-form> |
||||
<el-form :inline="true" v-if="tableData.param.searchType==2" > |
||||
<el-form-item label="桃谷uid" > |
||||
<el-input size="default" v-model="tableData.param.uid" placeholder="请输入桃谷UID" class="w-50 m-2" clearable/> |
||||
</el-form-item> |
||||
<el-form-item label="选择区服" prop="serverId"> |
||||
<el-select v-model="tableData.param.serverId" class="m-2" placeholder="选择区服" size="large"> |
||||
<el-option v-for="item in servers" :key="item.value" :label="item.label" :value="item.value" /> |
||||
</el-select> |
||||
</el-form-item> |
||||
</el-form> |
||||
<el-form :inline="true" v-if="tableData.param.searchType==3"> |
||||
<el-form-item label="起始时间" prop="lowTime"> |
||||
<el-date-picker type="datetime" size="large" v-model="tableData.param.lowTime" format="YYYY/MM/DD HH:mm:ss" value-format="x" /> |
||||
</el-form-item> |
||||
|
||||
<el-form-item label="终止时间" prop="time"> |
||||
<el-date-picker type="datetime" v-model="tableData.param.uptime" format="YYYY/MM/DD HH:mm:ss" value-format="x" /> |
||||
</el-form-item> |
||||
</el-form> |
||||
<el-form :inline="true" v-if="tableData.param.searchType==4"> |
||||
<el-form-item label="渠道订单id"> |
||||
<el-input size="default" v-model="tableData.param.orderId" placeholder="请输入渠道订单id" class="w-50 m-2" clearable/> |
||||
</el-form-item> |
||||
</el-form> |
||||
<el-form> |
||||
<el-form-item> |
||||
<el-button size="default" type="primary" class="ml10" @click="roleList"> |
||||
<el-icon> |
||||
<ele-Search /> |
||||
</el-icon> |
||||
查询 |
||||
</el-button> |
||||
</el-form-item> |
||||
</el-form> |
||||
</div> |
||||
<el-table :data="tableData.data" style="width: 100%"> |
||||
<el-table-column type="index" label="id" width="60" /> |
||||
<el-table-column prop="uid" label="桃谷uid" show-overflow-tooltip></el-table-column> |
||||
<el-table-column prop="server" label="区服" show-overflow-tooltip></el-table-column> |
||||
<el-table-column prop="money" label="充值数额" show-overflow-tooltip></el-table-column> |
||||
<el-table-column prop="timestampStr" label="充值时间" show-overflow-tooltip></el-table-column> |
||||
<el-table-column prop="rechargeId" label="商品id" show-overflow-tooltip></el-table-column> |
||||
<el-table-column prop="createTime" label="创建时间" show-overflow-tooltip></el-table-column> |
||||
<el-table-column prop="orderId" label="订单id(渠道产生)" show-overflow-tooltip></el-table-column> |
||||
<el-table-column prop="stateStr" label="订单状态" show-overflow-tooltip></el-table-column> |
||||
<!-- <el-table-column label="操作" width="100">--> |
||||
<!-- <template #default="scope">--> |
||||
<!-- <el-button size="small" type="text" @click="onOpenEditRole(scope.row)">修改名字</el-button>--> |
||||
<!-- <el-button size="small" type="text" @click="onRowDel(scope.row)">删除</el-button>--> |
||||
<!-- </template>--> |
||||
<!-- </el-table-column>--> |
||||
</el-table> |
||||
<pagination |
||||
v-show="tableData.total>0" |
||||
:total="tableData.total" |
||||
v-model:page="tableData.param.pageNum" |
||||
v-model:limit="tableData.param.pageSize" |
||||
@pagination="roleList" |
||||
/> |
||||
</el-card> |
||||
<EditRole ref="editRoleRef" @getRoleList="roleList"/> |
||||
</div> |
||||
</template> |
||||
|
||||
<script lang="ts"> |
||||
import {toRefs, reactive, onMounted, defineComponent, } from 'vue'; |
||||
//import { ElMessageBox, ElMessage } from 'element-plus'; |
||||
import {gameOrderList} from "/@/api/game"; |
||||
import {ServerList} from "/@/utils/game"; |
||||
import {ChannelList} from "/@/utils/game"; |
||||
// 定义接口来定义对象的类型 |
||||
interface TableData { |
||||
id:string |
||||
uid:number; |
||||
server: number; |
||||
money: number; |
||||
timestamp: number; //订单时间 |
||||
rechargeId: number; |
||||
createTime:string; |
||||
orderId: string; |
||||
state:number; |
||||
stateStr:string; |
||||
timestampStr:string; |
||||
} |
||||
interface TableDataState { |
||||
tableData: { |
||||
data: Array<TableData>; |
||||
param: { |
||||
searchType:number |
||||
id:string; |
||||
orderId:string |
||||
serverId:number |
||||
uid:number |
||||
account: string; |
||||
channel:string |
||||
lowTime:number |
||||
uptime:number |
||||
}; |
||||
|
||||
}; |
||||
servers:object; |
||||
channels:object; |
||||
} |
||||
|
||||
export default defineComponent({ |
||||
name: 'apiV1GameOrderOrderList', |
||||
setup() { |
||||
// const {proxy} = getCurrentInstance() as any; |
||||
|
||||
const state = reactive<TableDataState>({ |
||||
tableData: { |
||||
data: [], |
||||
param:{ |
||||
searchType:0, |
||||
id:"", |
||||
orderId:"", |
||||
serverId:0, |
||||
uid:0, |
||||
account:"", |
||||
channel:"", |
||||
lowTime:0, |
||||
uptime:0 |
||||
|
||||
}, |
||||
|
||||
}, |
||||
servers:ServerList, |
||||
channels:ChannelList, |
||||
}); |
||||
// 初始化表格数据 |
||||
// const initTableData = () => { |
||||
// roleList() |
||||
// }; |
||||
const roleList = ()=>{ |
||||
const data: Array<TableData> = []; |
||||
gameOrderList(state.tableData.param).then(res=>{ |
||||
const list = res.data.list??[] |
||||
list.map((item:TableData)=>{ |
||||
|
||||
data.push({ |
||||
id:item.id, |
||||
uid:item.uid, |
||||
server: item.server, |
||||
money: item.money, |
||||
timestamp: item.timestamp, |
||||
rechargeId: item.rechargeId, |
||||
createTime:new Date(item.createTime).toLocaleString(), |
||||
orderId:item.orderId, |
||||
state:item.state, |
||||
stateStr:GetStateStr(item.state), |
||||
timestampStr:new Date(item.timestamp*1000).toLocaleString() |
||||
}); |
||||
}) |
||||
state.tableData.data = data; |
||||
}) |
||||
}; |
||||
|
||||
function GetStateStr(s:number){ |
||||
if (s==2){ |
||||
return "成功" |
||||
} |
||||
return "失败(错误id="+s+")" |
||||
} |
||||
|
||||
// // 分页改变 |
||||
// const onHandleSizeChange = (val: number) => { |
||||
// state.tableData.param.pageSize = val; |
||||
// }; |
||||
// // 分页改变 |
||||
// const onHandleCurrentChange = (val: number) => { |
||||
// state.tableData.param.pageNum = val; |
||||
// }; |
||||
// 页面加载时 |
||||
onMounted(() => { |
||||
// initTableData(); |
||||
}); |
||||
return { |
||||
|
||||
//onHandleSizeChange, |
||||
//onHandleCurrentChange, |
||||
roleList, |
||||
...toRefs(state), |
||||
}; |
||||
}, |
||||
}); |
||||
</script> |
||||
@ -0,0 +1,138 @@
|
||||
<template> |
||||
<div class="game-account-container"> |
||||
<el-card shadow="hover"> |
||||
<div class="game-account-search mb15"> |
||||
<el-form :inline="true"> |
||||
<el-form-item label="account"> |
||||
<el-input size="default" v-model="tableData.param.account" placeholder="account" class="w-50 m-2" clearable/> |
||||
</el-form-item> |
||||
<el-form-item label="手机号:"> |
||||
<el-input size="default" v-model="tableData.param.tel" placeholder="手机号" class="w-50 m-2" clearable/> |
||||
</el-form-item> |
||||
<el-form-item label="身份证:"> |
||||
<el-input size="default" v-model="tableData.param.ident" placeholder="身份证" class="w-50 m-2" clearable/> |
||||
</el-form-item> |
||||
<el-form-item label="名字:"> |
||||
<el-input size="default" v-model="tableData.param.name" placeholder="名字" class="w-50 m-2" clearable/> |
||||
</el-form-item> |
||||
|
||||
<el-form-item> |
||||
<el-button size="default" type="primary" class="ml10" @click="accountList"> |
||||
<el-icon> |
||||
<ele-Search /> |
||||
</el-icon> |
||||
查询 |
||||
</el-button> |
||||
</el-form-item> |
||||
</el-form> |
||||
</div> |
||||
<el-table :data="tableData.data" style="width: 100%"> |
||||
<el-table-column type="index" label="序号" width="60" /> |
||||
<el-table-column prop="account" label="账号" show-overflow-tooltip></el-table-column> |
||||
<el-table-column prop="trueName" label="名字" show-overflow-tooltip></el-table-column> |
||||
<el-table-column prop="tel" label="手机号" show-overflow-tooltip></el-table-column> |
||||
<el-table-column prop="leftPlayTime" label="剩余游戏时间" show-overflow-tooltip></el-table-column> |
||||
<el-table-column prop="createTime" label="创建时间" show-overflow-tooltip></el-table-column> |
||||
<el-table-column prop="lastLeaveTime" label="上次下线时间" show-overflow-tooltip></el-table-column> |
||||
</el-table> |
||||
<pagination |
||||
v-show="tableData.total>0" |
||||
:total="tableData.total" |
||||
v-model:page="tableData.param.pageNum" |
||||
v-model:limit="tableData.param.pageSize" |
||||
@pagination="onlineList" |
||||
/> |
||||
</el-card> |
||||
<EditRole ref="editRoleRef" @getRoleList="roleList"/> |
||||
</div> |
||||
</template> |
||||
|
||||
<script lang="ts"> |
||||
import {toRefs, reactive, onMounted, defineComponent, } from 'vue'; |
||||
//import { ElMessageBox, ElMessage } from 'element-plus'; |
||||
import EditRole from '/@/views/system/role/component/editRole.vue'; |
||||
import {ServerList} from "/@/utils/game"; |
||||
import {gameAccountList, gameOnlineList} from "/@/api/game"; |
||||
// 定义接口来定义对象的类型 |
||||
interface TableData { |
||||
account:string; |
||||
trueName: string; |
||||
identityCard: string; |
||||
tel:string; |
||||
lastLeaveTime:string; |
||||
createTime:string |
||||
leftPlayTime: string; |
||||
|
||||
} |
||||
interface TableDataState { |
||||
tableData: { |
||||
data: Array<TableData>; |
||||
param: { |
||||
account: string; |
||||
tel:string; |
||||
ident:string; |
||||
name:string |
||||
} |
||||
}; |
||||
} |
||||
|
||||
export default defineComponent({ |
||||
name: 'apiV1GameAccountList', |
||||
components: {EditRole}, |
||||
setup() { |
||||
// const {proxy} = getCurrentInstance() as any; |
||||
const state = reactive<TableDataState>({ |
||||
tableData: { |
||||
data: [], |
||||
param:{ |
||||
account:"", |
||||
tel:"", |
||||
ident:"", |
||||
name:"" |
||||
}, |
||||
|
||||
}, |
||||
}); |
||||
// 初始化表格数据 |
||||
// const initTableData = () => { |
||||
// roleList() |
||||
// }; |
||||
const accountList = ()=>{ |
||||
const data: Array<TableData> = []; |
||||
gameAccountList(state.tableData.param).then(res=>{ |
||||
const list = res.data.list??[] |
||||
list.map((item:TableData)=>{ |
||||
data.push({ |
||||
account:item.account, |
||||
trueName:item.trueName, |
||||
identityCard: item.identityCard, |
||||
tel: item.tel, |
||||
leftPlayTime:item.leftPlayTime, |
||||
createTime:item.createTime.replace("T"," ").substring(0,item.createTime.indexOf(".")), |
||||
lastLeaveTime:item.lastLeaveTime.replace("T"," ").substring(0,item.lastLeaveTime.indexOf(".")), |
||||
}); |
||||
}) |
||||
state.tableData.data = data; |
||||
}) |
||||
}; |
||||
|
||||
|
||||
// // 分页改变 |
||||
// const onHandleSizeChange = (val: number) => { |
||||
// state.tableData.param.pageSize = val; |
||||
// }; |
||||
// // 分页改变 |
||||
// const onHandleCurrentChange = (val: number) => { |
||||
// state.tableData.param.pageNum = val; |
||||
// }; |
||||
// 页面加载时 |
||||
onMounted(() => { |
||||
// initTableData(); |
||||
}); |
||||
return { |
||||
accountList, |
||||
...toRefs(state), |
||||
}; |
||||
}, |
||||
}); |
||||
</script> |
||||
@ -0,0 +1,123 @@
|
||||
<template> |
||||
<div class="game-online-container"> |
||||
<el-card shadow="hover"> |
||||
<div class="system-user-search mb15"> |
||||
<el-form :inline="true"> |
||||
<el-form-item label="选择服务器" prop="serverId"> |
||||
<el-select v-model="tableData.param.serverId" class="m-2" placeholder="选择服务器" size="large"> |
||||
<el-option v-for="item in servers" :key="item.value" :label="item.label" :value="item.value" /> |
||||
</el-select> |
||||
</el-form-item> |
||||
|
||||
<el-form-item> |
||||
<el-button size="default" type="primary" class="ml10" @click="onlineList"> |
||||
<el-icon> |
||||
<ele-Search /> |
||||
</el-icon> |
||||
查询 |
||||
</el-button> |
||||
</el-form-item> |
||||
</el-form> |
||||
</div> |
||||
<el-table :data="tableData.data" style="width: 100%"> |
||||
<el-table-column type="index" label="序号" width="60" /> |
||||
<el-table-column prop="connectId" label="连接服务器" show-overflow-tooltip></el-table-column> |
||||
<el-table-column prop="uid" label="uid" show-overflow-tooltip></el-table-column> |
||||
<el-table-column prop="address" label="IP地址" show-overflow-tooltip></el-table-column> |
||||
<el-table-column prop="loginTime" label="登录时间" show-overflow-tooltip></el-table-column> |
||||
</el-table> |
||||
<pagination |
||||
v-show="tableData.total>0" |
||||
:total="tableData.total" |
||||
v-model:page="tableData.param.pageNum" |
||||
v-model:limit="tableData.param.pageSize" |
||||
@pagination="onlineList" |
||||
/> |
||||
</el-card> |
||||
<EditRole ref="editRoleRef" @getRoleList="roleList"/> |
||||
</div> |
||||
</template> |
||||
|
||||
<script lang="ts"> |
||||
import {toRefs, reactive, onMounted, ref, defineComponent, } from 'vue'; |
||||
//import { ElMessageBox, ElMessage } from 'element-plus'; |
||||
import EditRole from '/@/views/system/role/component/editRole.vue'; |
||||
import {ServerList} from "/@/utils/game"; |
||||
import {gameOnlineList} from "/@/api/game"; |
||||
// 定义接口来定义对象的类型 |
||||
interface TableData { |
||||
connectId:number; |
||||
uid: number; |
||||
address: string; |
||||
loginTime: string; |
||||
|
||||
} |
||||
interface TableDataState { |
||||
tableData: { |
||||
data: Array<TableData>; |
||||
param: { |
||||
serverId: number; |
||||
} |
||||
}; |
||||
servers:object |
||||
} |
||||
|
||||
export default defineComponent({ |
||||
name: 'apiV1SystemRoleList', |
||||
components: {EditRole}, |
||||
setup() { |
||||
// const {proxy} = getCurrentInstance() as any; |
||||
const addRoleRef = ref(); |
||||
const editRoleRef = ref(); |
||||
const state = reactive<TableDataState>({ |
||||
tableData: { |
||||
data: [], |
||||
param:{ |
||||
serverId:1 |
||||
}, |
||||
|
||||
}, |
||||
servers:ServerList |
||||
}); |
||||
// 初始化表格数据 |
||||
// const initTableData = () => { |
||||
// roleList() |
||||
// }; |
||||
const onlineList = ()=>{ |
||||
const data: Array<TableData> = []; |
||||
gameOnlineList(state.tableData.param).then(res=>{ |
||||
const list = res.data.onlines??[] |
||||
list.map((item:TableData)=>{ |
||||
data.push({ |
||||
connectId:item.connectId, |
||||
uid:item.uid, |
||||
address: item.address, |
||||
loginTime: new Date(item.loginTime).toLocaleString(), |
||||
}); |
||||
}) |
||||
state.tableData.data = data; |
||||
}) |
||||
}; |
||||
|
||||
|
||||
// // 分页改变 |
||||
// const onHandleSizeChange = (val: number) => { |
||||
// state.tableData.param.pageSize = val; |
||||
// }; |
||||
// // 分页改变 |
||||
// const onHandleCurrentChange = (val: number) => { |
||||
// state.tableData.param.pageNum = val; |
||||
// }; |
||||
// 页面加载时 |
||||
onMounted(() => { |
||||
// initTableData(); |
||||
}); |
||||
return { |
||||
addRoleRef, |
||||
editRoleRef, |
||||
onlineList, |
||||
...toRefs(state), |
||||
}; |
||||
}, |
||||
}); |
||||
</script> |
||||
@ -0,0 +1,264 @@
|
||||
<template> |
||||
<div class="system-edit-role-container"> |
||||
<el-dialog :title="(formData.id===0?'添加':'修改')+'角色'" v-model="isShowDialog" width="769px"> |
||||
<el-form ref="formRef" :model="formData" :rules="rules" size="default" label-width="90px"> |
||||
<el-row :gutter="35"> |
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> |
||||
<el-form-item label="角色名称" prop="name"> |
||||
<el-input v-model="formData.name" placeholder="请输入角色名称" clearable></el-input> |
||||
</el-form-item> |
||||
</el-col> |
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> |
||||
<el-form-item label="排序"> |
||||
<el-input-number v-model="formData.listOrder" :min="0" controls-position="right" placeholder="请输入排序" class="w100" /> |
||||
</el-form-item> |
||||
</el-col> |
||||
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> |
||||
<el-form-item label="角色状态"> |
||||
<el-switch v-model="formData.status" :active-value="1" :inactive-value="0" inline-prompt active-text="启" inactive-text="禁"></el-switch> |
||||
</el-form-item> |
||||
</el-col> |
||||
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
||||
<el-form-item label="角色描述"> |
||||
<el-input v-model="formData.remark" type="textarea" placeholder="请输入角色描述" maxlength="150"></el-input> |
||||
</el-form-item> |
||||
</el-col> |
||||
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
||||
<el-form-item label="菜单权限"> |
||||
<el-row :gutter="35"> |
||||
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24"> |
||||
<el-checkbox v-model="menuExpand" @change="handleCheckedTreeExpand($event)">展开/折叠</el-checkbox> |
||||
<el-checkbox v-model="menuNodeAll" @change="handleCheckedTreeNodeAll($event)">全选/全不选</el-checkbox> |
||||
<el-checkbox v-model="menuCheckStrictly" @change="handleCheckedTreeConnect($event)">父子联动</el-checkbox> |
||||
</el-col> |
||||
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
||||
<el-tree |
||||
:data="menuData" |
||||
ref="menuRef" |
||||
:props="menuProps" |
||||
:default-checked-keys="formData.menuIds" |
||||
node-key="id" |
||||
show-checkbox class="menu-data-tree tree-border" |
||||
:check-strictly="!menuCheckStrictly"/> |
||||
</el-col> |
||||
</el-row> |
||||
</el-form-item> |
||||
</el-col> |
||||
</el-row> |
||||
</el-form> |
||||
<template #footer> |
||||
<span class="dialog-footer"> |
||||
<el-button @click="onCancel" size="default">取 消</el-button> |
||||
<el-button type="primary" @click="onSubmit" size="default" :loading="loading">{{formData.id===0?'新 增':'修 改'}}</el-button> |
||||
</span> |
||||
</template> |
||||
</el-dialog> |
||||
</div> |
||||
</template> |
||||
|
||||
<script lang="ts"> |
||||
import { reactive, toRefs, defineComponent,ref,getCurrentInstance,unref } from 'vue'; |
||||
import {addRole, editRole, getRole, getRoleParams} from "/@/api/system/role"; |
||||
import {ElMessage} from "element-plus"; |
||||
import {getBackEndControlRoutes} from "/@/router/backEnd"; |
||||
|
||||
|
||||
// 定义接口来定义对象的类型 |
||||
interface MenuDataTree { |
||||
id: number; |
||||
pid:number; |
||||
title: string; |
||||
children?: MenuDataTree[]; |
||||
} |
||||
interface DialogRow { |
||||
id:number; |
||||
name: string; |
||||
status: number; |
||||
listOrder: number; |
||||
remark: string; |
||||
menuIds:Array<number> |
||||
} |
||||
interface RoleState { |
||||
loading:boolean; |
||||
isShowDialog: boolean; |
||||
formData: DialogRow; |
||||
menuData: Array<MenuDataTree>; |
||||
menuExpand:boolean; |
||||
menuNodeAll:boolean; |
||||
menuCheckStrictly:boolean; |
||||
menuProps: { |
||||
children: string; |
||||
label: string; |
||||
}; |
||||
rules: object; |
||||
} |
||||
|
||||
export default defineComponent({ |
||||
name: 'systemEditRole', |
||||
setup(props,{emit}) { |
||||
const {proxy} = getCurrentInstance() as any; |
||||
const formRef = ref<HTMLElement | null>(null); |
||||
const menuRef = ref(); |
||||
const state = reactive<RoleState>({ |
||||
loading:false, |
||||
isShowDialog: false, |
||||
formData: { |
||||
id:0, |
||||
name: '', |
||||
status: 1, |
||||
listOrder: 0, |
||||
remark: '', |
||||
menuIds:[] |
||||
}, |
||||
// 表单校验 |
||||
rules: { |
||||
name:[ |
||||
{required: true, message: "角色名称不能为空", trigger: "blur"}, |
||||
] |
||||
}, |
||||
menuData: [], |
||||
menuExpand:false, |
||||
menuNodeAll:false, |
||||
menuCheckStrictly:false, |
||||
menuProps: { |
||||
children: 'children', |
||||
label: 'title', |
||||
}, |
||||
}); |
||||
// 打开弹窗 |
||||
const openDialog = (row?: DialogRow) => { |
||||
resetForm(); |
||||
getMenuData(); |
||||
if(row) { |
||||
getRole(row.id).then((res:any)=>{ |
||||
if(res.data.role){ |
||||
state.formData = res.data.role; |
||||
state.formData.menuIds = res.data.menuIds??[] |
||||
} |
||||
}) |
||||
} |
||||
state.isShowDialog = true; |
||||
}; |
||||
// 关闭弹窗 |
||||
const closeDialog = () => { |
||||
state.isShowDialog = false; |
||||
}; |
||||
// 取消 |
||||
const onCancel = () => { |
||||
closeDialog(); |
||||
}; |
||||
// 新增 |
||||
const onSubmit = () => { |
||||
const formWrap = unref(formRef) as any; |
||||
if (!formWrap) return; |
||||
formWrap.validate((valid: boolean) => { |
||||
if (valid) { |
||||
state.loading = true; |
||||
state.formData.menuIds = getMenuAllCheckedKeys(); |
||||
if(state.formData.id===0){ |
||||
//添加 |
||||
addRole(state.formData).then(()=>{ |
||||
ElMessage.success('角色添加成功'); |
||||
closeDialog(); // 关闭弹窗 |
||||
resetMenuSession() |
||||
emit('getRoleList') |
||||
}).finally(()=>{ |
||||
state.loading = false; |
||||
}) |
||||
}else{ |
||||
//修改 |
||||
editRole(state.formData).then(()=>{ |
||||
ElMessage.success('角色修改成功'); |
||||
closeDialog(); // 关闭弹窗 |
||||
resetMenuSession() |
||||
emit('getRoleList') |
||||
}).finally(()=>{ |
||||
state.loading = false; |
||||
}) |
||||
} |
||||
} |
||||
}); |
||||
}; |
||||
// 获取菜单结构数据 |
||||
const getMenuData = () => { |
||||
getRoleParams().then((res:any)=>{ |
||||
state.menuData = proxy.handleTree(res.data.menu, "id","pid"); |
||||
}) |
||||
}; |
||||
const resetForm = ()=>{ |
||||
state.menuCheckStrictly=false; |
||||
state.menuExpand = false; |
||||
state.menuNodeAll = false; |
||||
state.formData = { |
||||
id:0, |
||||
name: '', |
||||
status: 1, |
||||
listOrder: 0, |
||||
remark: '', |
||||
menuIds:[] |
||||
} |
||||
}; |
||||
/** 树权限（展开/折叠）*/ |
||||
const handleCheckedTreeExpand = (value:any) => { |
||||
let treeList = state.menuData; |
||||
for (let i = 0; i < treeList.length; i++) { |
||||
menuRef.value.store.nodesMap[treeList[i].id].expanded = value; |
||||
} |
||||
} |
||||
|
||||
/** 树权限（全选/全不选） */ |
||||
const handleCheckedTreeNodeAll = (value:any) => { |
||||
menuRef.value.setCheckedNodes(value ? state.menuData : []); |
||||
} |
||||
|
||||
/** 树权限（父子联动） */ |
||||
const handleCheckedTreeConnect = (value:any) => { |
||||
state.menuCheckStrictly = value ? true : false; |
||||
} |
||||
|
||||
/** 所有菜单节点数据 */ |
||||
function getMenuAllCheckedKeys() { |
||||
// 目前被选中的菜单节点 |
||||
let checkedKeys = menuRef.value.getCheckedKeys(); |
||||
// 半选中的菜单节点 |
||||
let halfCheckedKeys = menuRef.value.getHalfCheckedKeys(); |
||||
checkedKeys.unshift.apply(checkedKeys, halfCheckedKeys); |
||||
return checkedKeys; |
||||
} |
||||
|
||||
// 重置菜单session |
||||
const resetMenuSession = () => { |
||||
getBackEndControlRoutes(); |
||||
}; |
||||
return { |
||||
openDialog, |
||||
closeDialog, |
||||
onCancel, |
||||
onSubmit, |
||||
menuRef, |
||||
formRef, |
||||
handleCheckedTreeExpand, |
||||
handleCheckedTreeNodeAll, |
||||
handleCheckedTreeConnect, |
||||
resetMenuSession, |
||||
...toRefs(state), |
||||
}; |
||||
}, |
||||
}); |
||||
</script> |
||||
|
||||
<style scoped lang="scss"> |
||||
.tree-border { |
||||
margin-top: 5px; |
||||
border: 1px solid #e5e6e7!important; |
||||
background: #fff none!important; |
||||
border-radius: 4px; |
||||
} |
||||
.system-edit-role-container { |
||||
.menu-data-tree { |
||||
border: var(--el-input-border, var(--el-border-base)); |
||||
border-radius: var(--el-input-border-radius, var(--el-border-radius-base)); |
||||
padding: 5px; |
||||
} |
||||
} |
||||
</style> |
||||
Loading…
Reference in new issue