TEAMModelOS/TEAMModelOS.SmartTeach/ClientApp/components/resource/TeachResearch.vue

<template>
  <div class="home">
    <div class="title">
      <Icon type="ios-home-outline" size="22" />
      <p><router-link to="/TeacherZone/ZonesHome">工作室首页</router-link></p><span>>课题研究列表</span>
    </div>
    <div class="list-info">
      <h1 class="list-title">课题列表</h1>
      <Tabs class="list" value="name1">
        <TabPane label="不限" name="name1">暂时没有课题研究</TabPane>
        <TabPane label="国家级" name="name2">暂时没有课题研究</TabPane>
        <TabPane label="省级" name="name3">暂时没有课题研究</TabPane>
        <TabPane label="市级" name="name4">暂时没有课题研究</TabPane>
        <TabPane label="校级" name="name5">暂时没有课题研究</TabPane>
      </Tabs>
    </div>
    <div class="content-info">
      <h1 class="list-title">最新课题</h1>
      <p>暂无课题</p>
    </div>
  </div>
</template>
<script>
  export default {
    data() {
      return {

      }
    },
    methods: {
      viewDetails() {
        this.$router.push({ path: '/TeacherZone/TeachDetails' })

      },
      chooseTab() {
        this.info = this.data;
      }
    }
  }
</script>
<style scoped>
  .home {
    width: 66%;
    height: 500px;
    position: absolute;
    top: 70%;
    left: 53%;
    transform: translate(-50%,-50%);
    float: left;
    display: inline-flex;
  }

  .title {
    font-size: 16px;
    text-align: left;
    font-weight: 600;
    width:300px;
  }

    .title p {
      display: inline;
    }

  .list-info {
    margin-top: 35px;
    width: 50%;
    background: #fff;
    /* float: left; */
    margin-left: -24%;
    height: 200px;
    border: 1px solid #ededed;
  }

  .list-title {
    float: left;
    height: 57px;
    line-height: 57px;
    font-size: 20px;
    margin-left:10px;
    color: #288add;
    border-bottom: 1px solid #288add;
  }
  .list{
    margin-top:10%;
    margin-left:1%;
    font-size:15px;
  }
  .content-info {
    width: 25%;
    height: 200px;
    border: 1px solid #ededed;
    margin-top: 3%;
    margin-left: 4%;
    background-color: #ffffff;
  }
  .content-info p{
    margin-top:25%;
    font-size:15px;
    margin-left:10px;
  }


</style>