<template>
  <div> 
    <el-container>
      <el-header><myheader></myheader></el-header>
      <el-container class="mymain">
        <el-aside width="230px"><myaside></myaside></el-aside>
        <el-container>
          <el-main v-loading="store.state.loadding"
            element-loading-text="拼命加载中"
            element-loading-spinner="el-icon-loading"
            element-loading-background="rgba(255, 255, 255, 0.8)">
            <router-view></router-view>
          </el-main>
          <el-footer class="flex-footer">
            <p>技术支持:XXXXXXX</p><br>
            <!-- <small class="lastP">浙ICP备&nbsp;18043486号-1</small> -->
          </el-footer>
        </el-container>
      </el-container>
    </el-container>
  </div>
</template>

<script>
import store from "../../store/index"
import myheader from './modules/header.vue'
import myaside from './modules/aside.vue'
export default {
  components:{
    myheader,
    myaside
  },
  data () {
    return {
      store
    }
  }
}

</script>
<style>

</style>
<style scope>
.mymain{
  height: calc(100vh - 60px);
}
.el-header{
  padding: 0;
  border-bottom: 1px solid #f1f2f3;
  z-index: 999;

}
.el-main{
  position: relative;
  padding: 0;
  /* background: #f1f2f3; */
}
.flex-footer{
  display: flex;
  align-items: center;
  justify-content:  center;
  flex-wrap: wrap;
  font-size: 14px;
  color: #999;
  padding: 10px 0;
  border-top:1px solid #f1f2f3;
}
.flex-footer p{
  width: 100%;
  text-align: center;
}
</style>