cxw-010203

src/router/index.js

@@ -1,7 +1,7 @@
 /*
  * @Author: your name
  * @Date: 2021-10-08 09:26:29
- * @LastEditTime: 2021-10-19 11:59:59
+ * @LastEditTime: 2021-10-19 16:03:49
  * @LastEditors: Please set LastEditors
  * @Description: In User Settings Edit
  * @FilePath: /data-show/src/router/index.js
@@ -28,6 +28,7 @@ import BrandComparison from "@/views/BrandComparison"
 import EventInsight from "@/views/EventInsight"
 import EventComparison from "@/views/EventComparison"
 import Login from "@/views/Login"
+import EventDEC from "@/views/EventDEC"
 const router = [
     {
         path: '/login',
@@ -106,6 +107,12 @@ const router = [
                 desc: "事件对比",
                 component: EventComparison
             },
+            {
+                path: '/eventDEC',
+                name: "eventDEC",
+                desc: "事件详情",
+                component: EventDEC
+            },
         ]
     },
    

src/views/EventDEC/index.vue

@@ -0,0 +1,21 @@
+<!--
+ * @Author: your name
+ * @Date: 2021-10-19 15:57:11
+ * @LastEditTime: 2021-10-19 16:02:58
+ * @LastEditors: Please set LastEditors
+ * @Description: In User Settings Edit
+ * @FilePath: /data-show/src/views/EventDEC/index.vue
+-->
+<template>
+    <div class="d-container">
+        
+    </div>
+</template>
+<script>
+export default {
+    name: "eventDEC"
+}
+</script>
+<style lang="less" scoped>
+
+</style>

src/views/Login/forgetPWD/index.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: your name
  * @Date: 2021-10-19 14:45:23
- * @LastEditTime: 2021-10-19 15:39:55
+ * @LastEditTime: 2021-10-19 16:25:16
  * @LastEditors: Please set LastEditors
  * @Description: In User Settings Edit
  * @FilePath: /data-show/src/views/Login/forgetPWD/index.vue
@@ -9,7 +9,7 @@
 <template>
     <div class="fpwd-outter">
         <span class="fpw-label">忘记密码</span>
-        <a-form-model layout="horizontal" :model="form" :rules="rules">
+        <a-form-model layout="horizontal" :model="form" :rules="rules" ref="forgetForm">
             <a-form-model-item label="手机号码" prop="phone">
                 <a-input v-model="form.phone" placeholder="手机号码" />
             </a-form-model-item>
@@ -23,6 +23,9 @@
         <div class="fpw-d1">
             <span class="ss1" @click="reLogin">想起来了，去登录</span>
         </div>
+        <div class="fpwd-footer" @click="onNext">
+            下一步
+        </div>
     </div>
 </template>
 
@@ -85,6 +88,17 @@ export default {
         reLogin() {
             this.$emit("reLogin");
         },
+        // 下一步
+        onNext() {
+            this.$refs.forgetForm.validate((valid) => {
+                if (valid) {
+                    alert("submit!");
+                } else {
+                    console.log("error submit!!");
+                    return false;
+                }
+            });
+        }
     },
 };
 </script>
@@ -115,4 +129,18 @@ export default {
         cursor: pointer;
     }
 }
+.fpwd-footer {
+    position: absolute;
+    width: 354px;
+    height: 64px;
+    background-image: url("../../../assets/images/login/img_dlan_nor.png");
+    bottom: 0px;
+    left: 50%;
+    transform: translate(-50%);
+    cursor: pointer;
+    color: #63aecc;
+    font-size: 24px;
+    text-align: center;
+    line-height: 64px;
+}
 </style>

src/views/Login/index.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: your name
  * @Date: 2021-10-19 11:53:35
- * @LastEditTime: 2021-10-19 15:53:03
+ * @LastEditTime: 2021-10-19 16:19:02
  * @LastEditors: Please set LastEditors
  * @Description: In User Settings Edit
  * @FilePath: /data-show/src/views/Login/index.vue
@@ -24,13 +24,13 @@
 <script>
 import loginForm from "./loginForm";
 import forgetPWD from "./forgetPWD";
-import resetPassword from "./resetPassword"
+import resetPassword from "./resetPassword";
 export default {
     name: "Login",
     components: {
         loginForm,
         forgetPWD,
-        resetPassword
+        resetPassword,
     },
     data() {
         return {
@@ -43,7 +43,7 @@ export default {
         },
         handlerRelogin() {
             this.dateType = 1;
-        }
+        },
     },
 };
 </script>
@@ -78,10 +78,9 @@ export default {
         left: 50%;
         top: 50%;
         transform: translate(-50%, -60%);
-        background: rgba(12, 35, 66, 0.7);
-        box-shadow: 0px 1px 40px 0px rgba(42, 112, 206, 0.5);
-        border-radius: 8px;
-        border: 3px solid;
+        background-image: url("../../assets/images/login/img_dldt.png");
+        background-repeat: no-repeat;
+        background-size: cover;
     }
 }
 </style>

src/views/Login/loginForm/index.vue

@@ -1,14 +1,14 @@
 <!--
  * @Author: your name
  * @Date: 2021-10-19 14:14:52
- * @LastEditTime: 2021-10-19 14:47:20
+ * @LastEditTime: 2021-10-19 16:21:48
  * @LastEditors: Please set LastEditors
  * @Description: In User Settings Edit
  * @FilePath: /data-show/src/views/Login/loginForm/index.vue
 -->
 <template>
     <div class="lgf-outter">
-        <a-form-model layout="horizontal" :model="form" :rules="rules">
+        <a-form-model layout="horizontal" :model="form" :rules="rules" ref="loginForm">
             <a-form-model-item label="用户名" prop="phone">
                 <a-input v-model="form.phone" placeholder="请输入账号" />
             </a-form-model-item>
@@ -31,6 +31,9 @@
             </a-checkbox>
             <span class="stn" style="color: #3373CC" @click="forgetPassword">忘记密码</span>
         </div>
+        <div class="login-footer" @click="onSubmit">
+            登录
+        </div>
     </div>
 </template>
 
@@ -42,37 +45,40 @@ export default {
             if (value === "") {
                 callback(new Error("请输入密码"));
             } else {
-                let reg=/^(?![0-9]+$)(?![a-z]+$)(?![A-Z]+$)(?!([^(0-9a-zA-Z)])+$).{6,}$/;
+                let reg =
+                    /^(?![0-9]+$)(?![a-z]+$)(?![A-Z]+$)(?!([^(0-9a-zA-Z)])+$).{6,}$/;
                 if (!reg.test(value)) {
                     callback(new Error("密码由大小写字母、数字和特殊字符组成"));
-                } else if(value.length < 8 || value.length > 16) {
+                } else if (value.length < 8 || value.length > 16) {
                     callback(new Error("密码8~16位"));
                 } else {
                     callback();
-                } 
+                }
             }
         };
         const validateAccount = (rule, value, callback) => {
             if (value === "") {
                 callback(new Error("请输入账户"));
             } else {
-                let reg=/^[0-9a-zA-Z]*$/;
+                let reg = /^[0-9a-zA-Z]*$/;
                 if (!reg.test(value)) {
-                    callback(new Error("用户名是英文字母或英文字母与数字的组合"));
-                } else if(value.length < 8 || value.length > 13) {
-                     callback(new Error("账号在8~13位之间"));
+                    callback(
+                        new Error("用户名是英文字母或英文字母与数字的组合")
+                    );
+                } else if (value.length < 8 || value.length > 13) {
+                    callback(new Error("账号在8~13位之间"));
                 } else {
                     callback();
-                }   
+                }
             }
-        }
+        };
         const validateCode = (rule, value, callback) => {
             if (value === "") {
                 callback(new Error("请输入验证码"));
-            }  else {
-                 callback();
+            } else {
+                callback();
             }
-        }
+        };
         return {
             pwdType: "password",
             remCheck: false,
@@ -114,9 +120,20 @@ export default {
             }
         },
         //忘记密码
-        forgetPassword(){
-            this.$emit('forgetPassword')
-        }
+        forgetPassword() {
+            this.$emit("forgetPassword");
+        },
+        // 提交
+        onSubmit() {
+            this.$refs.loginForm.validate((valid) => {
+                if (valid) {
+                    alert("submit!");
+                } else {
+                    console.log("error submit!!");
+                    return false;
+                }
+            });
+        },
     },
 };
 </script>
@@ -140,4 +157,18 @@ export default {
         cursor: pointer;
     }
 }
+.login-footer {
+    position: absolute;
+    width: 354px;
+    height: 64px;
+    background-image: url("../../../assets/images/login/img_dlan_nor.png");
+    bottom: 0px;
+    left: 50%;
+    transform: translate(-50%);
+    cursor: pointer;
+    color: #63aecc;
+    font-size: 24px;
+    text-align: center;
+    line-height: 64px;
+}
 </style>

src/views/Login/resetPassword/index.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: your name
  * @Date: 2021-10-19 15:36:15
- * @LastEditTime: 2021-10-19 15:51:17
+ * @LastEditTime: 2021-10-19 16:29:17
  * @LastEditors: Please set LastEditors
  * @Description: In User Settings Edit
  * @FilePath: /data-show/src/views/Login/resetPassword/index.vue
@@ -9,7 +9,7 @@
 <template>
     <div class="rp-outter">
         <span class="fpw-label">重新设置密码</span>
-        <a-form-model layout="horizontal" :model="form" :rules="rules">
+        <a-form-model layout="horizontal" :model="form" :rules="rules" ref="resetForm">
             <a-form-model-item label="设置密码" prop="pwd1">
                 <a-input v-model="form.pwd1" placeholder="请输入新密码" />
             </a-form-model-item>
@@ -20,6 +20,9 @@
         <div class="fpw-d1">
             <span class="ss1" @click="reLogin">想起来了，去登录</span>
         </div>
+         <div class="rp-footer" @click="onSuccess">
+            完成
+        </div>
     </div>
 </template>
 
@@ -75,6 +78,17 @@ export default {
         reLogin() {
             this.$emit("reLogin");
         },
+        // 完成
+        onSuccess() {
+             this.$refs.resetForm.validate((valid) => {
+                if (valid) {
+                    alert("submit!");
+                } else {
+                    console.log("error submit!!");
+                    return false;
+                }
+            });
+        }
     },
 };
 </script>
@@ -101,4 +115,18 @@ export default {
         cursor: pointer;
     }
 }
+.rp-footer {
+    position: absolute;
+    width: 354px;
+    height: 64px;
+    background-image: url("../../../assets/images/login/img_dlan_nor.png");
+    bottom: 0px;
+    left: 50%;
+    transform: translate(-50%);
+    cursor: pointer;
+    color: #63aecc;
+    font-size: 24px;
+    text-align: center;
+    line-height: 64px;
+}
 </style>