<template>
  <el-container>
    <el-header height="80px">
      <div class="head-top">
        <el-button size="mini">
          课程基本信息编辑
        </el-button>
        <el-button size="mini" type="primary">
          课时设置
        </el-button>
        <span class="page-type">
          分页模式
          <el-switch
            v-model="value2">
          </el-switch>
        </span>
      </div>
      <div class="head-content">
        <div>
          未命名页面
        </div>
      </div>
    </el-header>
    <el-container>
      <el-aside width="200px">
        <div class="page-list">
          <el-card v-for="data in selectedMould" @click="addMould(data)" shadow="hover" class="box" :key="data.name" :body-style="{ padding: '0px' }">
            <img :src="data.imgUrl" class="image">
            <div style="padding: 14px;">
              <span>{{data.name}}</span>
              <div class="bottom clearfix">
              </div>
            </div>
          </el-card>
        </div>
      </el-aside>
      <el-main>123</el-main>
    </el-container>
  </el-container>
</template>

<script>
  export default {
    name: "editor",
    props:[
      'selectedMould',
    ],
    data(){
      return {
        value2:''
      }
    }
  }
</script>

<style scoped lang="less">
  @import "../../util/public";
  .el-container{
    background: white;
    .el-header{
      padding: 0;
      .head-top{
        background: #f5f8ff;
        font-size: 14px;
        color: #333333;
        padding: 5px;
        .page-type{
          display: inline-block;
          padding: 0 10px;
        }
      }
      .head-content{
        padding: 10px;
      }
    }
  }
</style>
