前端大更新vuex

Yi.Vue/src/layouts/default/AppBar.vue

@@ -25,6 +25,7 @@
     <default-notifications />
 
     <default-account />
+    
   </v-app-bar>
 </template>
 

Yi.Vue/src/layouts/default/View.vue

@@ -1,6 +1,13 @@
 <template>
   <v-main>
     <v-container fluid>
+          <v-progress-linear
+      :active="this.$store.state.loader.load"
+      :indeterminate="this.$store.state.loader.load"
+      background-color="primary lighten-4"
+      color="primary lighten-1"
+      striped
+    ></v-progress-linear>
       <router-view :key="$route.path" />
     </v-container>
   </v-main>

Yi.Vue/src/main.js

@@ -5,6 +5,7 @@ import vuetify from './plugins/vuetify'
 import VuetifyDialog from 'vuetify-dialog'
 import 'vuetify-dialog/dist/vuetify-dialog.css'
 import './plugins'
+import "./permission"
 import store from './store/index'
 
 Vue.config.productionTip = false
@@ -13,9 +14,11 @@ Vue.use(VuetifyDialog, {
         vuetify
     }
 });
-new Vue({
+let vm = new Vue({
     router,
     store,
     vuetify,
     render: function(h) { return h(App) }
-}).$mount('#app')
+}).$mount('#app')
+
+export default vm;

Yi.Vue/src/permission.js

@@ -0,0 +1,19 @@
+import router from './router/index'
+import store from './store/index'
+// import accountApi from '@/api/accountApi'
+
+
+router.beforeEach((to, from, next) => {
+    const user = store.state.user.user; //获取是有user
+    console.log(user)
+    if (!user) { //如果没有登入
+        if (to.path == '/login/' || to.path == '/register/' || to.path == '/reset_password/' || to.path == '/qq/') {
+            next();
+        } else {
+            next({ path: '/login/' });
+        }
+    } else {
+        next();
+    }
+
+})

Yi.Vue/src/util/myaxios.js

@@ -1,5 +1,6 @@
 import axios from 'axios'
 import store from '../store/index'
+import vm from '../main'
 // import VuetifyDialogPlugin from 'vuetify-dialog/nuxt/index';
 const myaxios = axios.create({
         // baseURL:'/'// 
@@ -12,25 +13,44 @@ const myaxios = axios.create({
     // 请求拦截器
 myaxios.interceptors.request.use(function(config) {
     config.headers.Authorization = 'Bearer ' + store.state.user.token;
-    // store.dispatch("openLoad");
+    store.dispatch("openLoad");
     return config;
 }, function(error) {
     return Promise.reject(error);
 });
 
 // 响应拦截器
-myaxios.interceptors.response.use(function(response) {
+myaxios.interceptors.response.use(async function(response) {
     const resp = response.data
-        // store.dispatch("closeLoad");
+    if (resp.code == undefined && resp.msg == undefined) {
+        vm.$dialog.notify.error("错误代码：无，原因：与服务器失去连接", {
+            position: "top-right",
+            timeout: 5000,
+        });
+    } else if (resp.code == 401) {
+        const res = await vm.$dialog.error({
+            text: `错误代码：${resp.code}，原因：${resp.msg}<br>是否重新进行登录？`,
+            title: '错误',
+            actions: {
+                'false': '取消',
+                'true': '跳转'
+            }
+        });
+        if (res) {
+            vm.$router.push({ path: "/login" });
+        }
+
+    } else if (resp.code !== 200) {
+        vm.$dialog.notify.error(`错误代码：${resp.code}，原因：${resp.msg}`, {
+            position: "top-right",
+            timeout: 5000,
+        });
+    }
+
+    store.dispatch("closeLoad");
     return resp;
 }, function(error) {
-    const resp = error.response.data
-        // if (resp.code == undefined && resp.msg == undefined) {
-        //     alert(`错误代码：无，原因：与服务器失去连接`)
-        // } else if (resp.code != 200) {
-        //     alert(`错误代码：${resp.code}，原因：${resp.msg}`)
-        // }
-        // store.dispatch("closeLoad");
+    store.dispatch("closeLoad");
     return Promise.reject(error);
 });
 export default myaxios

Yi.Vue/src/util/routes.js

@@ -55,8 +55,7 @@ export function redirect(
 
 export function route(name, component, path = '') {
     component = Object(component) === component ?
-        component :
-        { default: name.replace(' ', '') }
+        component : { default: name.replace(' ', '') }
 
     const components = {}
 

Yi.Vue/src/views/Index.vue

@@ -1,14 +1,25 @@
 <template>
-    <div>
-
-<MaterialCard title="首页卡片"  subtitle="微软（Microsoft）是一家美国跨国科技企业，由比尔·盖茨和保罗·艾伦于1975年4月4日创立。" heading="头部" color='#E91E63' :fullHeader='false' icon='mdi-view-dashboard'></MaterialCard>
-<MaterialCharCard></MaterialCharCard>
-<MaterialSnackbar></MaterialSnackbar>
-<MaterialStatCard value="微软（Microsoft）是一家美国跨国科技企业，由比尔·盖茨和保罗·艾伦于1975年4月4日创立。">
-    <template v-slot>
-        还有什么呢？
-    </template>
-</MaterialStatCard>
-    </div>
-
-</template>
+  <div>
+    <MaterialCard
+      title="首页卡片"
+      subtitle="微软（Microsoft）是一家美国跨国科技企业，由比尔·盖茨和保罗·艾伦于1975年4月4日创立。"
+      heading="头部"
+      color="#E91E63"
+      :fullHeader="false"
+      icon="mdi-view-dashboard"
+    ></MaterialCard>
+    <MaterialCharCard></MaterialCharCard>
+    <MaterialSnackbar></MaterialSnackbar>
+    <MaterialStatCard
+      value="微软（Microsoft）是一家美国跨国科技企业，由比尔·盖茨和保罗·艾伦于1975年4月4日创立。"
+    >
+      <template v-slot> 还有什么呢？ </template>
+    </MaterialStatCard>
+  </div>
+</template>
+<script>
+export default {
+  data: () => ({}),
+  created() {},
+};
+</script>