refactor: 优化组件库点击菜单，获取数据逻辑

data-room-ui/packages/BigScreenComponentMag/SideMenu.vue

@@ -39,17 +39,21 @@ export default {
   created () {
     const type = this.$route?.query?.type
     if (type) {
-      this.activeType = type
-      this.$nextTick(() => {
-        this.$emit('getPageInfo', type)
-      })
+      this.componentHandle(this.componentList.find(item => item.type === type))
+    } else {
+      this.componentHandle(this.componentList[0])
     }
   },
   methods: {
     // 点击左侧组件
     componentHandle (com) {
       this.activeType = com.type
-      this.$emit('getPageInfo', com.type)
+      this.$router.push({
+        path: window.BS_CONFIG?.routers?.componentUrl || '/big-screen-components',
+        query: {
+          type: com.type
+        }
+      })
     }
   }
 }

data-room-ui/packages/BigScreenComponentMag/index.vue

@@ -1,11 +1,7 @@
 <template>
   <div class="bs-manage-main-wrap">
-    <side-menu
-      @getPageInfo="getPageInfo"
-    />
-    <menu-content
-      :catalog-info="catalogInfo"
-    />
+    <side-menu />
+    <menu-content />
   </div>
 </template>
 <script>
@@ -18,15 +14,10 @@ export default {
   components: { SideMenu, MenuContent },
   data () {
     return {
-      catalogInfo: ''
     }
   },
-  mounted () {},
-  methods: {
-    getPageInfo (type) {
-      this.catalogInfo = type
-    }
-  }
+  mounted () { },
+  methods: {}
 }
 </script>
 

data-room-ui/packages/ComponentList/index.vue

@@ -201,16 +201,12 @@ import innerRemoteComponents, { getRemoteComponents } from 'packages/RemoteCompo
 export default {
   name: 'BigScreenList',
   mixins: [pageMixins],
-  props: {
-    catalogInfo: {
-      type: String,
-      default: ''
-    }
-  },
+  props: { },
   components: { EditForm, CatalogEditForm },
   data () {
     return {
       name: '',
+      catalogInfo: 'component',
       catalogVisible: false,
       templateLoading: false,
       searchKey: '',
@@ -238,7 +234,8 @@ export default {
     }
   },
   watch: {
-    catalogInfo () {
+    $route (val) {
+      this.catalogInfo = val.query.type || 'component'
       this.reset()
       this.init()
     },
@@ -247,6 +244,7 @@ export default {
     }
   },
   mounted () {
+    this.catalogInfo = this.$route.query.type || 'component'
     this.init()
   },
   methods: {
@@ -279,8 +277,12 @@ export default {
       this.$refs.CatalogEditForm.formVisible = true
     },
     // 获取分组列表
-    async getCatalogList () {
-      this.catalogList = await get(`/bigScreen/type/list/${this.catalogType}`)
+    getCatalogList () {
+      get(`/bigScreen/type/list/${this.catalogType}`)
+        .then((data) => {
+          this.catalogList = data
+        })
+        .catch(() => {})
     },
     getDataList () {
       this.loading = true