Perf: Change AccountConnectFormatter To Common Component

src/components/Apps/AccountListTable/AccountList.vue

@@ -52,7 +52,7 @@
 <script>
 import { accountOtherActions, accountQuickFilters, connectivityMeta } from './const'
 import { openTaskPage } from '@/utils/jms'
-import { ActionsFormatter, PlatformFormatter, SecretViewerFormatter } from '@/components/Table/TableFormatters'
+import { ActionsFormatter, PlatformFormatter, SecretViewerFormatter, AccountConnectFormatter } from '@/components/Table/TableFormatters'
 import ViewSecret from './ViewSecret.vue'
 import UpdateSecretInfo from './UpdateSecretInfo.vue'
 import ResultDialog from './BulkCreateResultDialog.vue'
@@ -191,14 +191,18 @@ export default {
           connect: {
             label: this.$t('Connect'),
             width: '80px',
-            formatter: () => {
+            formatter: AccountConnectFormatter,
-              return (
+            formatterArgs: {
-                <span className='connect'>
+              buttonIcon: 'fa fa-desktop',
-                  <el-button type='primary' size='mini' plain>
+              titleText: '可选协议',
-                    <i className='fa fa-desktop'/>
+              url: '/api/v1/assets/assets/{id}',
-                  </el-button>
+              connectUrlTemplate: (row) => `/luna/pam_connect/${row.id}/${row.username}/${row.asset.id}/${row.asset.name}/`,
-                </span>
+              setMapItem: (id, protocol) => {
-              )
+                this.$store.commit('table/SET_PROTOCOL_MAP_ITEM', {
+                  key: id,
+                  value: protocol
+                })
+              }
             }
           },
           platform: {

src/views/accounts/Account/AccountList.vue

@@ -9,7 +9,7 @@
 <script>
 import AssetTreeTable from '@/components/Apps/AssetTreeTable/index.vue'
 import AccountListTable from '@/components/Apps/AccountListTable/AccountList.vue'
-import { AccountConnectFormatter, DetailFormatter } from '@/components/Table/TableFormatters'
+import { DetailFormatter } from '@/components/Table/TableFormatters'
 
 export default {
   name: 'AssetAccountList',
@@ -39,17 +39,6 @@ export default {
                 query: { tab: 'Basic' }
               })
             }
-          },
-          connect: {
-            label: this.$t('Connect'),
-            width: '80px',
-            formatter: AccountConnectFormatter,
-            formatterArgs: {
-              buttonIcon: 'fa fa-desktop',
-              titleText: '可选协议',
-              url: '/api/v1/assets/assets/{id}',
-              connectUrlTemplate: '/luna/pam_connect/{id}/{username}/{assetId}/{assetName}/{protocol}'
-            }
           }
         }
       },

src/views/pam/Account/AccountList.vue

@@ -4,7 +4,7 @@
 
 <script>
 import AccountListTable from '@/components/Apps/AccountListTable/AccountList.vue'
-import { DetailFormatter, AccountConnectFormatter } from '@/components/Table/TableFormatters'
+import { DetailFormatter } from '@/components/Table/TableFormatters'
 
 export default {
   name: 'AssetAccountList',
@@ -30,23 +30,6 @@ export default {
                 query: { tab: 'Basic' }
               })
             }
-          },
-          connect: {
-            label: this.$t('Connect'),
-            width: '80px',
-            formatter: AccountConnectFormatter,
-            formatterArgs: {
-              buttonIcon: 'fa fa-desktop',
-              titleText: '可选协议',
-              url: '/api/v1/assets/assets/{id}',
-              connectUrlTemplate: (row) => `/luna/pam_connect/${row.id}/${row.username}/${row.asset.id}/${row.asset.name}/`,
-              setMapItem: (id, protocol) => {
-                this.$store.commit('table/SET_PROTOCOL_MAP_ITEM', {
-                  key: id,
-                  value: protocol
-                })
-              }
-            }
           }
         }
       }

src/views/pam/Integration/components/AccountList.vue

@@ -4,7 +4,7 @@
 
 <script>
 import AccountListTable from '@/components/Apps/AccountListTable/AccountList.vue'
-import { DetailFormatter, AccountConnectFormatter } from '@/components/Table/TableFormatters'
+import { DetailFormatter } from '@/components/Table/TableFormatters'
 
 export default {
   name: 'AssetAccountList',
@@ -37,23 +37,6 @@ export default {
                 query: { tab: 'Basic' }
               })
             }
-          },
-          connect: {
-            label: this.$t('Connect'),
-            width: '80px',
-            formatter: AccountConnectFormatter,
-            formatterArgs: {
-              buttonIcon: 'fa fa-desktop',
-              titleText: '可选协议',
-              url: '/api/v1/assets/assets/{id}',
-              connectUrlTemplate: (row) => `/luna/pam_connect/${row.id}/${row.username}/${row.asset.id}/${row.asset.name}/`,
-              setMapItem: (id, protocol) => {
-                this.$store.commit('table/SET_PROTOCOL_MAP_ITEM', {
-                  key: id,
-                  value: protocol
-                })
-              }
-            }
           }
         }
       }

src/views/perms/AssetPermission/AssetPermissionDetail/AssetPermissionAccount.vue

@@ -55,7 +55,7 @@ export default {
         disabled: false,
         username: ''
       },
-      columns: ['name', 'username', 'secret', 'asset']
+      columns: ['name', 'username', 'secret', 'asset', 'connect']
     }
   },
   computed: {