Web/admin-govern
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

角色列表添加

Browse Source
This commit is contained in:
仲么了
2024-01-19 14:08:07 +08:00
parent 343bda8c70
commit 9b75f5b38c
19 changed files with 515 additions and 378 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
src/api/user-boot/function.ts
View File

@@ -31,3 +31,12 @@ export function deleteMenu(id: string) {
method: 'delete',
})
}
// 更新角色菜单
export function updateRoleMenu(data:any) {
return createAxios({
url: '/user-boot/function/assignFunctionByRoleIndexes',
method: 'post',
data: data
})
}

25
src/api/user-boot/role.ts Normal file
View File

@@ -0,0 +1,25 @@
import createAxios from '@/utils/request'
export function add(data: any) {
return createAxios({
url: '/user-boot/role/add',
method: 'post',
data: data
})
}
export function update(data: any) {
return createAxios({
url: '/user-boot/role/update',
method: 'post',
data: data
})
}
export function del(data: any) {
return createAxios({
url: '/user-boot/role/delete',
method: 'post',
data: data
})
}

21
src/api/user-boot/roleFuction.ts Normal file
View File

@@ -0,0 +1,21 @@
import createAxios from '@/utils/request'
export function getFunctionsByRoleIndex(data) {
return createAxios({
url: '/user-boot/roleFunction/getFunctionsByRoleIndex',
method: 'post',
params: data
})
}
export function updateRoleMenu(data:any) {
return createAxios({
url: '/user-boot/function/assignFunctionByRoleIndexes',
method: 'post',
data: data
// params: roleIndex,functionIndexList
// data:{
// roleIndex,functionIndexList
// }
})
}

3
src/components/tree/index.vue
View File

@@ -26,13 +26,13 @@
</template>
<script lang="ts" setup>
import { ElTree } from 'element-plus';
import { ref, watch } from 'vue'
defineOptions({
name: 'govern/tree'
})
const filterText = ref('')
const treeRef = ref()
const defaultProps = {
label: 'name',
value: 'id'
@@ -44,6 +44,7 @@ const filterNode = (value: string, data: any) => {
if (!value) return true
return data.name.includes(value)
}
const treeRef = ref<InstanceType<typeof ElTree>>()
defineExpose({ treeRef })
</script>
<style lang="scss" scoped>

464
src/layouts/admin/index.vue
View File

@@ -58,235 +58,234 @@ const init = async () => {
* 后台初始化请求，获取站点配置，动态路由等信息
*/
getRouteMenu().then((res: any) => {
const arr = [
{
id: 1,
pid: 0,
type: 'menu',
title: '控制台',
name: 'dashboard',
path: 'dashboard',
icon: 'fa fa-dashboard',
menu_type: 'tab',
url: '',
component: '/src/views/govern/log/debug.vue',
keepalive: 'dashboard',
extend: 'none',
children: []
},
{
id: 3,
pid: 0,
type: 'menu',
title: '审计管理',
name: 'test',
path: 'test',
icon: 'el-icon-List',
menu_type: 'tab',
url: '',
component: '/src/views/govern/setting/app/index.vue',
keepalive: 'test',
extend: 'none',
children: [
{
id: 1,
pid: 3,
type: 'menu',
title: '图表1',
name: 'comptroller/list1',
path: 'comptroller/list1',
icon: 'el-icon-List',
menu_type: 'tab',
url: '',
component: '/src/views/govern/user/roleCode/index.vue',
keepalive: 'auth/role',
extend: 'none',
children: []
}
]
},
{
id: 3,
pid: 0,
type: 'menu_dir',
title: '电压暂降',
name: 'voltage/sags',
path: 'voltage/sags',
icon: 'el-icon-BellFilled',
menu_type: 'tab',
url: '',
extend: 'none',
children: [
{
id: 1,
pid: 3,
type: 'menu_dir',
title: '运行管理',
name: 'voltage/sags/operationsManagement',
path: 'voltage/sags/operationsManagement',
icon: 'fa-solid fa-bars-progress',
menu_type: 'tab',
url: '',
extend: 'none',
children: [
{
id: 1,
pid: 3,
type: 'menu',
title: '终端运行管理',
name: 'voltage/sags/operationsManagement/index',
path: 'voltage/sags/operationsManagement/index',
icon: 'fa-solid fa-recycle',
menu_type: 'tab',
url: '',
component: '/src/views/voltage/sags/operationsManagement/index.vue',
keepalive: 'voltage/sags/operationsManagement/index',
extend: 'none',
children: []
},
{
id: 1,
pid: 3,
type: 'menu',
title: '终端运行统计',
name: 'voltage/sags/operationsManagement/statistics',
path: 'voltage/sags/operationsManagement/statistics',
icon: 'fa-solid fa-chart-column',
menu_type: 'tab',
url: '',
component: '/src/views/voltage/sags/operationsManagement/statistics.vue',
keepalive: 'voltage/sags/operationsManagement/statistics',
extend: 'none',
children: []
},
{
id: 1,
pid: 3,
type: 'menu',
title: '监测点台账信息',
name: 'voltage/sags/operationsManagement/point',
path: 'voltage/sags/operationsManagement/point',
icon: 'fa-brands fa-square-pinterest',
menu_type: 'tab',
url: '',
component: '/src/views/voltage/sags/operationsManagement/point.vue',
keepalive: 'voltage/sags/operationsManagement/point',
extend: 'none',
children: []
}
]
},
{
id: 2,
pid: 3,
type: 'menu',
title: '区域',
name: 'Event-boot/Region/distribution',
path: 'Event-boot/Region/distribution',
icon: 'el-icon-Management',
menu_type: 'tab',
url: '',
component: '/src/views/Event-boot/Region/distribution.vue',
keepalive: 'Event-boot/Region/distribution',
extend: 'none',
children: [
{
id: 2,
pid: 3,
type: 'menu',
title: '区域概览',
name: 'Region/overview',
path: 'Region/overview',
icon: 'el-icon-Promotion',
menu_type: 'tab',
url: '',
component: '/src/views/Event-boot/Region/overview.vue',
keepalive: 'Region/overview',
extend: 'none',
children: []
},
{
id: 2,
pid: 3,
type: 'menu',
title: '区域统计',
name: 'Region/statistics',
path: 'Region/statistics',
icon: 'el-icon-Promotion',
menu_type: 'tab',
url: '',
component: '/src/views/Event-boot/Region/statistics.vue',
keepalive: 'Region/statistics',
extend: 'none',
children: []
},
{
id: 1,
pid: 3,
type: 'menu',
title: '监测网分布',
name: 'Region/distribution',
path: 'Region/distribution',
icon: 'el-icon-Share',
menu_type: 'tab',
url: '',
component: '/src/views/Event-boot/Region/distribution.vue',
keepalive: 'Region/distribution',
extend: 'none',
children: []
}
]
}
]
},
{
id: 2,
pid: 0,
type: 'menu_dir',
title: '权限管理',
name: 'auth',
path: 'auth',
icon: 'fa-solid fa-layer-group',
menu_type: null,
url: '',
component: '',
keepalive: 0,
extend: 'none',
children: [
{
id: 3,
pid: 2,
type: 'menu',
title: '角色管理',
name: 'auth/role',
path: 'auth/role',
icon: 'el-icon-Avatar',
menu_type: 'tab',
url: '',
component: '/src/views/auth/role/index.vue',
keepalive: 'auth/role',
extend: 'none',
children: []
},
{
id: 13,
pid: 2,
type: 'menu',
title: '菜单规则管理',
name: 'auth/menu',
path: 'auth/menu',
icon: 'el-icon-Menu',
menu_type: 'tab',
url: '',
component: '/src/views/auth/menu/index.vue',
keepalive: 'auth/menu',
extend: 'none',
children: []
}
]
}
]
// const arr = [
// {
// id: 1,
// pid: 0,
// type: 'menu',
// title: '控制台',
// name: 'dashboard',
// path: 'dashboard',
// icon: 'fa fa-dashboard',
// menu_type: 'tab',
// url: '',
// component: '/src/views/govern/log/debug.vue',
// keepalive: 'dashboard',
// extend: 'none',
// children: []
// },
// {
// id: 3,
// pid: 0,
// type: 'menu',
// title: '审计管理',
// name: 'test',
// path: 'test',
// icon: 'el-icon-List',
// menu_type: 'tab',
// url: '',
// component: '/src/views/govern/setting/app/index.vue',
// keepalive: 'test',
// extend: 'none',
// children: [
// {
// id: 1,
// pid: 3,
// type: 'menu',
// title: '图表1',
// name: 'comptroller/list1',
// path: 'comptroller/list1',
// icon: 'el-icon-List',
// menu_type: 'tab',
// url: '',
// component: '/src/views/govern/user/roleCode/index.vue',
// keepalive: 'auth/role',
// extend: 'none',
// children: []
// }
// ]
// },
// {
// id: 3,
// pid: 0,
// type: 'menu_dir',
// title: '电压暂降',
// name: 'voltage/sags',
// path: 'voltage/sags',
// icon: 'el-icon-BellFilled',
// menu_type: 'tab',
// url: '',
// extend: 'none',
// children: [
// {
// id: 1,
// pid: 3,
// type: 'menu_dir',
// title: '运行管理',
// name: 'voltage/sags/operationsManagement',
// path: 'voltage/sags/operationsManagement',
// icon: 'fa-solid fa-bars-progress',
// menu_type: 'tab',
// url: '',
// extend: 'none',
// children: [
// {
// id: 1,
// pid: 3,
// type: 'menu',
// title: '终端运行管理',
// name: 'voltage/sags/operationsManagement/index',
// path: 'voltage/sags/operationsManagement/index',
// icon: 'fa-solid fa-recycle',
// menu_type: 'tab',
// url: '',
// component: '/src/views/voltage/sags/operationsManagement/index.vue',
// keepalive: 'voltage/sags/operationsManagement/index',
// extend: 'none',
// children: []
// },
// {
// id: 1,
// pid: 3,
// type: 'menu',
// title: '终端运行统计',
// name: 'voltage/sags/operationsManagement/statistics',
// path: 'voltage/sags/operationsManagement/statistics',
// icon: 'fa-solid fa-chart-column',
// menu_type: 'tab',
// url: '',
// component: '/src/views/voltage/sags/operationsManagement/statistics.vue',
// keepalive: 'voltage/sags/operationsManagement/statistics',
// extend: 'none',
// children: []
// },
// {
// id: 1,
// pid: 3,
// type: 'menu',
// title: '监测点台账信息',
// name: 'voltage/sags/operationsManagement/point',
// path: 'voltage/sags/operationsManagement/point',
// icon: 'fa-brands fa-square-pinterest',
// menu_type: 'tab',
// url: '',
// component: '/src/views/voltage/sags/operationsManagement/point.vue',
// keepalive: 'voltage/sags/operationsManagement/point',
// extend: 'none',
// children: []
// }
// ]
// },
// {
// id: 2,
// pid: 3,
// type: 'menu',
// title: '区域',
// name: 'Event-boot/Region/distribution',
// path: 'Event-boot/Region/distribution',
// icon: 'el-icon-Management',
// menu_type: 'tab',
// url: '',
// component: '/src/views/Event-boot/Region/distribution.vue',
// keepalive: 'Event-boot/Region/distribution',
// extend: 'none',
// children: [
// {
// id: 2,
// pid: 3,
// type: 'menu',
// title: '区域概览',
// name: 'Region/overview',
// path: 'Region/overview',
// icon: 'el-icon-Promotion',
// menu_type: 'tab',
// url: '',
// component: '/src/views/Event-boot/Region/overview.vue',
// keepalive: 'Region/overview',
// extend: 'none',
// children: []
// },
// {
// id: 2,
// pid: 3,
// type: 'menu',
// title: '区域统计',
// name: 'Region/statistics',
// path: 'Region/statistics',
// icon: 'el-icon-Promotion',
// menu_type: 'tab',
// url: '',
// component: '/src/views/Event-boot/Region/statistics.vue',
// keepalive: 'Region/statistics',
// extend: 'none',
// children: []
// },
// {
// id: 1,
// pid: 3,
// type: 'menu',
// title: '监测网分布',
// name: 'Region/distribution',
// path: 'Region/distribution',
// icon: 'el-icon-Share',
// menu_type: 'tab',
// url: '',
// component: '/src/views/Event-boot/Region/distribution.vue',
// keepalive: 'Region/distribution',
// extend: 'none',
// children: []
// }
// ]
// }
// ]
// },
// {
// id: 2,
// pid: 0,
// type: 'menu_dir',
// title: '权限管理',
// name: 'auth',
// path: 'auth',
// icon: 'fa-solid fa-layer-group',
// menu_type: null,
// url: '',
// component: '',
// keepalive: 0,
// extend: 'none',
// children: [
// {
// id: 3,
// pid: 2,
// type: 'menu',
// title: '角色管理',
// name: 'auth/role',
// path: 'auth/role',
// icon: 'el-icon-Avatar',
// menu_type: 'tab',
// url: '',
// component: '/src/views/auth/role/index.vue',
// keepalive: 'auth/role',
// extend: 'none',
// children: []
// },
// {
// id: 13,
// pid: 2,
// type: 'menu',
// title: '菜单规则管理',
// name: 'auth/menu',
// path: 'auth/menu',
// icon: 'el-icon-Menu',
// menu_type: 'tab',
// url: '',
// component: '/src/views/auth/menu/index.vue',
// keepalive: 'auth/menu',
// extend: 'none',
// children: []
// }
// ]
// }
// ]
const handlerMenu = (data: any) => {
data.forEach((item: any) => {
item.path = item.routePath
@@ -301,10 +300,7 @@ const init = async () => {
})
}
handlerMenu(res.data)
// handleAdminRoute(arr)
// handleAdminRoute(res.data)
handleAdminRoute([...arr, ...res.data])
handleAdminRoute(res.data)
// 预跳转到上次路径
if (route.params.to) {
const lastRoute = JSON.parse(route.params.to as string)
@@ -316,9 +312,7 @@ const init = async () => {
}
// 跳转到第一个菜单
console.log(navTabs.state.tabsViewRoutes)
let firstRoute = getFirstRoute(navTabs.state.tabsViewRoutes)
console.log(firstRoute)
if (firstRoute) routePush(firstRoute.path)
})
}

38
src/layouts/admin/router-view/main.vue
View File

@@ -1,25 +1,22 @@
<template>
<el-main class='layout-main'>
<el-scrollbar class='layout-main-scrollbar' :style='layoutMainScrollbarStyle()' ref='mainScrollbarRef'>
<router-view v-slot='{ Component }'>
<transition :name='config.layout.mainAnimation' mode='out-in'>
<keep-alive :include='state.keepAliveComponentNameList'>
<component :is='Component' :key='state.componentKey' />
</keep-alive>
</transition>
</router-view>
</el-scrollbar>
<el-main class="layout-main" :style="mainHeight()">
<router-view v-slot="{ Component }">
<transition :name="config.layout.mainAnimation" mode="out-in">
<keep-alive :include="state.keepAliveComponentNameList">
<component :is="Component" :key="state.componentKey" />
</keep-alive>
</transition>
</router-view>
</el-main>
</template>
<script setup lang='ts'>
<script setup lang="ts">
import { ref, reactive, onMounted, watch, onBeforeMount, onUnmounted, nextTick, provide } from 'vue'
import { useRoute, type RouteLocationNormalized } from 'vue-router'
import { mainHeight as layoutMainScrollbarStyle } from '@/utils/layout'
import { mainHeight } from '@/utils/layout'
import useCurrentInstance from '@/utils/useCurrentInstance'
import { useConfig } from '@/stores/config'
import { useNavTabs } from '@/stores/navTabs'
import type { ScrollbarInstance } from 'element-plus'
defineOptions({
name: 'layout/main'
@@ -30,7 +27,6 @@ const { proxy } = useCurrentInstance()
const route = useRoute()
const config = useConfig()
const navTabs = useNavTabs()
const mainScrollbarRef = ref<ScrollbarInstance>()
const state: {
componentKey: string
@@ -40,7 +36,7 @@ const state: {
keepAliveComponentNameList: []
})
const addKeepAliveComponentName = function(keepAliveName: string | undefined) {
const addKeepAliveComponentName = function (keepAliveName: string | undefined) {
if (keepAliveName) {
let exist = state.keepAliveComponentNameList.find((name: string) => {
return name === keepAliveName
@@ -52,7 +48,9 @@ const addKeepAliveComponentName = function(keepAliveName: string | undefined) {
onBeforeMount(() => {
proxy.eventBus.on('onTabViewRefresh', (menu: RouteLocationNormalized) => {
state.keepAliveComponentNameList = state.keepAliveComponentNameList.filter((name: string) => menu.meta.keepalive !== name)
state.keepAliveComponentNameList = state.keepAliveComponentNameList.filter(
(name: string) => menu.meta.keepalive !== name
)
state.componentKey = ''
nextTick(() => {
state.componentKey = menu.path
@@ -60,7 +58,9 @@ onBeforeMount(() => {
})
})
proxy.eventBus.on('onTabViewClose', (menu: RouteLocationNormalized) => {
state.keepAliveComponentNameList = state.keepAliveComponentNameList.filter((name: string) => menu.meta.keepalive !== name)
state.keepAliveComponentNameList = state.keepAliveComponentNameList.filter(
(name: string) => menu.meta.keepalive !== name
)
})
})
@@ -74,7 +74,6 @@ onMounted(() => {
if (typeof navTabs.state.activeRoute?.meta.keepalive == 'string') {
addKeepAliveComponentName(navTabs.state.activeRoute?.meta.keepalive)
}
console.log(state.keepAliveComponentNameList)
})
watch(
@@ -87,10 +86,9 @@ watch(
}
)
provide('mainScrollbarRef', mainScrollbarRef)
</script>
<style scoped lang='scss'>
<style scoped lang="scss">
.layout-container .layout-main {
padding: 0 !important;
overflow: hidden;

1
src/router/index.ts
View File

@@ -17,7 +17,6 @@ router.beforeEach((to, from, next) => {
loading.show()
window.existLoading = true
}
console.log(to)
if (to.path == '/login' || to.path == '/404') {
// 登录或者注册才可以往下进行
next()

22
src/stores/adminInfo.ts
View File

@@ -5,14 +5,18 @@ import type { AdminInfo } from '@/stores/interface'
export const useAdminInfo = defineStore('adminInfo', {
state: (): AdminInfo => {
return {
id: 0,
username: '',
nickname: '',
avatar: '',
last_login_time: '',
token: '',
access_token: '',
token_type: '',
refresh_token: '',
super: false
expires_in: 0,
scope: '',
nickname: '',
userType: 1,
deptIndex: '',
userIndex: '',
client_id: '',
headSculpture: '',
jti: ''
}
},
actions: {
@@ -20,7 +24,7 @@ export const useAdminInfo = defineStore('adminInfo', {
this.$state = { ...this.$state, ...state }
},
removeToken() {
this.token = ''
this.access_token = ''
this.refresh_token = ''
},
setToken(token: string, type: 'auth' | 'refresh') {
@@ -28,7 +32,7 @@ export const useAdminInfo = defineStore('adminInfo', {
this[field] = token
},
getToken(type: 'auth' | 'refresh' = 'auth') {
return type === 'auth' ? this.token : this.refresh_token
return type === 'auth' ? this.token_type + ' ' + this.access_token : this.refresh_token
}
},
persist: {

18
src/stores/interface/index.ts
View File

@@ -35,14 +35,18 @@ export interface NavTabs {
}
export interface AdminInfo {
id: number
username: string
nickname: string
avatar: string
last_login_time: string
token: string
access_token: string
token_type: string
refresh_token: string
super: boolean
expires_in: number
scope: string
nickname: string
userType: number
deptIndex: string
userIndex: string
client_id: string
headSculpture: string
jti: string
}
export interface DictData {

11
src/styles/app.scss
View File

@@ -23,6 +23,17 @@ body,
position: relative;
}
::-webkit-scrollbar {
width: 8px;
height: 10px;
}
::-webkit-scrollbar-thumb {
border-radius: 5px;
height: 3px;
background-color: var(--el-color-primary) !important;
border-radius: 30px !important;
}
// 阿里 iconfont Symbol引用css
.iconfont-icon {
width: 1em;

27
src/styles/vxeTable.scss
View File

@@ -1,16 +1,16 @@
.vxe-table--body-wrapper,
.boxbx {
&::-webkit-scrollbar {
width: 10px;
height: 10px;
}
&::-webkit-scrollbar-thumb {
border-radius: 5px;
height: 3px;
background-color: var(--el-color-primary) !important;
border-radius: 30px !important;
}
}
// .vxe-table--body-wrapper,
// .boxbx {
// &::-webkit-scrollbar {
// width: 10px;
// height: 10px;
// }
// &::-webkit-scrollbar-thumb {
// border-radius: 5px;
// height: 3px;
// background-color: var(--el-color-primary) !important;
// border-radius: 30px !important;
// }
// }
// .vxe-table--body-wrapper::-webkit-scrollbar-thumb {
// border-radius: 5px;
@@ -23,3 +23,4 @@
background: var(--el-color-primary);
color: var(--el-color-white);
}

2
src/utils/layout.ts
View File

@@ -11,7 +11,7 @@ export function mainHeight(extra = 0,divided =1): CSSProperties {
let height = extra
const adminLayoutMainExtraHeight: anyObj = {
Default: 60,
Classic: 102,
Classic: 105,
Streamline: 60
}
const config = useConfig()

4
src/utils/request.ts
View File

@@ -17,8 +17,7 @@ const loadingInstance: LoadingInstance = {
* 根据运行环境获取基础请求URL
*/
export const getUrl = (): string => {
if (import.meta.env.MODE == 'development' || location.hostname === 'localhost') return '/api'
return window.location.protocol + '//' + window.location.host
return '/api'
}
/**
@@ -224,6 +223,7 @@ interface LoadingInstance {
target: any
count: number
}
interface Options {
// 是否开启取消重复请求, 默认为 true
CancelDuplicateRequest?: boolean

2
src/views/auth/menu/menu.vue
View File

@@ -116,7 +116,7 @@ provide('tableStore', tableStore)
const addMenu = () => {
console.log(popupRef)
popupRef.value.open('新增菜单')
popupRef.value.open('新增菜单',{})
}
const currentChange = (newValue: any) => {
emits('select', newValue.row.id)

56
src/views/auth/menu/popupMenu.vue
View File

@@ -1,45 +1,45 @@
<template>
<el-dialog class='cn-operate-dialog' v-model='dialogVisible' :title='title'>
<el-dialog class="cn-operate-dialog" v-model="dialogVisible" :title="title">
<el-scrollbar>
<el-form :inline='false' :model='form' label-width='120px'>
<el-form-item label='上级菜单'>
<el-form :inline="false" :model="form" label-width="120px">
<el-form-item label="上级菜单">
<el-cascader
v-model='form.pid'
:options='tableStore.table.data'
:props='cascaderProps'
style='width: 100%'
v-model="form.pid"
:options="tableStore.table.data"
:props="cascaderProps"
style="width: 100%"
/>
</el-form-item>
<el-form-item label='菜单名称'>
<el-input v-model='form.name' placeholder='请输入菜单名称' />
<el-form-item label="菜单名称">
<el-input v-model="form.name" placeholder="请输入菜单名称" />
</el-form-item>
<el-form-item label='图标'>
<IconSelector v-model='form.icon' placeholder='请选择图标' />
<el-form-item label="图标">
<IconSelector v-model="form.icon" placeholder="请选择图标" />
</el-form-item>
<el-form-item label='菜单路由'>
<el-input v-model='form.path' placeholder='请输入菜单名称' />
<el-form-item label="菜单路由">
<el-input v-model="form.path" placeholder="请输入菜单名称" />
</el-form-item>
<el-form-item label='组件路径'>
<el-input v-model='form.routeName' placeholder='请输入组件路径，如/src/views/dashboard/index.vue' />
<el-form-item label="组件路径">
<el-input v-model="form.routeName" placeholder="请输入组件路径，如/src/views/dashboard/index.vue" />
</el-form-item>
<el-form-item label='排序'>
<el-input-number v-model='form.sort' :min='0' />
<el-form-item label="排序">
<el-input-number v-model="form.sort" :min="0" />
</el-form-item>
<el-form-item label='菜单描述'>
<el-input v-model='form.remark' :rows='2' type='textarea' placeholder='请输入描述' />
<el-form-item label="菜单描述">
<el-input v-model="form.remark" :rows="2" type="textarea" placeholder="请输入描述" />
</el-form-item>
</el-form>
</el-scrollbar>
<template #footer>
<span class='dialog-footer'>
<el-button @click='dialogVisible = false'>取消</el-button>
<el-button type='primary' @click='submit'>确认</el-button>
<span class="dialog-footer">
<el-button @click="dialogVisible = false">取消</el-button>
<el-button type="primary" @click="submit">确认</el-button>
</span>
</template>
</el-dialog>
</template>
<script lang='ts' setup>
<script lang="ts" setup>
import { ref, inject } from 'vue'
import { reactive } from 'vue'
import TableStore from '@/utils/tableStore'
@@ -74,20 +74,20 @@ const form: any = reactive({
const dialogVisible = ref(false)
const title = ref('新增菜单')
const open = (text: string, data?: anyObj) => {
const open = (text: string, data: anyObj) => {
console.log(data)
title.value = text
// 重置表单
for (let key in form) {
form[key] = ''
}
form.pid = '0'
form.pid = data.pid || '0'
form.sort = 0
form.type = 0
if (data) {
if (data.id) {
for (let key in form) {
form[key] = data[key] || ''
form[key] = data[key] ? data[key] : data[key] === 0 ? 0 : ''
}
form.path = data.routePath || ''
form.name = data.title || ''
@@ -108,4 +108,4 @@ const submit = async () => {
}
defineExpose({ open })
</script>
</script>

101
src/views/auth/role/index.vue
View File

@@ -1,11 +1,23 @@
<template>
<div class="default-main">
<TableHeader>
<template v-slot:operation>
<el-button :icon="Plus" type="primary" @click="addMenu">添加</el-button>
</template>
</TableHeader>
<Table ref="tableRef" />
<div class="default-main" style="display: flex" :style="{ height: height }">
<div style="width: calc(100% - 280px)">
<div class="menu-index-header">
<div style="flex: 1; font-weight: 700">角色列表</div>
<el-button :icon="Plus" type="primary" @click="addRole" class="ml10">新增</el-button>
</div>
<Table ref="tableRef" @currentChange="currentChange" />
</div>
<div style="height: 100%; flex: 1">
<Tree
v-if="menuListId"
ref="treeRef"
show-checkbox
:data="menuTree"
:checkStrictly="checkStrictly"
@check-change="checkChange"
></Tree>
<el-empty style="width: 100%; padding-top: 300px; box-sizing: border-box" description="请选择角色" v-else />
</div>
<popupForm ref="popupRef"></popupForm>
</div>
</template>
@@ -15,13 +27,28 @@ import { ref, onMounted, provide } from 'vue'
import TableStore from '@/utils/tableStore'
import Table from '@/components/table/index.vue'
import TableHeader from '@/components/table/header/index.vue'
import Tree from '@/components/tree/index.vue'
import { functionTree } from '@/api/user-boot/function'
import { getFunctionsByRoleIndex, updateRoleMenu } from '@/api/user-boot/roleFuction'
import { mainHeight } from '@/utils/layout'
import { del } from '@/api/user-boot/role'
import { ElMessage } from 'element-plus'
import popupForm from './popupForm.vue'
import { useAdminInfo } from '@/stores/adminInfo'
const adminInfo = useAdminInfo()
defineOptions({
name: 'auth/role'
})
const height = mainHeight(20).height
const treeRef = ref()
const menuTree = ref<treeData[]>([])
const popupRef = ref()
const checkStrictly = ref(true)
const menuListId = ref('')
const tableStore = new TableStore({
url: '/user-boot/role/selectRoleDetail?id=1',
showPage: false,
url: '/user-boot/role/selectRoleDetail?id=' + adminInfo.$state.userType,
method: 'POST',
column: [
{ title: '角色名称', field: 'name', align: 'center' },
@@ -56,16 +83,68 @@ const tableStore = new TableStore({
confirmButtonType: 'danger',
title: '确定删除该角色吗？'
},
click: row => {}
click: row => {
del([row.id]).then(() => {
ElMessage.success('删除成功')
tableStore.index()
})
}
}
]
}
]
})
provide('tableStore', tableStore)
tableStore.table.params.searchValue = ''
provide('tableStore', tableStore)
const filterData = (arr: any[]) => {
return arr.filter((item: any) => {
item.name = item.title
if (item.children.length) {
item.children = filterData(item.children)
}
return item.type === 0
})
}
functionTree().then((res: any) => {
menuTree.value = filterData(res.data)
})
const currentChange = (data: any) => {
checkStrictly.value = true
menuListId.value = data.row.id
getFunctionsByRoleIndex({ id: data.row.id }).then((res: any) => {
treeRef.value.treeRef.setCheckedKeys(res.data.map((item: any) => item.id))
})
}
const timeout = ref<NodeJS.Timeout>()
const checkChange = (data: any) => {
if (checkStrictly.value) {
checkStrictly.value = false
return
}
if (timeout.value) {
clearTimeout(timeout.value)
}
timeout.value = setTimeout(() => {
updateRoleMenu({
id: menuListId.value,
idList: treeRef.value.treeRef.getCheckedNodes(false, true).map(node => node.id)
})
}, 1000)
}
onMounted(() => {
tableStore.index()
})
const addMenu = () => {}
const addRole = () => {
popupRef.value.open('新增角色')
}
</script>
<style lang="scss">
.menu-index-header {
display: flex;
padding: 13px 15px;
align-items: center;
}
</style>

74
src/views/auth/role/popupForm.vue
View File

@@ -1,31 +1,14 @@
<template>
<el-dialog class="cn-operate-dialog" v-model="dialogVisible" :title="title">
<el-scrollbar>
<el-form :inline="false" :model="form" label-width="120px">
<el-form-item label="上级菜单">
<el-cascader
v-model="form.pid"
:options="tableStore.table.data"
:props="cascaderProps"
style="width: 100%"
/>
</el-form-item>
<el-form-item label="菜单名称">
<el-form :inline="false" :model="form" label-width="120px" :rules="rules">
<el-form-item label="角色名称">
<el-input v-model="form.name" placeholder="请输入菜单名称" />
</el-form-item>
<el-form-item label="图标">
<IconSelector v-model="form.icon" placeholder="请选择图标" />
<el-form-item label="角色编码">
<el-input v-model="form.code" placeholder="请输入菜单名称" />
</el-form-item>
<el-form-item label="菜单路由">
<el-input v-model="form.path" placeholder="请输入菜单名称" />
</el-form-item>
<el-form-item label="组件路径">
<el-input v-model="form.routeName" placeholder="请输入组件路径，如/src/views/dashboard/index.vue" />
</el-form-item>
<el-form-item label="排序">
<el-input-number v-model="form.sort" :min="0" />
</el-form-item>
<el-form-item label="菜单描述">
<el-form-item label="角色描述">
<el-input v-model="form.remark" :rows="2" type="textarea" placeholder="请输入描述" />
</el-form-item>
</el-form>
@@ -43,33 +26,48 @@
import { ref, inject } from 'vue'
import { reactive } from 'vue'
import TableStore from '@/utils/tableStore'
import IconSelector from '@/components/baInput/components/iconSelector.vue'
import { ElMessage } from 'element-plus'
import { add, update } from '@/api/user-boot/role'
import { useAdminInfo } from '@/stores/adminInfo'
const adminInfo = useAdminInfo()
const tableStore = inject('tableStore') as TableStore
const cascaderProps = {
label: 'title',
value: 'id'
}
// do not use same name with ref
const form = reactive({
code: 'menu',
icon: '设备月保_设备日保',
id: '88c61dfd02fbdab02e3bf0753d487444',
name: '系统配置',
path: '/app/setting',
pid: 'f517484e241c2fdd7f11a9c3fcaaa109',
remark: '系统配置',
routeName: null,
sort: 0,
code: '',
name: '',
remark: '',
id: '',
type: 0
})
const rules = {
name: [{ required: true, message: '角色名称不能为空', trigger: 'blur' }],
code: [{ required: true, message: '角色编码不能为空', trigger: 'blur' }]
}
const dialogVisible = ref(false)
const title = ref('新增菜单')
const open = (text: string, data?: anyObj) => {
title.value = text
dialogVisible.value = true
if (data) {
for (let key in form) {
form[key] = data[key]
}
} else {
for (let key in form) {
form[key] = ''
}
}
}
const submit = () => {
const submit = async () => {
if (form.id) {
await update(form)
} else {
form.type = adminInfo.$state.userType + 1
await add(form)
}
ElMessage.success('保存成功')
tableStore.index()
dialogVisible.value = false
}

3
src/views/govern/manage/factory.vue
View File

@@ -145,6 +145,7 @@ import {
resetEquipmentDelivery
} from '@/api/cs-system-boot/device'
import html2canvas from 'html2canvas'
import { fullUrl } from '@/utils/common'
defineOptions({
name: 'govern/log/debug'
})
@@ -283,7 +284,7 @@ const tableStore = new TableStore({
click: row => {
deivce.value = row
deivce.value.qrPath = localStorage.getItem('STATIC_URL') + deivce.value.qrPath
deivce.value.qrPath = fullUrl(deivce.value.qrPath)
setTimeout(() => {
html2canvas(document.querySelector('.qrcode-label'), {
useCORS: true

12
src/views/user/login.vue
View File

@@ -137,20 +137,12 @@ const onSubmit = async (formEl: FormInstance | undefined) => {
imageCode: '',
verifyCode: 0
}).then(res => {
// console.log('🚀 ~ file: login.vue:134 ~ gongkey ~ res:', res)
let DOMIN = window.location.origin
let STATIC_URL = DOMIN + '/api/system-boot/image/toStream?bgImage='
localStorage.setItem('STATIC_URL', STATIC_URL)
userInfo.setToken(res.data.token_type + ' ' + res.data.access_token, 'auth')
userInfo.dataFill(res.data)
state.submitLoading = false
router.push({
path: 'admin/dashboard'
path: '/'
})
})
// .catch(err => {
// state.submitLoading = false
// })
// state.submitLoading = false
})
setTimeout(() => {
state.submitLoading = false