首页 发现 帮助
注册 登录
genlitex
/
prototype_design
1
0
派生 0
文件 工单管理 0 合并请求 0 Wiki
浏览代码

admin-2025-02-16 10:00:36

genlitex 3 月之前
父节点
2fe6328056
当前提交
c4c3a5f375
共有 4 个文件被更改，包括 37 次插入 和 12 次删除
合并视图 显示文件统计
  1. 1 0
      components.d.ts
  2. 10 10
      index.html
  3. 16 0
      src/styles.css
  4. 10 2
      src/views/LoginView.vue

+ 1 - 0
components.d.ts
查看文件 

@@ -8,6 +8,7 @@ export {}
 
 declare module 'vue' {
 
 declare module 'vue' {
 
   export interface GlobalComponents {
 
   export interface GlobalComponents {
 
     AButton: typeof import('ant-design-vue/es')['Button']
 
     AButton: typeof import('ant-design-vue/es')['Button']
 
+    ACheckbox: typeof import('ant-design-vue/es')['Checkbox']
 
     AForm: typeof import('ant-design-vue/es')['Form']
 
     AForm: typeof import('ant-design-vue/es')['Form']
 
     AFormItem: typeof import('ant-design-vue/es')['FormItem']
 
     AFormItem: typeof import('ant-design-vue/es')['FormItem']
 
     AInput: typeof import('ant-design-vue/es')['Input']
 
     AInput: typeof import('ant-design-vue/es')['Input']

+ 10 - 10
index.html
查看文件 

@@ -1,12 +1,12 @@
 
-<!doctype html>
 
+<!DOCTYPE html>
 
 <html lang="en">
 
 <html lang="en">
 
-  <head>
 
-    <meta charset="UTF-8" />
 
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
 
-    <title>Prototype Design</title>
 
-  </head>
 
-  <body>
 
-    <div id="app"></div>
 
-    <script type="module" src="/src/main.js"></script>
 
-  </body>
 
+<head>
 
+  <meta charset="UTF-8">
 
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
+  <title>Login Page</title>
 
+  <link rel="stylesheet" href="./styles.css">
 
+</head>
 
+<body>
 
+  <div id="app"></div>
 
+</body>
 
 </html>
 
 </html>

+ 16 - 0
src/styles.css
查看文件 

@@ -0,0 +1,16 @@
 
+@keyframes gradientAnimation {
 
+  0% {
 
+    background: linear-gradient(135deg, #ff9a9e 0%, #fad0c4 100%);
 
+  }
 
+  50% {
 
+    background: linear-gradient(135deg, #fad0c4 0%, #ff9a9e 100%);
 
+  }
 
+  100% {
 
+    background: linear-gradient(135deg, #ff9a9e 0%, #fad0c4 100%);
 
+  }
 
+}
 
+
 
+.login {
 
+  background: linear-gradient(135deg, #ff9a9e 0%, #fad0c4 100%);
 
+  animation: gradientAnimation 10s ease infinite;
 
+}

+ 10 - 2
src/views/LoginView.vue
查看文件 

@@ -1,5 +1,5 @@
 
 <template>
 
 <template>
 
-  <div class="login">
 
+  <div class="login" style="background-color: #DDA0DD;">
 
     <a-form
 
     <a-form
 
       :model="formState"
 
       :model="formState"
 
       :rules="rules"
 
       :rules="rules"
 
@@ -11,6 +11,9 @@
 
       <a-form-item label="Password" prop="password">
 
       <a-form-item label="Password" prop="password">
 
         <a-input-password v-model:value="formState.password" placeholder="Enter your password" />
 
         <a-input-password v-model:value="formState.password" placeholder="Enter your password" />
 
       </a-form-item>
 
       </a-form-item>
 
+      <a-form-item>
 
+        <a-checkbox v-model:checked="formState.rememberMe">Remember me</a-checkbox>
 
+      </a-form-item>
 
       <a-button type="primary" html-type="submit">Submit</a-button>
 
       <a-button type="primary" html-type="submit">Submit</a-button>
 
     </a-form>
 
     </a-form>
 
   </div>
 
   </div>
 
@@ -23,7 +26,8 @@ const router = useRouter();
 
 
 
 const formState = reactive({
 
 const formState = reactive({
 
   username: '',
 
   username: '',
 
-  password: ''
 
+  password: '',
 
+  rememberMe: false // Add rememberMe field
 
 });
 
 });
 
 
 
 const rules = {
 
 const rules = {
 
@@ -38,5 +42,9 @@ const rules = {
 
 const handleSubmit = () => {
 
 const handleSubmit = () => {
 
   // Handle form submission logic here
 
   // Handle form submission logic here
 
   console.log('Form submitted:', formState);
 
   console.log('Form submitted:', formState);
 
+  // Add remember me logic here
 
+  if (formState.rememberMe) {
 
+    localStorage.setItem('rememberMe', JSON.stringify(formState));
 
+  }
 
 };
 
 };
 
 </script>
 
 </script>