From 02f41ba45d9e799a9a45b708a21750aaf8269754 Mon Sep 17 00:00:00 2001
From: ssongliu <73214554+ssongliu@users.noreply.github.com>
Date: Thu, 7 Dec 2023 10:18:07 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E4=BC=98=E5=8C=96=E4=B8=BB=E6=9C=BA?=
 =?UTF-8?q?=E6=B5=8B=E8=AF=95=E8=BF=9E=E6=8E=A5=E9=80=BB=E8=BE=91=20(#3211?=
 =?UTF-8?q?)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 backend/server/server.go                      |  1 +
 .../host/terminal/host/operate/index.vue      | 34 ++++++++++--------
 .../host/terminal/terminal/host-create.vue    | 36 ++++++++++---------
 3 files changed, 40 insertions(+), 31 deletions(-)

diff --git a/backend/server/server.go b/backend/server/server.go
index 0fa3451a8..7b5c079b0 100644
--- a/backend/server/server.go
+++ b/backend/server/server.go
@@ -86,6 +86,7 @@ func Start() {
 			panic(err)
 		}
 	} else {
+		global.LOG.Infof("listen at http://%s:%s [%s]", global.CONF.System.BindAddress, global.CONF.System.Port, tcpItem)
 		if err := server.Serve(tcpKeepAliveListener{ln.(*net.TCPListener)}); err != nil {
 			panic(err)
 		}
diff --git a/frontend/src/views/host/terminal/host/operate/index.vue b/frontend/src/views/host/terminal/host/operate/index.vue
index e152656c4..61179d50d 100644
--- a/frontend/src/views/host/terminal/host/operate/index.vue
+++ b/frontend/src/views/host/terminal/host/operate/index.vue
@@ -11,13 +11,13 @@
                             <span v-if="dialogData.rowData!.addr === '127.0.0.1' && dialogData.title === 'edit'">
                                 {{ dialogData.rowData!.addr }}
                             </span>
-                            <el-input v-else clearable v-model.trim="dialogData.rowData!.addr" />
+                            <el-input @change="isOK = false" v-else clearable v-model.trim="dialogData.rowData!.addr" />
                         </el-form-item>
                         <el-form-item :label="$t('commons.login.username')" prop="user">
-                            <el-input clearable v-model="dialogData.rowData!.user" />
+                            <el-input @change="isOK = false" clearable v-model="dialogData.rowData!.user" />
                         </el-form-item>
                         <el-form-item :label="$t('terminal.authMode')" prop="authMode">
-                            <el-radio-group v-model="dialogData.rowData!.authMode">
+                            <el-radio-group @change="isOK = false" v-model="dialogData.rowData!.authMode">
                                 <el-radio label="password">{{ $t('terminal.passwordMode') }}</el-radio>
                                 <el-radio label="key">{{ $t('terminal.keyMode') }}</el-radio>
                             </el-radio-group>
@@ -27,14 +27,25 @@
                             v-if="dialogData.rowData!.authMode === 'password'"
                             prop="password"
                         >
-                            <el-input clearable show-password type="password" v-model="dialogData.rowData!.password" />
+                            <el-input
+                                @change="isOK = false"
+                                clearable
+                                show-password
+                                type="password"
+                                v-model="dialogData.rowData!.password"
+                            />
                         </el-form-item>
                         <el-form-item
                             :label="$t('terminal.key')"
                             v-if="dialogData.rowData!.authMode === 'key'"
                             prop="privateKey"
                         >
-                            <el-input clearable type="textarea" v-model="dialogData.rowData!.privateKey" />
+                            <el-input
+                                @change="isOK = false"
+                                clearable
+                                type="textarea"
+                                v-model="dialogData.rowData!.privateKey"
+                            />
                         </el-form-item>
                         <el-form-item
                             :label="$t('terminal.keyPassword')"
@@ -42,6 +53,7 @@
                             prop="passPhrase"
                         >
                             <el-input
+                                @change="isOK = false"
                                 type="password"
                                 show-password
                                 clearable
@@ -52,7 +64,7 @@
                             {{ $t('terminal.rememberPassword') }}
                         </el-checkbox>
                         <el-form-item style="margin-top: 10px" :label="$t('commons.table.port')" prop="port">
-                            <el-input clearable v-model.number="dialogData.rowData!.port" />
+                            <el-input @change="isOK = false" clearable v-model.number="dialogData.rowData!.port" />
                         </el-form-item>
                         <el-form-item :label="$t('commons.table.group')" prop="groupID">
                             <el-select filterable v-model="dialogData.rowData!.groupID" clearable style="width: 100%">
@@ -89,7 +101,7 @@
 </template>
 
 <script lang="ts" setup>
-import { ref, reactive, watch } from 'vue';
+import { ref, reactive } from 'vue';
 import type { ElForm } from 'element-plus';
 import { Rules } from '@/global/form-rules';
 import { addHost, editHost, testByInfo } from '@/api/modules/host';
@@ -111,14 +123,6 @@ const dialogData = ref<DialogProps>({
     title: '',
 });
 
-watch(
-    () => dialogData.value.rowData,
-    () => {
-        isOK.value = false;
-    },
-    { deep: true },
-);
-
 const groupList = ref();
 const acceptParams = (params: DialogProps): void => {
     dialogData.value = params;
diff --git a/frontend/src/views/host/terminal/terminal/host-create.vue b/frontend/src/views/host/terminal/terminal/host-create.vue
index 7d6d22f35..ab4a9219f 100644
--- a/frontend/src/views/host/terminal/terminal/host-create.vue
+++ b/frontend/src/views/host/terminal/terminal/host-create.vue
@@ -16,16 +16,16 @@
                             type="warning"
                         />
                         <el-form-item :label="$t('terminal.ip')" prop="addr">
-                            <el-input v-if="!isLocal" clearable v-model.trim="hostInfo.addr" />
+                            <el-input @change="isOK = false" v-if="!isLocal" clearable v-model.trim="hostInfo.addr" />
                             <div style="margin-left: 12px">
                                 <span v-if="isLocal">{{ hostInfo.addr }}</span>
                             </div>
                         </el-form-item>
                         <el-form-item :label="$t('commons.login.username')" prop="user">
-                            <el-input clearable v-model="hostInfo.user" />
+                            <el-input @change="isOK = false" clearable v-model="hostInfo.user" />
                         </el-form-item>
                         <el-form-item :label="$t('terminal.authMode')" prop="authMode">
-                            <el-radio-group v-model="hostInfo.authMode">
+                            <el-radio-group @change="isOK = false" v-model="hostInfo.authMode">
                                 <el-radio label="password">{{ $t('terminal.passwordMode') }}</el-radio>
                                 <el-radio label="key">{{ $t('terminal.keyMode') }}</el-radio>
                             </el-radio-group>
@@ -35,23 +35,35 @@
                             v-if="hostInfo.authMode === 'password'"
                             prop="password"
                         >
-                            <el-input clearable show-password type="password" v-model="hostInfo.password" />
+                            <el-input
+                                @change="isOK = false"
+                                clearable
+                                show-password
+                                type="password"
+                                v-model="hostInfo.password"
+                            />
                         </el-form-item>
                         <el-form-item :label="$t('terminal.key')" v-if="hostInfo.authMode === 'key'" prop="privateKey">
-                            <el-input clearable type="textarea" v-model="hostInfo.privateKey" />
+                            <el-input @change="isOK = false" clearable type="textarea" v-model="hostInfo.privateKey" />
                         </el-form-item>
                         <el-form-item
                             :label="$t('terminal.keyPassword')"
                             v-if="hostInfo.authMode === 'key'"
                             prop="passPhrase"
                         >
-                            <el-input type="password" show-password clearable v-model="hostInfo.passPhrase" />
+                            <el-input
+                                @change="isOK = false"
+                                type="password"
+                                show-password
+                                clearable
+                                v-model="hostInfo.passPhrase"
+                            />
                         </el-form-item>
                         <el-checkbox clearable v-model.number="hostInfo.rememberPassword">
                             {{ $t('terminal.rememberPassword') }}
                         </el-checkbox>
                         <el-form-item style="margin-top: 10px" :label="$t('commons.table.port')" prop="port">
-                            <el-input clearable v-model.number="hostInfo.port" />
+                            <el-input @change="isOK = false" clearable v-model.number="hostInfo.port" />
                         </el-form-item>
                         <el-form-item :label="$t('commons.table.title')" prop="name">
                             <el-input clearable v-model="hostInfo.name" />
@@ -84,7 +96,7 @@ import { Rules } from '@/global/form-rules';
 import { addHost, testByInfo } from '@/api/modules/host';
 import DrawerHeader from '@/components/drawer-header/index.vue';
 import i18n from '@/lang';
-import { reactive, ref, watch } from 'vue';
+import { reactive, ref } from 'vue';
 import { MsgError, MsgSuccess } from '@/utils/message';
 
 const dialogVisible = ref();
@@ -107,14 +119,6 @@ let hostInfo = reactive<Host.HostOperate>({
     description: '',
 });
 
-watch(
-    () => hostInfo,
-    () => {
-        isOK.value = false;
-    },
-    { deep: true },
-);
-
 const rules = reactive({
     addr: [Rules.ipV4V6OrDomain],
     port: [Rules.requiredInput, Rules.port],