增加两清三化

src/permission.js

@@ -6,8 +6,8 @@ import { getToken } from '@/utils/auth'
 
 NProgress.configure({ showSpinner: false })
 
-const whiteList = ['/index','/login', '/auth-redirect', '/bind', '/register','/news/index','/notice/index','/supply/index'
-,'/interaction/index','/register/index','/register/registerType','/register/userRegister','/register/companyRegister']
+const whiteList = ['/index', '/login', '/auth-redirect', '/bind', '/register', '/news/index', '/notice/index', '/supply/index'
+  , '/interaction/index', '/register/index', '/register/registerType', '/register/userRegister', '/register/companyRegister', '/homestead/login']
 
 router.beforeEach((to, from, next) => {
   NProgress.start()
@@ -46,7 +46,7 @@ router.beforeEach((to, from, next) => {
       next()
     } else {
       next(`/login?redirect=${to.fullPath}`) // 否则全部重定向到登录页
-     //next('/index');
+      //next('/index');
       NProgress.done()
     }
   }

src/router/index.js

@@ -320,7 +320,20 @@ export const constantRoutes = [
       hidden: true,
     },
     component: (resolve) => require(['@/views/user/supply/supplyAdd'], resolve)
+  }, {
+    path: '/homestead/login',
+    name: 'homesteadLogin',
+    meta: {
+      title: '登录页',
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/homestead/login'], resolve)
+
+
   }
+
+
+
 ];
 
 

src/views/homestead/login.vue

@@ -0,0 +1,153 @@
+<template>
+  <div class="app-container">
+    <div class="login_header"></div>
+    <div class="login_content">
+      <div class="homestead_wrap">
+        <div class="key_title">两清三化宅基地</div>
+        <div class="slogan">随时随地管理宅基地</div>
+      </div>
+      <div class="from_wrap">
+        <div class="from_content">
+          <div class="signIn_container">
+            <div class="signIn_input_wrap">
+              <van-field
+                v-model="message"
+                autosize
+                placeholder="请输入手机号"
+              />
+            </div>
+          </div>
+          <div class="signIn_container">
+            <div class="signIn_input_wrap">
+              <van-field v-model="message" autosize placeholder="请输入密码" />
+            </div>
+          </div>
+          <div class="signIn_container">
+            <div class="signIn_input_wrap">
+              <div class="verification_code">
+                <van-field
+                  v-model="message"
+                  autosize
+                  placeholder="请输入验证码"
+                />
+              </div>
+              <div class="verification_images"></div>
+            </div>
+          </div>
+          <div class="signIn_container">
+            <div class="remember_num">
+              <van-radio-group v-model="radio">
+                <van-radio name="1" icon-size="16px" checked-color="#3CBF5B"
+                  >记住密码</van-radio
+                >
+              </van-radio-group>
+            </div>
+          </div>
+        </div>
+        <div class="from_btn">登录</div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "homesteadLogin",
+  data() {
+    return {
+      message: "",
+      radio: "2",
+    };
+  },
+  mounted() {},
+  methods: {},
+};
+</script>
+
+<style scoped lang="scss">
+.app-container {
+  display: flex;
+  width: 100vw;
+  height: 100vh;
+  flex-direction: column;
+  .login_header {
+    flex: 0.35;
+    background: url("../../assets/images/homestead/login_bg.jpg") center bottom
+      no-repeat;
+    background-size: 100% 100%;
+  }
+  .login_content {
+    flex: 0.65;
+    display: flex;
+    flex-direction: column;
+
+    .homestead_wrap {
+      flex: 0.28;
+      display: flex;
+      justify-content: center; /* 相对父元素水平居中 */
+      align-items: center; /*  子元素相对父元素垂直居中 */
+      flex-direction: column;
+      .key_title {
+        font-size: 56px;
+        margin-bottom: 10px;
+      }
+      .slogan {
+        font-size: 32px;
+        color: #9f9f9f;
+      }
+    }
+    .from_wrap {
+      flex: 0.72;
+      padding-bottom: 14%;
+      flex-direction: column;
+      display: flex;
+      margin: 0 40px;
+      .from_content {
+        flex: 1;
+        display: flex;
+        flex-direction: column;
+        padding-bottom: 14%;
+        .signIn_container {
+          flex: 1;
+          display: flex;
+          margin-bottom: 18px;
+          &:last-child {
+            margin-bottom: 0;
+          }
+          .signIn_input_wrap {
+            flex: 1;
+            display: flex;
+            .verification_code {
+              flex: 1;
+            }
+            .verification_images {
+              flex: 0 0 220px;
+              margin-left: 20px;
+            }
+            .van-cell {
+              border: 2px solid #f1f0f5;
+              border-radius: 46px;
+              font-size: 32px;
+            }
+          }
+          .remember_num {
+            margin-left: 14px;
+            font-size: 28px;
+            color: #3cbf5b;
+          }
+        }
+      }
+      .from_btn {
+        display: flex;
+        flex: 0 0 80px;
+        background: #3cbf5b;
+        border-radius: 40px;
+        font-size: 36px;
+        justify-content: center; /* 相对父元素水平居中 */
+        align-items: center; /*  子元素相对父元素垂直居中 */
+        color: #fff;
+      }
+    }
+  }
+}
+</style>