feat: Cloud sync support ali rds (v4.10)

src/components/Table/CardTable/index.vue

@@ -137,9 +137,10 @@ export default {
         return
       }
       const pageQuery = this.getPageQuery(this.page, this.paginationSize)
-      const query = Object.assign(this.extraQuery, pageQuery)
+      const query = Object.assign(this.extraQuery, pageQuery, this.tableConfig.extraQuery)
       const queryString = Object.keys(query).map(key => key + '=' + query[key]).join('&')
-      const url = `${this.tableUrl}?${queryString}`
+      const connector = this.tableUrl.indexOf('?') === -1 ? '?' : '&'
+      const url = `${this.tableUrl}${connector}${queryString}`
 
       const resp = await this.$axios.get(url, this.axiosConfig)
       const data = resp.data

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

@@ -13,7 +13,20 @@ export default {
     return {
       config: {
         category: 'database',
-        url: '/api/v1/assets/databases/'
+        url: '/api/v1/assets/databases/',
+        headerActions: {
+          extraActions: [
+            {
+              name: this.$t('CloudSync'),
+              title: this.$t('CloudSync'),
+              icon: 'cloud-provider',
+              has: () => this.$hasPerm('xpack.view_account') && this.$hasLicense(),
+              callback: () => this.$router.push(
+                { name: 'CloudAccountList', query: { category: 'database' }}
+              )
+            }
+          ]
+        }
       }
     }
   }

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

@@ -37,7 +37,9 @@ export default {
               title: this.$t('CloudSync'),
               icon: 'cloud-provider',
               has: () => vm.$hasPerm('xpack.view_account') && vm.$hasLicense(),
-              callback: () => this.$router.push({ name: 'CloudAccountList' })
+              callback: () => this.$router.push(
+                { name: 'CloudAccountList', query: { category: 'host' }}
+              )
             }
           ]
         },

src/views/assets/Cloud/Account/AccountDetail/TaskSyncAssetList.vue

@@ -82,8 +82,9 @@ export default {
   },
   computed: {
     dynamicUrl() {
-      const baseUrl = '/api/v1/xpack/cloud/sync-instance-tasks/instances/'
-      return this.object ? `${baseUrl}?task_id=${this.object.task.id}` : baseUrl
+      const category = this.$route.query.category
+      const baseUrl = `/api/v1/xpack/cloud/sync-instance-tasks/instances/?category=${category}`
+      return this.object ? `${baseUrl}&task_id=${this.object.task.id}` : baseUrl
     }
   },
   mounted() {

src/views/assets/Cloud/Account/AccountList.vue

@@ -21,7 +21,7 @@
 </template>
 
 <script type="text/jsx">
-import { lan, privateCloudProviders, publicCloudProviders } from '../const'
+import { lan, privateCloudProviders, publicHostProviders, publicDBProviders } from '../const'
 import CreateDialog from './components/CreateDialog.vue'
 import UpdateDialog from './components/UpdateDialog.vue'
 import SyncDialog from './components/SyncDialog.vue'
@@ -43,11 +43,12 @@ export default {
       object: null,
       table: {
         tableConfig: {
-          url: '/api/v1/xpack/cloud/accounts/',
+          url: '',
           permissions: {
             app: 'xpack',
             resource: 'account'
-          }
+          },
+          extraQuery: {}
         },
         subComponentProps: {
           handleUpdate: (obj) => {
@@ -102,7 +103,8 @@ export default {
                 title: this.$t('PublicCloud'),
                 icon: 'public-cloud',
                 callback: () => {
-                  this.providerConfig.providers = publicCloudProviders.map(
+                  const providers = this.iCategory === 'host' ? publicHostProviders : publicDBProviders
+                  this.providerConfig.providers = providers.map(
                     (item) => ACCOUNT_PROVIDER_ATTRS_MAP[item]
                   )
                   this.visible = true
@@ -110,8 +112,9 @@ export default {
               },
               {
                 name: 'privateCloud',
-                icon: 'private-cloud',
                 title: this.$t('PrivateCloud'),
+                icon: 'private-cloud',
+                has: () => this.iCategory === 'host',
                 callback: () => {
                   this.providerConfig.providers = privateCloudProviders.map(
                     (item) => ACCOUNT_PROVIDER_ATTRS_MAP[item]
@@ -123,6 +126,7 @@ export default {
                 name: 'LAN',
                 title: this.$t('LAN'),
                 icon: 'computer',
+                has: () => this.iCategory === 'host',
                 callback: () => {
                   const providers = [lan]
                   this.providerConfig.providers = providers.map(
@@ -143,6 +147,11 @@ export default {
       onlineSyncVisible: false
     }
   },
+  computed: {
+    iCategory() {
+      return this.$route.query.category || 'host'
+    }
+  },
   watch: {
     visible: {
       handler(val) {
@@ -166,6 +175,10 @@ export default {
       }
     }
   },
+  mounted() {
+    this.table.tableConfig.url = '/api/v1/xpack/cloud/accounts/'
+    this.table.tableConfig.extraQuery = { category: this.iCategory }
+  },
   methods: {
     valid(status) {
       if (status !== 200) {

src/views/assets/Cloud/Account/components/AuthPanel.vue

@@ -169,6 +169,7 @@ export default {
           const newValues = JSON.parse(JSON.stringify(values))
           newValues['attrs'] = encryptAttrsField(newValues.attrs)
           newValues['provider'] = vm.provider
+          newValues['category'] = this.$route.query.category || 'host'
           return newValues
         },
         addContinue: true

src/views/assets/Cloud/Strategy/StrategyList.vue

@@ -21,7 +21,7 @@ export default {
       createDrawer: () => import('@/views/assets/Cloud/Strategy/StrategyCreateUpdate.vue'),
       detailDrawer: () => import('@/views/assets/Cloud/Strategy/StrategyDetail/index.vue'),
       tableConfig: {
-        url: '/api/v1/xpack/cloud/strategies/',
+        url: '',
         permissions: {
           app: 'xpack',
           resource: 'strategy'
@@ -70,8 +70,15 @@ export default {
       }
     }
   },
+  computed: {
+    iCategory() {
+      return this.$route.query.category || 'host'
+    }
+  },
+  mounted() {
+    this.tableConfig.url = `/api/v1/xpack/cloud/strategies/?category=${this.iCategory}`
+  },
   methods: {}
-
 }
 </script>
 

src/views/assets/Cloud/const.js

@@ -29,13 +29,15 @@ export const scp = 'scp'
 export const apsara_stack = 'apsara_stack'
 export const lan = 'lan'
 
-export const publicCloudProviders = [
+export const publicHostProviders = [
   aliyun, qcloud, qcloud_lighthouse, huaweicloud,
   baiducloud, jdcloud, kingsoftcloud, aws_china,
   aws_international, azure, azure_international,
   gcp, ucloud, volcengine
 ]
 
+export const publicDBProviders = [aliyun]
+
 export const privateCloudProviders = [
   vmware, qingcloud_private, huaweicloud_private, ctyun_private,
   openstack, zstack, nutanix, fc, scp, apsara_stack

src/views/assets/Cloud/index.vue

@@ -13,6 +13,7 @@ export default {
   data() {
     return {
       config: {
+        title: '',
         activeMenu: 'CloudAccountList',
         submenu: [
           {
@@ -39,6 +40,11 @@ export default {
         }
       }
     }
+  },
+  mounted() {
+    const category = this.$route.query.category || 'host'
+    const display = category === 'host' ? this.$t('Host') : this.$t('Database')
+    this.config.title = `${display} - ${this.$t('CloudSync')}`
   }
 }
 </script>