Merge branch 'master' of https://gitee.com/mtrain/yudao-ui-admin-vue3

src/styles/index.scss

@@ -61,3 +61,13 @@ legend {
 .el-form-item__label{
   color:#1f2225;
 }
+.login-form  .el-input__wrapper{
+  border-radius: 10px;
+  line-height: 50px;
+  height: 50px;
+}
+.line{
+  background: #1e4dad;
+  height: 8px;
+  width: 52px;
+}

src/views/Login/Login.vue

@@ -5,13 +5,13 @@
   >
     <div class="relative mx-auto h-full flex">
       <div
-        :class="`${prefixCls}__left flex-1 bg-gray-500 bg-opacity-20 relative p-30px lt-xl:hidden`"
+        :class="` flex-1 bg-opacity-20 relative p-30px lt-xl:hidden`"
       >
         <!-- 左上角的 logo + 系统标题 -->
-        <div class="relative flex items-center text-white">
+        <!-- <div class="relative flex items-center text-white">
           <img alt="" class="mr-10px h-48px w-48px" src="@/assets/imgs/logo.png" />
           <span class="text-20px font-bold">{{ underlineToHump(appStore.getTitle) }}</span>
-        </div>
+        </div> -->
         <!-- 左边的背景图 + 欢迎语 -->
         <div class="h-[calc(100%-60px)] flex items-center justify-center">
           <TransitionGroup
@@ -20,10 +20,10 @@
             tag="div"
           >
             <img key="1" alt="" class="w-350px" src="@/assets/svgs/login-box-bg.svg" />
-            <div key="2" class="text-3xl text-white">{{ t('login.welcome') }}</div>
+            <!-- <div key="2" class="text-3xl text-white">{{ t('login.welcome') }}</div>
             <div key="3" class="mt-5 text-14px font-normal text-white">
               {{ t('login.message') }}
-            </div>
+            </div> -->
           </TransitionGroup>
         </div>
       </div>
@@ -32,10 +32,10 @@
         <div
           class="flex items-center justify-between text-white at-2xl:justify-end at-xl:justify-end"
         >
-          <div class="flex items-center at-2xl:hidden at-xl:hidden">
+          <!-- <div class="flex items-center at-2xl:hidden at-xl:hidden">
             <img alt="" class="mr-10px h-48px w-48px" src="@/assets/imgs/logo.png" />
             <span class="text-20px font-bold">{{ underlineToHump(appStore.getTitle) }}</span>
-          </div>
+          </div> -->
           <div class="flex items-center justify-end space-x-10px">
             <ThemeSwitch />
             <LocaleDropdown class="dark:text-white lt-xl:text-white" />
@@ -94,11 +94,19 @@ $prefix-cls: #{$namespace}-login;
       z-index: -1;
       width: 100%;
       height: 100%;
-      background-image: url('@/assets/svgs/login-bg.svg');
+      // background-image: url('@/assets/svgs/login-bg.svg');
-      background-position: center;
+      // background-position: center;
-      background-repeat: no-repeat;
+      // background-repeat: no-repeat;
-      content: '';
+      // content: '';
     }
   }
 }
+.v-login{
+  overflow: hidden;
+  background-image: url('@/assets/imgs/icon_bg.png');
+  background-size: cover;
+    width: 100%;
+    height: 100vh;
+    justify-content: center;
+}
 </style>

src/views/Login/components/LoginForm.vue

@@ -1,14 +1,6 @@
 <template>
-  <el-form
+  <el-form v-show="getShow" ref="formLogin" :model="loginData.loginForm" :rules="LoginRules" class="login-form"
-    v-show="getShow"
+    label-position="top" label-width="120px" size="large">
-    ref="formLogin"
-    :model="loginData.loginForm"
-    :rules="LoginRules"
-    class="login-form"
-    label-position="top"
-    label-width="120px"
-    size="large"
-  >
     <el-row style="margin-right: -10px; margin-left: -10px">
       <el-col :span="24" style="padding-right: 10px; padding-left: 10px">
         <el-form-item>
@@ -17,40 +9,23 @@
       </el-col>
       <el-col :span="24" style="padding-right: 10px; padding-left: 10px">
         <el-form-item v-if="loginData.tenantEnable === 'true'" prop="tenantName">
-          <el-input
+          <el-input v-model="loginData.loginForm.tenantName" :placeholder="t('login.tenantNamePlaceholder')"
-            v-model="loginData.loginForm.tenantName"
+            :prefix-icon="iconHouse" link type="primary" />
-            :placeholder="t('login.tenantNamePlaceholder')"
-            :prefix-icon="iconHouse"
-            link
-            type="primary"
-          />
         </el-form-item>
       </el-col>
       <el-col :span="24" style="padding-right: 10px; padding-left: 10px">
         <el-form-item prop="username">
-          <el-input
+          <el-input v-model="loginData.loginForm.username" :placeholder="t('login.usernamePlaceholder')"
-            v-model="loginData.loginForm.username"
+            :prefix-icon="iconAvatar" />
-            :placeholder="t('login.usernamePlaceholder')"
-            :prefix-icon="iconAvatar"
-          />
         </el-form-item>
       </el-col>
       <el-col :span="24" style="padding-right: 10px; padding-left: 10px">
         <el-form-item prop="password">
-          <el-input
+          <el-input v-model="loginData.loginForm.password" :placeholder="t('login.passwordPlaceholder')"
-            v-model="loginData.loginForm.password"
+            :prefix-icon="iconLock" show-password type="password" @keyup.enter="getCode()" />
-            :placeholder="t('login.passwordPlaceholder')"
-            :prefix-icon="iconLock"
-            show-password
-            type="password"
-            @keyup.enter="getCode()"
-          />
         </el-form-item>
       </el-col>
-      <el-col
+      <el-col :span="24" style="padding-right: 10px; padding-left: 10px; margin-top: -20px; margin-bottom: -20px">
-        :span="24"
-        style="padding-right: 10px; padding-left: 10px; margin-top: -20px; margin-bottom: -20px"
-      >
         <el-form-item>
           <el-row justify="space-between" style="width: 100%">
             <el-col :span="6">
@@ -64,24 +39,13 @@
           </el-row>
         </el-form-item>
       </el-col>
-      <el-col :span="24" style="padding-right: 10px; padding-left: 10px">
+      <el-col :span="24" style="padding-right: 10px; padding-left: 10px;">
         <el-form-item>
-          <XButton
+          <XButton :loading="loginLoading" :title="t('login.login')" class="w-[100%]" type="primary" @click="getCode()"  style="height:50px;;line-height:50px;    border-radius: 10px;"/>
-            :loading="loginLoading"
-            :title="t('login.login')"
-            class="w-[100%]"
-            type="primary"
-            @click="getCode()"
-          />
         </el-form-item>
       </el-col>
-      <Verify
+      <Verify ref="verify" :captchaType="captchaType" :imgSize="{ width: '400px', height: '200px' }" mode="pop"
-        ref="verify"
+        @success="handleLogin" />
-        :captchaType="captchaType"
-        :imgSize="{ width: '400px', height: '200px' }"
-        mode="pop"
-        @success="handleLogin"
-      />
       <!--      <el-col :span="24" style="padding-right: 10px; padding-left: 10px">
         <el-form-item>
           <el-row :gutter="5" justify="space-between" style="width: 100%">
@@ -345,4 +309,13 @@ onMounted(() => {
     cursor: pointer;
   }
 }
+
+.login-form {
+  background: #fffeff;
+  box-shadow: 0 0 20px #5f82e726;
+  border-radius: 10px;
+  padding: 40px;
+ 
+}
+
 </style>

src/views/Login/components/LoginFormTitle.vue

@@ -1,7 +1,13 @@
 <template>
-  <h2 class="enter-x mb-3 text-center text-2xl font-bold xl:text-center xl:text-3xl">
+  <div style="    display: flex;
-    {{ getFormTitle }}
+    flex-direction: column;
-  </h2>
+    align-items: center;">
+    <div class="enter-x mb-3 text-center text-2xl font-bold xl:text-center xl:text-3xl">
+      科研管理系统
+      <!-- {{ getFormTitle }} -->
+    </div>
+    <!-- <div class="line"></div> -->
+  </div>
 </template>
 <script lang="ts" setup>
 import { LoginStateEnum, useLoginState } from './useLogin'