<template>
  <div>
    <div class="type-title-wrapper">
      <div style="margin-left: 40px;">课程名称</div>
      <div style="margin-right:80px;">操作</div>
    </div>
    <coursetype v-for="item in courseList" :coursetypes="item" />
  </div>
</template>

<script>
import coursetype from '../components/coursetype.vue'
export default {
  components: {
    coursetype
  },
  data() {
    return {
      courseList: [
        {
          id: 1,
          name: 'a',
          children: [
            {
              id: 11,
              name: 'a1',
              children: [],
              isShow: false,
              level: 2
            },
            {
              id: 12,
              name: 'a2',
              children: [],
              isShow: false,
              level: 2
            }
          ],
          isShow: false,
          level: 1
        },
        {
          id: 2,
          name: 'b',
          children: [],
          isShow: false,
          level: 1
        },
        {
          id: 3,
          name: 'c',
          children: [],
          isShow: false,
          level: 1
        }
      ]
    }
  }
}
</script>

<style lang="scss">
  .type-title-wrapper{
    margin-top: 20px;
    display: flex;
    justify-content: space-between;
    border-bottom: 3px solid #eee;
    padding-bottom: 18px;
  }
</style>
