|
@ -4,59 +4,42 @@ import {ElMessage} from 'element-plus' |
|
|
import _ from 'lodash' |
|
|
import _ from 'lodash' |
|
|
import request from '@/util/http' |
|
|
import request from '@/util/http' |
|
|
import API from '@/util/http' |
|
|
import API from '@/util/http' |
|
|
// 客户明细表格 什么表格??????? |
|
|
|
|
|
const tableData = ref([]) |
|
|
|
|
|
|
|
|
import { useAdminStore } from "@/store/index.js" |
|
|
|
|
|
import { storeToRefs } from "pinia" |
|
|
|
|
|
const adminStore = useAdminStore(); |
|
|
|
|
|
const { adminData, menuTree } = storeToRefs(adminStore); |
|
|
|
|
|
import { permissionMapping, findMenuById } from "@/utils/menuTreePermission.js" |
|
|
|
|
|
|
|
|
|
|
|
// 表单验证ref |
|
|
|
|
|
const Ref = ref(null) |
|
|
const roleData = ref([]) |
|
|
const roleData = ref([]) |
|
|
const total = ref(100) |
|
|
const total = ref(100) |
|
|
const roleTotal = ref(100)//角色分页 |
|
|
|
|
|
// 搜索admin |
|
|
|
|
|
|
|
|
const roleTotal = ref(100) |
|
|
|
|
|
const treeRef = ref(null) |
|
|
const admin = ref({ |
|
|
const admin = ref({ |
|
|
account: '', |
|
|
account: '', |
|
|
market: '', |
|
|
market: '', |
|
|
postiton: '' |
|
|
postiton: '' |
|
|
}) |
|
|
}) |
|
|
// 角色搜索 |
|
|
|
|
|
const role = ref({ |
|
|
const role = ref({ |
|
|
name: '' |
|
|
name: '' |
|
|
}) |
|
|
}) |
|
|
// 搜索对象 |
|
|
|
|
|
const getObj = ref({ |
|
|
const getObj = ref({ |
|
|
pageNum: 1, |
|
|
pageNum: 1, |
|
|
pageSize: 10 |
|
|
pageSize: 10 |
|
|
}) |
|
|
}) |
|
|
// 角色搜索对象 |
|
|
|
|
|
const getRoleObj = ref({ |
|
|
const getRoleObj = ref({ |
|
|
pageNum: 1, |
|
|
pageNum: 1, |
|
|
pageSize: 10 |
|
|
pageSize: 10 |
|
|
}) |
|
|
}) |
|
|
//选地区 |
|
|
|
|
|
const market = ref([]) |
|
|
|
|
|
// 选部门 |
|
|
|
|
|
const postiton = ref([]) |
|
|
|
|
|
|
|
|
|
|
|
// 新增角色弹窗 |
|
|
|
|
|
const permissionAddVisible = ref(false) |
|
|
const permissionAddVisible = ref(false) |
|
|
// 新增角色对象 |
|
|
|
|
|
const addRole = ref({ |
|
|
const addRole = ref({ |
|
|
roleName: '', |
|
|
roleName: '', |
|
|
parentId: null, |
|
|
parentId: null, |
|
|
checkedKeys: [], |
|
|
checkedKeys: [], |
|
|
grade: '', |
|
|
|
|
|
market: '' |
|
|
market: '' |
|
|
}) |
|
|
}) |
|
|
const addRoleMarket = ref([]) |
|
|
const addRoleMarket = ref([]) |
|
|
|
|
|
|
|
|
//这是获取用户信息的接口 |
|
|
|
|
|
const adminData = ref({}) |
|
|
|
|
|
const getAdminData = async function () { |
|
|
|
|
|
try { |
|
|
|
|
|
const result = await API({url: '/admin/userinfo', data: {}}) |
|
|
|
|
|
adminData.value = result |
|
|
|
|
|
console.log('管理员用户信息', adminData.value) |
|
|
|
|
|
} catch (error) { |
|
|
|
|
|
console.log('请求失败', error) |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
const viewRole = ref([]) |
|
|
const viewRole = ref([]) |
|
|
const getRolePermission = async function () { |
|
|
const getRolePermission = async function () { |
|
|
const result = await request({ |
|
|
const result = await request({ |
|
@ -68,29 +51,6 @@ const getRolePermission = async function () { |
|
|
viewRole.value = collectIds(result.data) |
|
|
viewRole.value = collectIds(result.data) |
|
|
console.log('result111', viewRole.value); |
|
|
console.log('result111', viewRole.value); |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
const get = async function (val) { |
|
|
|
|
|
try { |
|
|
|
|
|
if (typeof val === 'number') { |
|
|
|
|
|
getObj.value.pageNum = val |
|
|
|
|
|
} |
|
|
|
|
|
console.log('搜索参数', getObj.value, admin.value) |
|
|
|
|
|
const result = await request({ |
|
|
|
|
|
url: '/permission/getPermission', |
|
|
|
|
|
data: { |
|
|
|
|
|
...getObj.value, |
|
|
|
|
|
permission: { |
|
|
|
|
|
...admin.value |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
}) |
|
|
|
|
|
tableData.value = result.data.list |
|
|
|
|
|
console.log('tableData', tableData.value) |
|
|
|
|
|
total.value = result.data.total |
|
|
|
|
|
} catch (error) { |
|
|
|
|
|
console.log('请求失败', error) |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
const getRoleList = async function (val) { |
|
|
const getRoleList = async function (val) { |
|
|
try { |
|
|
try { |
|
|
if (typeof val === 'number') { |
|
|
if (typeof val === 'number') { |
|
@ -138,7 +98,6 @@ const trimJwCode = () => { |
|
|
admin.value.account = admin.value.account.replace(/\s/g, ''); |
|
|
admin.value.account = admin.value.account.replace(/\s/g, ''); |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
const searchRole = function () { |
|
|
const searchRole = function () { |
|
|
trimJwCode(); |
|
|
trimJwCode(); |
|
|
getObj.value.pageNum = 1 |
|
|
getObj.value.pageNum = 1 |
|
@ -164,32 +123,8 @@ const getRoleArea = async function () { |
|
|
console.log('请求失败', error) |
|
|
console.log('请求失败', error) |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
const getArea = async function () { |
|
|
|
|
|
try { |
|
|
|
|
|
const result = await request({ |
|
|
|
|
|
url: '/general/adminMarkets', |
|
|
|
|
|
data: {account: adminData.value.account} |
|
|
|
|
|
}) |
|
|
|
|
|
market.value = result.data |
|
|
|
|
|
} catch (error) { |
|
|
|
|
|
console.log('请求失败', error) |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
// 获取部门 |
|
|
|
|
|
const getStore = async function () { |
|
|
|
|
|
try { |
|
|
|
|
|
const result = await request({ |
|
|
|
|
|
url: '/permission/getposition', |
|
|
|
|
|
data: {} |
|
|
|
|
|
}) |
|
|
|
|
|
postiton.value = result.data |
|
|
|
|
|
} catch (error) { |
|
|
|
|
|
console.log('请求失败', error) |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
// 新增角色弹窗 |
|
|
// 新增角色弹窗 |
|
|
const openPermissionAddVisible = function () { |
|
|
const openPermissionAddVisible = function () { |
|
|
|
|
|
|
|
|
permissionAddVisible.value = true |
|
|
permissionAddVisible.value = true |
|
|
getRoles() |
|
|
getRoles() |
|
|
getLists() |
|
|
getLists() |
|
@ -209,9 +144,6 @@ const handleDialogClose = function(){ |
|
|
closePermissionAddVisible() |
|
|
closePermissionAddVisible() |
|
|
console.log('hhh'); |
|
|
console.log('hhh'); |
|
|
} |
|
|
} |
|
|
// 表单验证ref |
|
|
|
|
|
const Ref = ref(null) |
|
|
|
|
|
|
|
|
|
|
|
// 权限类别 |
|
|
// 权限类别 |
|
|
const permissionList = ref([]) |
|
|
const permissionList = ref([]) |
|
|
const getRoles = async function () { |
|
|
const getRoles = async function () { |
|
@ -237,7 +169,7 @@ const collectIds = (tree) => { |
|
|
} |
|
|
} |
|
|
}); |
|
|
}); |
|
|
return ids; |
|
|
return ids; |
|
|
}; |
|
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
//给data数据加上disabled属性,控制是否禁用 |
|
|
//给data数据加上disabled属性,控制是否禁用 |
|
|
function processTreeData(data) { |
|
|
function processTreeData(data) { |
|
@ -270,7 +202,6 @@ const handleAddRole = async function () { |
|
|
data: { |
|
|
data: { |
|
|
"roleName": addRole.value.roleName, |
|
|
"roleName": addRole.value.roleName, |
|
|
"menuIds": finalCheckedKeys, |
|
|
"menuIds": finalCheckedKeys, |
|
|
"priority": addRole.value.grade, |
|
|
|
|
|
"fatherId": addRole.value.parentId, |
|
|
"fatherId": addRole.value.parentId, |
|
|
"market": addRole.value.market |
|
|
"market": addRole.value.market |
|
|
} |
|
|
} |
|
@ -278,14 +209,14 @@ const handleAddRole = async function () { |
|
|
if (res.code === 200) { |
|
|
if (res.code === 200) { |
|
|
ElMessage.success('角色' + addRole.value.roleName + '添加成功') |
|
|
ElMessage.success('角色' + addRole.value.roleName + '添加成功') |
|
|
console.log('成功了,看看addRole', addRole.value) |
|
|
console.log('成功了,看看addRole', addRole.value) |
|
|
console.log('提交的权限ID列表:', finalCheckedKeys); |
|
|
|
|
|
|
|
|
console.log('提交的权限ID列表:', finalCheckedKeys) |
|
|
closePermissionAddVisible() |
|
|
closePermissionAddVisible() |
|
|
} else { |
|
|
} else { |
|
|
ElMessage.error(res.msg) |
|
|
ElMessage.error(res.msg) |
|
|
} |
|
|
} |
|
|
} catch (error) { |
|
|
} catch (error) { |
|
|
console.log('请求失败', error) |
|
|
console.log('请求失败', error) |
|
|
console.log('失败,看看addRole', addRole.value); |
|
|
|
|
|
|
|
|
console.log('失败,看看addRole', addRole.value) |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
@ -337,27 +268,25 @@ const getLists = async function () { |
|
|
}) |
|
|
}) |
|
|
if (result.code === 200) { |
|
|
if (result.code === 200) { |
|
|
if (typeof result.data === 'string' && result.data) { |
|
|
if (typeof result.data === 'string' && result.data) { |
|
|
addRoleMarket.value = result.data.split(','); |
|
|
|
|
|
|
|
|
addRoleMarket.value = result.data.split(',') |
|
|
addRole.value.market = '' |
|
|
addRole.value.market = '' |
|
|
} else if (Array.isArray(result.data)) { |
|
|
} else if (Array.isArray(result.data)) { |
|
|
addRoleMarket.value = result.data |
|
|
addRoleMarket.value = result.data |
|
|
addRole.value.market = '' |
|
|
addRole.value.market = '' |
|
|
} else { |
|
|
} else { |
|
|
addRoleMarket.value = []; |
|
|
|
|
|
|
|
|
addRoleMarket.value = [] |
|
|
addRole.value.market = '' |
|
|
addRole.value.market = '' |
|
|
} |
|
|
} |
|
|
} else { |
|
|
} else { |
|
|
ElMessage.error('该上级角色无归属地区') |
|
|
ElMessage.error('该上级角色无归属地区') |
|
|
console.log('该上级角色无归属地区'); |
|
|
|
|
|
|
|
|
console.log('该上级角色无归属地区') |
|
|
|
|
|
|
|
|
} |
|
|
} |
|
|
console.log('addRoleMarket.value', addRoleMarket.value); |
|
|
|
|
|
|
|
|
console.log('addRoleMarket.value', addRoleMarket.value) |
|
|
} else { |
|
|
} else { |
|
|
addRoleMarket.value = RoleArea.value |
|
|
addRoleMarket.value = RoleArea.value |
|
|
console.log('elseRoleArea', RoleArea); |
|
|
console.log('elseRoleArea', RoleArea); |
|
|
|
|
|
|
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
} catch (error) { |
|
|
} catch (error) { |
|
|
console.log('请求失败', error) |
|
|
console.log('请求失败', error) |
|
|
} |
|
|
} |
|
@ -369,67 +298,62 @@ const goldenBeanMenuIds = new Set([ |
|
|
41, 47, 46, 48, // 充值管理 -> 金豆充值 |
|
|
41, 47, 46, 48, // 充值管理 -> 金豆充值 |
|
|
42, 50, 49, 52, 51, // 消耗管理 -> 金豆消耗 |
|
|
42, 50, 49, 52, 51, // 消耗管理 -> 金豆消耗 |
|
|
45, 53 // 客户账户明细 -> 金豆客户账户明细 |
|
|
45, 53 // 客户账户明细 -> 金豆客户账户明细 |
|
|
]); |
|
|
|
|
|
|
|
|
]) |
|
|
const filterGoldenBeanMenus = (tree) => { |
|
|
const filterGoldenBeanMenus = (tree) => { |
|
|
return tree |
|
|
return tree |
|
|
.filter(item => { |
|
|
.filter(item => { |
|
|
// 排除金豆相关的顶层菜单 |
|
|
// 排除金豆相关的顶层菜单 |
|
|
if (goldenBeanMenuIds.has(item.id)) { |
|
|
if (goldenBeanMenuIds.has(item.id)) { |
|
|
return false; |
|
|
|
|
|
|
|
|
return false |
|
|
} |
|
|
} |
|
|
// 递归处理子菜单 |
|
|
// 递归处理子菜单 |
|
|
if (item.children && item.children.length > 0) { |
|
|
if (item.children && item.children.length > 0) { |
|
|
item.children = filterGoldenBeanMenus(item.children); |
|
|
|
|
|
|
|
|
item.children = filterGoldenBeanMenus(item.children) |
|
|
|
|
|
} |
|
|
|
|
|
return true |
|
|
|
|
|
}) |
|
|
} |
|
|
} |
|
|
return true; |
|
|
|
|
|
}); |
|
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const treeRef = ref(null) |
|
|
|
|
|
// 处理编辑角色权限时的勾选事件 |
|
|
// 处理编辑角色权限时的勾选事件 |
|
|
const handleEditRolePermissionCheck = (checkedNodes, checkedInfo) => { |
|
|
const handleEditRolePermissionCheck = (checkedNodes, checkedInfo) => { |
|
|
const {checkedKeys, checkedNodes: allCheckedNodes} = checkedInfo; |
|
|
|
|
|
|
|
|
const { checkedKeys, checkedNodes: allCheckedNodes } = checkedInfo |
|
|
|
|
|
|
|
|
// 判断是否有选中的节点 |
|
|
// 判断是否有选中的节点 |
|
|
if (allCheckedNodes.length === 0) { |
|
|
if (allCheckedNodes.length === 0) { |
|
|
permissionEditRoleObj.value.checkedKeys = []; |
|
|
|
|
|
return; |
|
|
|
|
|
|
|
|
permissionEditRoleObj.value.checkedKeys = [] |
|
|
|
|
|
return |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
// 由于设置了 check-strictly="false",Element Plus 会自动处理父子节点联动 |
|
|
// 由于设置了 check-strictly="false",Element Plus 会自动处理父子节点联动 |
|
|
// 我们只需要使用 checkedKeys,它已经包含了所有必要的节点ID |
|
|
// 我们只需要使用 checkedKeys,它已经包含了所有必要的节点ID |
|
|
permissionEditRoleObj.value.checkedKeys = checkedKeys; |
|
|
|
|
|
|
|
|
permissionEditRoleObj.value.checkedKeys = checkedKeys |
|
|
|
|
|
|
|
|
console.log('编辑角色选中的权限ID:', checkedKeys); |
|
|
|
|
|
console.log('选中的节点数量:', allCheckedNodes.length); |
|
|
|
|
|
|
|
|
console.log('编辑角色选中的权限ID:', checkedKeys) |
|
|
|
|
|
console.log('选中的节点数量:', allCheckedNodes.length) |
|
|
}; |
|
|
}; |
|
|
const handleCheckChange = async (checkedNodes, checkedInfo) => { |
|
|
const handleCheckChange = async (checkedNodes, checkedInfo) => { |
|
|
const {checkedKeys, checkedNodes: allCheckedNodes} = checkedInfo; |
|
|
|
|
|
|
|
|
const { checkedKeys, checkedNodes: allCheckedNodes } = checkedInfo |
|
|
|
|
|
|
|
|
// 判断是否有选中的节点 |
|
|
// 判断是否有选中的节点 |
|
|
if (allCheckedNodes.length === 0) { |
|
|
if (allCheckedNodes.length === 0) { |
|
|
addRole.value.checkedKeys = []; |
|
|
|
|
|
return; |
|
|
|
|
|
|
|
|
addRole.value.checkedKeys = [] |
|
|
|
|
|
return |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
// 创建一个Set存储所有需要选中的ID(包括父级) |
|
|
// 创建一个Set存储所有需要选中的ID(包括父级) |
|
|
const allKeys = new Set(checkedKeys); |
|
|
|
|
|
|
|
|
const allKeys = new Set(checkedKeys) |
|
|
|
|
|
|
|
|
// 遍历所有选中的节点,为每个节点添加其父级 |
|
|
// 遍历所有选中的节点,为每个节点添加其父级 |
|
|
allCheckedNodes.forEach(node => { |
|
|
allCheckedNodes.forEach(node => { |
|
|
// 为每个选中的节点单独查找父级 |
|
|
// 为每个选中的节点单独查找父级 |
|
|
selectParentNodes(data.value, node.id, allKeys); |
|
|
|
|
|
|
|
|
selectParentNodes(data.value, node.id, allKeys) |
|
|
}); |
|
|
}); |
|
|
|
|
|
|
|
|
// 将Set转换为数组并更新 |
|
|
// 将Set转换为数组并更新 |
|
|
addRole.value.checkedKeys = Array.from(allKeys); |
|
|
|
|
|
console.log('新增角色包含所有父级的选中项:', addRole.value.checkedKeys); |
|
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
addRole.value.checkedKeys = Array.from(allKeys) |
|
|
|
|
|
console.log('新增角色包含所有父级的选中项:', addRole.value.checkedKeys) |
|
|
|
|
|
} |
|
|
const selectParentNodes = (treeData, nodeId, checkedKeys) => { |
|
|
const selectParentNodes = (treeData, nodeId, checkedKeys) => { |
|
|
if (!Array.isArray(treeData)) return false; |
|
|
|
|
|
|
|
|
if (!Array.isArray(treeData)) return false |
|
|
|
|
|
|
|
|
for (const item of treeData) { |
|
|
for (const item of treeData) { |
|
|
// 先检查子节点 |
|
|
// 先检查子节点 |
|
@ -438,32 +362,32 @@ const selectParentNodes = (treeData, nodeId, checkedKeys) => { |
|
|
if (foundInChildren) { |
|
|
if (foundInChildren) { |
|
|
// 找到子节点后添加当前节点(父节点) |
|
|
// 找到子节点后添加当前节点(父节点) |
|
|
checkedKeys.add(item.id); |
|
|
checkedKeys.add(item.id); |
|
|
return true; |
|
|
|
|
|
|
|
|
return true |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
// 检查当前节点是否为目标节点 |
|
|
// 检查当前节点是否为目标节点 |
|
|
if (item.id === nodeId) { |
|
|
if (item.id === nodeId) { |
|
|
return true; |
|
|
|
|
|
|
|
|
return true |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
return false; |
|
|
|
|
|
|
|
|
return false |
|
|
}; |
|
|
}; |
|
|
//点击角色权限菜单树点击展示逻辑 |
|
|
//点击角色权限菜单树点击展示逻辑 |
|
|
const menuTreeVisible = ref(false); |
|
|
|
|
|
const currentRoleMenuTree = ref([]); |
|
|
|
|
|
const currentRoleName = ref(''); |
|
|
|
|
|
|
|
|
const menuTreeVisible = ref(false) |
|
|
|
|
|
const currentRoleMenuTree = ref([]) |
|
|
|
|
|
const currentRoleName = ref('') |
|
|
const Rolecheckedkeys = ref([]) |
|
|
const Rolecheckedkeys = ref([]) |
|
|
const showMenuTree = (treeData, roleName) => { |
|
|
const showMenuTree = (treeData, roleName) => { |
|
|
currentRoleMenuTree.value = processTreeData(treeData) || []; |
|
|
currentRoleMenuTree.value = processTreeData(treeData) || []; |
|
|
console.log('currentRoleMenuTree.value', currentRoleMenuTree.value); |
|
|
|
|
|
|
|
|
console.log('currentRoleMenuTree.value', currentRoleMenuTree.value) |
|
|
Rolecheckedkeys.value = collectIds(treeData) |
|
|
Rolecheckedkeys.value = collectIds(treeData) |
|
|
console.log('Rolecheckedkeys', Rolecheckedkeys.value); |
|
|
|
|
|
|
|
|
console.log('Rolecheckedkeys', Rolecheckedkeys.value) |
|
|
|
|
|
|
|
|
currentRoleName.value = roleName || '权限详情'; |
|
|
|
|
|
|
|
|
currentRoleName.value = roleName || '权限详情' |
|
|
menuTreeVisible.value = true; |
|
|
menuTreeVisible.value = true; |
|
|
}; |
|
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
// 编辑角色对象 |
|
|
// 编辑角色对象 |
|
|
const permissionEditRoleObj = ref({ |
|
|
const permissionEditRoleObj = ref({ |
|
@ -472,39 +396,37 @@ const permissionEditRoleObj = ref({ |
|
|
market: '', |
|
|
market: '', |
|
|
parentId: null, |
|
|
parentId: null, |
|
|
parentName: '', |
|
|
parentName: '', |
|
|
checkedKeys: [], |
|
|
|
|
|
grade: '', |
|
|
|
|
|
}); |
|
|
|
|
|
|
|
|
checkedKeys: [] |
|
|
|
|
|
}) |
|
|
|
|
|
|
|
|
// 编辑角色弹窗 |
|
|
// 编辑角色弹窗 |
|
|
const permissionEditRoleVisible = ref(false); |
|
|
|
|
|
|
|
|
const permissionEditRoleVisible = ref(false) |
|
|
|
|
|
|
|
|
const collectIds2 = (tree) => { |
|
|
const collectIds2 = (tree) => { |
|
|
let ids = []; |
|
|
|
|
|
|
|
|
let ids = [] |
|
|
tree.forEach((node) => { |
|
|
tree.forEach((node) => { |
|
|
// 如果当前节点没有 children 或 children 为空,说明是叶子节点 |
|
|
// 如果当前节点没有 children 或 children 为空,说明是叶子节点 |
|
|
if (!node.children || node.children.length === 0) { |
|
|
if (!node.children || node.children.length === 0) { |
|
|
ids.push(node.id); |
|
|
|
|
|
|
|
|
ids.push(node.id) |
|
|
} else { |
|
|
} else { |
|
|
// 如果有 children,递归收集子节点的叶子节点 |
|
|
// 如果有 children,递归收集子节点的叶子节点 |
|
|
ids = ids.concat(collectIds2(node.children)); |
|
|
|
|
|
|
|
|
ids = ids.concat(collectIds2(node.children)) |
|
|
|
|
|
} |
|
|
|
|
|
}) |
|
|
|
|
|
return ids |
|
|
} |
|
|
} |
|
|
}); |
|
|
|
|
|
return ids; |
|
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// 编辑角色初始化 |
|
|
// 编辑角色初始化 |
|
|
const permissionEditRoleInit = async function (row) { |
|
|
const permissionEditRoleInit = async function (row) { |
|
|
console.log('row', row); |
|
|
|
|
|
console.log('row.tree', row.tree); |
|
|
|
|
|
permissionEditRoleObj.value = {}; |
|
|
|
|
|
permissionEditRoleObj.value.id = row.id; |
|
|
|
|
|
permissionEditRoleObj.value.roleName = row.roleName; |
|
|
|
|
|
permissionEditRoleObj.value.market = row.market; |
|
|
|
|
|
permissionEditRoleObj.value.parentId = row.fatherId; |
|
|
|
|
|
permissionEditRoleObj.value.parentName = row.fatherName; |
|
|
|
|
|
permissionEditRoleObj.value.grade = row.priority; |
|
|
|
|
|
|
|
|
console.log('row', row) |
|
|
|
|
|
console.log('row.tree', row.tree) |
|
|
|
|
|
permissionEditRoleObj.value = {} |
|
|
|
|
|
permissionEditRoleObj.value.id = row.id |
|
|
|
|
|
permissionEditRoleObj.value.roleName = row.roleName |
|
|
|
|
|
permissionEditRoleObj.value.market = row.market |
|
|
|
|
|
permissionEditRoleObj.value.parentId = row.fatherId |
|
|
|
|
|
permissionEditRoleObj.value.parentName = row.fatherName |
|
|
|
|
|
|
|
|
try { |
|
|
try { |
|
|
let roleId = permissionEditRoleObj.value.parentId; |
|
|
let roleId = permissionEditRoleObj.value.parentId; |
|
@ -575,7 +497,6 @@ const permissionEditRole = async function () { |
|
|
"id": permissionEditRoleObj.value.id, |
|
|
"id": permissionEditRoleObj.value.id, |
|
|
"roleName": permissionEditRoleObj.value.roleName, |
|
|
"roleName": permissionEditRoleObj.value.roleName, |
|
|
"menuIds": finalCheckedKeys, |
|
|
"menuIds": finalCheckedKeys, |
|
|
"priority": permissionEditRoleObj.value.grade, |
|
|
|
|
|
"fatherId": permissionEditRoleObj.value.parentId, |
|
|
"fatherId": permissionEditRoleObj.value.parentId, |
|
|
"market": permissionEditRoleObj.value.market |
|
|
"market": permissionEditRoleObj.value.market |
|
|
} |
|
|
} |
|
@ -631,10 +552,6 @@ const Rolerules = reactive({ |
|
|
market: [ |
|
|
market: [ |
|
|
{ required: true, message: '请选择归属地区', trigger: 'change' } |
|
|
{ required: true, message: '请选择归属地区', trigger: 'change' } |
|
|
], |
|
|
], |
|
|
grade: [ |
|
|
|
|
|
{required: true, message: '请输入优先级', trigger: 'blur'}, |
|
|
|
|
|
{pattern: /^[1-9]\d{0,2}$/, message: '优先级应为1-999的数字', trigger: 'blur'} |
|
|
|
|
|
], |
|
|
|
|
|
checkedKeys: [ |
|
|
checkedKeys: [ |
|
|
{ |
|
|
{ |
|
|
required: true, |
|
|
required: true, |
|
@ -657,10 +574,6 @@ const throttledHandleAddRole = _.throttle(handleAddRole, 5000, { |
|
|
|
|
|
|
|
|
// 挂载 |
|
|
// 挂载 |
|
|
onMounted(async function () { |
|
|
onMounted(async function () { |
|
|
await getAdminData() |
|
|
|
|
|
await get() |
|
|
|
|
|
await getArea() |
|
|
|
|
|
await getStore() |
|
|
|
|
|
await getRoleList() |
|
|
await getRoleList() |
|
|
await getRolePermission() |
|
|
await getRolePermission() |
|
|
await getRoleArea() |
|
|
await getRoleArea() |
|
@ -669,20 +582,18 @@ onMounted(async function () { |
|
|
</script> |
|
|
</script> |
|
|
<template> |
|
|
<template> |
|
|
<div> |
|
|
<div> |
|
|
<!-- 角色搜索 --> |
|
|
|
|
|
<el-card style="margin-bottom: 20px;margin-top:10px"> |
|
|
<el-card style="margin-bottom: 20px;margin-top:10px"> |
|
|
<div class="head-card"> |
|
|
|
|
|
<el-text class="mx-1" size="large">角色名称:</el-text> |
|
|
|
|
|
|
|
|
<div style="display: flex;"> |
|
|
|
|
|
<el-text size="large">角色名称:</el-text> |
|
|
<el-input v-model="role.name" style="width: 240px" placeholder="请输入角色名称" clearable /> |
|
|
<el-input v-model="role.name" style="width: 240px" placeholder="请输入角色名称" clearable /> |
|
|
<div class="head-card-btn"> |
|
|
|
|
|
|
|
|
<div style="margin-left: auto;"> |
|
|
<el-button type="success" @click="reset()">重置</el-button> |
|
|
<el-button type="success" @click="reset()">重置</el-button> |
|
|
<el-button type="primary" @click="searchRole()">查询</el-button> |
|
|
<el-button type="primary" @click="searchRole()">查询</el-button> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</el-card> |
|
|
</el-card> |
|
|
<!-- 展示表单 --> |
|
|
|
|
|
<el-card> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<el-card> |
|
|
<div class="add-item"> |
|
|
<div class="add-item"> |
|
|
<el-button style="color: #048efb; border: 1px solid #048efb" @click="permissionAddInit()">新增角色</el-button> |
|
|
<el-button style="color: #048efb; border: 1px solid #048efb" @click="permissionAddInit()">新增角色</el-button> |
|
|
</div> |
|
|
</div> |
|
@ -698,7 +609,6 @@ onMounted(async function () { |
|
|
|
|
|
|
|
|
<el-table-column prop="roleName" label="角色名称" /> |
|
|
<el-table-column prop="roleName" label="角色名称" /> |
|
|
<el-table-column prop="fatherName" label="上级角色" /> |
|
|
<el-table-column prop="fatherName" label="上级角色" /> |
|
|
<el-table-column prop="priority" label="优先级"/> |
|
|
|
|
|
<el-table-column label="权限范围" show-overflow-tooltip> |
|
|
<el-table-column label="权限范围" show-overflow-tooltip> |
|
|
<template #default="scope"> |
|
|
<template #default="scope"> |
|
|
<div class="permission-cell" @click="showMenuTree(scope.row.tree, scope.row.roleName)"> |
|
|
<div class="permission-cell" @click="showMenuTree(scope.row.tree, scope.row.roleName)"> |
|
@ -706,24 +616,6 @@ onMounted(async function () { |
|
|
</div> |
|
|
</div> |
|
|
</template> |
|
|
</template> |
|
|
</el-table-column> |
|
|
</el-table-column> |
|
|
<!-- <el-table-column prop="operation" label="操作" width="200px"> |
|
|
|
|
|
<template #default="scope"> |
|
|
|
|
|
<el-popconfirm title="确定将此角色删除吗?" @confirm="delRoleConfirm"> |
|
|
|
|
|
<template #reference> |
|
|
|
|
|
<el-button type="danger" text @click="delRole(scope.row)" |
|
|
|
|
|
:disabled="scope.row.id === 1 || scope.row.id === 2"> |
|
|
|
|
|
删除 |
|
|
|
|
|
</el-button> |
|
|
|
|
|
</template> |
|
|
|
|
|
<template #actions="{ confirm, cancel }"> |
|
|
|
|
|
<el-button size="small" @click="cancel">取消</el-button> |
|
|
|
|
|
<el-button type="primary" size="small" @click="confirm"> |
|
|
|
|
|
确定 |
|
|
|
|
|
</el-button> |
|
|
|
|
|
</template> |
|
|
|
|
|
</el-popconfirm> |
|
|
|
|
|
</template> |
|
|
|
|
|
</el-table-column> --> |
|
|
|
|
|
<el-table-column prop="operation" label="操作" width="200px"> |
|
|
<el-table-column prop="operation" label="操作" width="200px"> |
|
|
<template #default="scope"> |
|
|
<template #default="scope"> |
|
|
<el-button type="warning" text @click="permissionEditRoleInit(scope.row)" :disabled="scope.row.id === 2"> |
|
|
<el-button type="warning" text @click="permissionEditRoleInit(scope.row)" :disabled="scope.row.id === 2"> |
|
@ -734,15 +626,14 @@ onMounted(async function () { |
|
|
</el-table> |
|
|
</el-table> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<!-- 分页 --> |
|
|
|
|
|
<div class="pagination" style="margin-top: 20px"> |
|
|
|
|
|
|
|
|
<div style="margin-top: 20px;display: flex;"> |
|
|
<el-pagination background :page-size="getObj.pageSize" :page-sizes="[5, 10, 20, 50, 100]" |
|
|
<el-pagination background :page-size="getObj.pageSize" :page-sizes="[5, 10, 20, 50, 100]" |
|
|
layout="total, sizes, prev, pager, next, jumper" :total="roleTotal" |
|
|
|
|
|
@size-change="handleRolePageSizeChange" |
|
|
|
|
|
|
|
|
layout="total, sizes, prev, pager, next, jumper" :total="roleTotal" @size-change="handleRolePageSizeChange" |
|
|
@current-change="handleRoleCurrentChange"></el-pagination> |
|
|
@current-change="handleRoleCurrentChange"></el-pagination> |
|
|
</div> |
|
|
</div> |
|
|
</el-card> |
|
|
</el-card> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<!-- 角色菜单树展示 --> |
|
|
<!-- 角色菜单树展示 --> |
|
|
<el-dialog v-model="menuTreeVisible" :title='`权限详情:${currentRoleName}`' width="600px"> |
|
|
<el-dialog v-model="menuTreeVisible" :title='`权限详情:${currentRoleName}`' width="600px"> |
|
|
<el-tree :data="currentRoleMenuTree" node-key="id" :props="{ label: 'menuName', children: 'children' }" |
|
|
<el-tree :data="currentRoleMenuTree" node-key="id" :props="{ label: 'menuName', children: 'children' }" |
|
@ -754,7 +645,8 @@ onMounted(async function () { |
|
|
</el-dialog> |
|
|
</el-dialog> |
|
|
|
|
|
|
|
|
<!-- 新增角色 --> |
|
|
<!-- 新增角色 --> |
|
|
<el-dialog v-model="permissionAddVisible" title="新增角色" width="800px" :close-on-click-modal="false" @close="handleDialogClose "> |
|
|
|
|
|
|
|
|
<el-dialog v-model="permissionAddVisible" title="新增角色" width="800px" :close-on-click-modal="false" |
|
|
|
|
|
@close="handleDialogClose"> |
|
|
<template #footer> |
|
|
<template #footer> |
|
|
<el-form ref="Ref" :rules="Rolerules" :model="addRole" label-width="auto" |
|
|
<el-form ref="Ref" :rules="Rolerules" :model="addRole" label-width="auto" |
|
|
style="max-width: 600px; align-items: center"> |
|
|
style="max-width: 600px; align-items: center"> |
|
@ -762,8 +654,7 @@ onMounted(async function () { |
|
|
<el-input v-model="addRole.roleName" placeholder="请输入角色名称" style="width: 220px" /> |
|
|
<el-input v-model="addRole.roleName" placeholder="请输入角色名称" style="width: 220px" /> |
|
|
</el-form-item> |
|
|
</el-form-item> |
|
|
<el-form-item prop="parentName" label="上级角色:"> |
|
|
<el-form-item prop="parentName" label="上级角色:"> |
|
|
<el-select v-model="addRole.parentId" placeholder="请选择上级角色" style="width: 220px" @change="getLists" |
|
|
|
|
|
clearable> |
|
|
|
|
|
|
|
|
<el-select v-model="addRole.parentId" placeholder="请选择上级角色" style="width: 220px" @change="getLists" clearable> |
|
|
<el-option v-for="item in permissionList" :key="item.value" :label="item.label" |
|
|
<el-option v-for="item in permissionList" :key="item.value" :label="item.label" |
|
|
:value="item.value"></el-option> |
|
|
:value="item.value"></el-option> |
|
|
</el-select> |
|
|
</el-select> |
|
@ -777,8 +668,7 @@ onMounted(async function () { |
|
|
<el-form-item prop="checkedKeys" label="权限列表:" required> |
|
|
<el-form-item prop="checkedKeys" label="权限列表:" required> |
|
|
<el-tree v-if="data.length > 0" :data="data" show-checkbox node-key="id" |
|
|
<el-tree v-if="data.length > 0" :data="data" show-checkbox node-key="id" |
|
|
:props="{ label: 'menuName', children: 'children' }" :checked-keys="addRole.checkedKeys" |
|
|
:props="{ label: 'menuName', children: 'children' }" :checked-keys="addRole.checkedKeys" |
|
|
:check-strictly="false" |
|
|
|
|
|
@check="handleCheckChange"> |
|
|
|
|
|
|
|
|
:check-strictly="false" @check="handleCheckChange"> |
|
|
<template #default="{ node, data }"> |
|
|
<template #default="{ node, data }"> |
|
|
<span>{{ node.label }}</span> |
|
|
<span>{{ node.label }}</span> |
|
|
</template> |
|
|
</template> |
|
@ -787,9 +677,6 @@ onMounted(async function () { |
|
|
<span style="color: #999;">暂无数据</span> |
|
|
<span style="color: #999;">暂无数据</span> |
|
|
</div> |
|
|
</div> |
|
|
</el-form-item> |
|
|
</el-form-item> |
|
|
<el-form-item prop="grade" label="优先级:" required> |
|
|
|
|
|
<el-input v-model="addRole.grade" placeholder="数字1~999" style="width: 220px"/> |
|
|
|
|
|
</el-form-item> |
|
|
|
|
|
</el-form> |
|
|
</el-form> |
|
|
|
|
|
|
|
|
<div> |
|
|
<div> |
|
@ -800,6 +687,7 @@ onMounted(async function () { |
|
|
</div> |
|
|
</div> |
|
|
</template> |
|
|
</template> |
|
|
</el-dialog> |
|
|
</el-dialog> |
|
|
|
|
|
|
|
|
<!-- 編輯角色彈窗 --> |
|
|
<!-- 編輯角色彈窗 --> |
|
|
<el-dialog v-model="permissionEditRoleVisible" title="编辑角色" width="800px" :close-on-click-modal="false"> |
|
|
<el-dialog v-model="permissionEditRoleVisible" title="编辑角色" width="800px" :close-on-click-modal="false"> |
|
|
<template #footer> |
|
|
<template #footer> |
|
@ -820,8 +708,7 @@ onMounted(async function () { |
|
|
<el-form-item prop="checkedKeys" label="权限列表:" required> |
|
|
<el-form-item prop="checkedKeys" label="权限列表:" required> |
|
|
<el-tree v-if="data.length > 0" :data="data" show-checkbox node-key="id" ref="treeRef" |
|
|
<el-tree v-if="data.length > 0" :data="data" show-checkbox node-key="id" ref="treeRef" |
|
|
:props="{ label: 'menuName', children: 'children' }" |
|
|
:props="{ label: 'menuName', children: 'children' }" |
|
|
:default-checked-keys="permissionEditRoleObj.checkedKeys" |
|
|
|
|
|
:check-strictly="false" |
|
|
|
|
|
|
|
|
:default-checked-keys="permissionEditRoleObj.checkedKeys" :check-strictly="false" |
|
|
@check="handleEditRolePermissionCheck"> |
|
|
@check="handleEditRolePermissionCheck"> |
|
|
<template #default="{ node, data }"> |
|
|
<template #default="{ node, data }"> |
|
|
<span>{{ node.label }}</span> |
|
|
<span>{{ node.label }}</span> |
|
@ -831,9 +718,6 @@ onMounted(async function () { |
|
|
<span style="color: #999;">暂无数据</span> |
|
|
<span style="color: #999;">暂无数据</span> |
|
|
</div> |
|
|
</div> |
|
|
</el-form-item> |
|
|
</el-form-item> |
|
|
<!-- <el-form-item prop="grade" label="优先级:" required> |
|
|
|
|
|
<el-input v-model="permissionEditRoleObj.grade" placeholder="数字1~999" style="width: 220px" /> |
|
|
|
|
|
</el-form-item> --> |
|
|
|
|
|
</el-form> |
|
|
</el-form> |
|
|
|
|
|
|
|
|
<div> |
|
|
<div> |
|
@ -847,20 +731,10 @@ onMounted(async function () { |
|
|
</template> |
|
|
</template> |
|
|
|
|
|
|
|
|
<style scoped> |
|
|
<style scoped> |
|
|
.pagination { |
|
|
|
|
|
display: flex; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.head-card { |
|
|
.head-card { |
|
|
display: flex; |
|
|
display: flex; |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
.head-card-btn { |
|
|
|
|
|
margin-left: auto; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.permission-cell { |
|
|
.permission-cell { |
|
|
cursor: pointer; |
|
|
cursor: pointer; |
|
|
color: #409eff; |
|
|
color: #409eff; |
|
|