cmc-web/webs/ams-web/src/views/resource/menu/index.vue

<template>
  <split-pane :min-percent="10" :default-percent="15" split="vertical" style="height: calc(100vh - 110px)">
    <template slot="paneL">
      <SideMenu @handleNodeClick="handleNodeClick"></SideMenu>
    </template>
    <template slot="paneR">
      <RightList ref="listRef"></RightList>
    </template>
  </split-pane>
</template>
<script lang="ts">
import { computed, defineComponent, ref, watch } from 'vue'
import SplitPane from 'vue-splitpane'
import SideMenu from './SideMenu.vue'
import RightList from './List.vue'
import { useStore } from '@cmp/cmp-core'
export default defineComponent({
  components: { SplitPane, SideMenu, RightList },
  setup() {
    const store = useStore()
    console.log(store)
    const selectedPostion = computed(() => store.state.position.selectedPostion)
    watch(selectedPostion, (val) => {
      console.log('阵地切换', val)
    })
    const listRef = ref()
    function handleNodeClick(node: any) {
      const { type, id } = node
      if (type === 'module') {
        listRef.value.init(node)
      }
    }
    return {
      listRef,
      handleNodeClick,
    }
  },
})
</script>