{% extends "manage_base.html" %}
{% import "components/ui/v1.html" as ui_v1 %}
{% block manage_content %}
<main class="course-video-library ui-page ui-page--compact-type ui-stack">
  {% call ui_v1.page_header('目录管理') %}
    <a class="rounded button" href="{{ url('course_video_main') }}">返回视频库</a>
    <a class="rounded primary button" href="{{ url('course_video_folder_create') }}">新建目录</a>
  {% endcall %}
  <section class="ui-panel">
  {% if folderTree.length %}
    <div class="ui-panel__body"><ul class="ui-item-list">
    {% for folder in folderTree %}
      <li class="ui-item-list__item">
        <div class="ui-item-list__content"><h2 class="ui-item-list__title"><a href="{{ url('course_video_main') }}?courseId={{ folder.id }}">{{ folder.name }}</a></h2></div>
        <div class="ui-item-list__aside ui-cluster">
          <form method="post" class="ui-cluster">
            <input type="hidden" name="operation" value="update_folder"><input type="hidden" name="folderId" value="{{ folder.id }}">
            <label class="ui-field"><span class="ui-field__label">排序值</span><input class="textbox ui-field__control course-video-library__order" type="number" name="order" value="{{ folder.order }}"></label>
            <button class="rounded button" type="submit">保存</button>
          </form>
          <details><summary>删除目录</summary>
            <form method="post" class="ui-stack ui-stack--sm">
              <input type="hidden" name="operation" value="delete_folder"><input type="hidden" name="folderId" value="{{ folder.id }}">
              <p class="ui-muted">目录中的视频将改为不分类，视频和已有绑定不会被删除。</p>
              <button class="rounded button" type="submit">确认删除目录</button>
            </form>
          </details>
        </div>
      </li>
    {% endfor %}
    </ul></div>
  {% else %}<div class="ui-panel__body">{{ ui_v1.empty_state('还没有目录', '视频也可以不分类。') }}</div>{% endif %}
  </section>
</main>
{% endblock %}