From 3a2f0a0417a7021bfaeae0153177f74cb309ff1e Mon Sep 17 00:00:00 2001
From: BianLzhaoMin <11485688+bianliangzhaomin123@user.noreply.gitee.com>
Date: Wed, 26 Nov 2025 17:50:10 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../image-captioning-library/index.vue        |   2 +-
 .../image-evaluate-library/index.vue          |   4 +-
 src/views/login.vue                           | 781 ++++++++++--------
 3 files changed, 425 insertions(+), 362 deletions(-)

diff --git a/src/views/imageCaptioning/image-captioning-library/index.vue b/src/views/imageCaptioning/image-captioning-library/index.vue
index f57fa07..beb8a72 100644
--- a/src/views/imageCaptioning/image-captioning-library/index.vue
+++ b/src/views/imageCaptioning/image-captioning-library/index.vue
@@ -307,7 +307,7 @@ export default {
     border-radius: 10px;
     align-content: flex-start;
     justify-items: center;
-    height: 47%;
+    height: 62%;
 }
 
 .card-image {
diff --git a/src/views/imageCaptioning/image-evaluate-library/index.vue b/src/views/imageCaptioning/image-evaluate-library/index.vue
index 0e45c26..e1ab3ec 100644
--- a/src/views/imageCaptioning/image-evaluate-library/index.vue
+++ b/src/views/imageCaptioning/image-evaluate-library/index.vue
@@ -78,7 +78,7 @@
                         </div>
 
                         <div class="person-info">
-                            <span class="name">备注:{{ item.remark }}</span>
+                            <span class="name">{{ item.remark }}</span>
                         </div>
                         <!--            <div class="tags">
               <div class="tag-row">
@@ -283,7 +283,7 @@ export default {
     border-radius: 10px;
     align-content: flex-start;
     justify-items: center;
-    height: 43%;
+    height: 56%;
 }
 
 .card-image {
diff --git a/src/views/login.vue b/src/views/login.vue
index 744ed5d..c303cb3 100644
--- a/src/views/login.vue
+++ b/src/views/login.vue
@@ -1,421 +1,484 @@
 <template>
-  <div class="login">
-    <el-form ref="loginForm" :model="loginForm" :rules="loginRules" class="login-form">
-      <h3 class="title">欢迎登录</h3>
-      <h3 class="title">{{title}}</h3>
-      <el-form-item prop="username">
-        <el-input
-          v-model="loginForm.username"
-          type="text"
-          auto-complete="off"
-          placeholder="账号"
+    <div class="login">
+        <el-form
+            ref="loginForm"
+            :model="loginForm"
+            :rules="loginRules"
+            class="login-form"
         >
-          <svg-icon slot="prefix" icon-class="user" class="el-input__icon input-icon" />
-        </el-input>
-      </el-form-item>
-      <el-form-item prop="password">
-        <el-input
-          v-model="loginForm.password"
-          type="password"
-          auto-complete="off"
-          placeholder="密码"
-          @keyup.enter.native="handleLogin"
-        >
-          <svg-icon slot="prefix" icon-class="password" class="el-input__icon input-icon" />
-        </el-input>
-      </el-form-item>
-      <el-form-item prop="code" v-if="captchaEnabled">
-        <div class="code-wrapper">
-          <el-input
-            v-model="loginForm.code"
-            auto-complete="off"
-            placeholder="验证码"
-            @keyup.enter.native="handleLogin"
-          >
-            <svg-icon slot="prefix" icon-class="validCode" class="el-input__icon input-icon" />
-          </el-input>
-          <div class="login-code">
-            <img :src="codeUrl" @click="getCode" class="login-code-img"/>
-          </div>
+            <h3 class="title">欢迎登录</h3>
+            <h3 class="title">{{ title }}</h3>
+            <el-form-item prop="username">
+                <el-input
+                    v-model="loginForm.username"
+                    type="text"
+                    auto-complete="off"
+                    placeholder="账号"
+                >
+                    <svg-icon
+                        slot="prefix"
+                        icon-class="user"
+                        class="el-input__icon input-icon"
+                    />
+                </el-input>
+            </el-form-item>
+            <el-form-item prop="password">
+                <el-input
+                    v-model="loginForm.password"
+                    type="password"
+                    auto-complete="off"
+                    placeholder="密码"
+                    show-password
+                    @keyup.enter.native="handleLogin"
+                >
+                    <svg-icon
+                        slot="prefix"
+                        icon-class="password"
+                        class="el-input__icon input-icon"
+                    />
+                </el-input>
+            </el-form-item>
+            <el-form-item prop="code" v-if="captchaEnabled">
+                <div class="code-wrapper">
+                    <el-input
+                        v-model="loginForm.code"
+                        auto-complete="off"
+                        placeholder="验证码"
+                        @keyup.enter.native="handleLogin"
+                    >
+                        <svg-icon
+                            slot="prefix"
+                            icon-class="validCode"
+                            class="el-input__icon input-icon"
+                        />
+                    </el-input>
+                    <div class="login-code">
+                        <img
+                            :src="codeUrl"
+                            @click="getCode"
+                            class="login-code-img"
+                        />
+                    </div>
+                </div>
+            </el-form-item>
+            <el-checkbox
+                v-model="loginForm.rememberMe"
+                style="margin: 0px 0px 25px 0px"
+                >记住密码</el-checkbox
+            >
+            <el-form-item style="width: 100%">
+                <el-button
+                    :loading="loading"
+                    size="medium"
+                    type="primary"
+                    style="width: 100%"
+                    @click.native.prevent="handleLogin"
+                >
+                    <span v-if="!loading">登 录</span>
+                    <span v-else>登 录 中...</span>
+                </el-button>
+                <div style="float: right" v-if="register">
+                    <router-link class="link-type" :to="'/register'"
+                        >立即注册</router-link
+                    >
+                </div>
+            </el-form-item>
+        </el-form>
+        <!--  底部  -->
+        <div class="el-login-footer">
+            <span>© 2025 智慧图档管理系统. All rights reserved.</span>
         </div>
-      </el-form-item>
-      <el-checkbox v-model="loginForm.rememberMe" style="margin:0px 0px 25px 0px;">记住密码</el-checkbox>
-      <el-form-item style="width:100%;">
-        <el-button
-          :loading="loading"
-          size="medium"
-          type="primary"
-          style="width:100%;"
-          @click.native.prevent="handleLogin"
-        >
-          <span v-if="!loading">登 录</span>
-          <span v-else>登 录 中...</span>
-        </el-button>
-        <div style="float: right;" v-if="register">
-          <router-link class="link-type" :to="'/register'">立即注册</router-link>
-        </div>
-      </el-form-item>
-    </el-form>
-    <!--  底部  -->
-    <div class="el-login-footer">
-      <span>© 2025 智慧图档管理系统. All rights reserved.</span>
     </div>
-  </div>
 </template>
 
 <script>
-import { getCodeImg } from "@/api/login"
-import Cookies from "js-cookie"
+import { getCodeImg } from '@/api/login'
+import Cookies from 'js-cookie'
 import { encrypt, decrypt } from '@/utils/jsencrypt'
 import { getSystemConfigApi } from '@/utils/systemConfig'
 
 export default {
-  name: "Login",
-  data() {
-    return {
-      title: process.env.VUE_APP_TITLE,
-      codeUrl: "",
-      loginForm: {
-        username: "",
-        password: "",
-        rememberMe: false,
-        code: "",
-        uuid: ""
-      },
-      loginRules: {
-        username: [
-          { required: true, trigger: "blur", message: "请输入您的账号" }
-        ],
-        password: [
-          { required: true, trigger: "blur", message: "请输入您的密码" }
-        ],
-        code: [{ required: true, trigger: "change", message: "请输入验证码" }]
-      },
-      loading: false,
-      // 验证码开关
-      captchaEnabled: true,
-      // 注册开关
-      register: false,
-      redirect: undefined
-    }
-  },
-  watch: {
-    $route: {
-      handler: function(route) {
-        this.redirect = route.query && route.query.redirect
-      },
-      immediate: true
-    }
-  },
-  created() {
-    this.getSystemConfig()
-    this.getCode()
-    this.getCookie()
-  },
-  methods: {
-   async getSystemConfig(){
-      await getSystemConfigApi();
-    },
-    async getCode() {
-      await getCodeImg().then(res => {
-        this.captchaEnabled = res.captchaEnabled === undefined ? true : res.captchaEnabled
-        if (this.captchaEnabled) {
-          this.codeUrl = "data:image/gif;base64," + res.img
-          this.loginForm.uuid = res.uuid
+    name: 'Login',
+    data() {
+        return {
+            title: process.env.VUE_APP_TITLE,
+            codeUrl: '',
+            loginForm: {
+                username: '',
+                password: '',
+                rememberMe: false,
+                code: '',
+                uuid: '',
+            },
+            loginRules: {
+                username: [
+                    {
+                        required: true,
+                        trigger: 'blur',
+                        message: '请输入您的账号',
+                    },
+                ],
+                password: [
+                    {
+                        required: true,
+                        trigger: 'blur',
+                        message: '请输入您的密码',
+                    },
+                ],
+                code: [
+                    {
+                        required: true,
+                        trigger: 'change',
+                        message: '请输入验证码',
+                    },
+                ],
+            },
+            loading: false,
+            // 验证码开关
+            captchaEnabled: true,
+            // 注册开关
+            register: false,
+            redirect: undefined,
         }
-      })
     },
-    getCookie() {
-      const username = Cookies.get("username")
-      const password = Cookies.get("password")
-      const rememberMe = Cookies.get('rememberMe')
-      this.loginForm = {
-        username: username === undefined ? this.loginForm.username : username,
-        password: password === undefined ? this.loginForm.password : decrypt(password),
-        rememberMe: rememberMe === undefined ? false : Boolean(rememberMe)
-      }
+    watch: {
+        $route: {
+            handler: function (route) {
+                this.redirect = route.query && route.query.redirect
+            },
+            immediate: true,
+        },
     },
-    handleLogin() {
-      this.$refs.loginForm.validate(valid => {
-        if (valid) {
-          this.loading = true
-          if (this.loginForm.rememberMe) {
-            Cookies.set("username", this.loginForm.username, { expires: 30 })
-            Cookies.set("password", encrypt(this.loginForm.password), { expires: 30 })
-            Cookies.set('rememberMe', this.loginForm.rememberMe, { expires: 30 })
-          } else {
-            Cookies.remove("username")
-            Cookies.remove("password")
-            Cookies.remove('rememberMe')
-          }
-          this.$store.dispatch("Login", this.loginForm).then(() => {
-            this.$router.push({ path: this.redirect || "/" }).catch(()=>{})
-          }).catch(() => {
-            this.loading = false
-            if (this.captchaEnabled) {
-              this.getCode()
+    created() {
+        this.getSystemConfig()
+        this.getCode()
+        this.getCookie()
+    },
+    methods: {
+        async getSystemConfig() {
+            await getSystemConfigApi()
+        },
+        async getCode() {
+            await getCodeImg().then((res) => {
+                this.captchaEnabled =
+                    res.captchaEnabled === undefined ? true : res.captchaEnabled
+                if (this.captchaEnabled) {
+                    this.codeUrl = 'data:image/gif;base64,' + res.img
+                    this.loginForm.uuid = res.uuid
+                }
+            })
+        },
+        getCookie() {
+            const username = Cookies.get('username')
+            const password = Cookies.get('password')
+            const rememberMe = Cookies.get('rememberMe')
+            this.loginForm = {
+                username:
+                    username === undefined ? this.loginForm.username : username,
+                password:
+                    password === undefined
+                        ? this.loginForm.password
+                        : decrypt(password),
+                rememberMe:
+                    rememberMe === undefined ? false : Boolean(rememberMe),
             }
-          })
-        }
-      })
-    }
-  }
+        },
+        handleLogin() {
+            this.$refs.loginForm.validate((valid) => {
+                if (valid) {
+                    this.loading = true
+                    if (this.loginForm.rememberMe) {
+                        Cookies.set('username', this.loginForm.username, {
+                            expires: 30,
+                        })
+                        Cookies.set(
+                            'password',
+                            encrypt(this.loginForm.password),
+                            { expires: 30 },
+                        )
+                        Cookies.set('rememberMe', this.loginForm.rememberMe, {
+                            expires: 30,
+                        })
+                    } else {
+                        Cookies.remove('username')
+                        Cookies.remove('password')
+                        Cookies.remove('rememberMe')
+                    }
+                    this.$store
+                        .dispatch('Login', this.loginForm)
+                        .then(() => {
+                            this.$router
+                                .push({ path: this.redirect || '/' })
+                                .catch(() => {})
+                        })
+                        .catch(() => {
+                            this.loading = false
+                            if (this.captchaEnabled) {
+                                this.getCode()
+                            }
+                        })
+                }
+            })
+        },
+    },
 }
 </script>
 
 <style rel="stylesheet/scss" lang="scss">
 .login {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  height: 100%;
-  background: #fff;
-  background-image: url("../assets/images/login-background.jpg");
-  background-repeat: no-repeat;
-  background-position: left center;
-  background-size: contain;
-  position: relative;
-  
-  &::before {
-    content: '';
-    position: absolute;
-    top: 0;
-    left: 0;
-    right: 0;
-    bottom: 0;
-    // background: linear-gradient(135deg, rgba(0, 110, 107, 0.1) 0%, rgba(0, 110, 107, 0.05) 100%);
-    z-index: 0;
-  }
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    height: 100%;
+    background: #fff;
+    background-image: url('../assets/images/login-background.jpg');
+    background-repeat: no-repeat;
+    background-position: left center;
+    background-size: contain;
+    position: relative;
+
+    &::before {
+        content: '';
+        position: absolute;
+        top: 0;
+        left: 0;
+        right: 0;
+        bottom: 0;
+        // background: linear-gradient(135deg, rgba(0, 110, 107, 0.1) 0%, rgba(0, 110, 107, 0.05) 100%);
+        z-index: 0;
+    }
 }
 
 .title {
-  margin: 0px auto 20px auto;
-  font-weight: bold;
-  text-align: left;
-  color: #060F2E;
-  font-size: 28px;
-  text-shadow: 0 2px 4px rgba(0,0,0,0.1);
-  position: relative;
-  z-index: 1;
+    margin: 0px auto 20px auto;
+    font-weight: bold;
+    text-align: left;
+    color: #060f2e;
+    font-size: 28px;
+    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
+    position: relative;
+    z-index: 1;
 }
 
 .login-form {
-  border-radius: 12px;
-  background: #ffffff;
-  backdrop-filter: blur(10px);
-  width: 600px;
-  padding: 40px 30px 30px 30px;
-  z-index: 1;
-  margin-left: 58%;
-  box-shadow: 0 15px 35px rgba(0, 0, 0, 0.15);
-  border: 1px solid rgba(0, 110, 107, 0.1);
-  position: relative;
-  
-  &::before {
-    content: '';
-    position: absolute;
-    top: 0;
-    left: 0;
-    right: 0;
-    height: 4px;
-    background: linear-gradient(90deg, #006E6B 0%, #008B8B 100%);
-    border-radius: 12px 12px 0 0;
-  }
-  
-  .el-input {
-    height: 42px;
-    margin: 8px 0;
+    border-radius: 12px;
+    background: #ffffff;
+    backdrop-filter: blur(10px);
+    width: 600px;
+    padding: 40px 30px 30px 30px;
+    z-index: 1;
+    margin-left: 58%;
+    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.15);
+    border: 1px solid rgba(0, 110, 107, 0.1);
     position: relative;
-    
-    .el-input__inner {
-      height: 42px;
-      border-radius: 8px;
-      border: 2px solid #e1e5e9;
-      padding-left: 40px;
-      font-size: 14px;
-      transition: all 0.3s ease;
-      background: #ffffff;
-      
-      &:focus {
-        border-color: #006E6B;
-        box-shadow: 0 0 0 3px rgba(0, 110, 107, 0.1);
-        background: #ffffff;
-      }
-      
-      &:hover {
-        border-color: #008B8B;
-      }
+
+    &::before {
+        content: '';
+        position: absolute;
+        top: 0;
+        left: 0;
+        right: 0;
+        height: 4px;
+        background: linear-gradient(90deg, #006e6b 0%, #008b8b 100%);
+        border-radius: 12px 12px 0 0;
     }
-    
-    .el-input__prefix {
-      position: absolute;
-      left: 12px;
-      top: 50%;
-      transform: translateY(-50%);
-      z-index: 1;
+
+    .el-input {
+        height: 42px;
+        margin: 8px 0;
+        position: relative;
+
+        .el-input__inner {
+            height: 42px;
+            border-radius: 8px;
+            border: 2px solid #e1e5e9;
+            padding-left: 40px;
+            font-size: 14px;
+            transition: all 0.3s ease;
+            background: #ffffff;
+
+            &:focus {
+                border-color: #006e6b;
+                box-shadow: 0 0 0 3px rgba(0, 110, 107, 0.1);
+                background: #ffffff;
+            }
+
+            &:hover {
+                border-color: #008b8b;
+            }
+        }
+
+        .el-input__prefix {
+            position: absolute;
+            left: 12px;
+            top: 50%;
+            transform: translateY(-50%);
+            z-index: 1;
+        }
     }
-  }
-  
-  .input-icon {
-    height: 16px;
-    width: 16px;
-    margin-left: 0;
-    color: #999;
-    transition: color 0.3s ease;
-    position: absolute;
-    top: 50%;
-    left: 12px;
-    transform: translateY(-50%);
-  }
-  
-  .el-form-item {
-    margin-bottom: 20px;
-  }
-  
-  .el-checkbox {
-    margin-bottom: 20px;
-    
-    .el-checkbox__label {
-      color: #666;
-      font-size: 14px;
+
+    .input-icon {
+        height: 16px;
+        width: 16px;
+        margin-left: 0;
+        color: #999;
+        transition: color 0.3s ease;
+        position: absolute;
+        top: 50%;
+        left: 12px;
+        transform: translateY(-50%);
     }
-    
-    .el-checkbox__input.is-checked .el-checkbox__inner {
-      background-color: #006E6B;
-      border-color: #006E6B;
+
+    .el-form-item {
+        margin-bottom: 20px;
     }
-  }
-  
-  .el-button {
-    height: 42px;
-    border-radius: 8px;
-    font-size: 16px;
-    font-weight: 600;
-    background: linear-gradient(135deg, #006E6B 0%, #008B8B 100%);
-    border: none;
-    transition: transform 0.2s ease, box-shadow 0.2s ease;
-    will-change: transform;
-    
-    &:hover {
-      transform: translateY(-1px);
-      box-shadow: 0 4px 12px rgba(0, 110, 107, 0.25);
+
+    .el-checkbox {
+        margin-bottom: 20px;
+
+        .el-checkbox__label {
+            color: #666;
+            font-size: 14px;
+        }
+
+        .el-checkbox__input.is-checked .el-checkbox__inner {
+            background-color: #006e6b;
+            border-color: #006e6b;
+        }
     }
-    
-    &:active {
-      transform: translateY(0);
-      box-shadow: 0 2px 6px rgba(0, 110, 107, 0.2);
+
+    .el-button {
+        height: 42px;
+        border-radius: 8px;
+        font-size: 16px;
+        font-weight: 600;
+        background: linear-gradient(135deg, #006e6b 0%, #008b8b 100%);
+        border: none;
+        transition: transform 0.2s ease, box-shadow 0.2s ease;
+        will-change: transform;
+
+        &:hover {
+            transform: translateY(-1px);
+            box-shadow: 0 4px 12px rgba(0, 110, 107, 0.25);
+        }
+
+        &:active {
+            transform: translateY(0);
+            box-shadow: 0 2px 6px rgba(0, 110, 107, 0.2);
+        }
     }
-  }
-  
-  .link-type {
-    color: #006E6B;
-    text-decoration: none;
-    font-size: 14px;
-    transition: color 0.3s ease;
-    
-    &:hover {
-      color: #008B8B;
-      text-decoration: underline;
+
+    .link-type {
+        color: #006e6b;
+        text-decoration: none;
+        font-size: 14px;
+        transition: color 0.3s ease;
+
+        &:hover {
+            color: #008b8b;
+            text-decoration: underline;
+        }
     }
-  }
 }
 
 .login-tip {
-  font-size: 13px;
-  text-align: center;
-  color: #bfbfbf;
+    font-size: 13px;
+    text-align: center;
+    color: #bfbfbf;
 }
 
 .code-wrapper {
-  display: flex;
-  gap: 10px;
-  align-items: center;
-  
-  .el-input {
-    flex: 1;
-  }
+    display: flex;
+    gap: 10px;
+    align-items: center;
+
+    .el-input {
+        flex: 1;
+    }
 }
 
 .login-code {
-  width: 120px;
-  height: 42px;
-  border-radius: 8px;
-  overflow: hidden;
-  border: 2px solid #e1e5e9;
-  cursor: pointer;
-  transition: all 0.3s ease;
-  flex-shrink: 0;
-  
-  &:hover {
-    border-color: #006E6B;
-    transform: scale(1.02);
-  }
-  
-  img {
+    width: 120px;
+    height: 42px;
+    border-radius: 8px;
+    overflow: hidden;
+    border: 2px solid #e1e5e9;
     cursor: pointer;
-    vertical-align: middle;
-    width: 100%;
-    height: 100%;
-    object-fit: cover;
-  }
+    transition: all 0.3s ease;
+    flex-shrink: 0;
+
+    &:hover {
+        border-color: #006e6b;
+        transform: scale(1.02);
+    }
+
+    img {
+        cursor: pointer;
+        vertical-align: middle;
+        width: 100%;
+        height: 100%;
+        object-fit: cover;
+    }
 }
 
 .el-login-footer {
-  height: 60px;
-  line-height: 60px;
-  position: fixed;
-  bottom: 0;
-  width: 100%;
-  text-align: center;
-  color: rgba(255, 255, 255, 0.9);
-  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', 'Helvetica Neue', Helvetica, Arial, sans-serif;
-  font-size: 14px;
-  font-weight: 400;
-  letter-spacing: 0.5px;
-  background: rgba(0, 110, 107, 0.1);
-  backdrop-filter: blur(10px);
-  z-index: 1;
-  border-top: 1px solid rgba(255, 255, 255, 0.1);
+    height: 60px;
+    line-height: 60px;
+    position: fixed;
+    bottom: 0;
+    width: 100%;
+    text-align: center;
+    color: rgba(255, 255, 255, 0.9);
+    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC',
+        'Hiragino Sans GB', 'Microsoft YaHei', 'Helvetica Neue', Helvetica,
+        Arial, sans-serif;
+    font-size: 14px;
+    font-weight: 400;
+    letter-spacing: 0.5px;
+    background: rgba(0, 110, 107, 0.1);
+    backdrop-filter: blur(10px);
+    z-index: 1;
+    border-top: 1px solid rgba(255, 255, 255, 0.1);
 }
 
 .login-code-img {
-  height: 42px;
+    height: 42px;
 }
 
 // 响应式优化
 @media (max-width: 1200px) {
-  .login-form {
-    margin-left: 50%;
-    width: 500px;
-  }
+    .login-form {
+        margin-left: 50%;
+        width: 500px;
+    }
 }
 
 @media (max-width: 768px) {
-  .login {
-    background-position: center;
-  }
-  
-  .login-form {
-    margin-left: 0;
-    width: 90%;
-    max-width: 400px;
-    padding: 30px 20px;
-  }
-  
-  .title {
-    font-size: 24px;
-    text-align: center;
-  }
+    .login {
+        background-position: center;
+    }
+
+    .login-form {
+        margin-left: 0;
+        width: 90%;
+        max-width: 400px;
+        padding: 30px 20px;
+    }
+
+    .title {
+        font-size: 24px;
+        text-align: center;
+    }
 }
 
 @media (max-width: 480px) {
-  .login-form {
-    width: 95%;
-    padding: 25px 15px;
-  }
-  
-  .title {
-    font-size: 20px;
-  }
+    .login-form {
+        width: 95%;
+        padding: 25px 15px;
+    }
+
+    .title {
+        font-size: 20px;
+    }
 }
 </style>