dataease-dm/frontend/src/views/panel/index.vue

<template>
  <de-container v-loading="$store.getters.loadingMap[$store.getters.currentPath]">
    <de-main-container>
      <component :is="component" :param="param" />
    </de-main-container>
  </de-container>
</template>

<script>
import bus from '@/utils/bus'
import DeMainContainer from '@/components/dataease/DeMainContainer'
import DeContainer from '@/components/dataease/DeContainer'
import PanelMain from '@/views/panel/list/PanelMain'
import ChartEdit from '@/views/chart/view/ChartEdit'
import PanelEdit from '@/views/panel/edit'

export default {
  name: 'Panel',
  components: { DeMainContainer, DeContainer, PanelMain, ChartEdit, PanelEdit },
  data() {
    return {
      component: PanelMain,
      param: {}
    }
  },
  mounted() {
    bus.$on('PanelSwitchComponent', (c) => {
      console.log(c)
      this.param = c.param
      switch (c.name) {
        case 'PanelEdit':
          this.component = PanelEdit
          break
        case 'ChartEdit':
          this.component = ChartEdit
          break
        default:
          this.component = PanelMain
          break
      }
    })
  },
  methods: {

  }
}
</script>

<style scoped>
  .ms-aside-container {
    height: calc(100vh - 56px);
    padding: 15px;
    min-width: 260px;
    max-width: 460px;
  }

  .ms-main-container {
    height: calc(100vh - 56px);
    padding: 0;
  }

</style>