{% set mode = mode|default('default') %}

<ul class="course-grids">
  {% for course in courses %}
    {% set courseSet = data('CourseSet', { id: course.courseSetId }) %}
    <li class="course-grid">
      <a href="{{ path('my_course_show', {id:course.id}) }}" class="grid-body">
        <div class="course-grid-img">
          <img src="{{ filepath(course_set_cover(courseSet, 'large'), 'courseSet.png') }}"  class="img-responsive thumb">

          <div class="course-grid-mask">
            <span class="btn btn-warning btn-sm course-grid-btn-learn">
              {% if course.memberIsLearned|default(1) %}
                {{'查看课程'|trans}}
              {% else %}
                {{'继续学习'|trans}}
              {% endif %}
            </span>
          </div>

        </div>
        <span class="course-label">
          {% if courseSet.status == constant('Biz\\Course\\Service\\CourseSetService::DRAFT_STATUS') %}
            <span class="label  label-warning">{{'未发布'|trans}}</span>
          {% elseif courseSet.status == constant('Biz\\Course\\Service\\CourseSetService::CLOSE_STATUS') %}
            <span class="label label-danger">{{'已关闭'|trans}}</span>
          {% endif %}
          {% if courseSet.status != constant('Biz\\Course\\Service\\CourseSetService::CLOSE_STATUS') %}
            {% if courseSet.serializeMode == constant('Biz\\Course\\Service\\CourseSetService::SERIALIZE_SERIALIZE_MODE') %}
              <span class="label label-success">{{'更新中'|trans}}</span>
            {% elseif courseSet.serializeMode == constant('Biz\\Course\\Service\\CourseSetService::FINISH_SERIALIZE_MODE') %}
              <span class="label label-warning">{{'已完结'|trans}}</span>
            {% endif %}
          {% endif %}
          {% if courseSet.type == 'live' %}
            {% set task = course['task']|default(null) %}
            {% if task and "now"|date("U") >= task.startTime and "now"|date("U") <= task.endTime %}
              <span class="label label-warning">{{'正在直播中'|trans}}</span>
            {% else %}
              <span class="label label-success">{{'直播'|trans}}</span>
            {% endif %}
          {% endif %}
        </span>
        
        {% if mode in ['default', 'teach'] %}

          {% if courseSet.type == 'live' %}
            {% set task = course['task']|default(null) %}
            {% if task %}
              <span class="live-course-lesson metas">
                <span class="color-success mrm">{{ task.startTime|date('n月j日 H:i'|trans) }} ~ {{ task.endTime|date('H:i') }}</span>
                <span class="color-gray mrm">{{'第%number%任务'|trans({'%number%': task.number})}}</span>
              </span>
            {% endif %}
          {% endif %}

          <span class="metas clearfix">
            <span class="price-col">
              <span class="meta-label">{{'价格'|trans}}</span>
              {% if setting('coin.coin_enabled') and setting('coin.price_type') == 'Coin' %}
              <span class="price-num" style="display:inline " >{% if course.price > 0 %}{{ course.price * setting('coin.cash_rate')}}{{setting('coin.coin_name')}}{% else %}{{'免费'|trans}}{% endif %}</span>
              {% else %}
              <span class="price-num">{% if course.price > 0 %}{{'%price%元'|trans({'%price%': course.price}) }}{% else %}{{'免费'|trans}}{% endif %}</span>
              {% endif %}
            </span>

            {% if setting('course.show_student_num_enabled', '1') == 1 %}
            <span class="student-col">
              <span class="meta-label">{{ default.user_name|default('学员'|trans) }}</span>
              <span class="student-num">{{'%studentNum%人'|trans({'%studentNum%': course.studentNum })}}</span>
            </span>
            {% endif %}

            <span class="review-col">
              {% if course.ratingNum > 0 %}
                <span class="meta-label"><strong>{{ course.ratingNum }}</strong> {{'评价'|trans}}</span>
                <span class="review-rating">
                  <span class="stars-{{ (course.rating)|number_format }}">&nbsp;</span>
                </span>
              {% else %}
                <span class="meta-label">{{'无评价'|trans}}</span>
                <span class="review-rating">
                  <span class="stars-0">&nbsp;</span>
                </span>
              {% endif %}
            </span>

          </span>
        {% endif %}

        {% if mode in ['default'] %}
          {% set user = users[course.teacherIds|first]|default(null) %}
          {% if user %}
            <span class="teacher clearfix">
              <img src="{{ filepath(user.smallAvatar, 'avatar.png') }}" class="thumb">
              <span class="nickname ellipsis">{{ user.nickname }}</span>
              <span class="user-title ellipsis">{{ user.title }}</span>
            </span>
          {% endif %}
        {% endif  %}

        {% if mode in ['learn'] %}
          {% if course.classroomCount > 0 %}
            {% set classroom = course.classroom %}
            <div class="course-label belong-classroom">
              <img class="classroomPicture" src="{{ filepath(classroom.smallPicture, 'classroom.png') }}">
              {{classroom.title|sub_text(10)}}
              {% if course.classroomCount > 1 %}
                  {{'等'|trans}}
              {% endif %}
            </div>
          {% endif %}

          {% if course.memberIsLearned %}
            <div class="text-12 color-gray ph10 pt10">{{'学习总时长：%learnTime%'|trans({'%learnTime%': course.learnTime|time_formatter})}}</div>
          {% else %}
            <div class="progress progress-sm mb0">
              <div class="progress-bar progress-bar-success" style="width: {{ percent(course.memberLearnedNum, course.publishedTaskNum) }};"></div>
            </div>
          {% endif %}
        {% endif %}
        <div class="title">
          {{ courseSet.title|sub_text(8) }}
          <span class="pull-right color-primary text-12" data-trigger="hover" data-container="body" 
            data-toggle="popover" data-placement="top" data-content="{{course.title}}">
            <span class="gray-light mrs">|</span>
            {{course.title|sub_text(6)}}
          </span>
        </div>
      </a>
    </li>
  {% endfor %}
</ul>