角色管理机构管理初始化
This commit is contained in:
parent
3b6959d678
commit
ac735f23a8
5
ui/dasadmin/src/lang/common/en/management.ts
Normal file
5
ui/dasadmin/src/lang/common/en/management.ts
Normal file
@ -0,0 +1,5 @@
|
||||
export default{
|
||||
search:'Search',
|
||||
add:'Add',
|
||||
'Query roles by name':'Query roles by name',
|
||||
}
|
5
ui/dasadmin/src/lang/common/zh-cn/management.ts
Normal file
5
ui/dasadmin/src/lang/common/zh-cn/management.ts
Normal file
@ -0,0 +1,5 @@
|
||||
export default{
|
||||
search:'搜索',
|
||||
add:'新增',
|
||||
'Query roles by name':'按名称查询角色',
|
||||
}
|
@ -867,6 +867,34 @@ const menu = [
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
id: 91,
|
||||
pid: 92,
|
||||
type: 'menu',
|
||||
title: '角色管理',
|
||||
name: 'routine\/roleManagement',
|
||||
path: 'routine\/roleManagement',
|
||||
icon: 'fa fa-folder',
|
||||
menu_type: 'tab',
|
||||
url: '',
|
||||
component: '\/src\/views\/backend\/RoleManagement\/RoleManagement.vue',
|
||||
keepalive: 'routine\/roleManagement',
|
||||
extend: 'none',
|
||||
},
|
||||
{
|
||||
id: 93,
|
||||
pid: 94,
|
||||
type: 'menu',
|
||||
title: '机构管理',
|
||||
name: 'routine\/institutionalManagement',
|
||||
path: 'routine\/institutionalManagement',
|
||||
icon: 'fa fa-folder',
|
||||
menu_type: 'tab',
|
||||
url: '',
|
||||
component: '\/src\/views\/backend\/InstitutionalManagement\/InstitutionalManagement.vue',
|
||||
keepalive: 'routine\/institutionalManagement',
|
||||
extend: 'none',
|
||||
},
|
||||
],
|
||||
},
|
||||
// {
|
||||
|
@ -0,0 +1,76 @@
|
||||
<template>
|
||||
<div class="instititionalManagement">
|
||||
<el-container>
|
||||
<el-aside class="defaultAside">
|
||||
<el-header class="treeHeader">
|
||||
<el-input v-model="searchInputTreeValue" :placeholder="treeSearchInputPlaceholder" class="searchInput"></el-input>
|
||||
</el-header>
|
||||
<el-main>
|
||||
<el-tree :data="treeData"></el-tree>
|
||||
</el-main>
|
||||
</el-aside>
|
||||
<el-container>
|
||||
<el-header class="defaultHeader">
|
||||
<div class="searchPart">
|
||||
<el-input class="searchInput"></el-input>
|
||||
<el-button type="primary" :icon="Search" class="defaultBtn">{{ t('management.search') }}</el-button>
|
||||
</div>
|
||||
<el-button type="primary" :icon="Plus" class="defaultBtn">{{ t('management.add') }}</el-button>
|
||||
</el-header>
|
||||
<el-main>
|
||||
<el-table></el-table>
|
||||
</el-main>
|
||||
</el-container>
|
||||
</el-container>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref } from 'vue'
|
||||
import { ElContainer, ElAside, ElHeader, ElMain, ElInput, ElButton, ElTable, ElTree } from 'element-plus'
|
||||
import { Plus, Search } from '@element-plus/icons-vue'
|
||||
import { useI18n } from 'vue-i18n'
|
||||
const { t } = useI18n()
|
||||
const treeSearchInputPlaceholder = '搜索机构'
|
||||
const searchInputTreeValue = ref<string>('')
|
||||
|
||||
const treeData = ref()
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@mixin searchInput($value) {
|
||||
margin-right: $value;
|
||||
width: 220px;
|
||||
height: 40px;
|
||||
}
|
||||
.instititionalManagement {
|
||||
.defaultAside {
|
||||
width: 260px;
|
||||
.treeHeader {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
.searchInput {
|
||||
@include searchInput(0);
|
||||
}
|
||||
}
|
||||
}
|
||||
.defaultHeader {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
.searchPart {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
.defaultBtn {
|
||||
width: 88px;
|
||||
height: 40px;
|
||||
}
|
||||
.searchInput {
|
||||
@include searchInput(10px);
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
@ -0,0 +1,87 @@
|
||||
<template>
|
||||
<div class="roleManagement">
|
||||
<el-container>
|
||||
<el-header class="containerHeader">
|
||||
<div class="searchPart">
|
||||
<el-input class="searchInput" v-model:value="searchInputValue" :placeholder="searchInputPlacehoder"></el-input>
|
||||
<el-button type="primary" :icon="Search" class="defaultBtn" @click="searchClick">{{ t('management.search') }}</el-button>
|
||||
</div>
|
||||
<el-button type="primary" :icon="Plus" class="defaultBtn" @click="addClick">{{ t('management.add') }}</el-button>
|
||||
</el-header>
|
||||
<el-main class="containerMain">
|
||||
<el-table :data="tableData">
|
||||
<el-table-column
|
||||
v-for="item in tableColumn"
|
||||
:key="item.key"
|
||||
:prop="item.prop"
|
||||
:label="item.label"
|
||||
:fixed="item.fixed"
|
||||
:align="item.align ?? 'center'"
|
||||
></el-table-column>
|
||||
</el-table>
|
||||
</el-main>
|
||||
</el-container>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref } from 'vue'
|
||||
import { ElContainer, ElHeader, ElMain, ElInput, ElButton, ElTable, ElTableColumn } from 'element-plus'
|
||||
import { Plus, Search } from '@element-plus/icons-vue'
|
||||
import { tableDataType, tableColumnType, roleDataEnum, roleTableDataKeyType } from './type'
|
||||
import { useI18n } from 'vue-i18n'
|
||||
|
||||
const { t } = useI18n()
|
||||
|
||||
const searchInputPlacehoder = t('management.Query roles by name')
|
||||
const searchInputValue = ref<string>('')
|
||||
const searchClick = () => {
|
||||
if (!searchInputValue.value) return
|
||||
}
|
||||
|
||||
const tableColumn = ref<tableColumnType<roleTableDataKeyType>[]>([
|
||||
{
|
||||
key: '1',
|
||||
prop: 'roleName',
|
||||
label: roleDataEnum['roleName'],
|
||||
},
|
||||
{
|
||||
key: '2',
|
||||
prop: 'roleCode',
|
||||
label: roleDataEnum['roleCode'],
|
||||
},
|
||||
{
|
||||
key: '3',
|
||||
prop: 'remark',
|
||||
label: roleDataEnum['remark'],
|
||||
},
|
||||
])
|
||||
const tableData = ref<tableDataType[]>([])
|
||||
const addClick = () => {
|
||||
// 新增角色
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.roleManagement {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
.containerHeader {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
.searchInput {
|
||||
margin-right: 10px;
|
||||
width: 220px;
|
||||
height: 40px;
|
||||
}
|
||||
.defaultBtn {
|
||||
width: 88px;
|
||||
height: 40px;
|
||||
}
|
||||
}
|
||||
.containerMain {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
</style>
|
19
ui/dasadmin/src/views/backend/RoleManagement/type.ts
Normal file
19
ui/dasadmin/src/views/backend/RoleManagement/type.ts
Normal file
@ -0,0 +1,19 @@
|
||||
export enum roleDataEnum {
|
||||
roleName = '角色名称',
|
||||
roleCode = '角色编码',
|
||||
remark = '备注',
|
||||
}
|
||||
export type roleTableDataKeyType = keyof typeof roleDataEnum
|
||||
|
||||
export type tableDataType = {
|
||||
roleName: string
|
||||
roleCode: number
|
||||
remark: string
|
||||
}
|
||||
export type tableColumnType<T extends roleTableDataKeyType> = {
|
||||
key: string
|
||||
prop: T
|
||||
label: (typeof roleDataEnum)[T]
|
||||
fixed?: boolean
|
||||
align?: 'left' | 'center' | 'right'
|
||||
}
|
Loading…
Reference in New Issue
Block a user