perf: connect ad account

src/components/Apps/AccountListTable/AccountList.vue

@@ -147,11 +147,6 @@ export default {
     showActions: {
       type: Boolean,
       default: true
-    },
-    // target for ad connect btn, if not has, ad account should be select one
-    target: {
-      type: Object,
-      default: null
     }
   },
   data() {
@@ -194,6 +189,14 @@ export default {
                 name: 'AccountDetail',
                 params: { id: row.id }
               }),
+              getTitle: ({ row }) => {
+                let title = row.name
+                if (row.ds_id && this.asset && this.asset.id !== row.asset.id) {
+                  const dsID = row.ds_id.split('-')[0]
+                  title = `${row.name}@${dsID}`
+                }
+                return title
+              },
               getDrawerTitle({ row }) {
                 return `${row.username}@${row.asset.name}`
               }
@@ -213,12 +216,14 @@ export default {
             width: '80px',
             formatter: AccountConnectFormatter,
             formatterArgs: {
-              can: () => this.currentUserIsSuperAdmin,
-              connectUrlTemplate: (row) => {
-
+              can: ({ row }) => {
+                return this.currentUserIsSuperAdmin
               }
             }
           },
+          ds_domain: {
+            width: '100px'
+          },
           platform: {
             label: this.$t('Platform'),
             width: '150px',
@@ -228,6 +233,7 @@ export default {
             }
           },
           asset: {
+            minWidth: '100px',
             formatter: function(row) {
               return row.asset.name
             }
@@ -235,8 +241,8 @@ export default {
           username: {
             minWidth: '60px',
             formatter: function(row) {
-              if (row.ad_domain) {
-                return `${row.username}@${row.ad_domain}`
+              if (row.ds_domain) {
+                return `${row.username}@${row.ds_domain}`
               } else {
                 return row.username
               }

src/components/Table/TableFormatters/AccountConnectFormatter.vue

@@ -80,7 +80,7 @@ export default {
       return this.formatterArgs.buttonIcon
     },
     hasPerm() {
-      return this.formatterArgs.can(this.row, this.cellValue)
+      return this.formatterArgs.can({ row: this.row, cellValue: this.cellValue })
     }
   },
   methods: {

src/components/Table/TableFormatters/PlatformFormatter.vue

@@ -45,7 +45,7 @@ export default {
 }
 </script>
 
-<style scoped lang="scss">
+<style lang="scss" scoped>
 .platform-td {
   display: flex;
   flex-wrap: nowrap;
@@ -55,6 +55,7 @@ export default {
   .icon-zone {
     width: 1.5em;
     height: 1.5em;
+    flex-shrink: 0;
 
     .asset-icon {
       height: 100%;
@@ -66,6 +67,10 @@ export default {
 
   .platform-name {
     flex: 1;
+    min-width: 0;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis
   }
 }
 

src/views/assets/Asset/AssetDetail/Account.vue

@@ -10,6 +10,7 @@
           :has-import="false"
           :has-left-actions="true"
           :header-extra-actions="headerExtraActions"
+          :target="object"
           :url="iUrl"
           v-bind="$attrs"
         />

src/views/assets/Asset/AssetList/index.vue

@@ -57,7 +57,7 @@ export default {
             component: () => import('@/views/assets/Asset/AssetList/WebList.vue')
           },
           {
-            icon: 'fa-vcard-o',
+            icon: 'fa-id-card-o',
             name: 'ds',
             hidden: true,
             component: () => import('@/views/assets/Asset/AssetList/DSList.vue')