<template>
  <div class="page-default">
    <el-row :gutter="20" class="c-row">      
     <el-col class="c-col" :span="12">
      <sis-chart1></sis-chart1>
     </el-col>
      <el-col class="c-col" :span="12">
        <sis-chart2></sis-chart2>
      </el-col>
    </el-row>   
  </div>
</template>

<script type="text/ecmascript-6">
import SisChart1 from "./Chart1";
import SisChart2 from "./Chart2";

export default {
  name: "SisDefault",
  components: {
    SisChart2,
    SisChart1
  },
  data() {
    return {     
    };
  }
};
</script>

<style lang="stylus" rel="stylesheet/stylus">
.page-default {
  height: 100%;
  display: -webkit-flex;
  flex-direction: column;
  min-width: 1200px;

  .c-row {
    flex: 1;
    margin-bottom: 20px;

    .c-col {
      flex: 1;
      height: 500px;

      .c-body {
        height: 400px;
      }
    }
  }
}
</style>
