fix(测试跟踪): 测试计划报告页面切换左侧菜单导致目录被覆盖问题

--bug=1016062 --user=宋昌昌 【测试跟踪】-【测试计划】github #17151页面，点击列表某一测试计划，切到【报告统计】页面，发现左侧菜单处出现样式问题 https://www.tapd.cn/55049933/s/1229270

frontend/src/business/App.vue

@@ -109,7 +109,8 @@ export default {
       localStorage.setItem("store", JSON.stringify(this.$store.state));
     });
     this.isFixed = localStorage.getItem('app-fixed') === 'true' || false;
-    this.isCollapse = this.isFixed === true ? false : true;
+    this.isCollapse = !this.isFixed;
+    this.$store.commit('setAppFixed', this.isFixed);
   },
   beforeCreate() {
     this.$get("/isLogin").then(response => {
@@ -187,6 +188,7 @@ export default {
       }
       localStorage.removeItem('app-fixed');
       localStorage.setItem('app-fixed', this.isFixed);
+      this.$store.commit('setAppFixed', this.isFixed);
     },
     collapseOpen() {
       this.isCollapse = false;

frontend/src/business/components/track/plan/view/comonents/report/detail/TestPlanReportNavigationBar.vue

@@ -2,7 +2,7 @@
   <div>
     <ms-drawer class="drawer-content"
                direction="left"
-               :class="{'move-bar' : needMoveBar}"
+               :class="moveBarClass"
                :visible="true"
                :size="10"
                :show-full-screen="false"
@@ -66,7 +66,8 @@ export default {
           link: 'load',
           title: this.$t('test_track.report.analysis_load'),
         }
-      ]
+      ],
+      moveBarClass: '',
     }
   },
   watch: {
@@ -91,8 +92,13 @@ export default {
     },
     uiEnable() {
       this.setData();
+    },
+    '$store.state.appFixed'(newVal){
+      if (this.needMoveBar) {
+        this.toggleMoveBarClass(newVal);
       }
     },
+  },
   computed: {
     navBtnClass() {
       let user = getCurrentUser();
@@ -107,10 +113,13 @@ export default {
       } else {
         return 'zh-button-span';
       }
-    }
+    },
   },
   mounted() {
     this.setData();
+    if (this.needMoveBar) {
+      this.toggleMoveBarClass(this.$store.state.appFixed);
+    }
   },
   methods: {
     setData() {
@@ -128,6 +137,9 @@ export default {
           this.data.push(item);
         }
       });
+    },
+    toggleMoveBarClass(val) {
+      this.moveBarClass = val ? 'fixed-move-bar' : 'move-bar';
     }
   }
 }
@@ -197,7 +209,11 @@ export default {
 }
 
 .move-bar {
-  margin-left: 50px;
+  margin-left: 53px;
+}
+
+.fixed-move-bar {
+  margin-left: 159px;
 }
 
 .drawer-content {

frontend/src/store/index.js

@@ -49,7 +49,8 @@ const state = {
   refreshUiScenario: false,
   showLicenseCountWarning: false,
   temWorkspaceId: null,
-  fileDownloadList: [], // 文件下载进度列表
+  fileDownloadList: [], // 文件下载进度列表,
+  appFixed: null,
 }
 
 const store = new Vuex.Store({

frontend/src/store/mutations.js

@@ -43,6 +43,7 @@ const mutations = {
   deleteDownloadFile: (state, props) => {
     state.fileDownloadList.splice(state.fileDownloadList.findIndex(item => item.id === props), 1);
   },
+  setAppFixed: (state, value) => state.appFixed = value,
 }
 
 export default mutations;