<!--班级-详情-->
<template>
  <view class="main_box">
    <!--自定义导航栏-->
    <view class="navbar_section">
      <view class="title">班级详情</view>
    </view>

    <view class="main_section">
      <view class="section_1">
        <view class="left">
          <image class="pic" src="http://www.firstui.cn:4000/vipdoc/img/img_logo.png"></image>
          <view class="name">包皮子</view>
        </view>
        <view class="right">
          <view class="item">
            班级：少年班
          </view>

          <view class="item">
            地点：XXXX体育馆 302室
          </view>

          <view class="item">
            课程：篮球少儿课
          </view>

          <view class="item">
            人数：30人
          </view>

          <view class="item">
            时间：2020.05:25 15:30 - 17:30
          </view>
        </view>
      </view>
    </view>

<!--    底部导航-->
<!--    <AQTabber/>-->
  </view>
</template>

<script>
import user from '@/api/user.js';
import AQTabber from "@/components/AQ/AQTabber.vue"


export default {
  components: {
    AQTabber,
  },
  data() {
    return {
      formData:{},
      tabType:'1',//1=班级成员,2=作业任务
    }
  },
  onLoad() {
  },
  methods: {
    //切换tab
    tabChange(tabType) {
      this.tabType = tabType
    },

    //打开课程详情
    openViewCourseInfo(item){
      uni.navigateTo({
        url: '/pages/coach/course/info'
      })
    },
    //打开学员详情页
    openViewStudentInfo(item){
      uni.navigateTo({
        url: '/pages/coach/student/info'
      })
    },
  }
}
</script>

<style lang="less" scoped>

.main_box{
  background: #292929 ;
}

//自定义导航栏
.navbar_section{
  display: flex;
  justify-content: center;
  align-items: center;
  background: #292929;
  .title{
    padding: 20rpx 0;
    font-size: 30rpx;
    color: #fff;
  }
}

.main_section{
  min-height: 100vh;
  background: #292929 100%;
  padding: 0 24rpx;
  padding-top: 40rpx;
  padding-bottom: 150rpx;
  font-size: 24rpx;
  color: #FFFFFF;

  .section_1 {
    border-radius: 10rpx;
    background-color: #525252;
    ::v-deep .fui-input__wrap{
      border-radius: 10rpx !important;
      background-color: #525252 !important;
    }
    ::v-deep .fui-input__background{
      background-color: #525252 !important;
    }
    .input_item {
      height: 60rpx;
      ::v-deep .uni-input-wrapper{
        .uni-input-placeholder {
          font-size: 28rpx !important;

        }

      }
    }
    ::v-deep .uni-input-input {
      color: #fff;
    }
  }

  .section_2{
    margin-top: 34rpx;
    .ul{
      display: flex;
      flex-direction: column;
      gap: 24rpx;
      .li{
        background: #404045;
        padding: 50rpx 36rpx 46rpx;
        border-radius: 16rpx;
        display: flex;
        gap: 32rpx;
        .left{
          .pic{
            border-radius: 50%;
            width: 92rpx;
            height: 92rpx;
          }
        }
        .right{
          display: flex;
          flex-direction: column;
          gap: 28rpx;
          .box_1{
            display: flex;
            align-items: center;
            gap: 36rpx;
            .name{
              font-size: 28rpx;
            }
            .btn_box{
              view{
                border: 1px solid #FAD04D;
                border-radius: 10rpx;
                width: 182rpx;
                height: 48rpx;
                line-height: 42rpx;
                text-align: center;
                font-size: 26rpx;
                color: #FAD04D;
              }
            }
          }
          .box_2{
            display: flex;
            align-items: center;
            gap: 44rpx;
            .user_list{
              display: flex;
              align-items: center;
              gap: 14rpx;
              image{
                border-radius: 50%;
                width: 48rpx;
                height: 48rpx;
              }
            }
            .num{}
          }

        }
      }
    }
  }



}


</style>