From a48c504de5b8580a10c04fff387a10b4aec59707 Mon Sep 17 00:00:00 2001
From: fuliqiang <1348994179@qq.com>
Date: Fri, 21 Feb 2025 12:51:53 +0800
Subject: [PATCH 1/3] fix: bug fixed

---
 .../src/pages/cluster-manage/hosts/create.vue | 30 +++++++++----------
 1 file changed, 15 insertions(+), 15 deletions(-)

diff --git a/bigtop-manager-ui/src/pages/cluster-manage/hosts/create.vue b/bigtop-manager-ui/src/pages/cluster-manage/hosts/create.vue
index 31b357be..8a946e3b 100644
--- a/bigtop-manager-ui/src/pages/cluster-manage/hosts/create.vue
+++ b/bigtop-manager-ui/src/pages/cluster-manage/hosts/create.vue
@@ -52,11 +52,11 @@
   const { locale } = storeToRefs(localeStore)
   const isEdit = computed(() => mode.value === 'EDIT')
 
-  const checkPassword = async (_rule: Rule, value: string) => {
+  const checkSshPassword = async (_rule: Rule, value: string) => {
     if (!value) {
       return Promise.reject(t('common.enter_error', [`${t('host.confirm_password')}`.toLowerCase()]))
     }
-    if (value != formValue.value?.sshKeyPassword) {
+    if (value != formValue.value?.sshPassword) {
       return Promise.reject(t('common.password_not_match'))
     } else {
       return Promise.resolve()
@@ -71,12 +71,12 @@
     }
   }
 
-  const formItemsForPassword = computed((): FormItemState[] => [
+  const formItemsForSshPassword = computed((): FormItemState[] => [
     {
       type: 'inputPassword',
-      field: 'sshKeyPassword',
+      field: 'sshPassword',
       formItemProps: {
-        name: 'sshKeyPassword',
+        name: 'sshPassword',
         label: t('host.password_auth'),
         rules: [
           {
@@ -92,14 +92,14 @@
     },
     {
       type: 'inputPassword',
-      field: 'sshKeyPasswordAgain',
+      field: 'sshPasswordAgain',
       formItemProps: {
-        name: 'sshKeyPasswordAgain',
+        name: 'sshPasswordAgain',
         label: t('host.confirm_password'),
         rules: [
           {
             required: true,
-            validator: checkPassword,
+            validator: checkSshPassword,
             trigger: 'blur'
           }
         ]
@@ -110,7 +110,7 @@
     }
   ])
 
-  const formItemsForKey = computed((): FormItemState[] => [
+  const formItemsForSshKeyPassword = computed((): FormItemState[] => [
     {
       type: 'radio',
       field: 'inputType',
@@ -164,9 +164,9 @@
     },
     {
       type: 'input',
-      field: 'keyPassword',
+      field: 'sshKeyPassword',
       formItemProps: {
-        name: 'keyPassword',
+        name: 'sshKeyPassword',
         label: t('host.key_password')
       },
       controlProps: {
@@ -175,9 +175,9 @@
     },
     {
       type: 'textarea',
-      field: 'keyPasswordAgain',
+      field: 'sshKeyPasswordAgain',
       formItemProps: {
-        name: 'keyPasswordAgain',
+        name: 'sshKeyPasswordAgain',
         label: t('host.confirm_key_password'),
         rules: [
           {
@@ -296,11 +296,11 @@
   const filterFormItems = computed((): FormItemState[] => {
     if (formValue.value.authType === '1') {
       const data = [...formItems.value]
-      data.splice(2, 0, ...formItemsForPassword.value)
+      data.splice(2, 0, ...formItemsForSshPassword.value)
       return data
     } else if (formValue.value.authType === '2') {
       const data = [...formItems.value]
-      data.splice(2, 0, ...formItemsForKey.value)
+      data.splice(2, 0, ...formItemsForSshKeyPassword.value)
       return data
     }
     return [...formItems.value]

From 0dbe8889921c55000c64b4ae6e5718a521bfad34 Mon Sep 17 00:00:00 2001
From: fuliqiang <1348994179@qq.com>
Date: Mon, 24 Feb 2025 17:39:34 +0800
Subject: [PATCH 2/3] feat: Fix file name not displaying after upload

---
 .../src/pages/cluster-manage/hosts/create.vue | 43 ++++++-------------
 1 file changed, 12 insertions(+), 31 deletions(-)

diff --git a/bigtop-manager-ui/src/pages/cluster-manage/hosts/create.vue b/bigtop-manager-ui/src/pages/cluster-manage/hosts/create.vue
index 8a946e3b..5354a8ae 100644
--- a/bigtop-manager-ui/src/pages/cluster-manage/hosts/create.vue
+++ b/bigtop-manager-ui/src/pages/cluster-manage/hosts/create.vue
@@ -49,6 +49,7 @@
   const hiddenItems = ref<string[]>([])
   const autoFormRef = ref<Comp.AutoFormInstance | null>(null)
   const formValue = ref<HostReq & { hostname?: string }>({})
+  const fileName = ref('')
   const { locale } = storeToRefs(localeStore)
   const isEdit = computed(() => mode.value === 'EDIT')
 
@@ -163,7 +164,7 @@
       }
     },
     {
-      type: 'input',
+      type: 'inputPassword',
       field: 'sshKeyPassword',
       formItemProps: {
         name: 'sshKeyPassword',
@@ -174,7 +175,7 @@
       }
     },
     {
-      type: 'textarea',
+      type: 'inputPassword',
       field: 'sshKeyPasswordAgain',
       formItemProps: {
         name: 'sshKeyPasswordAgain',
@@ -428,6 +429,7 @@
       authType: '1',
       inputType: '1'
     }
+    fileName.value = ''
     open.value = false
   }
 
@@ -452,16 +454,16 @@
       formData.append('file', file)
       const data = await uploadFile(formData)
       formValue.value!.sshKeyFilename = data
+      fileName.value = file.name
       onSuccess(data, file)
       message.success(t('common.upload_success'))
     } catch (error) {
       onError(error)
       message.error(t('common.upload_failed'))
+      fileName.value = ''
     }
   }
 
-  const fileList = ref()
-
   defineExpose({
     handleOpen
   })
@@ -492,7 +494,7 @@
         <template #sshKeyFilenameSlot="{ item }">
           <a-form-item v-bind="item.formItemProps">
             <a-upload
-              :file-list="fileList"
+              accept="text/plain"
               :before-upload="beforeUpload"
               :custom-request="customRequest"
               :show-upload-list="false"
@@ -502,34 +504,9 @@
                 {{ $t('common.upload_file') }}
               </a-button>
             </a-upload>
+            <span class="filename">{{ fileName }}</span>
           </a-form-item>
         </template>
-        <!-- <template #agentDirSlot="{ item, state }">
-          <a-form-item>
-            <template #label>
-              <div class="question">
-                <span>
-                  {{ item.formItemProps?.label }}
-                </span>
-                <svg-icon style="padding: 1px 0 0 0" name="question" />
-              </div>
-            </template>
-            <a-input v-bind="item.controlProps" v-model:value="state[item.field]" />
-          </a-form-item>
-        </template> -->
-        <!-- <template #grpcPortSlot="{ item, state }">
-          <a-form-item>
-            <template #label>
-              <div class="question">
-                <span>
-                  {{ item.formItemProps?.label }}
-                </span>
-                <svg-icon style="padding: 1px 0 0 0" name="question" />
-              </div>
-            </template>
-            <a-input v-bind="item.controlProps" v-model:value="state[item.field]" />
-          </a-form-item>
-        </template> -->
       </auto-form>
       <template #footer>
         <footer>
@@ -551,6 +528,10 @@
   .question {
     cursor: pointer;
   }
+  .filename {
+    color: $color-primary;
+    padding-inline: $space-sm;
+  }
   footer {
     width: 100%;
     @include flexbox($justify: flex-end);

From 6a458156ee86730f531521a054728a4bc13876c9 Mon Sep 17 00:00:00 2001
From: fuliqiang <1348994179@qq.com>
Date: Mon, 24 Feb 2025 17:41:16 +0800
Subject: [PATCH 3/3] fix: Fix sidebar route navigation without page refresh

---
 bigtop-manager-ui/src/layouts/index.vue |  2 +-
 bigtop-manager-ui/src/layouts/sider.vue | 21 ++++++++++++++++-----
 2 files changed, 17 insertions(+), 6 deletions(-)

diff --git a/bigtop-manager-ui/src/layouts/index.vue b/bigtop-manager-ui/src/layouts/index.vue
index c48ab595..f36aca0a 100644
--- a/bigtop-manager-ui/src/layouts/index.vue
+++ b/bigtop-manager-ui/src/layouts/index.vue
@@ -55,7 +55,7 @@
         @on-sider-click="menuStore.onSiderClick"
       />
       <a-layout class="layout-inner">
-        <router-view />
+        <router-view :key="$route.fullPath" />
         <layout-footer />
       </a-layout>
     </a-layout>
diff --git a/bigtop-manager-ui/src/layouts/sider.vue b/bigtop-manager-ui/src/layouts/sider.vue
index bdb988b0..ba88658d 100644
--- a/bigtop-manager-ui/src/layouts/sider.vue
+++ b/bigtop-manager-ui/src/layouts/sider.vue
@@ -18,7 +18,7 @@
 -->
 
 <script setup lang="ts">
-  import { toRefs, ref } from 'vue'
+  import { toRefs, ref, watch } from 'vue'
   import { useRouter } from 'vue-router'
   import { RouteExceptions } from '@/enums'
   import { useMenuStore } from '@/store/menu'
@@ -31,13 +31,13 @@
   }
 
   const props = withDefaults(defineProps<Props>(), {
-    siderMenuSelectedKey: '',
-    siderMenus: () => []
+    siderMenuSelectedKey: ''
   })
 
-  const { siderMenuSelectedKey, siderMenus } = toRefs(props)
+  const { siderMenuSelectedKey } = toRefs(props)
   const router = useRouter()
   const menuStore = useMenuStore()
+  const menus = ref<MenuItem[]>([])
   const emits = defineEmits(['onSiderClick'])
   const clusterStatus = ref<Record<ClusterStatusType, string>>({
     1: 'success',
@@ -45,6 +45,17 @@
     3: 'warning'
   })
 
+  watch(
+    () => props.siderMenus,
+    (val) => {
+      menus.value = []
+      menus.value = val
+    },
+    {
+      deep: true
+    }
+  )
+
   const toggleActivatedIcon = (menuItem: MenuItem) => {
     const { key, icon } = menuItem
     if (menuStore.isDynamicRouteMatched) {
@@ -66,7 +77,7 @@
 <template>
   <a-layout-sider class="sider">
     <a-menu :selected-keys="[siderMenuSelectedKey]" mode="inline" @select="onSiderClick">
-      <template v-for="menuItem in siderMenus" :key="menuItem.key">
+      <template v-for="menuItem in menus" :key="menuItem.key">
         <a-sub-menu
           v-if="menuItem.children && menuItem.name === RouteExceptions.SPECIAL_ROUTE_NAME"
           :key="menuItem.key"