<template>
  <div class="dash-page" v-bind:style="{ height: hg + 'px' }">
    <com-head type ="normal"></com-head>
    <el-row>
      <el-col :span="4" class="dash-page-menu">
        <com-menu class="dash-page-scroll"
          v-bind:style="{ height: contentHg + 'px' }"></com-menu>
      </el-col>
      <el-col :span="20" class="dash-page-content">
        <div class="dash-page-scroll"
          v-bind:style="{ height: contentHg + 'px', padding: '10px'}">
          <router-view></router-view>
        </div>
      </el-col>
    </el-row>
  </div>
</template>
<script>
  import './dash.less'
  import comHead from '../../components/chead/chead.vue'
  import comMenu from '../../components/cmenu/cmenu.vue'

  export default {
    name: 'dash',
    data () {
      return {
        hg: 0,
        contentHg: 0
      }
    },
    components: {
      comHead: comHead,
      comMenu: comMenu
    },
    created: function () {
      this.hg = document.body.clientHeight
      this.contentHg = this.hg - 100
    },
    mounted: function () {
      window.onresize = function () {
        this.hg = document.body.clientHeight
        this.contentHg = this.hg - 80
      }
    }
  }
</script>
