From 12b668ecd1eaf7c617494d5030d970745daf9b41 Mon Sep 17 00:00:00 2001 From: ssongliu Date: Thu, 8 Dec 2022 18:09:14 +0800 Subject: [PATCH] =?UTF-8?q?feat:=20=E6=95=B0=E6=8D=AE=E5=BA=93=E8=AE=BE?= =?UTF-8?q?=E7=BD=AE=E7=95=8C=E9=9D=A2=E8=B0=83=E6=95=B4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- backend/app/dto/database.go | 4 +- backend/app/service/database_mysql.go | 8 +- backend/app/service/image_repo.go | 2 + frontend/src/lang/modules/en.ts | 4 +- frontend/src/lang/modules/zh.ts | 10 +- frontend/src/views/database/mysql/index.vue | 27 ++- .../views/database/mysql/password/index.vue | 2 - .../src/views/database/mysql/remote/index.vue | 91 ++++++++++ .../views/database/mysql/setting/index.vue | 170 +++++++++--------- .../mysql/setting/variables/index.vue | 18 +- 10 files changed, 225 insertions(+), 111 deletions(-) create mode 100644 frontend/src/views/database/mysql/remote/index.vue diff --git a/backend/app/dto/database.go b/backend/app/dto/database.go index fa2dc61b6..f745ef415 100644 --- a/backend/app/dto/database.go +++ b/backend/app/dto/database.go @@ -84,8 +84,8 @@ type MysqlVariables struct { } type MysqlVariablesUpdate struct { - Param string `json:"param"` - Value interface{} `json:"value"` + Param string `json:"param"` + Value int64 `json:"value"` } type MysqlConfUpdateByFile struct { MysqlName string `json:"mysqlName" validate:"required"` diff --git a/backend/app/service/database_mysql.go b/backend/app/service/database_mysql.go index 504cc1a50..75dc7ca76 100644 --- a/backend/app/service/database_mysql.go +++ b/backend/app/service/database_mysql.go @@ -379,14 +379,8 @@ func (u *MysqlService) UpdateVariables(updatas []dto.MysqlVariablesUpdate) error } else { files = strings.Split(string(lineBytes), "\n") } - group := "" + group := "[mysqld]" for _, info := range updatas { - switch info.Param { - case "key_buffer_size", "sort_buffer_size": - group = "[myisamchk]" - default: - group = "[mysqld]" - } files = updateMyCnf(files, group, info.Param, info.Value) } file, err := os.OpenFile(path, os.O_WRONLY, 0666) diff --git a/backend/app/service/image_repo.go b/backend/app/service/image_repo.go index 8d1091570..546d02a71 100644 --- a/backend/app/service/image_repo.go +++ b/backend/app/service/image_repo.go @@ -88,6 +88,8 @@ func (u *ImageRepoService) Create(imageRepoDto dto.ImageRepoCreate) error { k = append(k, imageRepoDto.DownloadUrl) deamonMap["insecure-registries"] = k } + } else { + deamonMap["insecure-registries"] = []string{imageRepoDto.DownloadUrl} } newJson, err := json.MarshalIndent(deamonMap, "", "\t") if err != nil { diff --git a/frontend/src/lang/modules/en.ts b/frontend/src/lang/modules/en.ts index 00fe9a614..6af126e84 100644 --- a/frontend/src/lang/modules/en.ts +++ b/frontend/src/lang/modules/en.ts @@ -228,7 +228,7 @@ export default { backupList: 'Backup list', backList: 'Return', loadBackup: 'Import the backup', - setting: 'Database Settings', + setting: 'Mysql Settings', remoteAccess: 'Remote access', changePassword: 'Password change', @@ -345,7 +345,7 @@ export default { operatorHelper: '{0} will be performed on the selected container. Do you want to continue?', start: 'Start', stop: 'Stop', - reStart: 'Restart', + restart: 'Restart', kill: 'Kill', pause: 'Pause', unpause: 'Unpause', diff --git a/frontend/src/lang/modules/zh.ts b/frontend/src/lang/modules/zh.ts index 43b301acf..4daa6d0bf 100644 --- a/frontend/src/lang/modules/zh.ts +++ b/frontend/src/lang/modules/zh.ts @@ -231,15 +231,17 @@ export default { backupList: '备份列表', backList: '返回列表', loadBackup: '导入备份', - setting: '数据库设置', + setting: 'Mysql 设置', remoteAccess: '远程访问', + remoteConnHelper: 'root 帐号远程连接 mysql 有安全风险，开启需谨慎！', changePassword: '改密', - baseSetting: '基础设置', - remoteConnHelper: 'root 帐号远程连接 mysql 有安全风险，开启需谨慎！', - confChange: '配置修改', + portSetting: '端口', portHelper: '该端口为容器对外暴露端口，修改需要单独保存并且重启容器！', + baseSetting: '基础设置', + confChange: '配置修改', + unSupportType: '不支持当前文件类型！', unSupportSize: '上传文件超过 10M，请确认！', selectFile: '选择文件', diff --git a/frontend/src/views/database/mysql/index.vue b/frontend/src/views/database/mysql/index.vue index c41f32faf..5de4ad8fd 100644 --- a/frontend/src/views/database/mysql/index.vue +++ b/frontend/src/views/database/mysql/index.vue @@ -19,8 +19,10 @@ {{ $t('database.rootPassword') }} - 远程访问 - phpMyAdmin + + {{ $t('database.remoteAccess') }} + + phpMyAdmin @@ -144,7 +146,8 @@ - + + @@ -157,6 +160,7 @@ import ComplexTable from '@/components/complex-table/index.vue'; import OperatrDialog from '@/views/database/mysql/create/index.vue'; import RootPasswordDialog from '@/views/database/mysql/password/index.vue'; +import RemoteAccessDialog from '@/views/database/mysql/remote/index.vue'; import BackupRecords from '@/views/database/mysql/backup/index.vue'; import UploadDialog from '@/views/database/mysql/upload/index.vue'; import AppResources from '@/views/database/mysql/check/index.vue'; @@ -165,7 +169,13 @@ import AppStatus from '@/components/app-status/index.vue'; import Submenu from '@/views/database/index.vue'; import { dateFromat } from '@/utils/util'; import { reactive, ref } from 'vue'; -import { deleteCheckMysqlDB, deleteMysqlDB, searchMysqlDBs, updateMysqlDBInfo } from '@/api/modules/database'; +import { + deleteCheckMysqlDB, + deleteMysqlDB, + loadMysqlBaseInfo, + searchMysqlDBs, + updateMysqlDBInfo, +} from '@/api/modules/database'; import i18n from '@/lang'; import { useDeleteData } from '@/hooks/use-delete-data'; import { ElForm, ElMessage } from 'element-plus'; @@ -217,6 +227,15 @@ const onChangeRootPassword = async () => { rootPasswordRef.value!.acceptParams(); }; +const remoteAccessRef = ref(); +const onChangeAccess = async () => { + const res = await loadMysqlBaseInfo(); + let param = { + privilege: res.data.remoteConn, + }; + remoteAccessRef.value!.acceptParams(param); +}; + const settingRef = ref(); const onSetting = async () => { isOnSetting.value = true; diff --git a/frontend/src/views/database/mysql/password/index.vue b/frontend/src/views/database/mysql/password/index.vue index f985bef6c..43eb747b0 100644 --- a/frontend/src/views/database/mysql/password/index.vue +++ b/frontend/src/views/database/mysql/password/index.vue @@ -49,7 +49,6 @@ const acceptParams = (): void => { dialogVisiable.value = true; }; -const emit = defineEmits<{ (e: 'search'): void }>(); const onSubmit = async () => { let param = { id: 0, @@ -61,7 +60,6 @@ const onSubmit = async () => { .then(() => { loading.value = false; ElMessage.success(i18n.global.t('commons.msg.operationSuccess')); - emit('search'); dialogVisiable.value = false; }) .catch(() => { diff --git a/frontend/src/views/database/mysql/remote/index.vue b/frontend/src/views/database/mysql/remote/index.vue new file mode 100644 index 000000000..3aff9e78e --- /dev/null +++ b/frontend/src/views/database/mysql/remote/index.vue @@ -0,0 +1,91 @@ + + + diff --git a/frontend/src/views/database/mysql/setting/index.vue b/frontend/src/views/database/mysql/setting/index.vue index fd858d736..d07b47094 100644 --- a/frontend/src/views/database/mysql/setting/index.vue +++ b/frontend/src/views/database/mysql/setting/index.vue @@ -1,57 +1,9 @@ @@ -96,21 +69,19 @@ import ContainerLog from '@/components/container-log/index.vue'; import Status from '@/views/database/mysql/setting/status/index.vue'; import Variables from '@/views/database/mysql/setting/variables/index.vue'; import SlowLog from '@/views/database/mysql/setting/slow-log/index.vue'; +import ConfirmDialog from '@/components/confirm-dialog/index.vue'; import { reactive, ref } from 'vue'; import { Codemirror } from 'vue-codemirror'; import { javascript } from '@codemirror/lang-javascript'; import { oneDark } from '@codemirror/theme-one-dark'; import { LoadFile } from '@/api/modules/files'; -import { - loadMysqlBaseInfo, - loadMysqlVariables, - updateMysqlConfByFile, - updateMysqlDBInfo, -} from '@/api/modules/database'; +import { loadMysqlBaseInfo, loadMysqlVariables, updateMysqlConfByFile } from '@/api/modules/database'; import { ChangePort } from '@/api/modules/app'; import { Rules } from '@/global/form-rules'; import i18n from '@/lang'; +const loading = ref(false); + const extensions = [javascript(), oneDark]; const activeName = ref('1'); @@ -139,6 +110,7 @@ interface DialogProps { const dialogContainerLogRef = ref(); const acceptParams = (params: DialogProps): void => { onSetting.value = true; + loading.value = true; loadBaseInfo(); loadVariables(); loadSlowLogs(); @@ -148,33 +120,36 @@ const onClose = (): void => { onSetting.value = false; }; -const onSave = async (formEl: FormInstance | undefined, key: string, val: any) => { +const onSubmitChangePort = async () => { + let params = { + key: 'mysql', + name: mysqlName.value, + port: baseInfo.port, + }; + loading.value = true; + await ChangePort(params) + .then(() => { + loading.value = false; + ElMessage.success(i18n.global.t('commons.msg.operationSuccess')); + }) + .catch(() => { + loading.value = false; + }); +}; +const confirmPortRef = ref(); +const onSavePort = async (formEl: FormInstance | undefined) => { if (!formEl) return; - const result = await formEl.validateField(key, callback); + const result = await formEl.validateField('port', callback); if (!result) { return; } - if (key === 'port') { - let params = { - key: 'mysql', - name: mysqlName.value, - port: val, - }; - await ChangePort(params); - ElMessage.success(i18n.global.t('commons.msg.operationSuccess')); - return; - } - let changeForm = { - id: 0, - mysqlName: mysqlName.value, - value: val, - operation: key === 'remoteConn' ? 'privilege' : key, + let params = { + header: i18n.global.t('database.confChange'), + operationInfo: i18n.global.t('database.restartNowHelper'), + submitInputInfo: i18n.global.t('database.restartNow'), }; - if (changeForm.operation === 'privilege') { - changeForm.value = val ? '%' : 'localhost'; - } - await updateMysqlDBInfo(changeForm); - ElMessage.success(i18n.global.t('commons.msg.operationSuccess')); + confirmPortRef.value!.acceptParams(params); + return; }; function callback(error: any) { if (error) { @@ -184,13 +159,30 @@ function callback(error: any) { } } -const onSaveFile = async () => { +const onSubmitChangeConf = async () => { let param = { mysqlName: mysqlName.value, file: mysqlConf.value, }; - await updateMysqlConfByFile(param); - ElMessage.success(i18n.global.t('commons.msg.operationSuccess')); + loading.value = true; + await updateMysqlConfByFile(param) + .then(() => { + loading.value = false; + ElMessage.success(i18n.global.t('commons.msg.operationSuccess')); + }) + .catch(() => { + loading.value = false; + }); +}; +const confirmConfRef = ref(); +const onSaveConf = async () => { + let params = { + header: i18n.global.t('database.confChange'), + operationInfo: i18n.global.t('database.restartNowHelper'), + submitInputInfo: i18n.global.t('database.restartNow'), + }; + confirmConfRef.value!.acceptParams(params); + return; }; const loadContainerLog = async (containerID: string) => { @@ -225,8 +217,14 @@ const loadSlowLogs = async () => { }; const loadMysqlConf = async (path: string) => { - const res = await LoadFile({ path: path }); - mysqlConf.value = res.data; + await LoadFile({ path: path }) + .then((res) => { + loading.value = false; + mysqlConf.value = res.data; + }) + .catch(() => { + loading.value = false; + }); }; defineExpose({ diff --git a/frontend/src/views/database/mysql/setting/variables/index.vue b/frontend/src/views/database/mysql/setting/variables/index.vue index 06232a76b..18e248b2d 100644 --- a/frontend/src/views/database/mysql/setting/variables/index.vue +++ b/frontend/src/views/database/mysql/setting/variables/index.vue @@ -1,6 +1,6 @@ @@ -124,6 +125,8 @@ import { updateMysqlVariables } from '@/api/modules/database'; import i18n from '@/lang'; import { planOptions } from './../helper'; +const loading = ref(false); + const plan = ref(); const confirmDialogRef = ref(); @@ -277,8 +280,15 @@ const onSaveVariables = async () => { if (oldVariables.value?.max_connections !== mysqlVariables.max_connections) { param.push({ param: 'max_connections', value: mysqlVariables.max_connections }); } - await updateMysqlVariables(param); - ElMessage.success(i18n.global.t('commons.msg.operationSuccess')); + loading.value = true; + await updateMysqlVariables(param) + .then(() => { + loading.value = false; + ElMessage.success(i18n.global.t('commons.msg.operationSuccess')); + }) + .catch(() => { + loading.value = false; + }); }; defineExpose({