{% extends "manage/base.html" %}
{% load staticfiles %}
{% load i18n %}
{% load rest_framework %}
{% load manage_tags %}

{% block content %}
    <div class="page" id="page">
        <div class="page-header" id="toolbar">
            {% if manage.title %}
                <p class="page-title">{{ manage.title }}<i class="fa fa-refresh page-refresh" aria-hidden="true"></i>
                </p>{% endif %}
            <div class="page-operation">
                <form class="form-search" id="searchForm">
                    {% if manage.filter %}
                        {{ manage.filter.form.as_p }}
                    {% endif %}
                    <div class="form-group">
                        {% if manage.filter %}
                            <button class="button button-brand" id="searchBtn">查询</button>
                        {% endif %}
                        {% if manage.export_url %}
                            <a class="button button-info" id="exportBtn">导出</a>
                        {% endif %}
                        {% render_actions manage.actions %}
                    </div>
                </form>
            </div>
            {% render_values manage.statistics %}
        </div>
        <div class="page-body">
            <table id="mTable" class="easyui-datagrid"></table>
        </div>
    </div>
    {% block sub_content %}
    {% endblock %}
    {% if add_serializer %}
        <div id="dialog-add" class="easyui-dialog hidden" closed="true" buttons="#add-dialog-buttons"
             data-options="modal:true,draggable:false">
            <div class="ftitle"></div>
            <form id="fm-add" method="POST" class="form-inline">
                {% csrf_token %}
                {% render_form add_serializer %}
                {% block add_form_extra %}
                {% endblock %}
            </form>
            {% block add_extra %}
            {% endblock %}
        </div>
        <div id="add-dialog-buttons" class="hidden">
            <button href="javaScript:;" class="button button-brand" data-dlg="#dialog-add" data-fm="#fm-add"
                    id="save-add">新建
            </button>
            <button href="javaScript:;" class="button button-close dialog-close" data-dialog="#dialog-add">取消</button>
        </div>
    {% endif %}
    {% if edit_serializer %}
        <div id="dialog-edit" class="easyui-dialog hidden" closed="true" buttons="#edit-dialog-buttons"
             data-options="modal:true,draggable:false">
            <div class="ftitle"></div>
            <form id="fm-edit" method="POST" class="form-inline">
                {% csrf_token %}
                {% render_form edit_serializer %}
                {% block edit_form_extra %}
                {% endblock %}
            </form>
            {% block edit_extra %}
            {% endblock %}
        </div>
        <div id="edit-dialog-buttons" class="hidden">
            <button href="javaScript:;" class="button button-brand" data-dlg="#dialog-edit" data-fm="#fm-edit"
                    id="save-edit">保存
            </button>
            <button href="javaScript:;" class="button button-close dialog-close" data-dialog="#dialog-edit">取消</button>
        </div>
    {% endif %}
{% endblock %}
{% block javascript %}
    <script>
        var CSRF_TOKEN = '{{ csrf_token }}';
        $(function () {
            $(document).on('click', '.dialog-close', function (e) {
                e.preventDefault();
                var $this = $(this);
                var dialog = $this.attr('data-dialog');
                $(dialog).dialog('close');
            });
        });
    </script>
    {% block sub_javascript %}
    {% endblock %}
{% endblock %}