{% extends 'admin/admin_base.html' %}
{% import "_macros.html" as macros %}

{% block title %}
    Blog_mini -管理博文
{% endblock %}

{% block admin_content %}
<div class="entry-box manage-articles">
    <h4><strong>管理博文</strong></h4>
    <hr/>
    <p><span class="glyphicon glyphicon-file"></span>博文总数：<span class="badge">{{ Article.query.count() }}</span></p>
    <div class="row articles-list">
        <div class="list-handle">
            <form class="manage-articles" method="post" action="">
                {{ form.csrf_token }}
                <div class="form-group">
                    <div class="col-sm-2">
                        {{ form.types(class='form-control', required='', id='types_choice') }}
                    </div>
                    <div class="col-sm-2">
                        {{ form.source(class='form-control', required='', id='source_choice') }}
                    </div>
                    <div class="col-sm-2">
                        <button type="submit" class="btn btn-primary">
                            <span class="glyphicon glyphicon-search"></span> 筛选
                        </button>
                    </div>
                    <div class="col-sm-2 col-sm-offset-4">
                        <a class="btn btn-danger" id="delArticles">
                            <span class="glyphicon glyphicon-trash"></span>批量删除
                        </a>
                    </div>
                </div>
            </form>
        </div>
        <div class="list-detials">
            <form class="delete-articles" id="delArticlesForm" method="post"
                  action="{{ url_for('admin.delete_articles', types_id=types_id, source_id=source_id, page=page) }}">
                {{ form3.csrf_token }}
                {{ form3.articleIds(type='hidden', value='') }}
                <form class="solve problem">
                    {{ form2.articleId(type='hidden') }}
                {# 注意这个form是不会生成的，内层form，最接近外层form的第一个form，jinjia2是不会生成的 #}
                {# 这是用来解决博文列表的第一列form无法解决的问题，如果不这样做，第一列的删除表单将无法提交，因为根本不存在 #}
                {# 但是第一列之后的form表单都是可以正常生成的，当然，如果不想用这个方法，那建议你不要嵌套form，用Ajax技术也是可以的 #}
                </form>
                <table class="table table-striped table-hover">
                    <thead>
                    <tr class="table-header">
                        <th class="table-checkbox-or-left"><input type="checkbox" id="select-all">全选</th>
                        <th>博文标题</th>
                        <th>来源</th>
                        <th>分类</th>
                        <th>发表日期</th>
                        <th>编辑</th>
                        <th>删除</th>
                    </tr>
                    </thead>
                    <tbody>
                    {% for article in articles %}
                    <tr>
                        <td class="table-checkbox-or-left"><input type="checkbox" class="op_check" value="{{ article.id }}"></td>
                        <td class="table-checkbox-or-left"><a href="{{ url_for('main.articleDetails', id=article.id) }}" target="_blank">{{ article.title }}</a></td>
                        <td>
                            <a href="{{ url_for('main.article_sources', id=article.source.id) }}" target="_blank">
                                {{ article.source.name }}
                            </a>
                        </td>
                        <td>
                            <a href="{{ url_for('main.articleTypes', id=article.articleType.id) }}" target="_blank">
                                {{ article.articleType.name }}
                            </a>
                        </td>
                        <td>{{ moment(article.create_time.replace(microsecond=0)).format('LLL') }}</td>
                        <td>
                            <a href="{{ url_for('admin.editArticles', id=article.id) }}">
                                <span class="glyphicon glyphicon-pencil" title="编辑博文"></span>
                            </a>
                        </td>
                        <td>
                            <form class="delete-article" id="delForm{{ article.id }}" method="post"
                                  action="{{ url_for('admin.delete_article', types_id=types_id, source_id=source_id, page=page) }}">
                                {{ form2.csrf_token }}
                                {{ form2.articleId(type='hidden', value=article.id) }}
                                <a class="btn btn-sm btn-default" onclick="delCfm({{ article.id }})"  title="删除博文">
                                    <span class="glyphicon glyphicon-trash delete-article"></span>
                                </a>
                                {# 注意这里用a标签而不是button标签，否则即使button没有submit属性，也会自动提交，因为button默认type='submit'#}
                            </form>
                        </td>
                    </tr>
                    {% endfor %}
                    </tbody>
                </table>
            </form>
        </div>
        <div class="pagination">
            {{ macros.pagination_widget(pagination, endpoint, types_id=types_id, source_id=source_id) }}
        </div>
    </div>
</div>
<!-- 信息删除确认: For delete an article confirm -->
<div class="modal fade" id="delCfmModel">
    <div class="modal-dialog">
        <div class="modal-content message_align">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
                        aria-hidden="true">×</span></button>
                <h4 class="modal-title">确认删除博文？</h4>
            </div>
            <div class="modal-body">
                <p>将连同博文评论一起删除，并且删除后不可恢复，您确认要删除吗？</p>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                <a onclick="" id="cfmClick" class="btn btn-success" data-dismiss="modal">确定</a>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div><!-- /.modal -->

<!-- 信息删除确认: For select articles confirm -->
<div class="modal fade" id="selArtsCfmModel">
    <div class="modal-dialog">
        <div class="modal-content message_align">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
                        aria-hidden="true">×</span></button>
                <h4 class="modal-title">未选择博文</h4>
            </div>
            <div class="modal-body">
                <p>请选择您要删除的博文！</p>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                <a class="btn btn-success" data-dismiss="modal">确定</a>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div><!-- /.modal -->

<!-- 信息删除确认: For delete articles confirm -->
<div class="modal fade" id="delArtsCfmModel">
    <div class="modal-dialog">
        <div class="modal-content message_align">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
                        aria-hidden="true">×</span></button>
                <h4 class="modal-title">确认删除所选博文？</h4>
            </div>
            <div class="modal-body">
                <p>将连同博文评论一起删除，并且删除后不可恢复，您确认要删除所选博文吗？</p>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                <a id="delArtsCfm" class="btn btn-success" data-dismiss="modal">确定</a>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div><!-- /.modal -->
{% endblock %}