fix: 优化数据库页面

develop
时启龙 2024-09-06 11:00:17 +08:00
parent 89bcba26ea
commit a530cff1ff
2 changed files with 56 additions and 56 deletions

View File

@ -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>

View File

@ -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>