From 27854d4e0ae850c5b8fce00177726a58c7377ff3 Mon Sep 17 00:00:00 2001
From: wang-liang0615 <53748875+wang-liang0615@users.noreply.github.com>
Date: Wed, 3 Jan 2024 17:41:42 +0800
Subject: [PATCH] fix(acl-ui):operation history (#363)

---
 .../views/module/permissionHistoryTable.vue   | 78 +++++++++--------
 .../acl/views/module/resourceHistoryTable.vue | 64 +++++++-------
 .../modules/resourceHistoryTable.vue          | 78 ++++++++---------
 .../modules/resourceTypeHistoryTable.vue      | 84 ++++++++++---------
 .../modules/roleHistoryTable.vue              | 45 +++++-----
 .../modules/triggerHistoryTable.vue           | 77 ++++++++---------
 6 files changed, 214 insertions(+), 212 deletions(-)

diff --git a/cmdb-ui/src/modules/acl/views/module/permissionHistoryTable.vue b/cmdb-ui/src/modules/acl/views/module/permissionHistoryTable.vue
index 2828ece..bcad4ce 100644
--- a/cmdb-ui/src/modules/acl/views/module/permissionHistoryTable.vue
+++ b/cmdb-ui/src/modules/acl/views/module/permissionHistoryTable.vue
@@ -129,45 +129,7 @@ export default {
         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)
-    },
-    allResources: {
-      deep: true,
-      immediate: true,
-      handler(val) {
-        this.permissionTableAttrList[4].choice_value = val
-      },
-    },
-  },
-  computed: {
-    operateTypeMap() {
-      return new Map([
-        ['grant', this.$t('grant')],
-        ['revoke', this.$t('acl.cancel')],
-      ])
-    },
-    windowHeight() {
-      return this.$store.state.windowHeight
-    },
-    windowHeightMinus() {
-      return this.isExpand ? 374 : 310
-    },
-    tableDataLength() {
-      return this.tableData.length
-    },
-    permissionTableAttrList() {
-      return [
+      permissionTableAttrList: [
         {
           alias: this.$t('acl.date'),
           is_choice: false,
@@ -209,7 +171,43 @@ export default {
           value_type: '2',
           choice_value: [{ [this.$t('grant')]: 'grant' }, { [this.$t('acl.cancel')]: 'revoke' }],
         },
-      ]
+      ],
+    }
+  },
+  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)
+    },
+    allResources: {
+      deep: true,
+      immediate: true,
+      handler(val) {
+        this.permissionTableAttrList[4].choice_value = val
+      },
+    },
+  },
+  computed: {
+    operateTypeMap() {
+      return new Map([
+        ['grant', this.$t('grant')],
+        ['revoke', this.$t('acl.cancel')],
+      ])
+    },
+    windowHeight() {
+      return this.$store.state.windowHeight
+    },
+    windowHeightMinus() {
+      return this.isExpand ? 374 : 310
+    },
+    tableDataLength() {
+      return this.tableData.length
     },
   },
   methods: {
diff --git a/cmdb-ui/src/modules/acl/views/module/resourceHistoryTable.vue b/cmdb-ui/src/modules/acl/views/module/resourceHistoryTable.vue
index 56dbe64..d6e55ef 100644
--- a/cmdb-ui/src/modules/acl/views/module/resourceHistoryTable.vue
+++ b/cmdb-ui/src/modules/acl/views/module/resourceHistoryTable.vue
@@ -112,6 +112,39 @@ export default {
         start: '',
         end: '',
       },
+      resourceTableAttrList: [
+        {
+          alias: this.$t('acl.date'),
+          is_choice: false,
+          name: 'datetime',
+          value_type: '3',
+        },
+        {
+          alias: this.$t('acl.operator'),
+          is_choice: true,
+          name: 'operate_uid',
+          value_type: '2',
+          choice_value: this.allUsers,
+        },
+        {
+          alias: this.$t('operation'),
+          is_choice: true,
+          name: 'operate_type',
+          value_type: '2',
+          choice_value: [
+            { [this.$t('create')]: 'create' },
+            { [this.$t('update')]: 'update' },
+            { [this.$t('delete')]: 'delete' },
+          ],
+        },
+        {
+          alias: this.$t('acl.resourceName'),
+          is_choice: true,
+          name: 'link_id',
+          value_type: '2',
+          choice_value: this.allResources,
+        },
+      ],
     }
   },
   async created() {
@@ -146,37 +179,6 @@ export default {
     tableDataLength() {
       return this.tableData.length
     },
-    resourceTableAttrList() {
-      return [
-        {
-          alias: this.$t('acl.date'),
-          is_choice: false,
-          name: 'datetime',
-          value_type: '3',
-        },
-        {
-          alias: this.$t('acl.operator'),
-          is_choice: true,
-          name: 'operate_uid',
-          value_type: '2',
-          choice_value: this.allUsers,
-        },
-        {
-          alias: this.$t('operation'),
-          is_choice: true,
-          name: 'operate_type',
-          value_type: '2',
-          choice_value: [{ [this.$t('create')]: 'create' }, { [this.$t('update')]: 'update' }, { [this.$t('delete')]: 'delete' }],
-        },
-        {
-          alias: this.$t('acl.resourceName'),
-          is_choice: true,
-          name: 'link_id',
-          value_type: '2',
-          choice_value: this.allResources,
-        },
-      ]
-    },
   },
   methods: {
     async getTable(queryParams) {
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 ff39e40..ad10c80 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
@@ -99,42 +99,7 @@ export default {
         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: {
-    operateTypeMap() {
-      return new Map([
-        ['create', this.$t('create')],
-        ['update', this.$t('update')],
-        ['delete', this.$t('delete')],
-      ])
-    },
-    windowHeight() {
-      return this.$store.state.windowHeight
-    },
-    windowHeightMinus() {
-      return this.isExpand ? 374 : 310
-    },
-    tableDataLength() {
-      return this.tableData.length
-    },
-    resourceTableAttrList() {
-      return [
+      resourceTableAttrList: [
         {
           alias: this.$t('acl.date'),
           is_choice: false,
@@ -167,9 +132,46 @@ export default {
           is_choice: true,
           name: 'operate_type',
           value_type: '2',
-          choice_value: [{ [this.$t('create')]: 'create' }, { [this.$t('update')]: 'update' }, { [this.$t('delete')]: 'delete' }],
+          choice_value: [
+            { [this.$t('create')]: 'create' },
+            { [this.$t('update')]: 'update' },
+            { [this.$t('delete')]: 'delete' },
+          ],
         },
-      ]
+      ],
+    }
+  },
+  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: {
+    operateTypeMap() {
+      return new Map([
+        ['create', this.$t('create')],
+        ['update', this.$t('update')],
+        ['delete', this.$t('delete')],
+      ])
+    },
+    windowHeight() {
+      return this.$store.state.windowHeight
+    },
+    windowHeightMinus() {
+      return this.isExpand ? 374 : 310
+    },
+    tableDataLength() {
+      return this.tableData.length
     },
   },
   methods: {
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 722ce52..c179a23 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
@@ -90,42 +90,7 @@ export default {
         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: {
-    operateTypeMap() {
-      return new Map([
-        ['create', this.$t('create')],
-        ['update', this.$t('update')],
-        ['delete', this.$t('delete')],
-      ])
-    },
-    windowHeight() {
-      return this.$store.state.windowHeight
-    },
-    windowHeightMinus() {
-      return this.isExpand ? 374 : 310
-    },
-    tableDataLength() {
-      return this.tableData.length
-    },
-    resourceTableAttrList() {
-      return [
+      resourceTableAttrList: [
         {
           alias: this.$t('acl.date'),
           is_choice: false,
@@ -158,9 +123,46 @@ export default {
           is_choice: true,
           name: 'operate_type',
           value_type: '2',
-          choice_value: [{ [this.$t('create')]: 'create' }, { [this.$t('update')]: 'update' }, { [this.$t('delete')]: 'delete' }],
+          choice_value: [
+            { [this.$t('create')]: 'create' },
+            { [this.$t('update')]: 'update' },
+            { [this.$t('delete')]: 'delete' },
+          ],
         },
-      ]
+      ],
+    }
+  },
+  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: {
+    operateTypeMap() {
+      return new Map([
+        ['create', this.$t('create')],
+        ['update', this.$t('update')],
+        ['delete', this.$t('delete')],
+      ])
+    },
+    windowHeight() {
+      return this.$store.state.windowHeight
+    },
+    windowHeightMinus() {
+      return this.isExpand ? 374 : 310
+    },
+    tableDataLength() {
+      return this.tableData.length
     },
   },
   methods: {
@@ -312,7 +314,8 @@ export default {
           }
           const currentPerms =
             item.extra.permission_ids?.current === undefined ? this.$t('acl.none') : item.extra.permission_ids?.current
-          const originPerms = item.extra.permission_ids?.origin === undefined ? this.$t('acl.none') : item.extra.permission_ids?.origin
+          const originPerms =
+            item.extra.permission_ids?.origin === undefined ? this.$t('acl.none') : item.extra.permission_ids?.origin
           if (!_.isEqual(currentPerms, originPerms)) {
             item.changeDescription += ` 【 permission_ids : ${originPerms} -> ${currentPerms} 】 `
           }
@@ -321,7 +324,8 @@ export default {
         }
         case 'delete': {
           const description = item.origin?.description === undefined ? this.$t('acl.none') : item.origin?.description
-          const permission = item.extra.permission_ids?.origin === undefined ? this.$t('acl.none') : item.extra.permission_ids?.origin
+          const permission =
+            item.extra.permission_ids?.origin === undefined ? this.$t('acl.none') : item.extra.permission_ids?.origin
           item.changeDescription = `${this.$t('acl.deleteResourceType')}: ${item.origin.name}\n${this.$t(
             'desc'
           )}：${description}\n${this.$t('acl.permission')}: ${permission}`
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 0a25b3f..f98e462 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
@@ -108,26 +108,7 @@ export default {
         start: '',
         end: '',
       },
-    }
-  },
-  computed: {
-    operateTypeMap() {
-      return new Map([
-        ['create', this.$t('create')],
-        ['update', this.$t('update')],
-        ['delete', this.$t('delete')],
-        ['role_relation_add', this.$t('acl.roleRelationAdd')],
-        ['role_relation_delete', this.$t('acl.roleRelationDelete')],
-      ])
-    },
-    windowHeight() {
-      return this.$store.state.windowHeight
-    },
-    tableDataLength() {
-      return this.tableData.length
-    },
-    roleTableAttrList() {
-      return [
+      roleTableAttrList: [
         {
           alias: this.$t('acl.date'),
           is_choice: false,
@@ -161,7 +142,24 @@ export default {
             { [this.$t('acl.roleRelationDelete')]: 'role_relation_delete' },
           ],
         },
-      ]
+      ],
+    }
+  },
+  computed: {
+    operateTypeMap() {
+      return new Map([
+        ['create', this.$t('create')],
+        ['update', this.$t('update')],
+        ['delete', this.$t('delete')],
+        ['role_relation_add', this.$t('acl.roleRelationAdd')],
+        ['role_relation_delete', this.$t('acl.roleRelationDelete')],
+      ])
+    },
+    windowHeight() {
+      return this.$store.state.windowHeight
+    },
+    tableDataLength() {
+      return this.tableData.length
     },
   },
   async created() {
@@ -294,7 +292,6 @@ export default {
                 const str = ` 【 ${key} : -> ${newVal} 】 `
                 item.description += str
               } else {
-                const str = ` 【 ${key} : ${oldVal} -> ${newVal} 】 `
                 item.description += ` 【 ${key} : ${oldVal} -> ${newVal} 】 `
               }
             }
@@ -329,7 +326,9 @@ export default {
           resourceMap.forEach((value, key) => {
             permsArr.push(`${id2resources[key].name}：${value}`)
           })
-          item.description = `${this.$t('acl.heir')}：${child_ids}\n${this.$t('acl.inheritedFrom')}：${parent_ids}\n${this.$t('acl.involvingRP')}：\n${permsArr.join(`\n`)}`
+          item.description = `${this.$t('acl.heir')}：${child_ids}\n${this.$t(
+            'acl.inheritedFrom'
+          )}：${parent_ids}\n${this.$t('acl.involvingRP')}：\n${permsArr.join(`\n`)}`
           break
         }
       }
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 ab163a7..fa6cd63 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
@@ -96,44 +96,7 @@ export default {
         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: {
-    operateTypeMap() {
-      return new Map([
-        ['create', this.$t('create')],
-        ['update', this.$t('update')],
-        ['delete', this.$t('delete')],
-        ['trigger_apply', this.$t('acl.apply')],
-        ['trigger_cancel', this.$t('cancel')],
-      ])
-    },
-    windowHeight() {
-      return this.$store.state.windowHeight
-    },
-    windowHeightMinus() {
-      return this.isExpand ? 374 : 310
-    },
-    tableDataLength() {
-      return this.tableData.length
-    },
-    triggerTableAttrList() {
-      return [
+      triggerTableAttrList: [
         {
           alias: this.$t('acl.date'),
           is_choice: false,
@@ -174,7 +137,42 @@ export default {
             { [this.$t('cancel')]: 'trigger_cancel' },
           ],
         },
-      ]
+      ],
+    }
+  },
+  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: {
+    operateTypeMap() {
+      return new Map([
+        ['create', this.$t('create')],
+        ['update', this.$t('update')],
+        ['delete', this.$t('delete')],
+        ['trigger_apply', this.$t('acl.apply')],
+        ['trigger_cancel', this.$t('cancel')],
+      ])
+    },
+    windowHeight() {
+      return this.$store.state.windowHeight
+    },
+    windowHeightMinus() {
+      return this.isExpand ? 374 : 310
+    },
+    tableDataLength() {
+      return this.tableData.length
     },
   },
   methods: {
@@ -292,7 +290,6 @@ export default {
                 const str = ` 【 ${key} : -> ${newVal} 】 `
                 item.changeDescription += str
               } else {
-                const str = ` 【 ${key} : ${oldVal} -> ${newVal} 】 `
                 item.changeDescription += ` 【 ${key} :${oldVal} -> ${newVal} 】 `
               }
             }