解决侧边栏没办法显示徽标数字问题

src/App.vue

@@ -6,14 +6,10 @@
 
 <script>
   import { updateDocumentTitle } from '@/utils/document-title-util';
-  import { statistics } from '@/api/bpm/components/inspectionManage';
-  import { getTodoTaskPage } from '@/api/bpm/task';
   import { getPathAddress } from '@/api/system/file/index';
   export default {
     name: 'App',
     created() {
-      statistics(); // 加载工单待办侧边栏条数
-      getTodoTaskPage({ pageNo: 1, pageSize: 1 }); // 加载流程待办侧边栏条数
       console.log('我是子应用-----------');
       // 恢复主题
       this.$store.dispatch('theme/recoverTheme');

src/api/bpm/components/inspectionManage/index.js

@@ -37,9 +37,14 @@ export async function getList(params) {
 export async function statistics(params) {
   const res = await request.get('/eam/PdaWorkOrder/statistics', { params });
   if (res.data.code == 0) {
+    console.log('-----statistics---user--------');
+    console.log(store.state.user);
     if (store.state.user.menus?.length) {
       for (const p of store.state.user.menus) {
+        console.log('statistics----------------------');
+        console.log(p);
         if (p.path === '/tickets') {
+          console.log('进来了！~~~~~');
           store.dispatch('user/setMenuBadge', {
             path: '/tickets',
             value: res.data.data.total || 0,
@@ -52,9 +57,14 @@ export async function statistics(params) {
       const unwatch = Vue.prototype.$watch(
         '$store.state.user.menus',
         () => {
+          console.log('-----statistics---user--------');
+          console.log(store.state.user);
           if (store.state.user.menus?.length) {
             for (const p of store.state.user.menus) {
+              console.log('statistics----------------------');
+              console.log(p);
               if (p.path === '/tickets') {
+                console.log('进来了！~~~~~');
                 store.dispatch('user/setMenuBadge', {
                   path: '/tickets',
                   value: res.data.data.total || 0,

src/api/bpm/task.js

@@ -9,9 +9,14 @@ export async function getTodoTaskPage(query) {
     params: query
   });
   if (res.data.code == 0) {
+    console.log('-----getTodoTaskPage---user--------');
+    console.log(store.state.user);
     if (store.state.user.menus?.length) {
       for (const p of store.state.user.menus) {
+        console.log('getTodoTaskPage----------------------');
+        console.log(p);
         if (p.path === '/todo') {
+          console.log('进来了2~~~');
           store.dispatch('user/setMenuBadge', {
             path: '/todo',
             value: res.data.data.count || 0,
@@ -24,9 +29,14 @@ export async function getTodoTaskPage(query) {
       const unwatch = Vue.prototype.$watch(
         '$store.state.user.menus',
         () => {
+          console.log('-----getTodoTaskPage---user--------');
+          console.log(store.state.user);
           if (store.state.user.menus?.length) {
             for (const p of store.state.user.menus) {
+              console.log('getTodoTaskPage----------------------');
+              console.log(p);
               if (p.path === '/todo') {
+                console.log('进来了2~~~');
                 store.dispatch('user/setMenuBadge', {
                   path: '/todo',
                   value: res.data.data.count || 0,

src/layout/index.vue

@@ -121,7 +121,7 @@
       HeaderTools,
       PageFooter
     },
-    data () {
+    data() {
       return {
         PROJECT_NAME,
         HIDE_SIDEBARS,
@@ -136,15 +136,17 @@
       };
     },
     computed: {
-      isQianKun () {
+      isQianKun() {
         return window.__POWERED_BY_QIANKUN__;
       },
       // 当前语言
-      locale () {
+      locale() {
         return this.$i18n.locale;
       },
       // 菜单数据
-      menus () {
+      menus() {
+        console.log('menus---layout----------------');
+        console.log(this.$store.state.user.menus);
         return this.$store.state.user.menus;
       },
       // 主题状态
@@ -152,29 +154,29 @@
     },
     methods: {
       /* 侧栏折叠切换 */
-      updateCollapse (value) {
+      updateCollapse(value) {
         // console.log('value:', this.$store.state.user.menus);
         this.$store.dispatch('theme/setCollapse', value);
       },
       /* 双侧栏一级折叠切换 */
-      updateSideNavCollapse (value) {
+      updateSideNavCollapse(value) {
         this.$store.dispatch('theme/setSideNavCollapse', value);
       },
       /* 内容区域全屏切换 */
-      updateBodyFullscreen (value) {
+      updateBodyFullscreen(value) {
         this.$store.dispatch('theme/setBodyFullscreen', value);
       },
       /* logo 点击事件 */
-      onLogoClick (isHome) {
+      onLogoClick(isHome) {
         isHome || this.$router.push(LAYOUT_PATH);
       },
       /* 监听屏幕尺寸改变 */
-      screenSizeChange () {
+      screenSizeChange() {
         this.$store.dispatch('theme/updateScreenSize');
         this.fullscreen = isFullscreen();
       },
       /* 全屏切换 */
-      onFullscreen () {
+      onFullscreen() {
         try {
           this.fullscreen = toggleFullscreen();
         } catch (e) {
@@ -182,7 +184,7 @@
         }
       },
       /* 页签右键菜单点击事件 */
-      onTabContextMenu ({ key, tabKey, item, active }) {
+      onTabContextMenu({ key, tabKey, item, active }) {
         switch (key) {
           case 'reload': // 刷新
             reloadPageTab({
@@ -217,7 +219,7 @@
         }
       },
       /* 菜单标题国际化 */
-      i18n (_path, key) {
+      i18n(_path, key) {
         if (!I18N_ENABLE || !key) {
           return;
         }
@@ -341,10 +343,10 @@
     }
   }
 
-  .ele-admin-layout .ele-admin-logo img  {
+  .ele-admin-layout .ele-admin-logo img {
     height: auto !important;
     width: 80px !important;
     margin-right: 5px;
-    max-height: 35px
+    max-height: 35px;
   }
 </style>

src/main.js

@@ -94,8 +94,9 @@ export async function bootstrap() {
 
 export async function mount(props) {
   console.log('[vue] props from main framework', props);
-
-  initParentStore(props.store?.state);
+  Vue.prototype.$portalStore = props.store;
+  initParentStore(props.store);
+  // initParentStore(props.store?.state);
   props.onGlobalStateChange((state, prev) => {
     // state: 变更后的状态; prev 变更前的状态
     initParentStore(state);

src/router/index.js

@@ -6,6 +6,8 @@ import NProgress from 'nprogress';
 import VueRouter from 'vue-router';
 import { WHITE_LIST, REDIRECT_PATH, LAYOUT_PATH } from '@/config/setting';
 import store from '@/store';
+import { statistics } from '@/api/bpm/components/inspectionManage';
+import { getTodoTaskPage } from '@/api/bpm/task';
 import { getToken } from '@/utils/token-util';
 import { routes, getMenuRoutes } from './routes';
 import { SYSTEM_NAME } from '@/config/setting';
@@ -46,7 +48,8 @@ router.beforeEach((to, from, next) => {
       store
         .dispatch('user/fetchUserInfo')
         .then(({ menus, homePath, authoritiesRouter }) => {
-          console.log();
+          statistics(); // 加载工单待办侧边栏条数
+          getTodoTaskPage({ pageNo: 1, pageSize: 1 }); // 加载流程待办侧边栏条数
           menus.push({
             path: '/bpm/processInstance',
             component: 'bpm/processInstance/detail',
@@ -57,7 +60,7 @@ router.beforeEach((to, from, next) => {
               routePath: '/bpm/processInstance'
             }
           });
-        
+
           if (menus) {
             router.addRoute(
               getMenuRoutes([...menus, ...authoritiesRouter], homePath)

src/store/modules/user.js

@@ -4,6 +4,8 @@
 import { formatMenus, toTreeData, formatTreeData } from 'ele-admin';
 import { USER_MENUS } from '@/config/setting';
 import { getResourcesTree } from '@/api/layout';
+import { SYSTEM_NAME } from '@/config/setting';
+import Vue from 'vue';
 
 const formatRouter = (list) => {
   let menuList = []; // menuType
@@ -51,23 +53,23 @@ export default {
   },
   mutations: {
     // 设置登录用户的信息
-    setUserInfo (state, info) {
+    setUserInfo(state, info) {
       state.info = info;
     },
     // 设置登录用户的菜单
-    setMenus (state, menus) {
+    setMenus(state, menus) {
       state.menus = menus;
     },
     // 设置登录用户的权限
-    setAuthorities (state, authorities) {
+    setAuthorities(state, authorities) {
       state.authorities = authorities;
     },
     // 设置登录用户的权限路由
-    setAuthoritiesRouter (state, authoritiesRouter) {
+    setAuthoritiesRouter(state, authoritiesRouter) {
       state.authoritiesRouter = authoritiesRouter;
     },
     // 设置登录用户的角色
-    setRoles (state, roles) {
+    setRoles(state, roles) {
       state.roles = roles;
     }
   },
@@ -105,7 +107,7 @@ export default {
     //   return { menus, homePath };
     // },
     //动态路由
-    async fetchUserInfo ({ commit }) {
+    async fetchUserInfo({ commit }) {
       const result = await getResourcesTree().catch(() => {});
       const list = result?.filter((i) => i.path === '/page-wt');
       if (!list?.length) {
@@ -157,33 +159,41 @@ export default {
     /**
      * 更新用户信息
      */
-    setInfo ({ commit }, value) {
+    setInfo({ commit }, value) {
       commit('setUserInfo', value);
     },
     /**
      * 更新菜单数据
      */
-    setMenus ({ commit }, value) {
+    setMenus({ commit }, value) {
       commit('setMenus', value);
     },
     /**
      * 更新菜单的badge
      */
-    setMenuBadge ({ commit, state }, { path, value, color }) {
-      const menus = formatTreeData(state.menus, (m) => {
-        if (path === m.path) {
-          return {
-            ...m,
-            meta: {
-              ...m.meta,
-              badge: value,
-              badgeColor: color
-            }
-          };
-        }
-        return m;
-      });
-      commit('setMenus', menus);
+    setMenuBadge({ commit, state }, { path, value, color }) {
+      if (window.__POWERED_BY_QIANKUN__) {
+        Vue.prototype.$portalStore?.dispatch('user/setMenuBadge', {
+          path: `/page-${SYSTEM_NAME}${path}`,
+          value,
+          color
+        });
+      } else {
+        const menus = formatTreeData(state.menus, (m) => {
+          if (path === m.path) {
+            return {
+              ...m,
+              meta: {
+                ...m.meta,
+                badge: value,
+                badgeColor: color
+              }
+            };
+          }
+          return m;
+        });
+        commit('setMenus', menus);
+      }
     }
   }
 };