fix: 优化数据库页面

webs/cmp-web/src/views/resource/ctstack/page/database/mysql/index.vue

@@ -262,6 +262,7 @@
 
 <script>
 import validate from '@/validate'
+import { getRegion } from 'services/platform/index'
 import { getRds, detailRds, getRdsCos, patchRds, removeRds, getRdsUsers, createRdsUsers, removeRdsUsers, resetRdsUserPasd, resetRdsUser, authRdsUser, getRdsDbs, createRdsDbs, removeRdsDbs } from 'views/resource/ctstack/services/database/rds.js'
 import add from '../components/add.vue'
 import ModifyRole from './ModifyRole.vue'
@@ -369,10 +370,10 @@ export default {
       instanceNetworkTypeMap,
       required: validate.required,
       rdsAccountName: { pattern: /^[a-z]([a-z0-9_-]{0,14}[a-z0-9])?$/, message: '由小写字母、数字、下划线（_）组成，以字母开头，以字母或数字结尾，最多16个字符', trigger: null },
-      rdsDBName: { pattern: /^[a-z]([a-z0-9_-]{0,62}[a-z0-9])?$/, message: '由小写字母、数字、下划线（_）、中划线（-）组成，以字母开头，字母或数字结尾，最多64个字符', trigger: null },
       rdsDBPassword: { pattern: '^(?![a-zA-Z]+$)(?![A-Z0-9]+$)(?![A-Z\\W_]+$)(?![a-z0-9]+$)(?![a-z\\W_]+$)(?![0-9\\W_]+$)[a-zA-Z0-9\\W_]{8,32}$', message: '必须包含三种及以上类型：大小写字母、数字、特殊符号。长度为8-32位，特殊字符包括! @ # $ % ^ & * () _ + - =', trigger: null },
       searchConfigs: [
         { type: 'Input', label: '名称', value: 'name' },
+        { type: 'Select', label: '所属地域', data: [], value: 'regionId', props: { value: 'regionId' } },
         { type: 'Const', value: 'vendorId', initValue: this.platformObject.vendorId },
         { type: 'Const', value: 'dbType', initValue: 'MYSQL' }
       ],
@@ -382,12 +383,6 @@ export default {
         page: 1,
         rows: 10
       },
-      searchData: {
-        name: '',
-        regionId: '',
-        zone: ''
-      },
-      zoneList: [],
       tableData: [],
       total: 0,
       detailFlag: false,
@@ -482,7 +477,6 @@ export default {
         'utf32'
       ],
       accounts: [],
-      databases: [],
       databaseList: [],
       paramsDb: {
         page: 1,
@@ -503,6 +497,25 @@ export default {
       }
     }
   },
+  watch: {
+    platformObject: {
+      handler(newVal, oldVal) {
+        this.searchConfigs = [
+          { type: 'Input', label: '名称', value: 'name' },
+          { type: 'Select', label: '所属地域', data: [], value: 'regionId', props: { value: 'regionId' } },
+          { type: 'Const', value: 'vendorId', initValue: this.platformObject.vendorId },
+          { type: 'Const', value: 'dbType', initValue: 'MYSQL' }
+        ]
+        if (this.detailFlag) {
+          this.handleClick()
+        }
+      },
+      deep: true
+    }
+  },
+  mounted() {
+    this.getRegion()
+  },
   methods: {
     async getCoList(id) {
       this.paramsCo.params = handleSearchParam({
@@ -838,28 +851,15 @@ export default {
           }
         })
       })
+    }, // 获取域
+    getRegion() {
+      getRegion({ vendorId: this.platformObject.vendorId }).then(data => {
+        if (data.success) {
+          this.regionList = data.data
+          this.searchConfigs[1].data = data.data
         }
-  },
+      })
-  watch: {
-    platformObject: {
-      handler(newVal, oldVal) {
-        this.searchConfigs = [
-          { type: 'Input', label: '名称', value: 'name' },
-          { type: 'Const', value: 'vendorId', initValue: newVal.vendorId }
-        ]
-        if (this.detailFlag) {
-          this.handleClick()
-        }
-      },
-      deep: true
     }
   }
 }
 </script>
-
-<style scoped>
-.tooltip {
-  font-size: 12px;
-  color: #666;
-}
-</style>

webs/cmp-web/src/views/resource/ctstack/page/database/postgresql/index.vue

@@ -262,6 +262,7 @@
 
 <script>
 import validate from '@/validate'
+import { getRegion } from 'services/platform/index'
 import { getRds, detailRds, getRdsCos, patchRds, removeRds, getRdsUsers, createRdsUsers, removeRdsUsers, resetRdsUserPasd, resetRdsUser, authRdsUser, getRdsDbs, createRdsDbs, removeRdsDbs } from 'views/resource/ctstack/services/database/rds.js'
 import add from '../components/add.vue'
 import ModifyRole from './ModifyRole.vue'
@@ -369,10 +370,10 @@ export default {
       instanceNetworkTypeMap,
       required: validate.required,
       rdsAccountName: { pattern: /^[a-z]([a-z0-9_-]{0,14}[a-z0-9])?$/, message: '由小写字母、数字、下划线（_）组成，以字母开头，以字母或数字结尾，最多16个字符', trigger: null },
-      rdsDBName: { pattern: /^[a-z]([a-z0-9_-]{0,62}[a-z0-9])?$/, message: '由小写字母、数字、下划线（_）、中划线（-）组成，以字母开头，字母或数字结尾，最多64个字符', trigger: null },
       rdsDBPassword: { pattern: '^(?![a-zA-Z]+$)(?![A-Z0-9]+$)(?![A-Z\\W_]+$)(?![a-z0-9]+$)(?![a-z\\W_]+$)(?![0-9\\W_]+$)[a-zA-Z0-9\\W_]{8,32}$', message: '必须包含三种及以上类型：大小写字母、数字、特殊符号。长度为8-32位，特殊字符包括! @ # $ % ^ & * () _ + - =', trigger: null },
       searchConfigs: [
         { type: 'Input', label: '名称', value: 'name' },
+        { type: 'Select', label: '所属地域', data: [], value: 'regionId', props: { value: 'regionId' } },
         { type: 'Const', value: 'vendorId', initValue: this.platformObject.vendorId },
         { type: 'Const', value: 'dbType', initValue: 'POSTGRESQL' }
       ],
@@ -382,12 +383,6 @@ export default {
         page: 1,
         rows: 10
       },
-      searchData: {
-        name: '',
-        regionId: '',
-        zone: ''
-      },
-      zoneList: [],
       tableData: [],
       total: 0,
       detailFlag: false,
@@ -482,7 +477,6 @@ export default {
         'utf32'
       ],
       accounts: [],
-      databases: [],
       databaseList: [],
       paramsDb: {
         page: 1,
@@ -503,6 +497,25 @@ export default {
       }
     }
   },
+  watch: {
+    platformObject: {
+      handler(newVal, oldVal) {
+        this.searchConfigs = [
+          { type: 'Input', label: '名称', value: 'name' },
+          { type: 'Select', label: '所属地域', data: [], value: 'regionId', props: { value: 'regionId' } },
+          { type: 'Const', value: 'vendorId', initValue: this.platformObject.vendorId },
+          { type: 'Const', value: 'dbType', initValue: 'POSTGRESQL' }
+        ]
+        if (this.detailFlag) {
+          this.handleClick()
+        }
+      },
+      deep: true
+    }
+  },
+  mounted() {
+    this.getRegion()
+  },
   methods: {
     async getCoList(id) {
       this.paramsCo.params = handleSearchParam({
@@ -838,28 +851,15 @@ export default {
           }
         })
       })
+    }, // 获取域
+    getRegion() {
+      getRegion({ vendorId: this.platformObject.vendorId }).then(data => {
+        if (data.success) {
+          this.regionList = data.data
+          this.searchConfigs[1].data = data.data
         }
-  },
+      })
-  watch: {
-    platformObject: {
-      handler(newVal, oldVal) {
-        this.searchConfigs = [
-          { type: 'Input', label: '名称', value: 'name' },
-          { type: 'Const', value: 'vendorId', initValue: newVal.vendorId }
-        ]
-        if (this.detailFlag) {
-          this.handleClick()
-        }
-      },
-      deep: true
     }
   }
 }
 </script>
-
-<style scoped>
-.tooltip {
-  font-size: 12px;
-  color: #666;
-}
-</style>