<template>
 <div style="height:100%;width:100%">
 <div class="left-content">
       <sidebar class="sidebar-container" style="margin-top:5rem"/>
 </div>
 <div class='right-content'>   
     <div :class="{hasTagsView:needTagsView}" class="main-container">
      <div :class="{'fixed-header':fixedHeader}">
        <!-- <navbar /> -->
        <!-- <tags-view v-if="needTagsView" /> -->
      </div>
      <app-main />
      <right-panel>
        <settings />
      </right-panel>
    </div>
 </div>
 </div>
</template>

<script>
import { AppMain, Navbar, Settings, Sidebar, TagsView } from '@/layout/components'
import { mapState } from 'vuex'

export default {
  name: 'xjTable',
  components: {
    'sidebar':Sidebar,
    AppMain
  },
  computed: {
    ...mapState({
      sideTheme: state => state.settings.sideTheme,
      sidebar: state => state.app.sidebar,
    }),
  },
  methods: {
   
  }
}
</script>

<style lang="scss" scoped>
     .left-content{
          
          // height:100%;
          // width:33.2rem;
          // background: #04283C;
          float:left;
     }

     .right-content{
          height:100%;
          width:155.8rem;
          float: left;
     }
  
</style>
