优化初次登录会报网络异常的问题

src/views/index.vue

@@ -1,8 +1,8 @@
 <template>
     <div id="main" v-bind:class="{ fold: isFold }">
-        <page-menu @menuFold="menuFold"></page-menu>
+        <page-menu @menuFold="menuFold" ref="menu"></page-menu>
         <bread-crumb></bread-crumb>
-        <router-view class="mainBox"></router-view>
+        <router-view class="mainBox" ref="curRouter"></router-view>
     </div>
 </template>
 
@@ -27,6 +27,34 @@ export default {
             this.isFold = flag;
         },
     },
+    mounted() {
+        // localStorage.setItem(
+        //     "Authorization",
+        //     "Bearer 9882c634-9af6-4647-89dc-8ad53c04a56b"
+        // );
+
+        let { code, ticket } = this.$route.query;
+        if (code && ticket) {
+            this.$axios({
+                method: "post",
+                url: this.$api.common.single,
+                data: { code, ticket },
+            }).then((res) => {
+                if (res.code == 200 && !!res.info.access_token) {
+                    localStorage.setItem(
+                        "Authorization",
+                        "Bearer " + res.info.access_token
+                    );
+                    this.$nextTick(() => {
+                        this.$refs.curRouter.init &&
+                            this.$refs.curRouter.init();
+                    });
+                } else {
+                    alert(res);
+                }
+            });
+        }
+    },
 };
 </script>
 

src/views/mainPage.vue

@@ -74,9 +74,7 @@
                     <div class="titlePanelBor">日访问人数</div>
                 </div>
                 <div class="chartABox shadowBox">
-                    <line-chart-main-page
-                        id="lineA">
-                    </line-chart-main-page>
+                    <line-chart-main-page id="lineA"> </line-chart-main-page>
                 </div>
             </div>
 
@@ -383,28 +381,26 @@ export default {
                 }
             });
         },
-        getLineData() {
-            this.$axios({
-                method: "post",
-                url: this.$api.mainPage.selectRunProjectBySy,
-                data: {},
-            }).then((res) => {
-                if (res.code == 200 && res.info) {
-                    // this.data1 = res.info;
-                } else {
-                    this.$message.error(res.message || "获取信息失败");
-                }
-            });
+        init() {
+            this.getData(this.$api.mainPage.queryAllNum, "dataOverview");
+            this.getData(
+                this.$api.mainPage.selectRunProjectBySy,
+                "runProjectList"
+            );
+            this.getData(this.$api.mainPage.selectRunTaskBySy, "runTaskList");
+            this.getData(
+                this.$api.mainPage.selectRunProjectByState,
+                "dataListA"
+            );
+            this.getData(this.$api.mainPage.selectRunTaskByState, "dataListB");
+            this.getData(this.$api.mainPage.selectEvaluationLevel, "dataListC");
         },
     },
 
     mounted() {
-        this.getData(this.$api.mainPage.queryAllNum, "dataOverview");
-        this.getData(this.$api.mainPage.selectRunProjectBySy, "runProjectList");
-        this.getData(this.$api.mainPage.selectRunTaskBySy, "runTaskList");
-        this.getData(this.$api.mainPage.selectRunProjectByState, "dataListA");
-        this.getData(this.$api.mainPage.selectRunTaskByState, "dataListB");
-        this.getData(this.$api.mainPage.selectEvaluationLevel, "dataListC");
+        if (localStorage.getItem("Authorization")) {
+            this.init();
+        }
     },
 };
 </script>

src/views/page/pageMenu.vue

@@ -141,12 +141,6 @@
                 </el-menu>
             </div>
         </div>
-        <!-- <div class="fold" v-show="menuFold">
-            <img :src="imgSrc" width="100%" height="100%" />
-        </div>
-        <div class="unfold" v-show="!menuFold">
-            <img :src="imgSrc" width="100%" height="100%" />
-        </div> -->
     </div>
 </template>
 
@@ -157,7 +151,6 @@ export default {
         return {
             menuFold: false, // menu是否折叠
             opened: false,
-            imgSrc: require("@/assets/common/image/photoF.png"),
             menus: [
                 "mainPage",
                 "modelLibrary",
@@ -181,8 +174,6 @@ export default {
             // console.log(index, indexPath);
             this.opened = indexPath[0];
 
-            // console.log(this.activeMenu);
-
             // 如果是首页 手动关闭其他菜单
             if (index === this.menus[0]) {
                 this.menus.forEach((i) => {
@@ -191,34 +182,8 @@ export default {
             }
         },
     },
-    created() {
-        // localStorage.setItem(
-        //     "Authorization",
-        //     "Bearer 9882c634-9af6-4647-89dc-8ad53c04a56b"
-        // );
-
-        let { code, ticket } = this.$route.query;
-        if (code && ticket) {
-            this.$axios({
-                method: "post",
-                url: this.$api.common.single,
-                data: { code, ticket },
-            }).then((res) => {
-                if (res.code == 200 && !!res.info.access_token) {
-                    localStorage.setItem(
-                        "Authorization",
-                        "Bearer " + res.info.access_token
-                    );
-                } else {
-                    alert(res);
-                }
-            });
-        }
-    },
 
     mounted() {
-        // console.log(this.$route);
-
         let menuKind = this.$route.meta.menuKind;
 
         if (menuKind && menuKind !== "mainPage") {
@@ -364,7 +329,6 @@ export default {
 }
 
 .el-menu {
-    // background: @themeColor;
     border-right-color: @themeColor;
 
     /deep/ .el-submenu__title,
@@ -423,7 +387,6 @@ export default {
 }
 
 .hasList {
-    // /deep/ .el-submenu__title
     /deep/ .el-menu-item {
         color: #d7e7fe;
     }
@@ -440,25 +403,4 @@ export default {
         bottom: 30px;
     }
 }
-
-.fold,
-.unfold {
-    position: fixed;
-    bottom: 30px;
-    z-index: 12;
-    border-radius: 50%;
-    cursor: pointer;
-    overflow: hidden;
-}
-.fold {
-    width: 36px;
-    height: 36px;
-    left: 12px;
-}
-
-.unfold {
-    width: 60px;
-    height: 60px;
-    left: 35px;
-}
 </style>