From 440189d305f8387774edc776fba297a5f5be203c Mon Sep 17 00:00:00 2001
From: xiaoguang <aadsdas1@dingtalk.com>
Date: Mon, 9 May 2022 17:44:36 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E5=85=A8=E5=B1=80=E6=8E=A7=E5=88=B6?=
 =?UTF-8?q?=E7=99=BB=E5=BD=95=E5=BC=B9=E7=AA=97=EF=BC=8C=E6=B7=BB=E5=8A=A0?=
 =?UTF-8?q?=E5=85=A8=E5=B1=80=E7=99=BB=E5=BD=95=E6=8B=A6=E6=88=AA=E6=96=B9?=
 =?UTF-8?q?=E6=B3=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 README.md             | 13 +++++++++++++
 layouts/default.vue   | 14 +++++++++-----
 nuxt.config.js        |  3 ++-
 pages/index/index.vue |  3 +++
 plugins/vue-inject.js | 17 +++++++++++++++++
 store/index.js        |  8 ++++----
 6 files changed, 48 insertions(+), 10 deletions(-)
 create mode 100644 plugins/vue-inject.js

diff --git a/README.md b/README.md
index 7f58f4e..60d30ad 100644
--- a/README.md
+++ b/README.md
@@ -101,6 +101,19 @@ export {
   @include adj(transform, translate3d(-50%, 0, 0));
 }
 
+```
 
+## 登录相关
+```javascript
+// 访问token
+this.$store.state.token
+// 设置token
+this.$store.commit('setToken')
+// 退出登录
+this.$store.commit('setLoginOut')
+// 获取登录的用户信息
+this.$store.state.userInfo
+// 是否需要登录拦截
+this.$isLoginValidate();
 ```
 
diff --git a/layouts/default.vue b/layouts/default.vue
index 2ca99f1..f8f1e74 100644
--- a/layouts/default.vue
+++ b/layouts/default.vue
@@ -15,17 +15,21 @@
 </template>
 <script>
 import BsLogin from "@/components/BsLogin.vue";
-import { TOKEN_KEY } from "@/constants";
 import Header from "./module/header/index.vue";
 import Footer from "./module/footer/index.vue";
 
 export default {
   name: "Layout",
   components: { Header, Footer, BsLogin },
-  data() {
-    return {
-      loginVisible: true,
-    };
+  computed: {
+    loginVisible: {
+      get() {
+        return this.$store.state.loginVisible;
+      },
+      set(val) {
+        this.$store.commit("setLoginVisible", val);
+      },
+    },
   },
 };
 </script>
diff --git a/nuxt.config.js b/nuxt.config.js
index d33ba6d..5ea82b3 100644
--- a/nuxt.config.js
+++ b/nuxt.config.js
@@ -42,7 +42,8 @@ export default {
   plugins: [
     '@/plugins/element-ui',
     '@/plugins/axios',
-    '@plugins/axiosTk.js'
+    '@plugins/axiosTk.js',
+    '@plugins/vue-inject.js'
   ],
 
   // Auto import components: https://go.nuxtjs.dev/config-components
diff --git a/pages/index/index.vue b/pages/index/index.vue
index 6a4e2d6..2ddace0 100644
--- a/pages/index/index.vue
+++ b/pages/index/index.vue
@@ -17,5 +17,8 @@ import Banner from "./module/Banner.vue";
 import Seckil from "./module/Seckill.vue";
 export default {
   components: { Banner, Seckil },
+  mounted() {
+    this.$isLoginValidate();
+  },
 };
 </script>
diff --git a/plugins/vue-inject.js b/plugins/vue-inject.js
new file mode 100644
index 0000000..7d8acb5
--- /dev/null
+++ b/plugins/vue-inject.js
@@ -0,0 +1,17 @@
+import Vue from "vue";
+import { TOKEN_KEY } from "@/constants";
+
+const injectOptions = {
+  // 是否需要登录拦截
+  $isLoginValidate() {
+    if (this.$cookies.get(TOKEN_KEY)) {
+      return true;
+    }
+    this.$store.commit("setLoginVisible", true);
+    return false;
+  },
+};
+
+for (let key in injectOptions) {
+  Vue.prototype[key] = injectOptions[key];
+}
diff --git a/store/index.js b/store/index.js
index f39eb52..18f385f 100644
--- a/store/index.js
+++ b/store/index.js
@@ -12,6 +12,7 @@ const ONE_DAY = 86400000; // 一天的毫秒数 24 * 60 * 60 * 1000;
 const state = () => ({
   token: "",
   userInfo: {},
+  loginVisible: false, // 是否展示登录弹窗
 });
 const mutations = {
   setUserInfo(state, info) {
@@ -29,6 +30,9 @@ const mutations = {
     state.userInfo = {};
     this.$cookies.remove(TOKEN_KEY);
   },
+  setLoginVisible(state, visible) {
+    state.loginVisible = visible;
+  },
 };
 const actions = {
   async nuxtServerInit({ state, commit, dispatch }) {
@@ -44,10 +48,6 @@ const actions = {
       commit("setUserInfo", result);
     }
   },
-  loginOut({ commit }) {
-    commit("setLoginOut");
-    // 此处请求接口
-  },
 };
 
 export { state, mutations, actions };