<style>
  .Sctop_Last {
    position: absolute;
    right: 10px;
    bottom: 10px;
  }

  .Sctop_Last>div {
    display: inline-block;
    width: 100px;
    height: 30px;
    background-color: #D4DFFF;
    color: #2966FE;
    text-align: center;
    font-size: 14px;
    line-height: 30px;
    border-radius: 10px;
    font-weight: bold;
    cursor: pointer;
  }

  .sche_rightTop {
    width: 100%;
    padding: 20px 0;
    background-color: #fff;
    position: relative;
  }
.Scotop_little{
  white-space: nowrap;
}
.Scotop_con{
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
</style>
<template>
  <div class="sche_rightTop">
    <table style="margin:0 20px;font-size:18px;color:#000000;">
      <tr>
        <td style="width:20%">
          <span class="Sch_MainColor Scotop_con" >本次上课信息</span>
        </td>
        <td style="width:25%;">
          <div style="display:flex;">
            <div class="Scotop_little">
              班级:
            </div>
            <span class="Scotop_con">{{dataList.ClassName}}</span>
          </div>

        </td>
        <td style="width:25%;">
          <div style="display:flex;padding-left:20px;">
            <div class="Scotop_little">
              计划时间:
            </div>
            <span class="Scotop_con">{{dataList.PlanTime}}</span>
          </div>

        </td>
        <td style="width:25%;">
          <div style="display:flex;padding-left:20px;">
            <div class="Scotop_little">
              课程名称:
            </div>
            <span class="Scotop_con">{{dataList.CourseName}}</span>
          </div>
        </td>
        <td style="width:20%;">
          <div style="display:flex;padding-left:20px;">
            <div class="Scotop_little">
              当前状态:
            </div>
            <span v-if="dataList.ClassStatus===0" class="Scotop_con">待上课</span>
            <span v-if="dataList.ClassStatus===1" class="Scotop_con">上课中</span>
            <span v-if="dataList.ClassStatus===2" class="Scotop_con">下课</span>
          </div>

        </td>
      </tr>
      <tr>
        <td></td>
        <td>
          <span class="Scotop_little">老师:</span>{{dataList.TeacherName}}
        </td>
        <td>
          <div style="padding-left:20px;">
              <span class="Scotop_little" >实际时间:</span>{{dataList.ActualTime}}
          </div> 
        </td>
        <td>
           <div style="padding-left:20px;">
              <span class="Scotop_little">出勤人数:</span>{{dataList.AttendanceNum}}
           </div> 
        </td>
      </tr>
    </table>

  </div>
</template>
<script>
  export default {
    props: {
      dataList: {
        type: Object,
        default: null
      },
    },
    watch: {
      dataList: {
        handler(val) {
         
        }
      }
    }
  }

</script>
