From ccee45111871d53e00e613991b3946d779db55ea Mon Sep 17 00:00:00 2001
From: ssongliu <songlius11@163.com>
Date: Mon, 20 Feb 2023 15:39:55 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E6=95=B0=E6=8D=AE=E5=BA=93=E6=93=8D?=
 =?UTF-8?q?=E4=BD=9C=E5=A2=9E=E5=8A=A0=E4=B8=80=E4=BA=9B=20loading?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 backend/app/api/v1/terminal.go                | 12 ++++-----
 .../src/views/database/mysql/backup/index.vue | 27 ++++++++++++++-----
 .../views/database/mysql/setting/index.vue    |  2 +-
 .../mysql/setting/variables/index.vue         |  2 +-
 .../src/views/database/mysql/upload/index.vue | 20 +++++++++-----
 frontend/src/views/database/redis/index.vue   |  5 +++-
 .../views/database/redis/setting/index.vue    |  2 +-
 .../views/host/terminal/terminal/terminal.vue |  4 +--
 frontend/vite.config.ts                       |  2 +-
 9 files changed, 51 insertions(+), 25 deletions(-)

diff --git a/backend/app/api/v1/terminal.go b/backend/app/api/v1/terminal.go
index 1f69d5c55..cb49e8a13 100644
--- a/backend/app/api/v1/terminal.go
+++ b/backend/app/api/v1/terminal.go
@@ -90,6 +90,12 @@ func (b *BaseApi) RedisWsSsh(c *gin.Context) {
 		helper.ErrorWithDetail(c, constant.CodeErrBadRequest, constant.ErrTypeInvalidParams, err)
 		return
 	}
+	redisConf, err := redisService.LoadConf()
+	if err != nil {
+		global.LOG.Errorf("load redis container failed, err: %v", err)
+		helper.ErrorWithDetail(c, constant.CodeErrInternalServer, constant.ErrTypeInternalServer, err)
+		return
+	}
 
 	wsConn, err := upGrader.Upgrade(c.Writer, c.Request, nil)
 	if err != nil {
@@ -97,12 +103,6 @@ func (b *BaseApi) RedisWsSsh(c *gin.Context) {
 		return
 	}
 	defer wsConn.Close()
-
-	redisConf, err := redisService.LoadConf()
-	if err != nil {
-		helper.ErrorWithDetail(c, constant.CodeErrInternalServer, constant.ErrTypeInternalServer, err)
-		return
-	}
 	auth := ""
 	if len(redisConf.Requirepass) != 0 {
 		auth = fmt.Sprintf("-a %s --no-auth-warning", redisConf.Requirepass)
diff --git a/frontend/src/views/database/mysql/backup/index.vue b/frontend/src/views/database/mysql/backup/index.vue
index 1a87e0ec0..e39175eab 100644
--- a/frontend/src/views/database/mysql/backup/index.vue
+++ b/frontend/src/views/database/mysql/backup/index.vue
@@ -1,5 +1,5 @@
 <template>
-    <div>
+    <div v-loading="loading">
         <el-drawer v-model="backupVisiable" :destroy-on-close="true" :close-on-click-modal="false" size="50%">
             <template #header>
                 <DrawerHeader :header="$t('database.backup')" :resource="dbName" :back="handleClose" />
@@ -42,6 +42,7 @@ import { Backup } from '@/api/interface/backup';
 import { MsgSuccess } from '@/utils/message';
 
 const selects = ref<any>([]);
+const loading = ref();
 
 const data = ref();
 const paginationConfig = reactive({
@@ -85,9 +86,16 @@ const onBackup = async () => {
         mysqlName: mysqlName.value,
         dbName: dbName.value,
     };
-    await backup(params);
-    MsgSuccess(i18n.global.t('commons.msg.operationSuccess'));
-    search();
+    loading.value = true;
+    await backup(params)
+        .then(() => {
+            loading.value = false;
+            MsgSuccess(i18n.global.t('commons.msg.operationSuccess'));
+            search();
+        })
+        .catch(() => {
+            loading.value = false;
+        });
 };
 
 const onRecover = async (row: Backup.RecordInfo) => {
@@ -96,8 +104,15 @@ const onRecover = async (row: Backup.RecordInfo) => {
         dbName: dbName.value,
         backupName: row.fileDir + '/' + row.fileName,
     };
-    await recover(params);
-    MsgSuccess(i18n.global.t('commons.msg.operationSuccess'));
+    loading.value = true;
+    await recover(params)
+        .then(() => {
+            loading.value = false;
+            MsgSuccess(i18n.global.t('commons.msg.operationSuccess'));
+        })
+        .catch(() => {
+            loading.value = false;
+        });
 };
 
 const onDownload = async (row: Backup.RecordInfo) => {
diff --git a/frontend/src/views/database/mysql/setting/index.vue b/frontend/src/views/database/mysql/setting/index.vue
index c871cc945..d45247f58 100644
--- a/frontend/src/views/database/mysql/setting/index.vue
+++ b/frontend/src/views/database/mysql/setting/index.vue
@@ -1,6 +1,6 @@
 <template>
     <div v-show="onSetting">
-        <LayoutContent :title="'MySQL ' + $t('database.setting')" :reload="true">
+        <LayoutContent :title="'MySQL ' + $t('database.setting')" :reload="true" v-loading="loading">
             <template #buttons>
                 <el-button type="primary" :plain="activeName !== 'conf'" @click="activeName = 'conf'">
                     {{ $t('database.confChange') }}
diff --git a/frontend/src/views/database/mysql/setting/variables/index.vue b/frontend/src/views/database/mysql/setting/variables/index.vue
index 991931864..c282fc7d1 100644
--- a/frontend/src/views/database/mysql/setting/variables/index.vue
+++ b/frontend/src/views/database/mysql/setting/variables/index.vue
@@ -1,5 +1,5 @@
 <template>
-    <div>
+    <div v-loading="loading">
         <el-form :model="mysqlVariables" :rules="variablesRules" ref="variableFormRef" label-position="top">
             <el-row>
                 <el-col :span="1"><br /></el-col>
diff --git a/frontend/src/views/database/mysql/upload/index.vue b/frontend/src/views/database/mysql/upload/index.vue
index 93b2bfd13..fc266dff4 100644
--- a/frontend/src/views/database/mysql/upload/index.vue
+++ b/frontend/src/views/database/mysql/upload/index.vue
@@ -1,5 +1,5 @@
 <template>
-    <div>
+    <div v-loading="loading">
         <el-drawer v-model="upVisiable" :destroy-on-close="true" :close-on-click-modal="false" size="50%">
             <template #header>
                 <DrawerHeader :header="$t('commons.button.import')" :back="handleClose" />
@@ -14,9 +14,6 @@
                 <template #trigger>
                     <el-button type="primary" plain>{{ $t('database.selectFile') }}</el-button>
                 </template>
-                <el-button style="margin-left: 10px" icon="Upload" @click="onSubmit">
-                    {{ $t('commons.button.upload') }}
-                </el-button>
             </el-upload>
             <div style="margin-left: 10px">
                 <span class="input-help">{{ $t('database.supportUpType') }}</span>
@@ -24,6 +21,9 @@
                     {{ $t('database.zipFormat') }}
                 </span>
             </div>
+            <el-button style="margin-top: 10px" v-if="uploaderFiles.length === 1" icon="Upload" @click="onSubmit">
+                {{ $t('commons.button.upload') }}
+            </el-button>
             <el-divider />
             <ComplexTable :pagination-config="paginationConfig" v-model:selects="selects" :data="data">
                 <template #toolbar>
@@ -74,6 +74,7 @@ import { BatchDeleteFile, GetFilesList, UploadFileData } from '@/api/modules/fil
 import { loadBaseDir } from '@/api/modules/setting';
 import { MsgError, MsgSuccess } from '@/utils/message';
 
+const loading = ref();
 const selects = ref<any>([]);
 const baseDir = ref();
 
@@ -120,8 +121,15 @@ const onRecover = async (row: File.File) => {
         fileDir: baseDir.value,
         fileName: row.name,
     };
-    await recoverByUpload(params);
-    MsgSuccess(i18n.global.t('commons.msg.operationSuccess'));
+    loading.value = true;
+    await recoverByUpload(params)
+        .then(() => {
+            loading.value = false;
+            MsgSuccess(i18n.global.t('commons.msg.operationSuccess'));
+        })
+        .catch(() => {
+            loading.value = false;
+        });
 };
 
 const uploaderFiles = ref<UploadFiles>([]);
diff --git a/frontend/src/views/database/redis/index.vue b/frontend/src/views/database/redis/index.vue
index 467cde2b6..7cd2dec7d 100644
--- a/frontend/src/views/database/redis/index.vue
+++ b/frontend/src/views/database/redis/index.vue
@@ -56,7 +56,7 @@ import Setting from '@/views/database/redis/setting/index.vue';
 import Password from '@/views/database/redis/password/index.vue';
 import Terminal from '@/views/database/redis/terminal/index.vue';
 import AppStatus from '@/components/app-status/index.vue';
-import { nextTick, ref } from 'vue';
+import { nextTick, onBeforeUnmount, ref } from 'vue';
 import { App } from '@/api/interface/app';
 import { GetAppPort } from '@/api/modules/app';
 import router from '@/routers';
@@ -131,4 +131,7 @@ const onBefore = () => {
     closeTerminal(true);
     loading.value = true;
 };
+onBeforeUnmount(() => {
+    closeTerminal(false);
+});
 </script>
diff --git a/frontend/src/views/database/redis/setting/index.vue b/frontend/src/views/database/redis/setting/index.vue
index eec16cafd..b8f9352c5 100644
--- a/frontend/src/views/database/redis/setting/index.vue
+++ b/frontend/src/views/database/redis/setting/index.vue
@@ -1,6 +1,6 @@
 <template>
     <div v-show="settingShow">
-        <LayoutContent :title="'Redis ' + $t('database.setting')" :reload="true">
+        <LayoutContent :title="'Redis ' + $t('database.setting')" :reload="true" v-loading="loading">
             <template #buttons>
                 <el-button type="primary" :plain="activeName !== 'conf'" @click="changeTab('conf')">
                     {{ $t('database.confChange') }}
diff --git a/frontend/src/views/host/terminal/terminal/terminal.vue b/frontend/src/views/host/terminal/terminal/terminal.vue
index 344d459c7..c353441fd 100644
--- a/frontend/src/views/host/terminal/terminal/terminal.vue
+++ b/frontend/src/views/host/terminal/terminal/terminal.vue
@@ -3,7 +3,7 @@
 </template>
 
 <script setup lang="ts">
-import { ref, onUnmounted, nextTick } from 'vue';
+import { ref, nextTick, onBeforeUnmount } from 'vue';
 import { Terminal } from 'xterm';
 import { AttachAddon } from 'xterm-addon-attach';
 import { Base64 } from 'js-base64';
@@ -182,7 +182,7 @@ defineExpose({
     onSendMsg,
 });
 
-onUnmounted(() => {
+onBeforeUnmount(() => {
     onClose();
 });
 </script>
diff --git a/frontend/vite.config.ts b/frontend/vite.config.ts
index 43c7eb5df..a44b9a548 100644
--- a/frontend/vite.config.ts
+++ b/frontend/vite.config.ts
@@ -37,7 +37,7 @@ export default defineConfig(({ mode }: ConfigEnv): UserConfig => {
             open: viteEnv.VITE_OPEN,
             proxy: {
                 '/api/v1': {
-                    target: 'http://172.16.10.181:9999/', // http://172.16.10.181:9999
+                    target: 'http://localhost:9999/',
                     changeOrigin: true,
                 },
             },