From 833e9661908a9d36fb5322ea204461aef70ac615 Mon Sep 17 00:00:00 2001
From: wangdan-fit2cloud <dan.wang@fit2cloud.com>
Date: Tue, 12 Dec 2023 11:32:45 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E7=99=BB=E5=BD=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 ui/src/components/login-container/index.vue  | 35 +++++++++++---------
 ui/src/components/login-layout/index.vue     | 12 +++----
 ui/src/styles/app.scss                       |  4 ++-
 ui/src/styles/element-plus.scss              |  5 +++
 ui/src/views/dataset/step/ResultSuccess.vue  | 17 +++++++---
 ui/src/views/login/forgot-password/index.vue | 16 +++------
 ui/src/views/login/index.scss                |  1 -
 ui/src/views/login/index.vue                 | 23 ++++++-------
 ui/src/views/login/register/index.vue        | 33 +++++-------------
 ui/src/views/login/reset-password/index.vue  | 22 +++++-------
 10 files changed, 79 insertions(+), 89 deletions(-)

diff --git a/ui/src/components/login-container/index.vue b/ui/src/components/login-container/index.vue
index ea1f75334..a87568cb4 100644
--- a/ui/src/components/login-container/index.vue
+++ b/ui/src/components/login-container/index.vue
@@ -1,13 +1,17 @@
 <template>
   <div class="login-form-container">
     <div class="login-title">
-      <div class="title flex-center">
-        <div class="logo"></div>
+      <div class="title flex-center mb-8">
+        <div class="logo mr-4"></div>
         <div class="app-logo-font">{{ title || defaultTitle }}</div>
       </div>
-      <div class="sub-title" v-if="subTitle">{{ subTitle }}</div>
+      <div class="sub-title text-center" v-if="subTitle">
+        <el-text type="info">{{ subTitle }}</el-text>
+      </div>
     </div>
-    <slot></slot>
+    <el-card class="login-card">
+      <slot></slot>
+    </el-card>
   </div>
 </template>
 <script setup lang="ts">
@@ -20,27 +24,28 @@ defineProps({
 </script>
 <style lang="scss" scope>
 .login-form-container {
-  width: 420px;
+  width: 480px;
 
   .login-title {
-    margin-bottom: 30px;
+    margin-bottom: 32px;
 
     .title {
-      font-size: 28px;
-      height: 60px;
+      font-size: 32px;
       .logo {
-        background-image: url('@/assets/logo.png');
+        background-image: url('@/assets/logo.svg');
         background-size: 100% 100%;
-        width: 48px;
-        height: 48px;
+        width: 45px;
+        height: 45px;
+        background-position: center -2px;
       }
     }
-
     .sub-title {
-      text-align: center;
-      color: #101010;
-      font-size: 18px;
+      font-size: 16px;
     }
   }
+  .login-card {
+    border-radius: 8px;
+    padding: 18px;
+  }
 }
 </style>
diff --git a/ui/src/components/login-layout/index.vue b/ui/src/components/login-layout/index.vue
index 87d83ed9d..3aab70c1b 100644
--- a/ui/src/components/login-layout/index.vue
+++ b/ui/src/components/login-layout/index.vue
@@ -3,17 +3,17 @@
     <div class="login-container w-full h-full">
       <el-row class="container w-full h-full">
         <el-col
-          :xs="8"
-          :sm="6"
-          :md="14"
-          :lg="14"
-          :xl="14"
+          :xs="0"
+          :sm="0"
+          :md="10"
+          :lg="10"
+          :xl="10"
           class="left-container"
           v-if="screenWidth && screenWidth >= 990"
         >
           <div class="login-image"></div>
         </el-col>
-        <el-col :xs="24" :sm="24" :md="10" :lg="10" :xl="10" class="right-container flex-center">
+        <el-col :xs="24" :sm="24" :md="14" :lg="14" :xl="14" class="right-container flex-center">
           <slot></slot>
         </el-col>
       </el-row>
diff --git a/ui/src/styles/app.scss b/ui/src/styles/app.scss
index 84be6f417..6fc56b9ea 100644
--- a/ui/src/styles/app.scss
+++ b/ui/src/styles/app.scss
@@ -126,7 +126,9 @@ h4 {
 .mb-16 {
   margin-bottom: calc(var(--app-base-px) * 2);
 }
-
+.mb-24 {
+  margin-bottom: calc(var(--app-base-px) * 3);
+}
 .ml-4 {
   margin-left: calc(var(--app-base-px) - 4px);
 }
diff --git a/ui/src/styles/element-plus.scss b/ui/src/styles/element-plus.scss
index b3090ad62..d34a4bd0b 100644
--- a/ui/src/styles/element-plus.scss
+++ b/ui/src/styles/element-plus.scss
@@ -28,6 +28,11 @@
   --el-form-inline-content-width: 100%;
 }
 
+.el-form-item {
+  margin-bottom: 24px;
+
+}
+
 .el-dialog {
   --el-dialog-title-font-size: 16px;
   .dialog-sub-title {
diff --git a/ui/src/views/dataset/step/ResultSuccess.vue b/ui/src/views/dataset/step/ResultSuccess.vue
index 126a5fbce..3889e3b65 100644
--- a/ui/src/views/dataset/step/ResultSuccess.vue
+++ b/ui/src/views/dataset/step/ResultSuccess.vue
@@ -3,13 +3,13 @@
     <el-result icon="success" title="🎉 数据集创建成功 🎉">
       <template #sub-title>
         <div class="mt-8">
-          <span class="bold">{{ data?.document_count || 0 }}</span>
+          <span class="bold">{{ data?.documment_list.length || 0 }}</span>
           <el-text type="info" class="ml-4">文档</el-text>
           <el-divider direction="vertical" />
-          <span class="bold">{{ data?.document_list.length || 0 }}</span>
+          <span class="bold">{{ paragraph_count || 0 }}</span>
           <el-text type="info" class="ml-4">分段</el-text>
           <el-divider direction="vertical" />
-          <span class="bold">{{ numberFormat(data?.char_length) || 0 }}</span>
+          <span class="bold">{{ numberFormat(char_length) || 0 }}</span>
           <el-text type="info" class="ml-4">字符</el-text>
         </div>
       </template>
@@ -54,7 +54,8 @@
   </el-scrollbar>
 </template>
 <script setup lang="ts">
-import { useRouter, useRoute } from 'vue-router'
+import { computed } from 'vue'
+import { useRouter } from 'vue-router'
 import { numberFormat } from '@/utils/utils'
 import { filesize, getImgUrl } from '@/utils/utils'
 const props = defineProps({
@@ -64,6 +65,14 @@ const props = defineProps({
   }
 })
 const router = useRouter()
+const paragraph_count = computed(
+  () => props.data?.document_list.reduce((sum: number, obj: any) => (sum += obj.paragraph_count), 0)
+)
+
+const char_length = computed(
+  () =>
+    props.data?.document_list.reduce((sum: number, obj: any) => (sum += obj.char_length), 0) || 0
+)
 </script>
 <style scoped lang="scss">
 .result-success {
diff --git a/ui/src/views/login/forgot-password/index.vue b/ui/src/views/login/forgot-password/index.vue
index e2c608d62..a39110a2e 100644
--- a/ui/src/views/login/forgot-password/index.vue
+++ b/ui/src/views/login/forgot-password/index.vue
@@ -1,7 +1,7 @@
 <template>
   <login-layout>
     <LoginContainer>
-      <h4 class="mb-16">忘记密码</h4>
+      <h4 class="mb-24">忘记密码</h4>
       <el-form
         class="register-form"
         ref="resetPasswordFormRef"
@@ -15,9 +15,6 @@
             v-model="CheckEmailForm.email"
             placeholder="请输入邮箱"
           >
-            <template #prepend>
-              <el-button icon="UserFilled" />
-            </template>
           </el-input>
         </el-form-item>
         <el-form-item prop="code">
@@ -28,9 +25,6 @@
               v-model="CheckEmailForm.code"
               placeholder="请输入验证码"
             >
-              <template #prepend>
-                <el-button icon="Key" />
-              </template>
             </el-input>
             <el-button
               size="large"
@@ -42,16 +36,16 @@
           </div>
         </el-form-item>
       </el-form>
-      <el-button type="primary" class="login-submit-button w-full" @click="checkCode"
+      <el-button type="primary" class="login-submit-button w-full mt-4" @click="checkCode"
         >立即验证</el-button
       >
-      <div class="operate-container mt-8">
+      <div class="operate-container mt-12">
         <el-button
           class="register"
           @click="router.push('/login')"
           link
           type="primary"
-          icon="DArrowLeft"
+          icon="ArrowLeft"
         >
           返回登录
         </el-button>
@@ -115,4 +109,4 @@ const sendEmail = () => {
 </script>
 <style lang="scss" scope>
 @import '../index.scss';
-</style>
\ No newline at end of file
+</style>
diff --git a/ui/src/views/login/index.scss b/ui/src/views/login/index.scss
index 899919730..cf044384a 100644
--- a/ui/src/views/login/index.scss
+++ b/ui/src/views/login/index.scss
@@ -1,4 +1,3 @@
 .login-submit-button {
-  margin-top: 12px;
   height: 40px;
 }
diff --git a/ui/src/views/login/index.vue b/ui/src/views/login/index.vue
index 3e93437e4..218079ae0 100644
--- a/ui/src/views/login/index.vue
+++ b/ui/src/views/login/index.vue
@@ -1,20 +1,18 @@
 <template>
   <login-layout v-loading="loading">
     <LoginContainer subTitle="欢迎使用 MaxKB 管理平台">
+      <h2 class="mb-24">普通登录</h2>
       <el-form class="login-form" :rules="rules" :model="loginForm" ref="loginFormRef">
-        <el-form-item>
+        <el-form-item prop="username">
           <el-input
             size="large"
             class="input-item"
             v-model="loginForm.username"
             placeholder="请输入用户名"
           >
-            <template #prepend>
-              <el-button icon="UserFilled" />
-            </template>
           </el-input>
         </el-form-item>
-        <el-form-item>
+        <el-form-item prop="password">
           <el-input
             type="password"
             size="large"
@@ -23,13 +21,13 @@
             placeholder="请输入密码"
             show-password
           >
-            <template #prepend>
-              <el-button icon="Lock" />
-            </template>
           </el-input>
         </el-form-item>
       </el-form>
-      <div class="operate-container flex-between">
+      <el-button type="primary" class="login-submit-button mt-4 w-full" @click="login"
+        >登录</el-button
+      >
+      <div class="operate-container flex-between mt-12">
         <el-button class="register" @click="router.push('/register')" link type="primary">
           注册
         </el-button>
@@ -42,7 +40,6 @@
           忘记密码
         </el-button>
       </div>
-      <el-button type="primary" class="login-submit-button w-full" @click="login">登录</el-button>
     </LoginContainer>
   </login-layout>
 </template>
@@ -77,8 +74,8 @@ const rules = ref<FormRules<LoginRequest>>({
     },
     {
       min: 6,
-      max: 30,
-      message: '长度在 6 到 30 个字符',
+      max: 20,
+      message: '长度在 6 到 20 个字符',
       trigger: 'blur'
     }
   ]
@@ -99,4 +96,4 @@ const login = () => {
 </script>
 <style lang="scss" scope>
 @import './index.scss';
-</style>
\ No newline at end of file
+</style>
diff --git a/ui/src/views/login/register/index.vue b/ui/src/views/login/register/index.vue
index dd4fff74a..dd776abf2 100644
--- a/ui/src/views/login/register/index.vue
+++ b/ui/src/views/login/register/index.vue
@@ -1,7 +1,7 @@
 <template>
   <login-layout>
     <LoginContainer>
-      <h4 class="mb-16">注册</h4>
+      <h4 class="mb-24">用户注册</h4>
       <el-form class="register-form" :model="registerForm" :rules="rules" ref="registerFormRef">
         <el-form-item prop="username">
           <el-input
@@ -10,9 +10,6 @@
             v-model="registerForm.username"
             placeholder="请输入用户名"
           >
-            <template #prepend>
-              <el-button :icon="UserFilled" />
-            </template>
           </el-input>
         </el-form-item>
         <el-form-item prop="password">
@@ -24,9 +21,6 @@
             placeholder="请输入密码"
             show-password
           >
-            <template #prepend>
-              <el-button :icon="Lock" />
-            </template>
           </el-input>
         </el-form-item>
         <el-form-item prop="repassword">
@@ -38,9 +32,6 @@
             placeholder="请输入确认密码"
             show-password
           >
-            <template #prepend>
-              <el-button :icon="Lock" />
-            </template>
           </el-input>
         </el-form-item>
         <el-form-item prop="email">
@@ -50,9 +41,6 @@
             v-model="registerForm.email"
             placeholder="请输入邮箱"
           >
-            <template #prepend>
-              <el-button :icon="Message" />
-            </template>
           </el-input>
         </el-form-item>
         <el-form-item prop="code">
@@ -63,9 +51,6 @@
               v-model="registerForm.code"
               placeholder="请输入验证码"
             >
-              <template #prepend>
-                <el-button :icon="Key" />
-              </template>
             </el-input>
             <el-button
               size="large"
@@ -77,16 +62,16 @@
           </div>
         </el-form-item>
       </el-form>
-      <el-button type="primary" class="login-submit-button w-full" @click="register"
+      <el-button type="primary" class="login-submit-button w-full mt-4" @click="register"
         >注册</el-button
       >
-      <div class="operate-container mt-8">
+      <div class="operate-container mt-12">
         <el-button
           class="register"
           @click="router.push('/login')"
           link
           type="primary"
-          icon="DArrowLeft"
+          icon="ArrowLeft"
         >
           返回登录
         </el-button>
@@ -128,8 +113,8 @@ const rules = ref<FormRules<RegisterRequest>>({
     },
     {
       min: 6,
-      max: 30,
-      message: '长度在 6 到 30 个字符',
+      max: 20,
+      message: '长度在 6 到 20 个字符',
       trigger: 'blur'
     }
   ],
@@ -141,8 +126,8 @@ const rules = ref<FormRules<RegisterRequest>>({
     },
     {
       min: 6,
-      max: 30,
-      message: '长度在 6 到 30 个字符',
+      max: 20,
+      message: '长度在 6 到 20 个字符',
       trigger: 'blur'
     },
     {
@@ -200,4 +185,4 @@ const sendEmail = () => {
 </script>
 <style lang="scss" scope>
 @import '../index.scss';
-</style>
\ No newline at end of file
+</style>
diff --git a/ui/src/views/login/reset-password/index.vue b/ui/src/views/login/reset-password/index.vue
index ec474aa98..640853c72 100644
--- a/ui/src/views/login/reset-password/index.vue
+++ b/ui/src/views/login/reset-password/index.vue
@@ -1,7 +1,7 @@
 <template>
   <login-layout>
     <LoginContainer>
-      <h4 class="mb-16">修改密码</h4>
+      <h4 class="mb-24">修改密码</h4>
       <el-form
         class="reset-password-form"
         ref="resetPasswordFormRef"
@@ -17,9 +17,6 @@
             placeholder="请输入密码"
             show-password
           >
-            <template #prepend>
-              <el-button icon="Lock" />
-            </template>
           </el-input>
         </el-form-item>
         <el-form-item prop="re_password">
@@ -31,22 +28,19 @@
             placeholder="请输入确认密码"
             show-password
           >
-            <template #prepend>
-              <el-button icon="Lock" />
-            </template>
           </el-input>
         </el-form-item>
       </el-form>
-      <el-button type="primary" class="login-submit-button w-full" @click="resetPassword"
+      <el-button type="primary" class="login-submit-button w-full mt-4" @click="resetPassword"
         >确认修改</el-button
       >
-      <div class="operate-container mt-8">
+      <div class="operate-container mt-12">
         <el-button
           class="register"
           @click="router.push('/login')"
           link
           type="primary"
-          icon="DArrowLeft"
+          icon="ArrowLeft"
         >
           返回登录
         </el-button>
@@ -91,8 +85,8 @@ const rules = ref<FormRules<ResetPasswordRequest>>({
     },
     {
       min: 6,
-      max: 30,
-      message: '长度在 6 到 30 个字符',
+      max: 20,
+      message: '长度在 6 到 20 个字符',
       trigger: 'blur'
     }
   ],
@@ -104,8 +98,8 @@ const rules = ref<FormRules<ResetPasswordRequest>>({
     },
     {
       min: 6,
-      max: 30,
-      message: '长度在 6 到 30 个字符',
+      max: 20,
+      message: '长度在 6 到 20 个字符',
       trigger: 'blur'
     },
     {