From 14c6d7178ce126932d37b983760ceb9b84c3bd95 Mon Sep 17 00:00:00 2001 From: wang-liang0615 Date: Tue, 18 Jul 2023 15:14:35 +0800 Subject: [PATCH] =?UTF-8?q?acl=20=E6=A0=B7=E5=BC=8F=E5=8D=87=E7=BA=A7?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- cmdb-ui/src/modules/acl/views/apps.vue | 90 ++- cmdb-ui/src/modules/acl/views/history.vue | 144 ++--- .../views/module/permissionHistoryTable.vue | 8 +- .../acl/views/module/resourceHistoryTable.vue | 6 +- .../views/module/resourceTypeHistoryTable.vue | 396 +++++++------ .../acl/views/module/roleHistoryTable.vue | 466 ++++++++------- .../acl/views/module/triggerHistoryTable.vue | 457 ++++++++------- .../acl/views/operation_history/index.vue | 12 +- .../modules/permissionTable.vue | 8 +- .../modules/resourceHistoryTable.vue | 8 +- .../modules/resourceTypeHistoryTable.vue | 496 ++++++++-------- .../modules/roleHistoryTable.vue | 486 +++++++-------- .../modules/triggerHistoryTable.vue | 553 +++++++++--------- .../src/modules/acl/views/resource_types.vue | 44 +- cmdb-ui/src/modules/acl/views/resources.vue | 70 +-- cmdb-ui/src/modules/acl/views/roles.vue | 87 ++- cmdb-ui/src/modules/acl/views/secretKey.vue | 2 + cmdb-ui/src/modules/acl/views/trigger.vue | 31 +- cmdb-ui/src/modules/acl/views/users.vue | 83 +-- 19 files changed, 1794 insertions(+), 1653 deletions(-) diff --git a/cmdb-ui/src/modules/acl/views/apps.vue b/cmdb-ui/src/modules/acl/views/apps.vue index 62930bf..b6f7b34 100644 --- a/cmdb-ui/src/modules/acl/views/apps.vue +++ b/cmdb-ui/src/modules/acl/views/apps.vue @@ -1,35 +1,37 @@ + + diff --git a/cmdb-ui/src/modules/acl/views/module/permissionHistoryTable.vue b/cmdb-ui/src/modules/acl/views/module/permissionHistoryTable.vue index 7907c22..0811f70 100644 --- a/cmdb-ui/src/modules/acl/views/module/permissionHistoryTable.vue +++ b/cmdb-ui/src/modules/acl/views/module/permissionHistoryTable.vue @@ -12,12 +12,13 @@ > @@ -71,6 +72,7 @@ :isLoading="loading" @change="onChange" @showSizeChange="onShowSizeChange" + :style="{ marginTop: '10px' }" > @@ -199,7 +201,7 @@ export default { return this.$store.state.windowHeight }, windowHeightMinus() { - return this.isExpand ? 396 : 331 + return this.isExpand ? 374 : 310 }, tableDataLength() { return this.tableData.length diff --git a/cmdb-ui/src/modules/acl/views/module/resourceHistoryTable.vue b/cmdb-ui/src/modules/acl/views/module/resourceHistoryTable.vue index 48f056d..6d12a0a 100644 --- a/cmdb-ui/src/modules/acl/views/module/resourceHistoryTable.vue +++ b/cmdb-ui/src/modules/acl/views/module/resourceHistoryTable.vue @@ -14,12 +14,13 @@ > @@ -54,6 +55,7 @@ :isLoading="loading" @change="onChange" @showSizeChange="onShowSizeChange" + :style="{ marginTop: '10px' }" > diff --git a/cmdb-ui/src/modules/acl/views/module/resourceTypeHistoryTable.vue b/cmdb-ui/src/modules/acl/views/module/resourceTypeHistoryTable.vue index 4b4f0d5..090ea98 100644 --- a/cmdb-ui/src/modules/acl/views/module/resourceTypeHistoryTable.vue +++ b/cmdb-ui/src/modules/acl/views/module/resourceTypeHistoryTable.vue @@ -8,12 +8,13 @@ > @@ -43,11 +44,12 @@ @@ -58,207 +60,213 @@ import Pager from './pager.vue' import SearchForm from './searchForm.vue' import { searchResourceHistory } from '@/modules/acl/api/history' export default { - components: { SearchForm, Pager }, - props: { - allResourceTypes: { - type: Array, - required: true - }, - allUsers: { - type: Array, - required: true - }, - allRoles: { - type: Array, - required: true - }, - allRolesMap: { - type: Map, - required: true - }, - allUsersMap: { - type: Map, - required: true - }, - allResourceTypesMap: { - type: Map, - required: true - }, + components: { SearchForm, Pager }, + props: { + allResourceTypes: { + type: Array, + required: true, }, - data() { - return { - loading: true, - checked: false, - tableData: [], - app_id: this.$route.name.split('_')[0], - resourceTableAttrList: [ - { - alias: '日期', - is_choice: false, - name: 'datetime', - value_type: '3' - }, - { - alias: '操作员', - is_choice: true, - name: 'operate_uid', - value_type: '2', - choice_value: this.allUsers - }, - { - alias: '操作', - is_choice: true, - name: 'operate_type', - value_type: '2', - choice_value: [ - { '新建': 'create' }, - { '修改': 'update' }, - { '删除': 'delete' }, - ] - }, - { - alias: '资源类型', - is_choice: true, - name: 'link_id', - value_type: '2', - choice_value: this.allResourceTypes - } - ], - operateTypeMap: new Map([ - ['create', '新建'], - ['update', '修改'], - ['delete', '删除'] - ]), - colorMap: new Map([ - ['create', 'green'], - ['update', 'orange'], - ['delete', 'red'] - ]), - queryParams: { - page: 1, - page_size: 50, - app_id: this.$route.name.split('_')[0], - scope: 'resource_type', - start: '', - end: '' - }, - } + allUsers: { + type: Array, + required: true, }, - async created() { - await this.getTable(this.queryParams) + allRoles: { + type: Array, + required: true, }, - updated() { - this.$refs.xTable.$el.querySelector('.vxe-table--body-wrapper').scrollTop = 0 + allRolesMap: { + type: Map, + required: true, }, - watch: { - '$route.name': async function(oldName, newName) { - this.app_id = this.$route.name.split('_')[0] - await this.getTable(this.queryParams) - } + allUsersMap: { + type: Map, + required: true, }, - computed: { - windowHeight() { - return this.$store.state.windowHeight - }, - tableDataLength() { - return this.tableData.length - } + allResourceTypesMap: { + type: Map, + required: true, }, - methods: { - async getTable(queryParams) { - try { - this.loading = true - const { data } = await searchResourceHistory(this.handleQueryParams(queryParams)) - data.forEach(item => { - this.handleChangeDescription(item, item.operate_type) - item.operate_uid = this.allUsersMap.get(item.operate_uid) - }) - this.tableData = data - } finally { - this.loading = false - } + }, + data() { + return { + loading: true, + checked: false, + tableData: [], + app_id: this.$route.name.split('_')[0], + resourceTableAttrList: [ + { + alias: '日期', + is_choice: false, + name: 'datetime', + value_type: '3', }, - - // searchForm相关 - handleSearch(queryParams) { - this.queryParams = { ...queryParams, app_id: this.app_id, scope: 'resource_type' } - this.getTable(this.queryParams) + { + alias: '操作员', + is_choice: true, + name: 'operate_uid', + value_type: '2', + choice_value: this.allUsers, }, - searchFormReset() { - this.$refs.child.checked = false - this.checked = false - this.queryParams = { - page: 1, - page_size: 50, - app_id: this.$route.name.split('_')[0], - scope: 'resource_type', - } - this.getTable(this.queryParams) + { + alias: '操作', + is_choice: true, + name: 'operate_type', + value_type: '2', + choice_value: [{ 新建: 'create' }, { 修改: 'update' }, { 删除: 'delete' }], }, - - // pager相关 - onShowSizeChange(size) { - this.queryParams.page_size = size - this.queryParams.page = 1 - this.getTable(this.queryParams) + { + alias: '资源类型', + is_choice: true, + name: 'link_id', + value_type: '2', + choice_value: this.allResourceTypes, }, - onChange(pageNum) { - this.queryParams.page = pageNum - this.getTable(this.queryParams) - }, - - handleQueryParams(queryParams) { - let flag = false - let q = queryParams.q ? queryParams.q : '' - for (const key in queryParams) { - if (key !== 'page' && key !== 'page_size' && key !== 'app_id' && key !== 'q' && key !== 'start' && key !== 'end' && queryParams[key] !== undefined) { - flag = true - if (q) q += `,${key}:${queryParams[key]}` - else q += `${key}:${queryParams[key]}` - delete queryParams[key] - } - } - const newQueryParams = { ...queryParams, q } - return flag ? newQueryParams : queryParams - }, - handleTagColor(operateType) { - return this.colorMap.get(operateType) - }, - handleChangeDescription(item, operate_type) { - switch (operate_type) { - // create - case 'create': { - item.changeDescription = `新增资源类型：${item.current.name}\n描述：${item.current.description}\n权限：${item.extra.permission_ids.current}` - break - } - case 'update': { - item.changeDescription = '' - for (const key in item.origin) { - const newVal = item.current[key] - const oldVal = item.origin[key] - if (!_.isEqual(newVal, oldVal) && key !== 'updated_at' && key !== 'deleted_at' && key !== 'created_at') { - if (oldVal === null || oldVal === '') { - const str = ` 【 ${key} : 改为 ${newVal} 】 \n` - item.changeDescription += str - } else { - const str = ` 【 ${key} : 由 ${oldVal} 改为 ${newVal} 】 \n` - item.changeDescription += str - } - } - } - const currentPerms = item.extra.permission_ids.current - const originPerms = item.extra.permission_ids.origin - if (!_.isEqual(currentPerms, originPerms)) item.changeDescription += ` 【 permission_ids : 由 ${originPerms} 改为 ${currentPerms} 】 ` - if (!item.changeDescription) item.changeDescription = '没有修改' - break - } - case 'delete': { - item.changeDescription = `删除资源类型：${item.origin.name}\n描述：${item.origin.description}\n权限：${item.extra.permission_ids.origin}` - break - } - } - } + ], + operateTypeMap: new Map([ + ['create', '新建'], + ['update', '修改'], + ['delete', '删除'], + ]), + colorMap: new Map([ + ['create', 'green'], + ['update', 'orange'], + ['delete', 'red'], + ]), + queryParams: { + page: 1, + page_size: 50, + app_id: this.$route.name.split('_')[0], + scope: 'resource_type', + start: '', + end: '', + }, } + }, + async created() { + await this.getTable(this.queryParams) + }, + updated() { + this.$refs.xTable.$el.querySelector('.vxe-table--body-wrapper').scrollTop = 0 + }, + watch: { + '$route.name': async function(oldName, newName) { + this.app_id = this.$route.name.split('_')[0] + await this.getTable(this.queryParams) + }, + }, + computed: { + windowHeight() { + return this.$store.state.windowHeight + }, + tableDataLength() { + return this.tableData.length + }, + }, + methods: { + async getTable(queryParams) { + try { + this.loading = true + const { data } = await searchResourceHistory(this.handleQueryParams(queryParams)) + data.forEach((item) => { + this.handleChangeDescription(item, item.operate_type) + item.operate_uid = this.allUsersMap.get(item.operate_uid) + }) + this.tableData = data + } finally { + this.loading = false + } + }, + + // searchForm相关 + handleSearch(queryParams) { + this.queryParams = { ...queryParams, app_id: this.app_id, scope: 'resource_type' } + this.getTable(this.queryParams) + }, + searchFormReset() { + this.$refs.child.checked = false + this.checked = false + this.queryParams = { + page: 1, + page_size: 50, + app_id: this.$route.name.split('_')[0], + scope: 'resource_type', + } + this.getTable(this.queryParams) + }, + + // pager相关 + onShowSizeChange(size) { + this.queryParams.page_size = size + this.queryParams.page = 1 + this.getTable(this.queryParams) + }, + onChange(pageNum) { + this.queryParams.page = pageNum + this.getTable(this.queryParams) + }, + + handleQueryParams(queryParams) { + let flag = false + let q = queryParams.q ? queryParams.q : '' + for (const key in queryParams) { + if ( + key !== 'page' && + key !== 'page_size' && + key !== 'app_id' && + key !== 'q' && + key !== 'start' && + key !== 'end' && + queryParams[key] !== undefined + ) { + flag = true + if (q) q += `,${key}:${queryParams[key]}` + else q += `${key}:${queryParams[key]}` + delete queryParams[key] + } + } + const newQueryParams = { ...queryParams, q } + return flag ? newQueryParams : queryParams + }, + handleTagColor(operateType) { + return this.colorMap.get(operateType) + }, + handleChangeDescription(item, operate_type) { + switch (operate_type) { + // create + case 'create': { + item.changeDescription = `新增资源类型：${item.current.name}\n描述：${item.current.description}\n权限：${item.extra.permission_ids.current}` + break + } + case 'update': { + item.changeDescription = '' + for (const key in item.origin) { + const newVal = item.current[key] + const oldVal = item.origin[key] + if (!_.isEqual(newVal, oldVal) && key !== 'updated_at' && key !== 'deleted_at' && key !== 'created_at') { + if (oldVal === null || oldVal === '') { + const str = ` 【 ${key} : 改为 ${newVal} 】 \n` + item.changeDescription += str + } else { + const str = ` 【 ${key} : 由 ${oldVal} 改为 ${newVal} 】 \n` + item.changeDescription += str + } + } + } + const currentPerms = item.extra.permission_ids.current + const originPerms = item.extra.permission_ids.origin + if (!_.isEqual(currentPerms, originPerms)) { + item.changeDescription += ` 【 permission_ids : 由 ${originPerms} 改为 ${currentPerms} 】 ` + } + if (!item.changeDescription) item.changeDescription = '没有修改' + break + } + case 'delete': { + item.changeDescription = `删除资源类型：${item.origin.name}\n描述：${item.origin.description}\n权限：${item.extra.permission_ids.origin}` + break + } + } + }, + }, } @@ -269,7 +277,7 @@ export default { .ant-tag { max-width: 100%; overflow: hidden; - text-overflow:ellipsis; + text-overflow: ellipsis; } p { margin-bottom: 0; diff --git a/cmdb-ui/src/modules/acl/views/module/roleHistoryTable.vue b/cmdb-ui/src/modules/acl/views/module/roleHistoryTable.vue index 948abd6..91fd9c6 100644 --- a/cmdb-ui/src/modules/acl/views/module/roleHistoryTable.vue +++ b/cmdb-ui/src/modules/acl/views/module/roleHistoryTable.vue @@ -11,12 +11,13 @@ > @@ -33,17 +34,21 @@ {{ row.current.name || row.origin.name }} @@ -59,11 +64,12 @@ @@ -74,228 +80,246 @@ import Pager from './pager.vue' import SearchForm from './searchForm.vue' import { searchRoleHistory } from '@/modules/acl/api/history' export default { - components: { SearchForm, Pager }, - props: { - allUsers: { - type: Array, - required: true - }, - allRoles: { - type: Array, - required: true - }, - allRolesMap: { - type: Map, - required: true - }, - allUsersMap: { - type: Map, - required: true - }, + components: { SearchForm, Pager }, + props: { + allUsers: { + type: Array, + required: true, }, - data() { - return { - loading: true, - checked: false, - tableData: [], - app_id: this.$route.name.split('_')[0], - operateTypeMap: new Map([ - ['create', '新建'], - ['delete', '删除'], - ['update', '修改'], - ['role_relation_add', '添加角色关系'], - ['role_relation_delete', '删除角色关系'], - ]), - colorMap: new Map([ - ['create', 'green'], - ['delete', 'red'], - ['update', 'orange'], - ['role_relation_add', 'green'], - ['role_relation_delete', 'red'] - ]), - queryParams: { - page: 1, - page_size: 50, - app_id: this.$route.name.split('_')[0], - scope: 'role', - start: '', - end: '' - }, - roleTableAttrList: [ - { - alias: '日期', - is_choice: false, - name: 'datetime', - value_type: '3' - }, - { - alias: '操作员', - is_choice: true, - name: 'operate_uid', - value_type: '2', - choice_value: this.allUsers - }, - { - alias: '操作', - is_choice: true, - name: 'operate_type', - value_type: '2', - choice_value: [ - { '新建': 'create' }, - { '修改': 'update' }, - { '删除': 'delete' }, - { '添加角色关系': 'role_relation_add' }, - { '删除角色关系': 'role_relation_delete' }, - ] - } - ] - } + allRoles: { + type: Array, + required: true, }, - computed: { - windowHeight() { - return this.$store.state.windowHeight - }, - tableDataLength() { - return this.tableData.length - }, + allRolesMap: { + type: Map, + required: true, }, - async created() { - await this.getTable(this.queryParams) + allUsersMap: { + type: Map, + required: true, }, - updated() { - this.$refs.xTable.$el.querySelector('.vxe-table--body-wrapper').scrollTop = 0 - }, - watch: { - '$route.name': async function(oldName, newName) { - this.app_id = this.$route.name.split('_')[0] - await this.getTable(this.queryParams) - } - }, - methods: { - async getTable(queryParams) { - try { - this.loading = true - const { data, id2roles, id2perms, id2resources } = await searchRoleHistory(this.handleQueryParams(queryParams)) - data.forEach(item => { - item.operate_uid = this.allUsersMap.get(item.operate_uid) - if (item.operate_type === 'role_relation_add' || item.operate_type === 'role_relation_delete') { - item.extra.child_ids.forEach((subItem, index) => { item.extra.child_ids[index] = id2roles[subItem].name }) - item.extra.parent_ids.forEach((subItem, index) => { item.extra.parent_ids[index] = id2roles[subItem].name }) - } else { - this.handleChangeDescription(item, item.operate_type, id2roles, id2perms, id2resources) - } - }) - this.tableData = data - } finally { - this.loading = false - } + }, + data() { + return { + loading: true, + checked: false, + tableData: [], + app_id: this.$route.name.split('_')[0], + operateTypeMap: new Map([ + ['create', '新建'], + ['delete', '删除'], + ['update', '修改'], + ['role_relation_add', '添加角色关系'], + ['role_relation_delete', '删除角色关系'], + ]), + colorMap: new Map([ + ['create', 'green'], + ['delete', 'red'], + ['update', 'orange'], + ['role_relation_add', 'green'], + ['role_relation_delete', 'red'], + ]), + queryParams: { + page: 1, + page_size: 50, + app_id: this.$route.name.split('_')[0], + scope: 'role', + start: '', + end: '', + }, + roleTableAttrList: [ + { + alias: '日期', + is_choice: false, + name: 'datetime', + value_type: '3', }, - - // pager相关 - onShowSizeChange(size) { - this.queryParams.page_size = size - this.queryParams.page = 1 - this.getTable(this.queryParams) + { + alias: '操作员', + is_choice: true, + name: 'operate_uid', + value_type: '2', + choice_value: this.allUsers, }, - onChange(pageNum) { - this.queryParams.page = pageNum - this.getTable(this.queryParams) - }, - - // searchForm相关 - onSwitchChange(checked) { - this.checked = checked - this.queryParams.scope = checked ? 'role_relation' : 'role' - this.queryParams.page = 1 - this.getTable(this.queryParams) - }, - handleSearch(queryParams) { - this.queryParams = { ...queryParams, app_id: this.app_id, scope: this.checked ? 'role_relation' : 'role' } - this.getTable(this.queryParams) - }, - searchFormReset() { - this.$refs.child.checked = false - this.checked = false - this.queryParams = { - page: 1, - page_size: 50, - app_id: this.$route.name.split('_')[0], - scope: this.checked ? 'role_relation' : 'role' - } - this.getTable(this.queryParams) - }, - - // 处理查询参数 - handleQueryParams(queryParams) { - let flag = false - let q = queryParams.q ? queryParams.q : '' - for (const key in queryParams) { - if (key !== 'page' && key !== 'page_size' && key !== 'app_id' && key !== 'q' && key !== 'start' && key !== 'end' && queryParams[key] !== undefined) { - flag = true - if (q) q += `,${key}:${queryParams[key]}` - else q += `${key}:${queryParams[key]}` - delete queryParams[key] - } - } - const newQueryParams = { ...queryParams, q } - return flag ? newQueryParams : queryParams - }, - // 处理tag颜色 - handleTagColor(operateType) { - return this.colorMap.get(operateType) - }, - handleChangeDescription(item, operate_type, id2roles, id2perms, id2resources) { - switch (operate_type) { - // create - case 'create': { - item.description = `新建角色：${item.current.name}` - break - } - case 'update': { - item.description = '' - for (const key in item.origin) { - const newVal = item.current[key] - const oldVal = item.origin[key] - if (!_.isEqual(newVal, oldVal) && key !== 'updated_at' && key !== 'deleted_at' && key !== 'created_at') { - if (oldVal === null) { - const str = ` 【 ${key} : 改为 ${newVal} 】 ` - item.description += str - } else { - const str = ` 【 ${key} : 由 ${oldVal} 改为 ${newVal} 】 ` - item.description += ` 【 ${key} : 由 ${oldVal} 改为 ${newVal} 】 ` - } - } - } - if (!item.description) item.description = '没有修改' - break - } - case 'delete': { - const { extra: { child_ids, parent_ids, role_permissions } } = item - child_ids.forEach((subItem, index) => { child_ids[index] = id2roles[subItem].name }) - parent_ids.forEach((subItem, index) => { parent_ids[index] = id2roles[subItem].name }) - - const resourceMap = new Map() - const permsArr = [] - role_permissions.forEach(subItem => { - const resource_id = subItem.resource_id - const perm_id = subItem.perm_id - if (resourceMap.has(resource_id)) { - let resource_perms = resourceMap.get(resource_id) - resource_perms += `,${id2perms[perm_id].name}` - resourceMap.set(resource_id, resource_perms) - } else { - resourceMap.set(resource_id, String(id2perms[perm_id].name)) - } - }) - resourceMap.forEach((value, key) => { - permsArr.push(`${id2resources[key].name}：${value}`) - }) - item.description = `继承者：${child_ids}\n继承自：${parent_ids}\n涉及资源及权限：\n${permsArr.join(`\n`)}` - break - } - } + { + alias: '操作', + is_choice: true, + name: 'operate_type', + value_type: '2', + choice_value: [ + { 新建: 'create' }, + { 修改: 'update' }, + { 删除: 'delete' }, + { 添加角色关系: 'role_relation_add' }, + { 删除角色关系: 'role_relation_delete' }, + ], }, + ], } + }, + computed: { + windowHeight() { + return this.$store.state.windowHeight + }, + tableDataLength() { + return this.tableData.length + }, + }, + async created() { + await this.getTable(this.queryParams) + }, + updated() { + this.$refs.xTable.$el.querySelector('.vxe-table--body-wrapper').scrollTop = 0 + }, + watch: { + '$route.name': async function(oldName, newName) { + this.app_id = this.$route.name.split('_')[0] + await this.getTable(this.queryParams) + }, + }, + methods: { + async getTable(queryParams) { + try { + this.loading = true + const { data, id2roles, id2perms, id2resources } = await searchRoleHistory(this.handleQueryParams(queryParams)) + data.forEach((item) => { + item.operate_uid = this.allUsersMap.get(item.operate_uid) + if (item.operate_type === 'role_relation_add' || item.operate_type === 'role_relation_delete') { + item.extra.child_ids.forEach((subItem, index) => { + item.extra.child_ids[index] = id2roles[subItem].name + }) + item.extra.parent_ids.forEach((subItem, index) => { + item.extra.parent_ids[index] = id2roles[subItem].name + }) + } else { + this.handleChangeDescription(item, item.operate_type, id2roles, id2perms, id2resources) + } + }) + this.tableData = data + } finally { + this.loading = false + } + }, + + // pager相关 + onShowSizeChange(size) { + this.queryParams.page_size = size + this.queryParams.page = 1 + this.getTable(this.queryParams) + }, + onChange(pageNum) { + this.queryParams.page = pageNum + this.getTable(this.queryParams) + }, + + // searchForm相关 + onSwitchChange(checked) { + this.checked = checked + this.queryParams.scope = checked ? 'role_relation' : 'role' + this.queryParams.page = 1 + this.getTable(this.queryParams) + }, + handleSearch(queryParams) { + this.queryParams = { ...queryParams, app_id: this.app_id, scope: this.checked ? 'role_relation' : 'role' } + this.getTable(this.queryParams) + }, + searchFormReset() { + this.$refs.child.checked = false + this.checked = false + this.queryParams = { + page: 1, + page_size: 50, + app_id: this.$route.name.split('_')[0], + scope: this.checked ? 'role_relation' : 'role', + } + this.getTable(this.queryParams) + }, + + // 处理查询参数 + handleQueryParams(queryParams) { + let flag = false + let q = queryParams.q ? queryParams.q : '' + for (const key in queryParams) { + if ( + key !== 'page' && + key !== 'page_size' && + key !== 'app_id' && + key !== 'q' && + key !== 'start' && + key !== 'end' && + queryParams[key] !== undefined + ) { + flag = true + if (q) q += `,${key}:${queryParams[key]}` + else q += `${key}:${queryParams[key]}` + delete queryParams[key] + } + } + const newQueryParams = { ...queryParams, q } + return flag ? newQueryParams : queryParams + }, + // 处理tag颜色 + handleTagColor(operateType) { + return this.colorMap.get(operateType) + }, + handleChangeDescription(item, operate_type, id2roles, id2perms, id2resources) { + switch (operate_type) { + // create + case 'create': { + item.description = `新建角色：${item.current.name}` + break + } + case 'update': { + item.description = '' + for (const key in item.origin) { + const newVal = item.current[key] + const oldVal = item.origin[key] + if (!_.isEqual(newVal, oldVal) && key !== 'updated_at' && key !== 'deleted_at' && key !== 'created_at') { + if (oldVal === null) { + const str = ` 【 ${key} : 改为 ${newVal} 】 ` + item.description += str + } else { + const str = ` 【 ${key} : 由 ${oldVal} 改为 ${newVal} 】 ` + item.description += ` 【 ${key} : 由 ${oldVal} 改为 ${newVal} 】 ` + } + } + } + if (!item.description) item.description = '没有修改' + break + } + case 'delete': { + const { + extra: { child_ids, parent_ids, role_permissions }, + } = item + child_ids.forEach((subItem, index) => { + child_ids[index] = id2roles[subItem].name + }) + parent_ids.forEach((subItem, index) => { + parent_ids[index] = id2roles[subItem].name + }) + + const resourceMap = new Map() + const permsArr = [] + role_permissions.forEach((subItem) => { + const resource_id = subItem.resource_id + const perm_id = subItem.perm_id + if (resourceMap.has(resource_id)) { + let resource_perms = resourceMap.get(resource_id) + resource_perms += `,${id2perms[perm_id].name}` + resourceMap.set(resource_id, resource_perms) + } else { + resourceMap.set(resource_id, String(id2perms[perm_id].name)) + } + }) + resourceMap.forEach((value, key) => { + permsArr.push(`${id2resources[key].name}：${value}`) + }) + item.description = `继承者：${child_ids}\n继承自：${parent_ids}\n涉及资源及权限：\n${permsArr.join(`\n`)}` + break + } + } + }, + }, } @@ -306,7 +330,7 @@ export default { .ant-tag { max-width: 100%; overflow: hidden; - text-overflow:ellipsis; + text-overflow: ellipsis; } p { margin-bottom: 0; diff --git a/cmdb-ui/src/modules/acl/views/module/triggerHistoryTable.vue b/cmdb-ui/src/modules/acl/views/module/triggerHistoryTable.vue index db6bd71..6b733cb 100644 --- a/cmdb-ui/src/modules/acl/views/module/triggerHistoryTable.vue +++ b/cmdb-ui/src/modules/acl/views/module/triggerHistoryTable.vue @@ -8,12 +8,13 @@ > @@ -42,11 +43,12 @@ @@ -57,229 +59,252 @@ import Pager from './pager.vue' import SearchForm from './searchForm.vue' import { searchTriggerHistory } from '@/modules/acl/api/history' export default { - components: { SearchForm, Pager }, - props: { - allUsers: { - type: Array, - required: true - }, - allRoles: { - type: Array, - required: true - }, - allTriggers: { - type: Array, - required: true - }, - allRolesMap: { - type: Map, - required: true - }, - allTriggersMap: { - type: Map, - required: true - }, - allUsersMap: { - type: Map, - required: true - }, - allResourceTypesMap: { - type: Map, - required: true - }, + components: { SearchForm, Pager }, + props: { + allUsers: { + type: Array, + required: true, }, - data() { - return { - app_id: this.$route.name.split('_')[0], - loading: true, - tableData: [], - operateTypeMap: new Map([ - ['create', '新建'], - ['update', '修改'], - ['delete', '删除'], - ['trigger_apply', '应用'], - ['trigger_cancel', '取消'], - ]), - colorMap: new Map([ - ['create', 'green'], - ['delete', 'red'], - ['update', 'orange'], - ['trigger_apply', 'green'], - ['trigger_cancel', 'red'], - ]), - triggerTableAttrList: [ - { - alias: '日期', - is_choice: false, - name: 'datetime', - value_type: '3' - }, - { - alias: '操作员', - is_choice: true, - name: 'operate_uid', - value_type: '2', - choice_value: this.allUsers - }, - { - alias: '操作', - is_choice: true, - name: 'operate_type', - value_type: '2', - choice_value: [ - { '新建': 'create' }, - { '修改': 'update' }, - { '删除': 'delete' }, - { '应用': 'trigger_apply' }, - { '取消': 'trigger_cancel' }, - ] - }, - { - alias: '触发器', - is_choice: true, - name: 'trigger_id', - value_type: '2', - choice_value: this.allTriggers - } - ], - queryParams: { - page: 1, - page_size: 50, - app_id: this.$route.name.split('_')[0] - }, - } + allRoles: { + type: Array, + required: true, }, - async created() { - await this.getTable(this.queryParams) + allTriggers: { + type: Array, + required: true, }, - updated() { - this.$refs.xTable.$el.querySelector('.vxe-table--body-wrapper').scrollTop = 0 + allRolesMap: { + type: Map, + required: true, }, - watch: { - '$route.name': async function(oldName, newName) { - this.app_id = this.$route.name.split('_')[0] - await this.getTable(this.queryParams) - } + allTriggersMap: { + type: Map, + required: true, }, - computed: { - windowHeight() { - return this.$store.state.windowHeight - }, - tableDataLength() { - return this.tableData.length - } + allUsersMap: { + type: Map, + required: true, }, - methods: { - async getTable(queryParams) { - try { - this.loading = true - const res = await searchTriggerHistory(this.handleQueryParams(queryParams)) - res.data.forEach(item => { - this.handleChangeDescription(item, item.operate_type) - item.trigger_id = this.allTriggersMap.get(item.trigger_id) - item.operate_uid = this.allUsersMap.get(item.operate_uid) - }) - this.tableData = res.data - } finally { - this.loading = false - } + allResourceTypesMap: { + type: Map, + required: true, + }, + }, + data() { + return { + app_id: this.$route.name.split('_')[0], + loading: true, + tableData: [], + operateTypeMap: new Map([ + ['create', '新建'], + ['update', '修改'], + ['delete', '删除'], + ['trigger_apply', '应用'], + ['trigger_cancel', '取消'], + ]), + colorMap: new Map([ + ['create', 'green'], + ['delete', 'red'], + ['update', 'orange'], + ['trigger_apply', 'green'], + ['trigger_cancel', 'red'], + ]), + triggerTableAttrList: [ + { + alias: '日期', + is_choice: false, + name: 'datetime', + value_type: '3', }, - - // pager相关 - onShowSizeChange(size) { - this.queryParams.page_size = size - this.queryParams.page = 1 - this.getTable(this.queryParams) + { + alias: '操作员', + is_choice: true, + name: 'operate_uid', + value_type: '2', + choice_value: this.allUsers, }, - onChange(pageNum) { - this.queryParams.page = pageNum - this.getTable(this.queryParams) + { + alias: '操作', + is_choice: true, + name: 'operate_type', + value_type: '2', + choice_value: [ + { 新建: 'create' }, + { 修改: 'update' }, + { 删除: 'delete' }, + { 应用: 'trigger_apply' }, + { 取消: 'trigger_cancel' }, + ], }, - - // searchForm相关 - handleSearch(queryParams) { - this.queryParams = queryParams - this.queryParams.app_id = this.app_id - this.getTable(this.queryParams) + { + alias: '触发器', + is_choice: true, + name: 'trigger_id', + value_type: '2', + choice_value: this.allTriggers, }, - searchFormReset() { - this.queryParams = { - page: 1, - page_size: 50, - app_id: this.$route.name.split('_')[0] - } - this.getTable(this.queryParams) - }, - - handleChangeDescription(item, operate_type) { - switch (operate_type) { - // create - case 'create': { - const str = item.current.roles - const newArr = str.slice(1, str.length - 1).split(', ') - const newStr = newArr.map(i => this.allRolesMap.get(Number(i))).join('，') - item.changeDescription = `新增触发器：${item.current.name}\n资源类型：${this.allResourceTypesMap.get(item.current.resource_type_id)}，资源名：${item.current.wildcard}，角色：[${newStr}]\n权限：${item.current.permissions}\n状态：${item.current.enabled}` - break - } - case 'update': { - item.changeDescription = '' - for (const key in item.origin) { - const newVal = item.current[key] - const oldVal = item.origin[key] - if (!_.isEqual(newVal, oldVal) && key !== 'updated_at' && key !== 'deleted_at' && key !== 'created_at') { - if (oldVal === null) { - const str = ` 【 ${key} : 改为 ${newVal} 】 ` - item.changeDescription += str - } else { - const str = ` 【 ${key} : 由 ${oldVal} 改为 ${newVal} 】 ` - item.changeDescription += ` 【 ${key} : 由 ${oldVal} 改为 ${newVal} 】 ` - } - } - } - if (!item.changeDescription) item.changeDescription = '没有修改' - break - } - case 'delete': { - const str = item.origin.roles - const newArr = str.slice(1, str.length - 1).split(', ') - const newStr = newArr.map(i => this.allRolesMap.get(Number(i))).join('，') - item.changeDescription = `删除触发器：${item.origin.name}\n资源类型：${this.allResourceTypesMap.get(item.origin.resource_type_id)}，资源名：${item.origin.wildcard}，角色：[${newStr}]\n权限：${item.origin.permissions}\n状态：${item.origin.enabled}` - break - } - case 'trigger_apply': { - const str = item.current.roles - const newArr = str.slice(1, str.length - 1).split(', ') - const newStr = newArr.map(i => this.allRolesMap.get(Number(i))).join('，') - item.changeDescription = `应用触发器：${item.current.name}\n资源类型：${this.allResourceTypesMap.get(item.current.resource_type_id)}，资源名：${item.current.wildcard}，角色：[${newStr}]\n权限：${item.current.permissions}\n状态：${item.current.enabled}` - break - } - case 'trigger_cancel': { - const str = item.current.roles - const newArr = str.slice(1, str.length - 1).split(', ') - const newStr = newArr.map(i => this.allRolesMap.get(Number(i))).join('，') - item.changeDescription = `取消触发器：${item.current.name}\n资源类型：${this.allResourceTypesMap.get(item.current.resource_type_id)}，资源名：${item.current.wildcard}，角色：[${newStr}]\n权限：${item.current.permissions}\n状态：${item.current.enabled}` - break - } - } - }, - handleQueryParams(queryParams) { - let q = '' - for (const key in queryParams) { - if (key !== 'page' && key !== 'page_size' && key !== 'app_id' && key !== 'start' && key !== 'end' && queryParams[key] !== undefined) { - if (q) { - q += `,${key}:${queryParams[key]}` - } else { - q += `${key}:${queryParams[key]}` - } - } - } - const newQueryParams = { ...queryParams, q } - return q ? newQueryParams : queryParams - }, - handleTagColor(operateType) { - return this.colorMap.get(operateType) - } + ], + queryParams: { + page: 1, + page_size: 50, + app_id: this.$route.name.split('_')[0], + }, } + }, + async created() { + await this.getTable(this.queryParams) + }, + updated() { + this.$refs.xTable.$el.querySelector('.vxe-table--body-wrapper').scrollTop = 0 + }, + watch: { + '$route.name': async function(oldName, newName) { + this.app_id = this.$route.name.split('_')[0] + await this.getTable(this.queryParams) + }, + }, + computed: { + windowHeight() { + return this.$store.state.windowHeight + }, + tableDataLength() { + return this.tableData.length + }, + }, + methods: { + async getTable(queryParams) { + try { + this.loading = true + const res = await searchTriggerHistory(this.handleQueryParams(queryParams)) + res.data.forEach((item) => { + this.handleChangeDescription(item, item.operate_type) + item.trigger_id = this.allTriggersMap.get(item.trigger_id) + item.operate_uid = this.allUsersMap.get(item.operate_uid) + }) + this.tableData = res.data + } finally { + this.loading = false + } + }, + + // pager相关 + onShowSizeChange(size) { + this.queryParams.page_size = size + this.queryParams.page = 1 + this.getTable(this.queryParams) + }, + onChange(pageNum) { + this.queryParams.page = pageNum + this.getTable(this.queryParams) + }, + + // searchForm相关 + handleSearch(queryParams) { + this.queryParams = queryParams + this.queryParams.app_id = this.app_id + this.getTable(this.queryParams) + }, + searchFormReset() { + this.queryParams = { + page: 1, + page_size: 50, + app_id: this.$route.name.split('_')[0], + } + this.getTable(this.queryParams) + }, + + handleChangeDescription(item, operate_type) { + switch (operate_type) { + // create + case 'create': { + const str = item.current.roles + const newArr = str.slice(1, str.length - 1).split(', ') + const newStr = newArr.map((i) => this.allRolesMap.get(Number(i))).join('，') + item.changeDescription = `新增触发器：${item.current.name}\n资源类型：${this.allResourceTypesMap.get( + item.current.resource_type_id + )}，资源名：${item.current.wildcard}，角色：[${newStr}]\n权限：${item.current.permissions}\n状态：${ + item.current.enabled + }` + break + } + case 'update': { + item.changeDescription = '' + for (const key in item.origin) { + const newVal = item.current[key] + const oldVal = item.origin[key] + if (!_.isEqual(newVal, oldVal) && key !== 'updated_at' && key !== 'deleted_at' && key !== 'created_at') { + if (oldVal === null) { + const str = ` 【 ${key} : 改为 ${newVal} 】 ` + item.changeDescription += str + } else { + const str = ` 【 ${key} : 由 ${oldVal} 改为 ${newVal} 】 ` + item.changeDescription += ` 【 ${key} : 由 ${oldVal} 改为 ${newVal} 】 ` + } + } + } + if (!item.changeDescription) item.changeDescription = '没有修改' + break + } + case 'delete': { + const str = item.origin.roles + const newArr = str.slice(1, str.length - 1).split(', ') + const newStr = newArr.map((i) => this.allRolesMap.get(Number(i))).join('，') + item.changeDescription = `删除触发器：${item.origin.name}\n资源类型：${this.allResourceTypesMap.get( + item.origin.resource_type_id + )}，资源名：${item.origin.wildcard}，角色：[${newStr}]\n权限：${item.origin.permissions}\n状态：${ + item.origin.enabled + }` + break + } + case 'trigger_apply': { + const str = item.current.roles + const newArr = str.slice(1, str.length - 1).split(', ') + const newStr = newArr.map((i) => this.allRolesMap.get(Number(i))).join('，') + item.changeDescription = `应用触发器：${item.current.name}\n资源类型：${this.allResourceTypesMap.get( + item.current.resource_type_id + )}，资源名：${item.current.wildcard}，角色：[${newStr}]\n权限：${item.current.permissions}\n状态：${ + item.current.enabled + }` + break + } + case 'trigger_cancel': { + const str = item.current.roles + const newArr = str.slice(1, str.length - 1).split(', ') + const newStr = newArr.map((i) => this.allRolesMap.get(Number(i))).join('，') + item.changeDescription = `取消触发器：${item.current.name}\n资源类型：${this.allResourceTypesMap.get( + item.current.resource_type_id + )}，资源名：${item.current.wildcard}，角色：[${newStr}]\n权限：${item.current.permissions}\n状态：${ + item.current.enabled + }` + break + } + } + }, + handleQueryParams(queryParams) { + let q = '' + for (const key in queryParams) { + if ( + key !== 'page' && + key !== 'page_size' && + key !== 'app_id' && + key !== 'start' && + key !== 'end' && + queryParams[key] !== undefined + ) { + if (q) { + q += `,${key}:${queryParams[key]}` + } else { + q += `${key}:${queryParams[key]}` + } + } + } + const newQueryParams = { ...queryParams, q } + return q ? newQueryParams : queryParams + }, + handleTagColor(operateType) { + return this.colorMap.get(operateType) + }, + }, } @@ -290,6 +315,6 @@ p { .ant-tag { max-width: 100%; overflow: hidden; - text-overflow:ellipsis; + text-overflow: ellipsis; } diff --git a/cmdb-ui/src/modules/acl/views/operation_history/index.vue b/cmdb-ui/src/modules/acl/views/operation_history/index.vue index e7663c0..66ae9d2 100644 --- a/cmdb-ui/src/modules/acl/views/operation_history/index.vue +++ b/cmdb-ui/src/modules/acl/views/operation_history/index.vue @@ -1,5 +1,5 @@ @@ -172,7 +174,7 @@ export default { return this.$store.state.windowHeight }, windowHeightMinus() { - return this.isExpand ? 396 : 331 + return this.isExpand ? 374 : 310 }, tableDataLength() { return this.tableData.length diff --git a/cmdb-ui/src/modules/acl/views/operation_history/modules/resourceHistoryTable.vue b/cmdb-ui/src/modules/acl/views/operation_history/modules/resourceHistoryTable.vue index 0273a15..7702373 100644 --- a/cmdb-ui/src/modules/acl/views/operation_history/modules/resourceHistoryTable.vue +++ b/cmdb-ui/src/modules/acl/views/operation_history/modules/resourceHistoryTable.vue @@ -15,13 +15,14 @@ @resourceClear="resourceClear" > @@ -56,6 +57,7 @@ :isLoading="loading" @change="onChange" @showSizeChange="onShowSizeChange" + :style="{ marginTop: '10px' }" > @@ -160,7 +162,7 @@ export default { return this.$store.state.windowHeight }, windowHeightMinus() { - return this.isExpand ? 396 : 331 + return this.isExpand ? 374 : 310 }, tableDataLength() { return this.tableData.length diff --git a/cmdb-ui/src/modules/acl/views/operation_history/modules/resourceTypeHistoryTable.vue b/cmdb-ui/src/modules/acl/views/operation_history/modules/resourceTypeHistoryTable.vue index c02eca8..014b118 100644 --- a/cmdb-ui/src/modules/acl/views/operation_history/modules/resourceTypeHistoryTable.vue +++ b/cmdb-ui/src/modules/acl/views/operation_history/modules/resourceTypeHistoryTable.vue @@ -10,12 +10,13 @@ > @@ -45,11 +46,12 @@ @@ -63,249 +65,261 @@ import { searchUser } from '@/modules/acl/api/user' import { searchResourceType } from '@/modules/acl/api/resource' import { searchApp } from '@/modules/acl/api/app' export default { - components: { SearchForm, Pager }, - data() { - return { - loading: true, - checked: false, - isExpand: false, - app_id: undefined, - tableData: [], - allResourceTypes: [], - allUsers: [], - allApps: [], - allUsersMap: new Map(), - allResourcesMap: new Map(), - resourceTableAttrList: [ - { - alias: '日期', - is_choice: false, - name: 'datetime', - value_type: '3' - }, - { - alias: '应用', - is_choice: true, - name: 'app_id', - value_type: '2', - choice_value: [] - }, - { - alias: '操作员', - is_choice: true, - name: 'operate_uid', - value_type: '2', - choice_value: [] - }, - { - alias: '资源类型', - is_choice: true, - name: 'link_id', - value_type: '2', - choice_value: [] - }, - { - alias: '操作', - is_choice: true, - name: 'operate_type', - value_type: '2', - choice_value: [ - { '新建': 'create' }, - { '修改': 'update' }, - { '删除': 'delete' }, - ] - } - ], - operateTypeMap: new Map([ - ['create', '新建'], - ['update', '修改'], - ['delete', '删除'] - ]), - colorMap: new Map([ - ['create', 'green'], - ['update', 'orange'], - ['delete', 'red'] - ]), - queryParams: { - page: 1, - page_size: 50, - scope: 'resource_type', - start: '', - end: '' - }, - } - }, - async created() { - this.$watch( - function () { - return this.resourceTableAttrList[3].choice_value - }, - function () { - delete this.$refs.child.queryParams.link_id - } - ) - await Promise.all([ this.getAllApps(), this.getAllUsers() ]) - await this.getTable(this.queryParams) - }, - updated() { - this.$refs.xTable.$el.querySelector('.vxe-table--body-wrapper').scrollTop = 0 - }, - computed: { - windowHeight() { - return this.$store.state.windowHeight + components: { SearchForm, Pager }, + data() { + return { + loading: true, + checked: false, + isExpand: false, + app_id: undefined, + tableData: [], + allResourceTypes: [], + allUsers: [], + allApps: [], + allUsersMap: new Map(), + allResourcesMap: new Map(), + resourceTableAttrList: [ + { + alias: '日期', + is_choice: false, + name: 'datetime', + value_type: '3', }, - windowHeightMinus() { - return this.isExpand ? 396 : 331 + { + alias: '应用', + is_choice: true, + name: 'app_id', + value_type: '2', + choice_value: [], }, - tableDataLength() { - return this.tableData.length - } - }, - methods: { - async getTable(queryParams) { - try { - this.loading = true - const { data } = await searchResourceHistory(this.handleQueryParams(queryParams)) - data.forEach(item => { - this.handleChangeDescription(item, item.operate_type) - item.operate_uid = this.allUsersMap.get(item.operate_uid) - }) - this.tableData = data - } finally { - this.loading = false - } + { + alias: '操作员', + is_choice: true, + name: 'operate_uid', + value_type: '2', + choice_value: [], }, - async getAllApps() { - const { apps } = await searchApp() - const allApps = [] - apps.forEach(item => { allApps.push({ [item.name]: item.id }) }) - this.allApps = allApps - this.resourceTableAttrList[1].choice_value = this.allApps + { + alias: '资源类型', + is_choice: true, + name: 'link_id', + value_type: '2', + choice_value: [], }, - async getAllUsers() { - const { users } = await searchUser({ page_size: 10000, app_id: 'acl' }) - const allUsers = [] - const allUsersMap = new Map() - users.forEach(item => { - allUsers.push({ [item.nickname]: item.uid }) - allUsersMap.set(item.uid, item.nickname) - }) - this.allUsers = allUsers - this.allUsersMap = allUsersMap - this.resourceTableAttrList[2].choice_value = this.allUsers + { + alias: '操作', + is_choice: true, + name: 'operate_type', + value_type: '2', + choice_value: [{ 新建: 'create' }, { 修改: 'update' }, { 删除: 'delete' }], }, - async getAllResourceTypes(app_id) { - if (!app_id) { - this.resourceTableAttrList[3].choice_value = [] - return - } - const { groups } = await searchResourceType({ - page: 1, - page_size: 9999, - app_id: app_id - }) - const allResourceTypes = [] - groups.forEach(item => { allResourceTypes.push({ [item.name]: item.id }) }) - this.allResourceTypes = allResourceTypes - this.resourceTableAttrList[3].choice_value = this.allResourceTypes - }, - - // searchForm相关 - handleExpandChange(expand) { - this.isExpand = expand - }, - handleSearch(queryParams) { - this.queryParams = { ...queryParams, scope: 'resource_type' } - this.getTable(this.queryParams) - }, - searchFormReset() { - this.$refs.child.checked = false - this.checked = false - this.queryParams = { - page: 1, - page_size: 50, - scope: 'resource_type', - } - this.getTable(this.queryParams) - }, - async searchFormChange(queryParams) { - if (this.app_id !== queryParams.app_id) { - this.app_id = queryParams.app_id - await this.getAllResourceTypes(this.app_id) - } - if (queryParams.app_id === undefined) { - this.app_id = undefined - this.$refs.child.queryParams.link_id = undefined - } - }, - - // pager相关 - onShowSizeChange(size) { - this.queryParams.page_size = size - this.queryParams.page = 1 - this.getTable(this.queryParams) - }, - onChange(pageNum) { - this.queryParams.page = pageNum - this.getTable(this.queryParams) - }, - - handleQueryParams(queryParams) { - let flag = false - let q = queryParams.q ? queryParams.q : '' - for (const key in queryParams) { - if (key !== 'page' && key !== 'page_size' && key !== 'app_id' && key !== 'q' && key !== 'start' && key !== 'end' && queryParams[key] !== undefined) { - flag = true - if (q) q += `,${key}:${queryParams[key]}` - else q += `${key}:${queryParams[key]}` - delete queryParams[key] - } - } - const newQueryParams = { ...queryParams, q } - return flag ? newQueryParams : queryParams - }, - handleTagColor(operateType) { - return this.colorMap.get(operateType) - }, - handleChangeDescription(item, operate_type) { - switch (operate_type) { - // create - case 'create': { - const description = item.current?.description === undefined ? '无' : item.current?.description - const permission = item.extra.permission_ids?.current === undefined ? '无' : item.extra.permission_ids?.current - item.changeDescription = `新增资源类型：${item.current.name}\n描述：${description}\n权限：${permission}` - break - } - case 'update': { - item.changeDescription = '' - for (const key in item.origin) { - const newVal = item.current[key] - const oldVal = item.origin[key] - if (!_.isEqual(newVal, oldVal) && key !== 'updated_at' && key !== 'deleted_at' && key !== 'created_at') { - if (oldVal === null || oldVal === '') { - const str = ` 【 ${key} : 改为 ${newVal} 】 \n` - item.changeDescription += str - } else { - const str = ` 【 ${key} : 由 ${oldVal} 改为 ${newVal} 】 \n` - item.changeDescription += str - } - } - } - const currentPerms = item.extra.permission_ids?.current === undefined ? '无' : item.extra.permission_ids?.current - const originPerms = item.extra.permission_ids?.origin === undefined ? '无' : item.extra.permission_ids?.origin - if (!_.isEqual(currentPerms, originPerms)) item.changeDescription += ` 【 permission_ids : 由 ${originPerms} 改为 ${currentPerms} 】 ` - if (!item.changeDescription) item.changeDescription = '没有修改' - break - } - case 'delete': { - const description = item.origin?.description === undefined ? '无' : item.origin?.description - const permission = item.extra.permission_ids?.origin === undefined ? '无' : item.extra.permission_ids?.origin - item.changeDescription = `删除资源类型：${item.origin.name}\n描述：${description}\n权限：${permission}` - break - } - } - } + ], + operateTypeMap: new Map([ + ['create', '新建'], + ['update', '修改'], + ['delete', '删除'], + ]), + colorMap: new Map([ + ['create', 'green'], + ['update', 'orange'], + ['delete', 'red'], + ]), + queryParams: { + page: 1, + page_size: 50, + scope: 'resource_type', + start: '', + end: '', + }, } + }, + async created() { + this.$watch( + function() { + return this.resourceTableAttrList[3].choice_value + }, + function() { + delete this.$refs.child.queryParams.link_id + } + ) + await Promise.all([this.getAllApps(), this.getAllUsers()]) + await this.getTable(this.queryParams) + }, + updated() { + this.$refs.xTable.$el.querySelector('.vxe-table--body-wrapper').scrollTop = 0 + }, + computed: { + windowHeight() { + return this.$store.state.windowHeight + }, + windowHeightMinus() { + return this.isExpand ? 374 : 310 + }, + tableDataLength() { + return this.tableData.length + }, + }, + methods: { + async getTable(queryParams) { + try { + this.loading = true + const { data } = await searchResourceHistory(this.handleQueryParams(queryParams)) + data.forEach((item) => { + this.handleChangeDescription(item, item.operate_type) + item.operate_uid = this.allUsersMap.get(item.operate_uid) + }) + this.tableData = data + } finally { + this.loading = false + } + }, + async getAllApps() { + const { apps } = await searchApp() + const allApps = [] + apps.forEach((item) => { + allApps.push({ [item.name]: item.id }) + }) + this.allApps = allApps + this.resourceTableAttrList[1].choice_value = this.allApps + }, + async getAllUsers() { + const { users } = await searchUser({ page_size: 10000, app_id: 'acl' }) + const allUsers = [] + const allUsersMap = new Map() + users.forEach((item) => { + allUsers.push({ [item.nickname]: item.uid }) + allUsersMap.set(item.uid, item.nickname) + }) + this.allUsers = allUsers + this.allUsersMap = allUsersMap + this.resourceTableAttrList[2].choice_value = this.allUsers + }, + async getAllResourceTypes(app_id) { + if (!app_id) { + this.resourceTableAttrList[3].choice_value = [] + return + } + const { groups } = await searchResourceType({ + page: 1, + page_size: 9999, + app_id: app_id, + }) + const allResourceTypes = [] + groups.forEach((item) => { + allResourceTypes.push({ [item.name]: item.id }) + }) + this.allResourceTypes = allResourceTypes + this.resourceTableAttrList[3].choice_value = this.allResourceTypes + }, + + // searchForm相关 + handleExpandChange(expand) { + this.isExpand = expand + }, + handleSearch(queryParams) { + this.queryParams = { ...queryParams, scope: 'resource_type' } + this.getTable(this.queryParams) + }, + searchFormReset() { + this.$refs.child.checked = false + this.checked = false + this.queryParams = { + page: 1, + page_size: 50, + scope: 'resource_type', + } + this.getTable(this.queryParams) + }, + async searchFormChange(queryParams) { + if (this.app_id !== queryParams.app_id) { + this.app_id = queryParams.app_id + await this.getAllResourceTypes(this.app_id) + } + if (queryParams.app_id === undefined) { + this.app_id = undefined + this.$refs.child.queryParams.link_id = undefined + } + }, + + // pager相关 + onShowSizeChange(size) { + this.queryParams.page_size = size + this.queryParams.page = 1 + this.getTable(this.queryParams) + }, + onChange(pageNum) { + this.queryParams.page = pageNum + this.getTable(this.queryParams) + }, + + handleQueryParams(queryParams) { + let flag = false + let q = queryParams.q ? queryParams.q : '' + for (const key in queryParams) { + if ( + key !== 'page' && + key !== 'page_size' && + key !== 'app_id' && + key !== 'q' && + key !== 'start' && + key !== 'end' && + queryParams[key] !== undefined + ) { + flag = true + if (q) q += `,${key}:${queryParams[key]}` + else q += `${key}:${queryParams[key]}` + delete queryParams[key] + } + } + const newQueryParams = { ...queryParams, q } + return flag ? newQueryParams : queryParams + }, + handleTagColor(operateType) { + return this.colorMap.get(operateType) + }, + handleChangeDescription(item, operate_type) { + switch (operate_type) { + // create + case 'create': { + const description = item.current?.description === undefined ? '无' : item.current?.description + const permission = + item.extra.permission_ids?.current === undefined ? '无' : item.extra.permission_ids?.current + item.changeDescription = `新增资源类型：${item.current.name}\n描述：${description}\n权限：${permission}` + break + } + case 'update': { + item.changeDescription = '' + for (const key in item.origin) { + const newVal = item.current[key] + const oldVal = item.origin[key] + if (!_.isEqual(newVal, oldVal) && key !== 'updated_at' && key !== 'deleted_at' && key !== 'created_at') { + if (oldVal === null || oldVal === '') { + const str = ` 【 ${key} : 改为 ${newVal} 】 \n` + item.changeDescription += str + } else { + const str = ` 【 ${key} : 由 ${oldVal} 改为 ${newVal} 】 \n` + item.changeDescription += str + } + } + } + const currentPerms = + item.extra.permission_ids?.current === undefined ? '无' : item.extra.permission_ids?.current + const originPerms = item.extra.permission_ids?.origin === undefined ? '无' : item.extra.permission_ids?.origin + if (!_.isEqual(currentPerms, originPerms)) { + item.changeDescription += ` 【 permission_ids : 由 ${originPerms} 改为 ${currentPerms} 】 ` + } + if (!item.changeDescription) item.changeDescription = '没有修改' + break + } + case 'delete': { + const description = item.origin?.description === undefined ? '无' : item.origin?.description + const permission = item.extra.permission_ids?.origin === undefined ? '无' : item.extra.permission_ids?.origin + item.changeDescription = `删除资源类型：${item.origin.name}\n描述：${description}\n权限：${permission}` + break + } + } + }, + }, } @@ -316,7 +330,7 @@ export default { .ant-tag { max-width: 100%; overflow: hidden; - text-overflow:ellipsis; + text-overflow: ellipsis; } p { margin-bottom: 0; diff --git a/cmdb-ui/src/modules/acl/views/operation_history/modules/roleHistoryTable.vue b/cmdb-ui/src/modules/acl/views/operation_history/modules/roleHistoryTable.vue index a91e5eb..bd3094e 100644 --- a/cmdb-ui/src/modules/acl/views/operation_history/modules/roleHistoryTable.vue +++ b/cmdb-ui/src/modules/acl/views/operation_history/modules/roleHistoryTable.vue @@ -10,13 +10,14 @@ @searchFormReset="searchFormReset" > @@ -33,17 +34,21 @@ {{ row.current.name || row.origin.name }} @@ -59,11 +64,12 @@ @@ -76,234 +82,254 @@ import { searchRoleHistory } from '@/modules/acl/api/history' import { searchApp } from '@/modules/acl/api/app' import { searchUser } from '@/modules/acl/api/user' export default { - components: { SearchForm, Pager }, - data() { - return { - loading: true, - checked: false, - app_id: undefined, - tableData: [], - allApps: [], - allUsers: [], - allRoles: [], - allRolesMap: new Map(), - allUsersMap: new Map(), - operateTypeMap: new Map([ - ['create', '新建'], - ['delete', '删除'], - ['update', '修改'], - ['role_relation_add', '添加角色关系'], - ['role_relation_delete', '删除角色关系'], - ]), - colorMap: new Map([ - ['create', 'green'], - ['delete', 'red'], - ['update', 'orange'], - ['role_relation_add', 'green'], - ['role_relation_delete', 'red'] - ]), - queryParams: { - page: 1, - page_size: 50, - scope: 'role', - start: '', - end: '' - }, - roleTableAttrList: [ - { - alias: '日期', - is_choice: false, - name: 'datetime', - value_type: '3' - }, - { - alias: '应用', - is_choice: true, - name: 'app_id', - value_type: '2', - choice_value: [] - }, - { - alias: '操作员', - is_choice: true, - name: 'operate_uid', - value_type: '2', - choice_value: [] - }, - { - alias: '操作', - is_choice: true, - name: 'operate_type', - value_type: '2', - choice_value: [ - { '新建': 'create' }, - { '修改': 'update' }, - { '删除': 'delete' }, - { '添加角色关系': 'role_relation_add' }, - { '删除角色关系': 'role_relation_delete' }, - ] - } - ] - } - }, - computed: { - windowHeight() { - return this.$store.state.windowHeight + components: { SearchForm, Pager }, + data() { + return { + loading: true, + checked: false, + app_id: undefined, + tableData: [], + allApps: [], + allUsers: [], + allRoles: [], + allRolesMap: new Map(), + allUsersMap: new Map(), + operateTypeMap: new Map([ + ['create', '新建'], + ['delete', '删除'], + ['update', '修改'], + ['role_relation_add', '添加角色关系'], + ['role_relation_delete', '删除角色关系'], + ]), + colorMap: new Map([ + ['create', 'green'], + ['delete', 'red'], + ['update', 'orange'], + ['role_relation_add', 'green'], + ['role_relation_delete', 'red'], + ]), + queryParams: { + page: 1, + page_size: 50, + scope: 'role', + start: '', + end: '', + }, + roleTableAttrList: [ + { + alias: '日期', + is_choice: false, + name: 'datetime', + value_type: '3', }, - tableDataLength() { - return this.tableData.length - } - }, - async created() { - await Promise.all([ this.getAllApps(), this.getAllUsers() ]) - await this.getTable(this.queryParams) - }, - updated() { - this.$refs.xTable.$el.querySelector('.vxe-table--body-wrapper').scrollTop = 0 - }, - methods: { - async getTable(queryParams) { - try { - this.loading = true - const { data, id2roles, id2perms, id2resources } = await searchRoleHistory(this.handleQueryParams(queryParams)) - data.forEach(item => { - item.operate_uid = this.allUsersMap.get(item.operate_uid) - if (item.operate_type === 'role_relation_add' || item.operate_type === 'role_relation_delete') { - item.extra.child_ids.forEach((subItem, index) => { item.extra.child_ids[index] = id2roles[subItem].name }) - item.extra.parent_ids.forEach((subItem, index) => { item.extra.parent_ids[index] = id2roles[subItem].name }) - } else { - this.handleChangeDescription(item, item.operate_type, id2roles, id2perms, id2resources) - } - }) - this.tableData = data - } finally { - this.loading = false - } + { + alias: '应用', + is_choice: true, + name: 'app_id', + value_type: '2', + choice_value: [], }, - async getAllApps() { - const { apps } = await searchApp() - const allApps = [] - apps.forEach(item => { allApps.push({ [item.name]: item.id }) }) - this.allApps = allApps - this.roleTableAttrList[1].choice_value = this.allApps + { + alias: '操作员', + is_choice: true, + name: 'operate_uid', + value_type: '2', + choice_value: [], }, - async getAllUsers() { - const { users } = await searchUser({ page_size: 10000, app_id: 'acl' }) - const allUsers = [] - const allUsersMap = new Map() - users.forEach(item => { - allUsers.push({ [item.nickname]: item.uid }) - allUsersMap.set(item.uid, item.nickname) - }) - this.allUsers = allUsers - this.allUsersMap = allUsersMap - this.roleTableAttrList[2].choice_value = this.allUsers - }, - - // pager相关 - onShowSizeChange(size) { - this.queryParams.page_size = size - this.queryParams.page = 1 - this.getTable(this.queryParams) - }, - onChange(pageNum) { - this.queryParams.page = pageNum - this.getTable(this.queryParams) - }, - - // searchForm相关 - onSwitchChange(checked) { - this.checked = checked - this.queryParams.scope = checked ? 'role_relation' : 'role' - this.queryParams.page = 1 - this.getTable(this.queryParams) - }, - handleSearch(queryParams) { - this.queryParams = { ...queryParams, scope: this.checked ? 'role_relation' : 'role' } - this.getTable(this.queryParams) - }, - searchFormReset() { - this.$refs.child.checked = false - this.checked = false - this.queryParams = { - page: 1, - page_size: 50, - scope: this.checked ? 'role_relation' : 'role' - } - this.getTable(this.queryParams) - }, - - // 处理查询参数 - handleQueryParams(queryParams) { - let flag = false - let q = queryParams.q ? queryParams.q : '' - for (const key in queryParams) { - if (key !== 'page' && key !== 'page_size' && key !== 'app_id' && key !== 'q' && key !== 'start' && key !== 'end' && queryParams[key] !== undefined) { - flag = true - if (q) q += `,${key}:${queryParams[key]}` - else q += `${key}:${queryParams[key]}` - delete queryParams[key] - } - } - const newQueryParams = { ...queryParams, q } - return flag ? newQueryParams : queryParams - }, - // 处理tag颜色 - handleTagColor(operateType) { - return this.colorMap.get(operateType) - }, - handleChangeDescription(item, operate_type, id2roles, id2perms, id2resources) { - switch (operate_type) { - // create - case 'create': { - item.description = `新建角色：${item.current.name}` - break - } - case 'update': { - item.description = '' - for (const key in item.origin) { - const newVal = item.current[key] - const oldVal = item.origin[key] - if (!_.isEqual(newVal, oldVal) && key !== 'updated_at' && key !== 'deleted_at' && key !== 'created_at') { - if (oldVal === null) { - const str = ` 【 ${key} : 改为 ${newVal} 】 ` - item.description += str - } else { - const str = ` 【 ${key} : 由 ${oldVal} 改为 ${newVal} 】 ` - item.description += str - } - } - } - if (!item.description) item.description = '没有修改' - break - } - case 'delete': { - const { extra: { child_ids, parent_ids, role_permissions } } = item - child_ids.forEach((subItem, index) => { child_ids[index] = id2roles[subItem].name }) - parent_ids.forEach((subItem, index) => { parent_ids[index] = id2roles[subItem].name }) - - const resourceMap = new Map() - const permsArr = [] - role_permissions.forEach(subItem => { - const resource_id = subItem.resource_id - const perm_id = subItem.perm_id - if (resourceMap.has(resource_id)) { - let resource_perms = resourceMap.get(resource_id) - resource_perms += `,${id2perms[perm_id].name}` - resourceMap.set(resource_id, resource_perms) - } else { - resourceMap.set(resource_id, String(id2perms[perm_id].name)) - } - }) - resourceMap.forEach((value, key) => { - permsArr.push(`${id2resources[key].name}：${value}`) - }) - item.description = `继承者：${child_ids}\n继承自：${parent_ids}\n涉及资源及权限：\n${permsArr.join(`\n`)}` - break - } - } + { + alias: '操作', + is_choice: true, + name: 'operate_type', + value_type: '2', + choice_value: [ + { 新建: 'create' }, + { 修改: 'update' }, + { 删除: 'delete' }, + { 添加角色关系: 'role_relation_add' }, + { 删除角色关系: 'role_relation_delete' }, + ], }, + ], } + }, + computed: { + windowHeight() { + return this.$store.state.windowHeight + }, + tableDataLength() { + return this.tableData.length + }, + }, + async created() { + await Promise.all([this.getAllApps(), this.getAllUsers()]) + await this.getTable(this.queryParams) + }, + updated() { + this.$refs.xTable.$el.querySelector('.vxe-table--body-wrapper').scrollTop = 0 + }, + methods: { + async getTable(queryParams) { + try { + this.loading = true + const { data, id2roles, id2perms, id2resources } = await searchRoleHistory(this.handleQueryParams(queryParams)) + data.forEach((item) => { + item.operate_uid = this.allUsersMap.get(item.operate_uid) + if (item.operate_type === 'role_relation_add' || item.operate_type === 'role_relation_delete') { + item.extra.child_ids.forEach((subItem, index) => { + item.extra.child_ids[index] = id2roles[subItem].name + }) + item.extra.parent_ids.forEach((subItem, index) => { + item.extra.parent_ids[index] = id2roles[subItem].name + }) + } else { + this.handleChangeDescription(item, item.operate_type, id2roles, id2perms, id2resources) + } + }) + this.tableData = data + } finally { + this.loading = false + } + }, + async getAllApps() { + const { apps } = await searchApp() + const allApps = [] + apps.forEach((item) => { + allApps.push({ [item.name]: item.id }) + }) + this.allApps = allApps + this.roleTableAttrList[1].choice_value = this.allApps + }, + async getAllUsers() { + const { users } = await searchUser({ page_size: 10000, app_id: 'acl' }) + const allUsers = [] + const allUsersMap = new Map() + users.forEach((item) => { + allUsers.push({ [item.nickname]: item.uid }) + allUsersMap.set(item.uid, item.nickname) + }) + this.allUsers = allUsers + this.allUsersMap = allUsersMap + this.roleTableAttrList[2].choice_value = this.allUsers + }, + + // pager相关 + onShowSizeChange(size) { + this.queryParams.page_size = size + this.queryParams.page = 1 + this.getTable(this.queryParams) + }, + onChange(pageNum) { + this.queryParams.page = pageNum + this.getTable(this.queryParams) + }, + + // searchForm相关 + onSwitchChange(checked) { + this.checked = checked + this.queryParams.scope = checked ? 'role_relation' : 'role' + this.queryParams.page = 1 + this.getTable(this.queryParams) + }, + handleSearch(queryParams) { + this.queryParams = { ...queryParams, scope: this.checked ? 'role_relation' : 'role' } + this.getTable(this.queryParams) + }, + searchFormReset() { + this.$refs.child.checked = false + this.checked = false + this.queryParams = { + page: 1, + page_size: 50, + scope: this.checked ? 'role_relation' : 'role', + } + this.getTable(this.queryParams) + }, + + // 处理查询参数 + handleQueryParams(queryParams) { + let flag = false + let q = queryParams.q ? queryParams.q : '' + for (const key in queryParams) { + if ( + key !== 'page' && + key !== 'page_size' && + key !== 'app_id' && + key !== 'q' && + key !== 'start' && + key !== 'end' && + queryParams[key] !== undefined + ) { + flag = true + if (q) q += `,${key}:${queryParams[key]}` + else q += `${key}:${queryParams[key]}` + delete queryParams[key] + } + } + const newQueryParams = { ...queryParams, q } + return flag ? newQueryParams : queryParams + }, + // 处理tag颜色 + handleTagColor(operateType) { + return this.colorMap.get(operateType) + }, + handleChangeDescription(item, operate_type, id2roles, id2perms, id2resources) { + switch (operate_type) { + // create + case 'create': { + item.description = `新建角色：${item.current.name}` + break + } + case 'update': { + item.description = '' + for (const key in item.origin) { + const newVal = item.current[key] + const oldVal = item.origin[key] + if (!_.isEqual(newVal, oldVal) && key !== 'updated_at' && key !== 'deleted_at' && key !== 'created_at') { + if (oldVal === null) { + const str = ` 【 ${key} : 改为 ${newVal} 】 ` + item.description += str + } else { + const str = ` 【 ${key} : 由 ${oldVal} 改为 ${newVal} 】 ` + item.description += str + } + } + } + if (!item.description) item.description = '没有修改' + break + } + case 'delete': { + const { + extra: { child_ids, parent_ids, role_permissions }, + } = item + child_ids.forEach((subItem, index) => { + child_ids[index] = id2roles[subItem].name + }) + parent_ids.forEach((subItem, index) => { + parent_ids[index] = id2roles[subItem].name + }) + + const resourceMap = new Map() + const permsArr = [] + role_permissions.forEach((subItem) => { + const resource_id = subItem.resource_id + const perm_id = subItem.perm_id + if (resourceMap.has(resource_id)) { + let resource_perms = resourceMap.get(resource_id) + resource_perms += `,${id2perms[perm_id].name}` + resourceMap.set(resource_id, resource_perms) + } else { + resourceMap.set(resource_id, String(id2perms[perm_id].name)) + } + }) + resourceMap.forEach((value, key) => { + permsArr.push(`${id2resources[key].name}：${value}`) + }) + item.description = `继承者：${child_ids}\n继承自：${parent_ids}\n涉及资源及权限：\n${permsArr.join(`\n`)}` + break + } + } + }, + }, } @@ -314,7 +340,7 @@ export default { .ant-tag { max-width: 100%; overflow: hidden; - text-overflow:ellipsis; + text-overflow: ellipsis; } p { margin-bottom: 0; diff --git a/cmdb-ui/src/modules/acl/views/operation_history/modules/triggerHistoryTable.vue b/cmdb-ui/src/modules/acl/views/operation_history/modules/triggerHistoryTable.vue index 1b8b3a2..a7ee747 100644 --- a/cmdb-ui/src/modules/acl/views/operation_history/modules/triggerHistoryTable.vue +++ b/cmdb-ui/src/modules/acl/views/operation_history/modules/triggerHistoryTable.vue @@ -10,12 +10,13 @@ > @@ -44,11 +45,12 @@ @@ -62,275 +64,292 @@ import { getTriggers } from '@/modules/acl/api/trigger' import { searchUser } from '@/modules/acl/api/user' import { searchApp } from '@/modules/acl/api/app' export default { - components: { SearchForm, Pager }, - data() { - return { - app_id: undefined, - loading: true, - isExpand: false, - tableData: [], - allResourceTypes: [], - allResources: [], - allUsers: [], - allRoles: [], - allTriggers: [], - allApps: [], - allRolesMap: new Map(), - allUsersMap: new Map(), - allResourceTypesMap: new Map(), - allResourcesMap: new Map(), - allTriggersMap: new Map(), - operateTypeMap: new Map([ - ['create', '新建'], - ['update', '修改'], - ['delete', '删除'], - ['trigger_apply', '应用'], - ['trigger_cancel', '取消'], - ]), - colorMap: new Map([ - ['create', 'green'], - ['delete', 'red'], - ['update', 'orange'], - ['trigger_apply', 'green'], - ['trigger_cancel', 'red'], - ]), - triggerTableAttrList: [ - { - alias: '日期', - is_choice: false, - name: 'datetime', - value_type: '3' - }, - { - alias: '应用', - is_choice: true, - name: 'app_id', - value_type: '2', - choice_value: [] - }, - { - alias: '操作员', - is_choice: true, - name: 'operate_uid', - value_type: '2', - choice_value: [] - }, - { - alias: '触发器', - is_choice: true, - name: 'trigger_id', - value_type: '2', - choice_value: [] - }, - { - alias: '操作', - is_choice: true, - name: 'operate_type', - value_type: '2', - choice_value: [ - { '新建': 'create' }, - { '修改': 'update' }, - { '删除': 'delete' }, - { '应用': 'trigger_apply' }, - { '取消': 'trigger_cancel' }, - ] - }, - ], - queryParams: { - page: 1, - page_size: 50, - start: '', - end: '' - }, - } - }, - async created() { - this.$watch( - function () { - return this.triggerTableAttrList[3].choice_value - }, - function () { - delete this.$refs.child.queryParams.trigger_id - } - ) - await Promise.all([ this.getAllApps(), this.getAllUsers() ]) - await this.getTable(this.queryParams) - }, - updated() { - this.$refs.xTable.$el.querySelector('.vxe-table--body-wrapper').scrollTop = 0 - }, - computed: { - windowHeight() { - return this.$store.state.windowHeight + components: { SearchForm, Pager }, + data() { + return { + app_id: undefined, + loading: true, + isExpand: false, + tableData: [], + allResourceTypes: [], + allResources: [], + allUsers: [], + allRoles: [], + allTriggers: [], + allApps: [], + allRolesMap: new Map(), + allUsersMap: new Map(), + allResourceTypesMap: new Map(), + allResourcesMap: new Map(), + allTriggersMap: new Map(), + operateTypeMap: new Map([ + ['create', '新建'], + ['update', '修改'], + ['delete', '删除'], + ['trigger_apply', '应用'], + ['trigger_cancel', '取消'], + ]), + colorMap: new Map([ + ['create', 'green'], + ['delete', 'red'], + ['update', 'orange'], + ['trigger_apply', 'green'], + ['trigger_cancel', 'red'], + ]), + triggerTableAttrList: [ + { + alias: '日期', + is_choice: false, + name: 'datetime', + value_type: '3', }, - windowHeightMinus() { - return this.isExpand ? 396 : 331 + { + alias: '应用', + is_choice: true, + name: 'app_id', + value_type: '2', + choice_value: [], }, - tableDataLength() { - return this.tableData.length - } - }, - methods: { - async getTable(queryParams) { - try { - this.loading = true - const { data, id2resource_types, id2roles } = await searchTriggerHistory(this.handleQueryParams(queryParams)) - data.forEach(item => { - this.handleChangeDescription(item, item.operate_type, id2resource_types, id2roles) - item.trigger_id = this.allTriggersMap.get(item.trigger_id) - item.operate_uid = this.allUsersMap.get(item.operate_uid) - }) - this.tableData = data - } finally { - this.loading = false - } + { + alias: '操作员', + is_choice: true, + name: 'operate_uid', + value_type: '2', + choice_value: [], }, - async getAllApps() { - const { apps } = await searchApp() - const allApps = [] - apps.forEach(item => { allApps.push({ [item.name]: item.id }) }) - this.allApps = allApps - this.triggerTableAttrList[1].choice_value = this.allApps + { + alias: '触发器', + is_choice: true, + name: 'trigger_id', + value_type: '2', + choice_value: [], }, - async getAllUsers() { - const { users } = await searchUser({ page_size: 10000, app_id: 'acl' }) - const allUsers = [] - const allUsersMap = new Map() - users.forEach(item => { - allUsers.push({ [item.nickname]: item.uid }) - allUsersMap.set(item.uid, item.nickname) - }) - this.allUsers = allUsers - this.allUsersMap = allUsersMap - this.triggerTableAttrList[2].choice_value = this.allUsers + { + alias: '操作', + is_choice: true, + name: 'operate_type', + value_type: '2', + choice_value: [ + { 新建: 'create' }, + { 修改: 'update' }, + { 删除: 'delete' }, + { 应用: 'trigger_apply' }, + { 取消: 'trigger_cancel' }, + ], }, - async getTriggers(app_id) { - if (!app_id) { - this.triggerTableAttrList[3].choice_value = [] - return - } - const res = await getTriggers({ app_id: app_id }) - const allTriggers = [] - const allTriggersMap = new Map() - res.forEach(item => { - allTriggers.push({ [item.name]: item.id }) - allTriggersMap.set(item.id, item.name) - }) - this.allTriggers = allTriggers - this.allTriggersMap = allTriggersMap - this.triggerTableAttrList[3].choice_value = this.allTriggers - }, - - // pager相关 - onShowSizeChange(size) { - this.queryParams.page_size = size - this.queryParams.page = 1 - this.getTable(this.queryParams) - }, - onChange(pageNum) { - this.queryParams.page = pageNum - this.getTable(this.queryParams) - }, - - // searchForm相关 - handleExpandChange(expand) { - this.isExpand = expand - }, - handleSearch(queryParams) { - this.queryParams = queryParams - this.getTable(this.queryParams) - }, - searchFormReset() { - this.queryParams = { - page: 1, - page_size: 50, - } - this.getTable(this.queryParams) - }, - async searchFormChange(queryParams) { - if (this.app_id !== queryParams.app_id) { - this.app_id = queryParams.app_id - await this.getTriggers(this.app_id) - } - if (queryParams.app_id === undefined) { - this.app_id = undefined - this.$refs.child.queryParams.trigger_id = undefined - } - }, - - handleChangeDescription(item, operate_type, id2resource_types, id2roles) { - switch (operate_type) { - // create - case 'create': { - const str = item.current.roles - const newArr = str.slice(1, str.length - 1).split(', ') - const newStr = newArr.map(i => id2roles[i].name).join('，') - const { name, resource_type_id, wildcard, permissions, enabled } = item.current - item.changeDescription = `新增触发器：${name}\n资源类型：${id2resource_types[resource_type_id].name}，资源名：${wildcard || ''}，角色：[${newStr}]\n权限：${permissions}\n状态：${enabled}` - break - } - case 'update': { - item.changeDescription = '' - for (const key in item.origin) { - const newVal = item.current[key] - const oldVal = item.origin[key] - if (!_.isEqual(newVal, oldVal) && key !== 'updated_at' && key !== 'deleted_at' && key !== 'created_at') { - if (oldVal === null) { - const str = ` 【 ${key} : 改为 ${newVal} 】 ` - item.changeDescription += str - } else { - const str = ` 【 ${key} : 由 ${oldVal} 改为 ${newVal} 】 ` - item.changeDescription += ` 【 ${key} : 由 ${oldVal} 改为 ${newVal} 】 ` - } - } - } - if (!item.changeDescription) item.changeDescription = '没有修改' - break - } - case 'delete': { - const str = item.origin.roles - const newArr = str.slice(1, str.length - 1).split(', ') - const newStr = newArr.map(i => id2roles[i].name).join('，') - const { name, resource_type_id, wildcard, permissions, enabled } = item.origin - item.changeDescription = `删除触发器：${name}\n资源类型：${id2resource_types[resource_type_id].name}，资源名：${wildcard || ''}，角色：[${newStr}]\n权限：${permissions}\n状态：${enabled}` - break - } - case 'trigger_apply': { - const str = item.current.roles - const newArr = str.slice(1, str.length - 1).split(', ') - const newStr = newArr.map(i => id2roles[i].name).join('，') - const { name, resource_type_id, wildcard, permissions, enabled } = item.current - item.changeDescription = `应用触发器：${name}\n资源类型：${id2resource_types[resource_type_id].name}，资源名：${wildcard || ''}，角色：[${newStr}]\n权限：${permissions}\n状态：${enabled}` - break - } - case 'trigger_cancel': { - const str = item.current.roles - const newArr = str.slice(1, str.length - 1).split(', ') - const newStr = newArr.map(i => id2roles[i].name).join('，') - const { name, resource_type_id, wildcard, permissions, enabled } = item.current - item.changeDescription = `取消触发器：${name}\n资源类型：${id2resource_types[resource_type_id].name}，资源名：${wildcard || ''}，角色：[${newStr}]\n权限：${permissions}\n状态：${enabled}` - break - } - } - }, - handleQueryParams(queryParams) { - let q = '' - for (const key in queryParams) { - if (key !== 'page' && key !== 'page_size' && key !== 'app_id' && key !== 'start' && key !== 'end' && queryParams[key] !== undefined) { - if (q) { - q += `,${key}:${queryParams[key]}` - } else { - q += `${key}:${queryParams[key]}` - } - } - } - const newQueryParams = { ...queryParams, q } - return q ? newQueryParams : queryParams - }, - handleTagColor(operateType) { - return this.colorMap.get(operateType) - } + ], + queryParams: { + page: 1, + page_size: 50, + start: '', + end: '', + }, } + }, + async created() { + this.$watch( + function() { + return this.triggerTableAttrList[3].choice_value + }, + function() { + delete this.$refs.child.queryParams.trigger_id + } + ) + await Promise.all([this.getAllApps(), this.getAllUsers()]) + await this.getTable(this.queryParams) + }, + updated() { + this.$refs.xTable.$el.querySelector('.vxe-table--body-wrapper').scrollTop = 0 + }, + computed: { + windowHeight() { + return this.$store.state.windowHeight + }, + windowHeightMinus() { + return this.isExpand ? 374 : 310 + }, + tableDataLength() { + return this.tableData.length + }, + }, + methods: { + async getTable(queryParams) { + try { + this.loading = true + const { data, id2resource_types, id2roles } = await searchTriggerHistory(this.handleQueryParams(queryParams)) + data.forEach((item) => { + this.handleChangeDescription(item, item.operate_type, id2resource_types, id2roles) + item.trigger_id = this.allTriggersMap.get(item.trigger_id) + item.operate_uid = this.allUsersMap.get(item.operate_uid) + }) + this.tableData = data + } finally { + this.loading = false + } + }, + async getAllApps() { + const { apps } = await searchApp() + const allApps = [] + apps.forEach((item) => { + allApps.push({ [item.name]: item.id }) + }) + this.allApps = allApps + this.triggerTableAttrList[1].choice_value = this.allApps + }, + async getAllUsers() { + const { users } = await searchUser({ page_size: 10000, app_id: 'acl' }) + const allUsers = [] + const allUsersMap = new Map() + users.forEach((item) => { + allUsers.push({ [item.nickname]: item.uid }) + allUsersMap.set(item.uid, item.nickname) + }) + this.allUsers = allUsers + this.allUsersMap = allUsersMap + this.triggerTableAttrList[2].choice_value = this.allUsers + }, + async getTriggers(app_id) { + if (!app_id) { + this.triggerTableAttrList[3].choice_value = [] + return + } + const res = await getTriggers({ app_id: app_id }) + const allTriggers = [] + const allTriggersMap = new Map() + res.forEach((item) => { + allTriggers.push({ [item.name]: item.id }) + allTriggersMap.set(item.id, item.name) + }) + this.allTriggers = allTriggers + this.allTriggersMap = allTriggersMap + this.triggerTableAttrList[3].choice_value = this.allTriggers + }, + + // pager相关 + onShowSizeChange(size) { + this.queryParams.page_size = size + this.queryParams.page = 1 + this.getTable(this.queryParams) + }, + onChange(pageNum) { + this.queryParams.page = pageNum + this.getTable(this.queryParams) + }, + + // searchForm相关 + handleExpandChange(expand) { + this.isExpand = expand + }, + handleSearch(queryParams) { + this.queryParams = queryParams + this.getTable(this.queryParams) + }, + searchFormReset() { + this.queryParams = { + page: 1, + page_size: 50, + } + this.getTable(this.queryParams) + }, + async searchFormChange(queryParams) { + if (this.app_id !== queryParams.app_id) { + this.app_id = queryParams.app_id + await this.getTriggers(this.app_id) + } + if (queryParams.app_id === undefined) { + this.app_id = undefined + this.$refs.child.queryParams.trigger_id = undefined + } + }, + + handleChangeDescription(item, operate_type, id2resource_types, id2roles) { + switch (operate_type) { + // create + case 'create': { + const str = item.current.roles + const newArr = str.slice(1, str.length - 1).split(', ') + const newStr = newArr.map((i) => id2roles[i].name).join('，') + const { name, resource_type_id, wildcard, permissions, enabled } = item.current + item.changeDescription = `新增触发器：${name}\n资源类型：${ + id2resource_types[resource_type_id].name + }，资源名：${wildcard || ''}，角色：[${newStr}]\n权限：${permissions}\n状态：${enabled}` + break + } + case 'update': { + item.changeDescription = '' + for (const key in item.origin) { + const newVal = item.current[key] + const oldVal = item.origin[key] + if (!_.isEqual(newVal, oldVal) && key !== 'updated_at' && key !== 'deleted_at' && key !== 'created_at') { + if (oldVal === null) { + const str = ` 【 ${key} : 改为 ${newVal} 】 ` + item.changeDescription += str + } else { + const str = ` 【 ${key} : 由 ${oldVal} 改为 ${newVal} 】 ` + item.changeDescription += ` 【 ${key} : 由 ${oldVal} 改为 ${newVal} 】 ` + } + } + } + if (!item.changeDescription) item.changeDescription = '没有修改' + break + } + case 'delete': { + const str = item.origin.roles + const newArr = str.slice(1, str.length - 1).split(', ') + const newStr = newArr.map((i) => id2roles[i].name).join('，') + const { name, resource_type_id, wildcard, permissions, enabled } = item.origin + item.changeDescription = `删除触发器：${name}\n资源类型：${ + id2resource_types[resource_type_id].name + }，资源名：${wildcard || ''}，角色：[${newStr}]\n权限：${permissions}\n状态：${enabled}` + break + } + case 'trigger_apply': { + const str = item.current.roles + const newArr = str.slice(1, str.length - 1).split(', ') + const newStr = newArr.map((i) => id2roles[i].name).join('，') + const { name, resource_type_id, wildcard, permissions, enabled } = item.current + item.changeDescription = `应用触发器：${name}\n资源类型：${ + id2resource_types[resource_type_id].name + }，资源名：${wildcard || ''}，角色：[${newStr}]\n权限：${permissions}\n状态：${enabled}` + break + } + case 'trigger_cancel': { + const str = item.current.roles + const newArr = str.slice(1, str.length - 1).split(', ') + const newStr = newArr.map((i) => id2roles[i].name).join('，') + const { name, resource_type_id, wildcard, permissions, enabled } = item.current + item.changeDescription = `取消触发器：${name}\n资源类型：${ + id2resource_types[resource_type_id].name + }，资源名：${wildcard || ''}，角色：[${newStr}]\n权限：${permissions}\n状态：${enabled}` + break + } + } + }, + handleQueryParams(queryParams) { + let q = '' + for (const key in queryParams) { + if ( + key !== 'page' && + key !== 'page_size' && + key !== 'app_id' && + key !== 'start' && + key !== 'end' && + queryParams[key] !== undefined + ) { + if (q) { + q += `,${key}:${queryParams[key]}` + } else { + q += `${key}:${queryParams[key]}` + } + } + } + const newQueryParams = { ...queryParams, q } + return q ? newQueryParams : queryParams + }, + handleTagColor(operateType) { + return this.colorMap.get(operateType) + }, + }, } @@ -341,6 +360,6 @@ p { .ant-tag { max-width: 100%; overflow: hidden; - text-overflow:ellipsis; + text-overflow: ellipsis; } diff --git a/cmdb-ui/src/modules/acl/views/resource_types.vue b/cmdb-ui/src/modules/acl/views/resource_types.vue index 55fa655..5cce622 100644 --- a/cmdb-ui/src/modules/acl/views/resource_types.vue +++ b/cmdb-ui/src/modules/acl/views/resource_types.vue @@ -1,6 +1,6 @@