浏览代码

feature 1002776

修改登录页面背景及文字
Kevin Jiang 2 年之前
父节点
当前提交
0aba74f3cf
共有 2 个文件被更改,包括 38 次插入15 次删除
  1. 37 15
      src/views/LoginView.vue
  2. 1 0
      vite.config.ts

+ 37 - 15
src/views/LoginView.vue

@@ -49,33 +49,44 @@ const onFinishFailed = (errorInfo: any) => {
   <div class="login-main">
     <a-row type="flex">
       <a-col class="left" :flex="1">
-        <h1 class="login-title">技淘平台智慧产权大脑</h1>
+        <!-- <h1 class="login-title">技淘平台智慧产权大脑</h1> -->
          <p class="login-banner">
           <img src="@/assets/imgs/login-banner.png" />
         </p>
       </a-col>
       <a-col class="right" :flex="1">
-        <h1>用户登录</h1>
-        <a-divider></a-divider>
+        <h1>Think Logically</h1>
+        <h1>Create Reasoningly</h1>
+
+        <h2 style="margin-top: 100px;">用户登录</h2>
         <div class="login-form-wrapper">
           <a-form
             :model="formState"
             name="basic"
-            :label-col="{ span: 4 }"
-            :wrapper-col="{ span: 20 }"
+            :wrapper-col="{ span: 24 }"
             autocomplete="off"
             @finish="onFinish"
             @finishFailed="onFinishFailed"
           >
-            <a-form-item label="用户名" name="username" :rules="[{ required: true, message: '请输入用户名' }]">
-              <a-input v-model:value="formState.username" />
+            <!-- <div class="kede-input" style="margin-top: 20px; background: transparent;">
+              <a-input v-model:value="formState.username" placeholder="请输入用户名" />
+            </div>
+            <div class="kede-input" style="margin-top: 20px; background: transparent;">
+              <a-input-password v-model:value="formState.password" placeholder="请输入密码" />
+            </div>
+            <div style="margin-top: 20px;">
+              <a-button type="primary" html-type="submit" block :loading="loading">登&nbsp;&nbsp;&nbsp;&nbsp;录</a-button>
+            </div> -->
+
+            <a-form-item class="kede-input" name="username" :rules="[{ required: true, message: '请输入用户名' }]">
+              <a-input v-model:value="formState.username" placeholder="请输入用户名" />
             </a-form-item>
 
-            <a-form-item label="密码" name="password" :rules="[{ required: true, message: '请输入密码' }]">
-              <a-input-password v-model:value="formState.password" />
+            <a-form-item class="kede-input" name="password" :rules="[{ required: true, message: '请输入密码' }]">
+              <a-input-password v-model:value="formState.password" placeholder="请输入密码" />
             </a-form-item>
 
-            <a-form-item :wrapper-col="{ sm: { span: 20, offset: 4 }, xs: { span: 24, offset: 0 } }">
+            <a-form-item>
               <a-button type="primary" html-type="submit" block :loading="loading">登&nbsp;&nbsp;&nbsp;&nbsp;录</a-button>
             </a-form-item>
           </a-form>
@@ -97,9 +108,9 @@ const onFinishFailed = (errorInfo: any) => {
     text-align: center;
     padding-top: 100px;
     // background: url(@/assets/imgs/login-banner.png) no-repeat;
-    // background-size: 100% 100%;  
+    // background-size: 100% 100%;
     background: radial-gradient(circle, #0D2148, #00051E);
-    
+
     .login-title {
       color: #00A09A;
     }
@@ -121,12 +132,23 @@ const onFinishFailed = (errorInfo: any) => {
     height: 100vh;
     padding-top: 100px;
     padding-left: 60px;
-    border-top-left-radius: 1em;
-    border-bottom-left-radius: 1em;
-    background-color: #ffffff;
+    background-color: #040E2B;
+
+    h1, h2 {
+      color: #FFFFFF;
+    }
 
     .login-form-wrapper {
       width: 400px;
+
+      color: white;
+
+      .kede-input::v-deep {
+        * {
+          background: transparent;
+          color: white;
+        }
+      }
     }
   }
 }

+ 1 - 0
vite.config.ts

@@ -13,6 +13,7 @@ export default defineConfig({
     },
   },
   server: {
+    port: 5274,
     proxy: {
       '/gw': {
         target: 'http://localhost:8088',