84 lines
4.2 KiB
HTML
84 lines
4.2 KiB
HTML
{% extends 'base.html' %}
|
|
|
|
{% block title %}{{ article.section.title }} - 长白山消防救援支队{% endblock %}
|
|
|
|
{% block content %}
|
|
<div class="container mt-4">
|
|
<!-- 1. 面包屑导航 -->
|
|
<nav aria-label="breadcrumb" style="margin-left: -10px;">
|
|
<ol class="breadcrumb" style="background-color: transparent !important; padding-bottom: 0;">
|
|
<li class="breadcrumb-item"><a href="/">网站首页</a></li>
|
|
<!-- 动态显示所属板块 -->
|
|
<li class="breadcrumb-item"><a href="#">{{ article.section.parent.title }}</a></li>
|
|
<li class="breadcrumb-item"><a href="#">{{ article.section.title }}</a></li>
|
|
<li class="breadcrumb-item active" aria-current="page">文章详情</li>
|
|
</ol>
|
|
</nav>
|
|
|
|
<!-- 2. 文章主体内容 -->
|
|
<div class="row justify-content-center mt-4">
|
|
<div class="col-lg-10">
|
|
|
|
<!-- 文章头部信息 -->
|
|
<div class="text-center mb-5">
|
|
<h1 class="fw-bold mb-3">{{ article.title }}</h1>
|
|
<div class="text-muted small">
|
|
<span class="me-3"><i class="bi bi-clock"></i> {{ article.created_at|date:"Y-m-d H:i" }}</span>
|
|
<span class="me-3"><i
|
|
class="bi bi-person"></i> {{ article.author.username|default:"管理员" }}</span>
|
|
<span><i class="bi bi-eye"></i> 阅读数：{{ article.views|default:0 }}</span>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 封面图 (如果有) -->
|
|
{% if article.cover %}
|
|
<div class="mb-4 text-center">
|
|
<img src="{{ article.cover.url }}" alt="{{ article.title }}" class="img-fluid rounded shadow-sm"
|
|
style="max-height: 400px; width: 100%; object-fit: cover;">
|
|
</div>
|
|
{% endif %}
|
|
|
|
<!-- 正文内容 -->
|
|
<div class="article-content mb-5" style="line-height: 1.8; font-size: 1.1rem; color: #333;">
|
|
{{ article.content|safe }}
|
|
</div>
|
|
{% with attachments=article.attachments.all %}
|
|
<!-- 3. 附件列表 (如果有附件) -->
|
|
{% if attachments %}
|
|
<div class="card bg-light mb-5">
|
|
<div class="card-header">
|
|
<i class="bi bi-paperclip"></i> 相关附件
|
|
</div>
|
|
<ul class="list-group list-group-flush">
|
|
{% for attachment in attachments %}
|
|
<li class="list-group-item bg-transparent">
|
|
<a href="{{ attachment.file.url }}" target="_blank"
|
|
class="text-decoration-none">
|
|
<i class="bi bi-file-earmark-text"></i>
|
|
<!-- 截取文件名显示，防止太长 -->
|
|
{{ attachment.file.name|slice:"30:" }}
|
|
</a>
|
|
<span class="text-muted small float-end">
|
|
{{ attachment.uploaded_at|date:"Y-m-d" }}
|
|
</span>
|
|
</li>
|
|
{% endfor %}
|
|
</ul>
|
|
</div>
|
|
{% endif %}
|
|
{% endwith %}
|
|
<!-- 4. 底部操作栏 -->
|
|
<div class="d-grid gap-4 d-sm-flex justify-content-sm-center border-top pt-4 mt-5" style="gap: 30px;">
|
|
<a href="javascript:history.back()" class="btn btn-outline-secondary btn px-3">
|
|
<i class="bi bi-arrow-left"></i> 返回上一页
|
|
</a>
|
|
<a href="/" class="btn btn-primary btn px-3">
|
|
<i class="bi bi-house-door-fill"></i> 返回首页
|
|
</a>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endblock %}
|