{% extends "base.html" %}
{% load static %}
{% block title %}
    文章详情:{{ article.title }}
{% endblock title %}
{% block content %}
    <div class="container">
        <div class="row">
            <div class="col-3 mt-4">
                <h4><strong>目录</strong></h4>
                <hr>
                <div>
                    {{ tor|safe }}
                </div>
            </div>
            <div class="col-9">
                <h1 class="mt-4 mb-4">
                    {{ article.title }}
                </h1>
                <div class="col-12 alert alert-success">
                    作者: {{ article.author }}
                    {% if user == article.author %}
                        · <a href="#" onclick="confirm_delete()">
                        删除文章
                    </a>
                        · <a href="{% url 'article:article_update' article.id %}">
                        编辑文章
                    </a>
                    {% endif %}
                    <div>
                        浏览:{{ article.total_views }}
                    </div>
                    <form style="display: none"
                          id="safa_delete"
                          action="{% url 'article:article_safe_delete' article.id %}"
                          method="post"
                    >
                        {% csrf_token %}
                        <button type="submit">
                            发送
                        </button>
                    </form>
                </div>
                <div class="col-12">
                    <p>
                        {{ article.body|safe }}
                    </p>
                </div>
            </div>
        </div>
    </div>
    <script>
        function confirm_delete() {
            layer.open({
                title: "删除文章",
                content: "确认删除这篇文章吗？",
                yes: function (index, layero) {
                    $('form#safe_delete button').click();
                    layer.close(index);
                },
            })
        }
    </script>
{% endblock content %}