提交 1fe79ec4 authored 作者: fit2cloud-chenyw's avatar fit2cloud-chenyw

feat: 系统管理列表使用fit2cloud-ui

上级 bab168f8
......@@ -3,7 +3,8 @@ import request from '@/utils/request'
export function getDeptTree(pid) {
return request({
url: 'api/dept/childNodes/' + pid,
method: 'post'
method: 'post',
loading: true
})
}
......
......@@ -3,7 +3,8 @@ import request from '@/utils/request'
export function getMenusTree(pid) {
return request({
url: 'api/menu/childNodes/' + pid,
method: 'post'
method: 'post',
loading: true
})
}
......
......@@ -3,7 +3,8 @@ import request from '@/utils/request'
export function allRoles() {
return request({
url: '/api/role/all',
method: 'post'
method: 'post',
loading: true
})
}
......@@ -11,7 +12,8 @@ export function roleGrid(pageIndex, pageSize, data) {
return request({
url: '/api/role/roleGrid/' + pageIndex + '/' + pageSize,
method: 'post',
data
data,
loading: true
})
}
......
......@@ -448,7 +448,8 @@ export default {
menu: {
create: '创建菜单',
modify: '修改菜单',
delete: '删除菜单'
delete: '删除菜单',
delete_confirm: '确定删除菜单吗'
},
organization: {
create: '创建组织',
......
......@@ -115,8 +115,8 @@
<span
class="item-axis"
>
{{ item.name }}<i class="el-icon-arrow-down el-icon--right"/>
<span/>
{{ item.name }}<i class="el-icon-arrow-down el-icon--right" />
<span />
<el-dropdown-menu slot="dropdown">
<el-dropdown-item icon="el-icon-edit-outline">
item1
......@@ -147,13 +147,13 @@
<span
class="item-axis"
>
{{ item.name }}<i class="el-icon-arrow-down el-icon--right"/>
<span/>
{{ item.name }}<i class="el-icon-arrow-down el-icon--right" />
<span />
<el-dropdown-menu slot="dropdown">
<el-dropdown-item icon="el-icon-edit-outline">
<el-dropdown placement="right-start" size="mini">
<span class="el-dropdown-link">
item3<i class="el-icon-arrow-right el-icon--right"/>
item3<i class="el-icon-arrow-right el-icon--right" />
</span>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item>sub1</el-dropdown-item>
......@@ -173,7 +173,7 @@
</el-row>
<div class="Echarts" style="height: 100%;display: flex;margin-top: 10px;">
<div id="echart" style="width: 100%;height: 80vh;"/>
<div id="echart" style="width: 100%;height: 80vh;" />
</div>
</el-row>
</el-col>
......
<template>
<div v-loading="result.loading">
<el-card class="table-card">
<template v-slot:header>
<ms-table-header
:permission="permission"
:condition.sync="condition"
:create-tip="$t('organization.create')"
:title="$t('commons.organization')"
@search="initTableData"
@create="create"
/>
</template>
<!-- system menu organization table-->
<el-table
<layout-content v-loading="$store.getters.loadingMap[$store.getters.currentPath]">
<complex-table
ref="table"
border
class="adjust-table"
:data="tableData"
lazy
:load="initTableData"
style="width: 100%"
:columns="columns"
:buttons="buttons"
:header="header"
:search-config="searchConfig"
:pagination-config="paginationConfig"
:tree-props="{children: 'children', hasChildren: 'hasChildren'}"
row-key="deptId"
@search="initTableData"
>
<!-- <el-table-column :selectable="checkboxT" type="selection" width="55" /> -->
<template #buttons>
<fu-table-button icon="el-icon-circle-plus-outline" :label="$t('organization.create')" @click="create" />
</template>
<!-- <el-table-column type="selection" fix /> -->
<el-table-column label="名称" prop="name" />
<el-table-column label="下属部门数" prop="subCount" />
<el-table-column label="下属组织数" prop="subCount" />
<el-table-column label="状态" align="center" prop="enabled">
<template slot-scope="scope">
<el-switch
......@@ -44,14 +39,8 @@
</template>
</el-table-column>
<el-table-column :label="$t('commons.operating')">
<template v-slot:default="scope">
<ms-table-operator :permission="permission" @editClick="edit(scope.row)" @deleteClick="handleDelete(scope.row)" />
</template>
</el-table-column> -->
</el-table>
</el-card>
<fu-table-operations :buttons="buttons" label="操作" fix />
</complex-table>
<!-- add organization form -->
<el-dialog
......@@ -64,10 +53,10 @@
>
<el-form ref="createOrganization" inline :model="form" :rules="rule" size="small" label-width="80px">
<el-form-item label="部门名称" prop="name">
<el-form-item label="组织名称" prop="name">
<el-input v-model="form.name" style="width: 370px;" />
</el-form-item>
<el-form-item label="部门排序" prop="deptSort">
<el-form-item label="组织排序" prop="deptSort">
<el-input-number
v-model.number="form.deptSort"
:min="0"
......@@ -77,7 +66,7 @@
/>
</el-form-item>
<el-form-item label="顶级部门" prop="top">
<el-form-item label="顶级组织" prop="top">
<el-radio-group v-model="form.top" style="width: 140px">
<el-radio :label="true"></el-radio>
<el-radio :label="false"></el-radio>
......@@ -92,7 +81,7 @@
<!-- <el-radio v-for="item in dict.dept_status" :key="item.id" v-model="form.enabled" :label="item.value">{{ item.label }}</el-radio> -->
</el-form-item>
<el-form-item v-if="!form.top" style="margin-bottom: 0;" label="上级部门" prop="pid">
<el-form-item v-if="!form.top" style="margin-bottom: 0;" label="上级组织" prop="pid">
<treeselect
v-model="form.pid"
:auto-load-root-options="false"
......@@ -103,44 +92,31 @@
/>
</el-form-item>
</el-form>
<!-- <div slot="footer" class="dialog-footer">
<el-button type="text" @click="crud.cancelCU">取消</el-button>
<el-button :loading="crud.status.cu === 2" type="primary" @click="crud.submitCU">确认</el-button>
</div> -->
<template v-slot:footer>
<ms-dialog-footer
@cancel="dialogOrgAddVisible = false"
@confirm="createDept('createOrganization')"
/>
</template>
</el-dialog>
<ms-delete-confirm ref="deleteConfirm" :title="$t('organization.delete')" @delete="_handleDelete" />
<div slot="footer" class="dialog-footer">
<el-button type="text" @click="dialogOrgAddVisible = false">{{ $t('commons.cancel') }}</el-button>
<el-button type="primary" @click="createDept('createOrganization')">确认</el-button>
</div>
</el-dialog>
</layout-content>
</template>
<script>
import LayoutContent from '@/components/business/LayoutContent'
import ComplexTable from '@/components/business/complex-table'
import Treeselect from '@riophae/vue-treeselect'
import '@riophae/vue-treeselect/dist/vue-treeselect.css'
import { LOAD_CHILDREN_OPTIONS, LOAD_ROOT_OPTIONS } from '@riophae/vue-treeselect'
import MsTableHeader from '@/metersphere/common/components/MsTableHeader'
import MsTableOperator from '@/metersphere/common/components/MsTableOperator'
import MsDialogFooter from '@/metersphere/common/components/MsDialogFooter'
import {
listenGoBack,
removeGoBackListener
} from '@/metersphere/common/js/utils'
import MsDeleteConfirm from '@/metersphere/common/components/MsDeleteConfirm'
import { getDeptTree, addDept, editDept, delDept } from '@/api/system/dept'
export default {
name: 'MsOrganization',
components: {
MsDeleteConfirm,
MsTableHeader,
MsTableOperator,
MsDialogFooter,
LayoutContent,
ComplexTable,
Treeselect
},
data() {
......@@ -173,6 +149,28 @@ export default {
add: ['dept:add'],
edit: ['dept:edit'],
del: ['dept:del']
},
header: '',
columns: [],
buttons: [
{
label: this.$t('commons.edit'), icon: 'el-icon-edit', click: this.edit
}, {
label: this.$t('commons.delete'), icon: 'el-icon-delete', type: 'danger', click: this._handleDelete
}
],
searchConfig: {
useQuickSearch: false,
useComplexSearch: false,
quickPlaceholder: '按姓名搜索',
components: [
]
},
paginationConfig: {
currentPage: 1,
pageSize: 10,
total: 0
}
}
......@@ -184,7 +182,6 @@ export default {
create() {
this.dialogOrgAddVisible = true
this.formType = 'add'
listenGoBack(this.closeFunc)
},
search(condition) {
console.log(condition)
......@@ -196,7 +193,6 @@ export default {
this.oldPid = row.pid
this.form = Object.assign({}, row)
this.treeByRow(row)
listenGoBack(this.closeFunc)
},
treeByRow(row) {
......@@ -242,7 +238,7 @@ export default {
initTableData(row, treeNode, resolve) {
const _self = this
const pid = row ? row.deptId : '0'
const pid = (row && row.deptId) ? row.deptId : '0'
getDeptTree(pid).then(response => {
let data = response.data
data = data.map(obj => {
......@@ -268,7 +264,6 @@ export default {
this.form = {}
this.oldPid = null
this.depts = null
removeGoBackListener(this.closeFunc)
this.dialogOrgAddVisible = false
},
......@@ -312,7 +307,7 @@ export default {
},
// 改变状态
changeEnabled(data, val) {
this.$confirm('此操作将 "停用" ' + data.name + '部门, 是否继续?', '提示', {
this.$confirm('此操作将 "停用" ' + data.name + '组织, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
......@@ -353,9 +348,7 @@ export default {
}
})
},
handleDelete(organization) {
this.$refs.deleteConfirm.open(organization)
},
_handleDelete(organization) {
this.$confirm(this.$t('organization.delete_confirm'), '', {
confirmButtonText: this.$t('commons.confirm'),
......@@ -407,7 +400,6 @@ export default {
</script>
<style scoped>
@import "~@/metersphere/common/css/index.css";
.member-size {
text-decoration: underline;
}
......
<template>
<div v-loading="$store.getters.loadingMap[$store.getters.currentPath]">
<el-card class="table-card">
<template v-slot:header>
<ms-table-header
:permission="permission"
:condition.sync="condition"
:create-tip="$t('menu.create')"
:title="$t('commons.menu')"
@search="initTableData"
@create="create"
/>
</template>
<el-table
<layout-content v-loading="$store.getters.loadingMap[$store.getters.currentPath]">
<complex-table
ref="table"
border
class="adjust-table"
:data="tableData"
lazy
:load="initTableData"
style="width: 100%"
:columns="columns"
:buttons="buttons"
:header="header"
:search-config="searchConfig"
:pagination-config="paginationConfig"
:tree-props="{children: 'children', hasChildren: 'hasChildren'}"
row-key="menuId"
@search="initTableData"
>
<template #buttons>
<fu-table-button icon="el-icon-circle-plus-outline" :label="$t('menu.create')" @click="create" />
</template>
<!-- <el-table-column type="selection" fix /> -->
<el-table-column :show-overflow-tooltip="true" label="菜单标题" width="150px" prop="title" />
<el-table-column prop="icon" label="图标" align="center" width="60px">
<template slot-scope="scope">
......@@ -33,7 +28,7 @@
<el-table-column :show-overflow-tooltip="true" prop="permission" label="权限标识" />
<el-table-column :show-overflow-tooltip="true" prop="component" label="组件路径" />
<el-table-column prop="iframe" label="外链" width="75px">
<!-- <el-table-column prop="iframe" label="外链" width="75px">
<template slot-scope="scope">
<span v-if="scope.row.iframe">是</span>
<span v-else>否</span>
......@@ -50,21 +45,15 @@
<span v-if="scope.row.hidden">否</span>
<span v-else>是</span>
</template>
</el-table-column>
</el-table-column> -->
<el-table-column prop="createTime" label="创建日期" width="160px">
<template v-slot:default="scope">
<span>{{ scope.row.createTime | timestampFormatDate }}</span>
</template>
</el-table-column>
<el-table-column :label="$t('commons.operating')">
<template v-slot:default="scope">
<ms-table-operator :permission="permission" @editClick="edit(scope.row)" @deleteClick="handleDelete(scope.row)" />
</template>
</el-table-column>
</el-table>
</el-card>
<fu-table-operations :buttons="buttons" label="操作" fix />
</complex-table>
<el-dialog
:close-on-click-modal="false"
......@@ -97,7 +86,7 @@
</el-input>
</el-popover>
</el-form-item>
<el-form-item v-show="form.type !== '2'" label="外链菜单" prop="iframe">
<!-- <el-form-item v-show="form.type !== '2'" label="外链菜单" prop="iframe">
<el-radio-group v-model="form.iframe" size="mini">
<el-radio-button label="true">是</el-radio-button>
<el-radio-button label="false">否</el-radio-button>
......@@ -114,7 +103,7 @@
<el-radio-button label="false">是</el-radio-button>
<el-radio-button label="true">否</el-radio-button>
</el-radio-group>
</el-form-item>
</el-form-item> -->
<el-form-item v-if="form.type !== '2'" label="菜单标题" prop="title">
<el-input v-model="form.title" :style=" form.type === '0' ? 'width: 450px' : 'width: 179px'" placeholder="菜单标题" />
</el-form-item>
......@@ -146,43 +135,37 @@
/>
</el-form-item>
</el-form>
<template v-slot:footer>
<div slot="footer" class="dialog-footer">
<el-button type="text" @click="dialogVisible = false">{{ $t('commons.cancel') }}</el-button>
<el-button type="primary" @click="createMenu('menuForm')">确认</el-button>
</div>
<!-- <template v-slot:footer>
<ms-dialog-footer
@cancel="dialogVisible = false"
@confirm="createMenu('menuForm')"
/>
</template>
</template> -->
</el-dialog>
<ms-delete-confirm ref="deleteConfirm" :title="$t('menu.delete')" @delete="_handleDelete" />
</div>
</layout-content>
</template>
<script>
import LayoutContent from '@/components/business/LayoutContent'
import ComplexTable from '@/components/business/complex-table'
// import { checkPermission } from '@/utils/permission'
import IconSelect from '@/components/IconSelect'
import Treeselect from '@riophae/vue-treeselect'
import '@riophae/vue-treeselect/dist/vue-treeselect.css'
import { LOAD_CHILDREN_OPTIONS, LOAD_ROOT_OPTIONS } from '@riophae/vue-treeselect'
import MsTableHeader from '@/metersphere/common/components/MsTableHeader'
import MsTableOperator from '@/metersphere/common/components/MsTableOperator'
import MsDialogFooter from '@/metersphere/common/components/MsDialogFooter'
import {
listenGoBack,
removeGoBackListener
} from '@/metersphere/common/js/utils'
import MsDeleteConfirm from '@/metersphere/common/components/MsDeleteConfirm'
import { addMenu, editMenu, delMenu, getMenusTree } from '@/api/system/menu'
export default {
name: 'MsMenu',
components: {
MsDeleteConfirm,
MsTableHeader,
MsTableOperator,
MsDialogFooter,
ComplexTable,
LayoutContent,
Treeselect,
IconSelect
},
......@@ -191,11 +174,6 @@ export default {
menus: [],
topMunu: { id: 0, label: '顶级类目', children: null },
formType: 'add',
queryPath: '/api/menu/childNodes/',
deletePath: '/api/menu/delete',
createPath: '/api/menu/create',
updatePath: '/api/menu/update',
result: {},
dialogVisible: false,
condition: {},
tableData: [],
......@@ -216,6 +194,41 @@ export default {
add: ['menu:add'],
edit: ['menu:edit'],
del: ['menu:del']
},
header: '',
columns: [],
buttons: [
{
label: this.$t('commons.edit'), icon: 'el-icon-edit', click: this.edit
}, {
label: this.$t('commons.delete'), icon: 'el-icon-delete', type: 'danger', click: this._handleDelete
}
],
searchConfig: {
useQuickSearch: false,
useComplexSearch: false,
quickPlaceholder: '按姓名搜索',
components: [
// { field: 'name', label: '姓名', component: 'FuComplexInput' },
// {
// field: 'enabled',
// label: '状态',
// component: 'FuComplexSelect',
// options: [
// { label: '启用', value: '1' },
// { label: '禁用', value: '0' }
// ],
// multiple: false
// }
]
},
paginationConfig: {
currentPage: 1,
pageSize: 10,
total: 0
}
}
......@@ -229,7 +242,6 @@ export default {
this.form = Object.assign({}, this.defaultForm)
this.dialogVisible = true
this.formType = 'add'
listenGoBack(this.closeFunc)
},
search(condition) {
console.log(condition)
......@@ -241,7 +253,6 @@ export default {
this.oldPid = row.pid
this.form = Object.assign({}, row)
this.treeByRow(row)
listenGoBack(this.closeFunc)
},
treeByRow(row) {
......@@ -288,7 +299,7 @@ export default {
initTableData(row, treeNode, resolve) {
const _self = this
const pid = row ? row.menuId : '0'
const pid = (row && row.menuId) ? row.menuId : '0'
getMenusTree(pid).then(response => {
let data = response.data
......@@ -314,7 +325,6 @@ export default {
this.form = this.defaultForm
this.oldPid = null
this.menus = null
removeGoBackListener(this.closeFunc)
this.dialogVisible = false
},
......@@ -374,9 +384,7 @@ export default {
}
})
},
handleDelete(menu) {
this.$refs.deleteConfirm.open(menu)
},
_handleDelete(menu) {
this.$confirm(this.$t('menu.delete_confirm'), '', {
confirmButtonText: this.$t('commons.confirm'),
......@@ -414,7 +422,6 @@ export default {
</script>
<style scoped>
@import "~@/metersphere/common/css/index.css";
.member-size {
text-decoration: underline;
}
......
<template>
<div v-loading="result.loading" style="height: 100%">
<el-container style="width: 100%; height: 100%;border: 1px solid #eee">
<el-aside width="70%" style="border: 1px solid #eee">
<el-card class="table-card">
<template v-slot:header>
<ms-table-header :permission="permission" :condition.sync="condition" :create-tip="$t('role.add')" :title="$t('commons.role')" @search="search" @create="create" />
<layout-content v-loading="$store.getters.loadingMap[$store.getters.currentPath]">
<!-- <div v-loading="result.loading" style="height: 100%"> -->
<el-container style="width: 100%; height: 100%;">
<el-aside width="70%">
<complex-table
highlight-current-row
:data="tableData"
:columns="columns"
:buttons="buttons"
:header="header"
:search-config="searchConfig"
:pagination-config="paginationConfig"
@search="search"
@row-click="rowClick"
>
<template #buttons>
<fu-table-button icon="el-icon-circle-plus-outline" :label="$t('role.add')" @click="create" />
</template>
<el-table border highlight-current-row class="adjust-table" :data="tableData" style="width: 100%;" @row-click="rowClick">
<el-table-column prop="name" label="名称" />
<el-table-column prop="code" label="代码" />
......@@ -15,17 +25,10 @@
<span>{{ scope.row.createTime | timestampFormatDate }}</span>
</template>
</el-table-column>
<el-table-column :label="$t('commons.operating')">
<template v-slot:default="scope">
<ms-table-operator :permission="permission" @editClick="edit(scope.row)" @deleteClick="handleDelete(scope.row)" />
</template>
</el-table-column>
</el-table>
<ms-table-pagination :change="search" :current-page.sync="currentPage" :page-size.sync="pageSize" :total="total" />
</el-card>
<fu-table-operations :buttons="buttons" label="操作" fix />
</complex-table>
</el-aside>
<el-main style="">
<el-main style="padding: 8px 20px;">
<el-tabs v-model="activeName" @tab-click="handleClick">
<el-tab-pane label="菜单授权" name="first">
<el-tree
......@@ -67,52 +70,31 @@
<el-input v-model="form.description" style="width: 380px;" rows="5" type="textarea" />
</el-form-item>
</el-form>
<template v-slot:footer>
<ms-dialog-footer
@cancel="dialogVisible = false"
@confirm="saveRole('roleForm')"
/>
</template>
<div slot="footer" class="dialog-footer">
<el-button type="text" @click="dialogVisible = false">{{ $t('commons.cancel') }}</el-button>
<el-button type="primary" @click="saveRole('roleForm')">确认</el-button>
</div>
</el-dialog>
</div>
</layout-content>
</template>
<script>
import MsTablePagination from '@/metersphere/common/pagination/TablePagination'
import MsTableHeader from '@/metersphere/common/components/MsTableHeader'
import MsTableOperator from '@/metersphere/common/components/MsTableOperator'
import MsDialogFooter from '@/metersphere/common/components/MsDialogFooter'
import {
listenGoBack,
removeGoBackListener
} from '@/metersphere/common/js/utils'
import LayoutContent from '@/components/business/LayoutContent'
import ComplexTable from '@/components/business/complex-table'
import { addRole, editRole, delRole, roleGrid, addRoleMenus, menuIds } from '@/api/system/role'
import { getMenusTree, getChild } from '@/api/system/menu'
export default {
name: 'Role',
components: {
MsTablePagination,
MsTableHeader,
MsTableOperator,
MsDialogFooter
LayoutContent,
ComplexTable
},
data() {
return {
result: {},
queryPath: '/api/role/roleGrid',
deletePath: '/api/role/delete/',
createPath: '/api/role/create',
updatePath: '/api/role/update',
queryMenusPath: '/api/menu/childNodes/',
childMenusPath: '/api/menu/childMenus/',
saveRoleMenusPath: '/api/role/saveRolesMenus',
currentPage: 1,
pageSize: 10,
total: 0,
condition: {},
tableData: [],
menus: [],
menuIds: [],
......@@ -131,6 +113,39 @@ export default {
add: ['role:add'],
edit: ['role:edit'],
del: ['role:del']
},
header: '',
columns: [],
buttons: [
{
label: this.$t('commons.edit'), icon: 'el-icon-edit', click: this.edit
}, {
label: this.$t('commons.delete'), icon: 'el-icon-delete', type: 'danger', click: this.handleDelete
}
],
searchConfig: {
quickPlaceholder: '按名称搜索',
components: [
// { field: 'name', label: '姓名', component: 'FuComplexInput', defaultOperator: 'eq' },
{ field: 'name', label: '名称', component: 'FuComplexInput' },
{
field: 'enabled',
label: '状态',
component: 'FuComplexSelect',
options: [
{ label: '启用', value: '1' },
{ label: '禁用', value: '0' }
],
multiple: false
}
// { field: 'deptId', label: '组织', component: conditionTable }
]
},
paginationConfig: {
currentPage: 1,
pageSize: 10,
total: 0
}
}
},
......@@ -148,10 +163,9 @@ export default {
this.form = {}
this.formType = 'add'
this.dialogVisible = true
listenGoBack(this.closeFunc)
},
search() {
roleGrid(this.currentPage, this.pageSize, this.condition).then(response => {
roleGrid(this.paginationConfig.currentPage, this.paginationConfig.pageSize, {}).then(response => {
const data = response.data
this.total = data.itemCount
this.tableData = data.listObject
......@@ -162,7 +176,6 @@ export default {
this.formType = 'modify'
this.dialogVisible = true
this.form = Object.assign({}, row)
listenGoBack(this.closeFunc)
},
saveRole(roleForm) {
......@@ -182,7 +195,6 @@ export default {
closeFunc() {
this.dialogVisible = false
removeGoBackListener(this.closeFunc)
},
getMenuDatas(node, resolve) {
......@@ -272,5 +284,4 @@ export default {
</script>
<style scoped>
@import "~@/metersphere/common/css/index.css";
</style>
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论