🎨 修改细节问题

src/pages/change-password.vue

@@ -9,13 +9,26 @@
           <h2>修改密码</h2>
         </div>
         <div class="form-container">
-          <DynamicForm 
-            ref="form"
-            :model="formModel" 
-            :options="formOptions"
-          />
-          <a-button type="primary" block @click="handleSubmit">确认修改</a-button>
-          <a-button class="mt-3" block @click="router.back()">返回</a-button>
+          <template v-if="isSuccess">
+            <a-result
+              status="success"
+              title="修改成功"
+              sub-title="您可以使用新密码登录"
+            >
+              <template #extra>
+                <a-button class="mt-3" block @click="router.back()">返回</a-button>
+              </template>
+            </a-result>
+          </template>
+          <template v-else>
+            <DynamicForm 
+              ref="form"
+              :model="formModel" 
+              :options="formOptions"
+            />
+            <a-button type="primary" block :loading="isSubmiting" @click="handleSubmit">确认修改</a-button>
+            <a-button class="mt-3" block @click="router.back()">返回</a-button>
+          </template>
         </div>
       </div>
     </section>
@@ -93,25 +106,34 @@ const formOptions = ref<IDynamicFormOptions>({
   },
 });
 
+const isSubmiting = ref(false);
+const isSuccess = ref(true);
+
 const router = useRouter();
 
 async function handleSubmit() {
+  isSubmiting.value = true;
   try {
     await (form.value?.getFormRef() as FormInstance).validate();
   } catch {
+    isSubmiting.value = false;
     return;
   }
+
   try {
     await UserApi.updatePassword({
       oldpassword: formModel.value.oldPassword,
       newpassword: formModel.value.password,
     });
     message.success('修改密码成功');
+
   } catch (error) {
     Modal.error({
       title: '修改密码失败',
       content: '' + error,
     });
+  } finally {
+    isSubmiting.value = false;
   }
 }
 </script>

src/pages/index.vue

@@ -1,9 +1,9 @@
 <template>
-  <div class="main-background main-background-type0">
+  <div class="main-background main-background-type0 index">
     <div class="nav-placeholder"></div>
     <div class="empty-page">
       <img src="@/assets/images/Welecome.svg" />
-      <h1>欢迎!</h1>
+      <h1>欢迎您 {{authStore.userInfo?.nickname}}!</h1>
       <p></p>
       
       <RouterLink v-if="authStore.isLogged && authStore.loginType === 1" to="/admin">
@@ -28,6 +28,9 @@ const authStore = useAuthStore();
 <style lang="scss">
 @use '@/assets/scss/colors.scss' as *;
 
+.index {
+  min-height: calc(100vh - 50px);
+}
 .empty-page {
   display: flex;
   flex-direction: column;