fix: 优化数据库页面
							parent
							
								
									89bcba26ea
								
							
						
					
					
						commit
						a530cff1ff
					
				| 
						 | 
					@ -262,6 +262,7 @@
 | 
				
			||||||
 | 
					
 | 
				
			||||||
<script>
 | 
					<script>
 | 
				
			||||||
import validate from '@/validate'
 | 
					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 { 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 add from '../components/add.vue'
 | 
				
			||||||
import ModifyRole from './ModifyRole.vue'
 | 
					import ModifyRole from './ModifyRole.vue'
 | 
				
			||||||
| 
						 | 
					@ -369,10 +370,10 @@ export default {
 | 
				
			||||||
      instanceNetworkTypeMap,
 | 
					      instanceNetworkTypeMap,
 | 
				
			||||||
      required: validate.required,
 | 
					      required: validate.required,
 | 
				
			||||||
      rdsAccountName: { pattern: /^[a-z]([a-z0-9_-]{0,14}[a-z0-9])?$/, message: '由小写字母、数字、下划线(_)组成,以字母开头,以字母或数字结尾,最多16个字符', trigger: null },
 | 
					      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 },
 | 
					      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: [
 | 
					      searchConfigs: [
 | 
				
			||||||
        { type: 'Input', label: '名称', value: 'name' },
 | 
					        { 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: 'vendorId', initValue: this.platformObject.vendorId },
 | 
				
			||||||
        { type: 'Const', value: 'dbType', initValue: 'MYSQL' }
 | 
					        { type: 'Const', value: 'dbType', initValue: 'MYSQL' }
 | 
				
			||||||
      ],
 | 
					      ],
 | 
				
			||||||
| 
						 | 
					@ -382,12 +383,6 @@ export default {
 | 
				
			||||||
        page: 1,
 | 
					        page: 1,
 | 
				
			||||||
        rows: 10
 | 
					        rows: 10
 | 
				
			||||||
      },
 | 
					      },
 | 
				
			||||||
      searchData: {
 | 
					 | 
				
			||||||
        name: '',
 | 
					 | 
				
			||||||
        regionId: '',
 | 
					 | 
				
			||||||
        zone: ''
 | 
					 | 
				
			||||||
      },
 | 
					 | 
				
			||||||
      zoneList: [],
 | 
					 | 
				
			||||||
      tableData: [],
 | 
					      tableData: [],
 | 
				
			||||||
      total: 0,
 | 
					      total: 0,
 | 
				
			||||||
      detailFlag: false,
 | 
					      detailFlag: false,
 | 
				
			||||||
| 
						 | 
					@ -482,7 +477,6 @@ export default {
 | 
				
			||||||
        'utf32'
 | 
					        'utf32'
 | 
				
			||||||
      ],
 | 
					      ],
 | 
				
			||||||
      accounts: [],
 | 
					      accounts: [],
 | 
				
			||||||
      databases: [],
 | 
					 | 
				
			||||||
      databaseList: [],
 | 
					      databaseList: [],
 | 
				
			||||||
      paramsDb: {
 | 
					      paramsDb: {
 | 
				
			||||||
        page: 1,
 | 
					        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: {
 | 
					  methods: {
 | 
				
			||||||
    async getCoList(id) {
 | 
					    async getCoList(id) {
 | 
				
			||||||
      this.paramsCo.params = handleSearchParam({
 | 
					      this.paramsCo.params = handleSearchParam({
 | 
				
			||||||
| 
						 | 
					@ -838,28 +851,15 @@ export default {
 | 
				
			||||||
          }
 | 
					          }
 | 
				
			||||||
        })
 | 
					        })
 | 
				
			||||||
      })
 | 
					      })
 | 
				
			||||||
    }
 | 
					    }, // 获取域
 | 
				
			||||||
  },
 | 
					    getRegion() {
 | 
				
			||||||
  watch: {
 | 
					      getRegion({ vendorId: this.platformObject.vendorId }).then(data => {
 | 
				
			||||||
    platformObject: {
 | 
					        if (data.success) {
 | 
				
			||||||
      handler(newVal, oldVal) {
 | 
					          this.regionList = data.data
 | 
				
			||||||
        this.searchConfigs = [
 | 
					          this.searchConfigs[1].data = data.data
 | 
				
			||||||
          { type: 'Input', label: '名称', value: 'name' },
 | 
					 | 
				
			||||||
          { type: 'Const', value: 'vendorId', initValue: newVal.vendorId }
 | 
					 | 
				
			||||||
        ]
 | 
					 | 
				
			||||||
        if (this.detailFlag) {
 | 
					 | 
				
			||||||
          this.handleClick()
 | 
					 | 
				
			||||||
        }
 | 
					        }
 | 
				
			||||||
      },
 | 
					      })
 | 
				
			||||||
      deep: true
 | 
					 | 
				
			||||||
    }
 | 
					    }
 | 
				
			||||||
  }
 | 
					  }
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
</script>
 | 
					</script>
 | 
				
			||||||
 | 
					 | 
				
			||||||
<style scoped>
 | 
					 | 
				
			||||||
.tooltip {
 | 
					 | 
				
			||||||
  font-size: 12px;
 | 
					 | 
				
			||||||
  color: #666;
 | 
					 | 
				
			||||||
}
 | 
					 | 
				
			||||||
</style>
 | 
					 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -262,6 +262,7 @@
 | 
				
			||||||
 | 
					
 | 
				
			||||||
<script>
 | 
					<script>
 | 
				
			||||||
import validate from '@/validate'
 | 
					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 { 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 add from '../components/add.vue'
 | 
				
			||||||
import ModifyRole from './ModifyRole.vue'
 | 
					import ModifyRole from './ModifyRole.vue'
 | 
				
			||||||
| 
						 | 
					@ -369,10 +370,10 @@ export default {
 | 
				
			||||||
      instanceNetworkTypeMap,
 | 
					      instanceNetworkTypeMap,
 | 
				
			||||||
      required: validate.required,
 | 
					      required: validate.required,
 | 
				
			||||||
      rdsAccountName: { pattern: /^[a-z]([a-z0-9_-]{0,14}[a-z0-9])?$/, message: '由小写字母、数字、下划线(_)组成,以字母开头,以字母或数字结尾,最多16个字符', trigger: null },
 | 
					      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 },
 | 
					      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: [
 | 
					      searchConfigs: [
 | 
				
			||||||
        { type: 'Input', label: '名称', value: 'name' },
 | 
					        { 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: 'vendorId', initValue: this.platformObject.vendorId },
 | 
				
			||||||
        { type: 'Const', value: 'dbType', initValue: 'POSTGRESQL' }
 | 
					        { type: 'Const', value: 'dbType', initValue: 'POSTGRESQL' }
 | 
				
			||||||
      ],
 | 
					      ],
 | 
				
			||||||
| 
						 | 
					@ -382,12 +383,6 @@ export default {
 | 
				
			||||||
        page: 1,
 | 
					        page: 1,
 | 
				
			||||||
        rows: 10
 | 
					        rows: 10
 | 
				
			||||||
      },
 | 
					      },
 | 
				
			||||||
      searchData: {
 | 
					 | 
				
			||||||
        name: '',
 | 
					 | 
				
			||||||
        regionId: '',
 | 
					 | 
				
			||||||
        zone: ''
 | 
					 | 
				
			||||||
      },
 | 
					 | 
				
			||||||
      zoneList: [],
 | 
					 | 
				
			||||||
      tableData: [],
 | 
					      tableData: [],
 | 
				
			||||||
      total: 0,
 | 
					      total: 0,
 | 
				
			||||||
      detailFlag: false,
 | 
					      detailFlag: false,
 | 
				
			||||||
| 
						 | 
					@ -482,7 +477,6 @@ export default {
 | 
				
			||||||
        'utf32'
 | 
					        'utf32'
 | 
				
			||||||
      ],
 | 
					      ],
 | 
				
			||||||
      accounts: [],
 | 
					      accounts: [],
 | 
				
			||||||
      databases: [],
 | 
					 | 
				
			||||||
      databaseList: [],
 | 
					      databaseList: [],
 | 
				
			||||||
      paramsDb: {
 | 
					      paramsDb: {
 | 
				
			||||||
        page: 1,
 | 
					        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: {
 | 
					  methods: {
 | 
				
			||||||
    async getCoList(id) {
 | 
					    async getCoList(id) {
 | 
				
			||||||
      this.paramsCo.params = handleSearchParam({
 | 
					      this.paramsCo.params = handleSearchParam({
 | 
				
			||||||
| 
						 | 
					@ -838,28 +851,15 @@ export default {
 | 
				
			||||||
          }
 | 
					          }
 | 
				
			||||||
        })
 | 
					        })
 | 
				
			||||||
      })
 | 
					      })
 | 
				
			||||||
    }
 | 
					    }, // 获取域
 | 
				
			||||||
  },
 | 
					    getRegion() {
 | 
				
			||||||
  watch: {
 | 
					      getRegion({ vendorId: this.platformObject.vendorId }).then(data => {
 | 
				
			||||||
    platformObject: {
 | 
					        if (data.success) {
 | 
				
			||||||
      handler(newVal, oldVal) {
 | 
					          this.regionList = data.data
 | 
				
			||||||
        this.searchConfigs = [
 | 
					          this.searchConfigs[1].data = data.data
 | 
				
			||||||
          { type: 'Input', label: '名称', value: 'name' },
 | 
					 | 
				
			||||||
          { type: 'Const', value: 'vendorId', initValue: newVal.vendorId }
 | 
					 | 
				
			||||||
        ]
 | 
					 | 
				
			||||||
        if (this.detailFlag) {
 | 
					 | 
				
			||||||
          this.handleClick()
 | 
					 | 
				
			||||||
        }
 | 
					        }
 | 
				
			||||||
      },
 | 
					      })
 | 
				
			||||||
      deep: true
 | 
					 | 
				
			||||||
    }
 | 
					    }
 | 
				
			||||||
  }
 | 
					  }
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
</script>
 | 
					</script>
 | 
				
			||||||
 | 
					 | 
				
			||||||
<style scoped>
 | 
					 | 
				
			||||||
.tooltip {
 | 
					 | 
				
			||||||
  font-size: 12px;
 | 
					 | 
				
			||||||
  color: #666;
 | 
					 | 
				
			||||||
}
 | 
					 | 
				
			||||||
</style>
 | 
					 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
		Loading…
	
		Reference in New Issue