build: 登录功能完成

src/api/login.js

@@ -3,10 +3,10 @@
  * @Author: youme
  * @LastEditors: youme
  * @Date: 2020-04-20 09:36:15
- * @LastEditTime: 2020-04-30 09:09:19
+ * @LastEditTime: 2020-04-30 15:08:57
  */
 import { stringify } from 'qs'
-// import { setHeader } from '../utils/models'
+import { setHeader } from '../utils/models'
 import request from '../utils/request'
 
 /**
@@ -39,3 +39,13 @@ export async function onLogin(params) {
     data: params
   })
 }
+
+/**
+ * @description 获取用户可查看菜单
+ */
+export async function renderMenusLoginUser(params) {
+  const headers = setHeader()
+  return request(`/platform/web/renderMenusLoginUser?${stringify(params)}`, {
+    headers
+  })
+}

src/layouts/LoginLayout.vue

@@ -0,0 +1,93 @@
+<!--
+ * @Description:登录注册页面的通用布局
+ * @Author: youme
+ * @LastEditors: youme
+ * @Date: 2020-05-06 09:30:27
+ * @LastEditTime: 2020-05-06 09:48:04
+ -->
+<template>
+  <div class="login-wrap">
+    <div class="login-title" :class="{easeOut: accessToken}">SWEET-MIND</div>
+    <div class="login-form" :class="{zoomOut: accessToken}">
+      <router-view />
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  computed: {
+    accessToken() {
+      return this.$store.state.login.access_token
+    }
+  }
+}
+</script>
+
+<style lang="scss">
+.login-wrap {
+  height: 100vh;
+  background: url('../assets/login_images/cover.jpeg') 0 / cover fixed;
+  .login-title {
+    position: absolute;
+    top: 50%;
+    width: 100%;
+    margin-top: -230px;
+    text-align: center;
+    font-size: 30px;
+    color: #fff;
+    text-shadow: 2px 2px 3px #000;
+    transition-duration: 2s;
+    &.easeOut {
+      -webkit-transform: translateY(190px);
+      -ms-transform: translateY(190px);
+      transform: translateY(190px);
+    }
+  }
+  .login-form {
+    position: absolute;
+    left: 50%;
+    top: 50%;
+    width: 420px;
+    min-height: 270px;
+    margin: -165px 0 0 -210px;
+    padding: 40px;
+    border-radius: 5px;
+    box-shadow: inset 0 0 0 1px hsla(0, 0%, 100%, 0.3), 0 0.5em 1em rgba(0, 0, 0, 0.6);
+    background: hsla(0, 0%, 100%, 0.25);
+    overflow: hidden;
+    box-sizing: border-box;
+    &::before {
+      background: url('../assets/login_images/cover.jpeg') 0 / cover fixed;
+      content: '';
+      position: absolute;
+      top: 0;
+      right: 0;
+      left: 0;
+      bottom: 0;
+      margin: -30px;
+      z-index: 0;
+      filter: blur(1px);
+    }
+  }
+  .zoomOut {
+    animation-duration: 1.5s;
+    animation-fill-mode: both;
+    animation-name: zoomOut;
+  }
+  @keyframes zoomOut {
+    0% {
+      opacity: 1;
+    }
+
+    50% {
+      opacity: 0;
+      transform: scale3d(0.3, 0.3, 0.3);
+    }
+
+    to {
+      opacity: 0;
+    }
+  }
+}
+</style>

src/layouts/UserLayout.vue

@@ -0,0 +1,23 @@
+<!--
+ * @Description:基础页面布局
+ * @Author: youme
+ * @LastEditors: youme
+ * @Date: 2020-05-06 08:26:02
+ * @LastEditTime: 2020-05-06 10:20:58
+ -->
+<template>
+  <div>
+    <div>123</div>
+    <router-view />
+  </div>
+</template>
+
+<script>
+export default {
+
+}
+</script>
+
+<style scope>
+
+</style>

src/layouts/index.vue

@@ -0,0 +1,41 @@
+<!--
+ * @Description:基础布局权限
+ * @Author: youme
+ * @LastEditors: youme
+ * @Date: 2020-05-06 08:26:02
+ * @LastEditTime: 2020-05-06 10:20:03
+ -->
+<template>
+  <div>
+    <div v-if="typeof this.userName === 'undefined'" class="placeholder" v-loading="true"/>
+    <user-layout/>
+  </div>
+</template>
+
+<script>
+import UserLayout from './UserLayout'
+
+export default {
+  components: { UserLayout },
+  created() {
+    this.$store.dispatch('user/saveCurrentUser')
+  },
+  mounted() {
+    console.log(this.userName)
+    if (!this.userName && typeof this.userName !== 'undefined' && this.userName !== 0) {
+      this.$router.push('/user')
+    }
+  },
+  computed: {
+    userName() {
+      return this.$store.state.user.currentUser.name
+    }
+  }
+}
+</script>
+
+<style scope>
+.placeholder {
+  height: 100%;
+}
+</style>

src/router/index.js

@@ -3,19 +3,33 @@
  * @Author: youme
  * @LastEditors: youme
  * @Date: 2020-04-23 14:58:31
- * @LastEditTime: 2020-04-29 08:31:16
+ * @LastEditTime: 2020-05-06 10:00:55
  */
 import Vue from 'vue'
 import Router from 'vue-router'
+import system from './system'
 
 Vue.use(Router)
 
 export default new Router({
   routes: [
+    {
+      path: '/user',
+      component: () => import('@/layouts/LoginLayout'),
+      redirect: '/user/login',
+      children: [
+        {
+          path: 'login',
+          component: () => import('@/views/Login')
+        }
+      ]
+    },
     {
       path: '/',
-      name: 'Login',
-      component: () => import('@/views/Login')
+      component: () => import('@/layouts'),
+      children: [
+        system
+      ]
     }
   ]
 })

src/router/system.js

@@ -0,0 +1,11 @@
+/*
+ * @Description:系统管理路由
+ * @Author: youme
+ * @LastEditors: youme
+ * @Date: 2020-05-06 09:58:55
+ * @LastEditTime: 2020-05-06 10:15:11
+ */
+export default {
+  path: 'login',
+  component: () => import('@/views/log')
+}