update. 完成前端页面展示、列表和详情页
update. 调整融合主菜单与板块 update. 分离新闻模块
This commit is contained in:
ngfchl
+91
-86
@@ -1,4 +1,6 @@
|
||||
{% load static %}
|
||||
{% load footer_tags %}
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
@@ -39,32 +41,33 @@
|
||||
<li class="{% if request.resolver_match.url_name == 'about' %}active{% endif %}">
|
||||
<a href="{% url 'front:about' %}">单位简介</a>
|
||||
</li>
|
||||
|
||||
<!-- 新闻中心 -->
|
||||
<li class="{% if request.resolver_match.url_name == 'news' %}active{% endif %}">
|
||||
<a href="{% url 'front:news' %}">新闻中心</a>
|
||||
</li>
|
||||
{% show_main_menu %}
|
||||
|
||||
<!-- 信息公开 -->
|
||||
<li class="{% if request.resolver_match.url_name == 'info' %}active{% endif %}">
|
||||
<a href="{% url 'front:info' %}">信息公开</a>
|
||||
</li>
|
||||
<!-- 党建引领 -->
|
||||
<li class="{% if request.resolver_match.url_name == 'party' %}active{% endif %}">
|
||||
<a href="{% url 'front:party' %}">党建引领</a>
|
||||
</li>
|
||||
<!-- 办事服务 -->
|
||||
<li class="{% if request.resolver_match.url_name == 'service' %}active{% endif %}">
|
||||
<a href="{% url 'front:service' %}">办事服务</a>
|
||||
</li>
|
||||
<!-- 互动交流 -->
|
||||
<li class="{% if request.resolver_match.url_name == 'interaction' %}active{% endif %}">
|
||||
<a href="{% url 'front:interaction' %}">互动交流</a>
|
||||
</li>
|
||||
<!-- 消防科普 -->
|
||||
<li class="{% if request.resolver_match.url_name == 'science' %}active{% endif %}">
|
||||
<a href="{% url 'front:science' %}">消防科普</a>
|
||||
</li>
|
||||
{##}
|
||||
{# <!-- 信息公开 -->#}
|
||||
{# <li class="{% if request.resolver_match.url_name == 'info' %}active{% endif %}">#}
|
||||
{# <a href="{% url 'front:info' %}">信息公开</a>#}
|
||||
{# </li>#}
|
||||
{# <!-- 党建引领 -->#}
|
||||
{# <li class="{% if request.resolver_match.url_name == 'party' %}active{% endif %}">#}
|
||||
{# <a href="{% url 'front:party' %}">党建引领</a>#}
|
||||
{# </li>#}
|
||||
{# <!-- 办事服务 -->#}
|
||||
{# <li class="{% if request.resolver_match.url_name == 'service' %}active{% endif %}">#}
|
||||
{# <a href="{% url 'front:service' %}">办事服务</a>#}
|
||||
{# </li>#}
|
||||
{# <!-- 互动交流 -->#}
|
||||
{# <li class="{% if request.resolver_match.url_name == 'interaction' %}active{% endif %}">#}
|
||||
{# <a href="{% url 'front:interaction' %}">互动交流</a>#}
|
||||
{# </li>#}
|
||||
{# <!-- 消防科普 -->#}
|
||||
{# <li class="{% if request.resolver_match.url_name == 'science' %}active{% endif %}">#}
|
||||
{# <a href="{% url 'front:science' %}">消防科普</a>#}
|
||||
{# </li>#}
|
||||
</ul>
|
||||
</div>
|
||||
<span></span>
|
||||
@@ -81,75 +84,77 @@
|
||||
<main class="container main" style="padding: 10px 5px !important;">
|
||||
{% block content %}{% endblock %}
|
||||
</main>
|
||||
<!-- 底部页脚：只需要写这一行，全站生效！ -->
|
||||
|
||||
{% show_footer %}
|
||||
<!-- 底部 -->
|
||||
<footer class="footer">
|
||||
<div class=" d-none d-md-block">
|
||||
<div class="row"
|
||||
style="align-items: center;justify-content: space-evenly;padding: 15px 0;background-color: #F5F5F5;width: 100%!important;margin-left: 0 !important;gap: 10px;">
|
||||
<div style="display: flex;align-items: center;">
|
||||
<img src="{% static "icons/link.svg" %}" alt="" style="width: 13px; height: 13px; object-fit: contain;">
|
||||
<a href="#"
|
||||
style="margin-left: 6px; text-decoration: none; color: #13227a; font-size: 14px; white-space: nowrap;">
|
||||
友情链接
|
||||
</a>
|
||||
</div>
|
||||
<div style="width: 280px;">
|
||||
<select class="form-control" id="exampleFormControlSelect1"
|
||||
x-placement="市政府网站"
|
||||
>
|
||||
<option>市政府网站</option>
|
||||
<option>1</option>
|
||||
<option>2</option>
|
||||
<option>3</option>
|
||||
<option>4</option>
|
||||
<option>5</option>
|
||||
</select>
|
||||
</div>
|
||||
<div style="display: block;width: 280px;">
|
||||
<select class="form-control" id="exampleFormControlSelect1"
|
||||
x-placement="国内消防站点"
|
||||
>
|
||||
<option>国内消防站点</option>
|
||||
<option>1</option>
|
||||
<option>2</option>
|
||||
<option>3</option>
|
||||
<option>4</option>
|
||||
<option>5</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="footer-info">
|
||||
<div class="row">
|
||||
<div class="col-lg-3 col-md-6 text-center">
|
||||
<img src="{% static 'images/red.png' %}">
|
||||
<img class="footerImg" src="{% static 'images/jiucuo.png' %}">
|
||||
</div>
|
||||
<div class="col-lg-6 d-none d-xl-block">
|
||||
<p class="margin-top-20 font-size-14 line-height-2 footerColor">
|
||||
地址：某某市某某东路锦海·某某区大厦B栋14楼 邮编：xxxxxx
|
||||
</p>
|
||||
<p class="font-size-14 line-height-2 footerColor">
|
||||
服务热线：0791-00000000 传真：0791-00000000
|
||||
</p>
|
||||
</div>
|
||||
<div class="col-lg-3 col-md-6 text-center">
|
||||
<img src="/media/upload/images/2026/03/25/wechat.png" alt="">
|
||||
<img class="footerImg" src="/media/upload/images/2026/03/25/weibo.png" alt="">
|
||||
</div>
|
||||
</div>
|
||||
<div class="copyright text-center line-height-2 padding-bottom-20 padding-top-20">
|
||||
<p class="margin-top-20 font-size-14 line-height-2 footerColor">
|
||||
版权所有：长白山消防救援支队 备案证号：<a href="http://beian.miit.gov.cn/"
|
||||
target="_blank">辽ICP备xxxxxxxx号</a>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
{#<footer class="footer">#}
|
||||
{# <div class=" d-none d-md-block">#}
|
||||
{# <div class="row"#}
|
||||
{# style="align-items: center;justify-content: space-evenly;padding: 15px 0;background-color: #F5F5F5;width: 100%!important;margin-left: 0 !important;gap: 10px;">#}
|
||||
{# <div style="display: flex;align-items: center;">#}
|
||||
{# <img src="{% static "icons/link.svg" %}" alt="" style="width: 13px; height: 13px; object-fit: contain;">#}
|
||||
{# <a href="#"#}
|
||||
{# style="margin-left: 6px; text-decoration: none; color: #13227a; font-size: 14px; white-space: nowrap;">#}
|
||||
{# 友情链接#}
|
||||
{# </a>#}
|
||||
{# </div>#}
|
||||
{# <div style="width: 280px;">#}
|
||||
{# <select class="form-control" id="exampleFormControlSelect1"#}
|
||||
{# x-placement="市政府网站"#}
|
||||
{# >#}
|
||||
{# <option>市政府网站</option>#}
|
||||
{# <option>1</option>#}
|
||||
{# <option>2</option>#}
|
||||
{# <option>3</option>#}
|
||||
{# <option>4</option>#}
|
||||
{# <option>5</option>#}
|
||||
{# </select>#}
|
||||
{# </div>#}
|
||||
{# <div style="display: block;width: 280px;">#}
|
||||
{# <select class="form-control" id="exampleFormControlSelect1"#}
|
||||
{# x-placement="国内消防站点"#}
|
||||
{# >#}
|
||||
{# <option>国内消防站点</option>#}
|
||||
{# <option>1</option>#}
|
||||
{# <option>2</option>#}
|
||||
{# <option>3</option>#}
|
||||
{# <option>4</option>#}
|
||||
{# <option>5</option>#}
|
||||
{# </select>#}
|
||||
{# </div>#}
|
||||
{# </div>#}
|
||||
{# </div>#}
|
||||
{# <div class="footer-info">#}
|
||||
{# <div class="row">#}
|
||||
{# <div class="col-lg-3 col-md-6 text-center">#}
|
||||
{# <img src="{% static 'images/red.png' %}">#}
|
||||
{# <img class="footerImg" src="{% static 'images/jiucuo.png' %}">#}
|
||||
{# </div>#}
|
||||
{# <div class="col-lg-6 d-none d-xl-block">#}
|
||||
{# <p class="margin-top-20 font-size-14 line-height-2 footerColor">#}
|
||||
{# 地址：某某市某某东路锦海·某某区大厦B栋14楼 邮编：xxxxxx#}
|
||||
{# </p>#}
|
||||
{# <p class="font-size-14 line-height-2 footerColor">#}
|
||||
{# 服务热线：0791-00000000 传真：0791-00000000#}
|
||||
{# </p>#}
|
||||
{# </div>#}
|
||||
{# <div class="col-lg-3 col-md-6 text-center">#}
|
||||
{# <img src="/media/upload/images/2026/03/25/wechat.png" alt="">#}
|
||||
{# <img class="footerImg" src="/media/upload/images/2026/03/25/weibo.png" alt="">#}
|
||||
{# </div>#}
|
||||
{# </div>#}
|
||||
{# <div class="copyright text-center line-height-2 padding-bottom-20 padding-top-20">#}
|
||||
{# <p class="margin-top-20 font-size-14 line-height-2 footerColor">#}
|
||||
{# 版权所有：长白山消防救援支队 备案证号：<a href="http://beian.miit.gov.cn/"#}
|
||||
{# target="_blank">辽ICP备xxxxxxxx号</a>#}
|
||||
{# </p>#}
|
||||
{# </div>#}
|
||||
{# </div>#}
|
||||
{#</footer>#}
|
||||
<script src="{% static 'js/jquery-3.6.0.min.js' %}"></script>
|
||||
<script src="{% static 'js/bootstrap.bundle.min.js' %}"></script>
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
||||
@@ -47,12 +47,17 @@
|
||||
{% if items %}
|
||||
{% for item in items %}
|
||||
<li class="news-item">
|
||||
<a href="{% url "front:article_detail" pk=item.id %}"
|
||||
style="text-decoration: none;color: black;">
|
||||
|
||||
<div class="news-title-wrapper">
|
||||
<span class="bullet-point"></span>
|
||||
<span class="news-title-text"
|
||||
title="{{ item.title }}">{{ item.title|truncatechars:30 }}</span>
|
||||
</div>
|
||||
<span class="news-date">{{ item.date }}</span>
|
||||
</a>
|
||||
<span class="news-date">{{ item.created_at | date:"Y-m-d" }}</span>
|
||||
|
||||
</li>
|
||||
{% endfor %}
|
||||
{% else %}
|
||||
@@ -63,4 +68,4 @@
|
||||
{% endfor %}
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -0,0 +1,95 @@
|
||||
{% load static %}
|
||||
|
||||
<footer class="footer">
|
||||
<!-- 友情链接区域 -->
|
||||
<div class=" d-none d-md-block">
|
||||
<div class="row"
|
||||
style="align-items: center;justify-content: space-evenly;padding: 15px 0;background-color: #F5F5F5;width: 100%!important;margin-left: 0 !important;gap: 10px;">
|
||||
|
||||
<div style="display: flex;align-items: center;">
|
||||
<img src="{% static "icons/link.svg" %}" alt=""
|
||||
style="width: 13px; height: 13px; object-fit: contain;">
|
||||
<a href="#"
|
||||
style="margin-left: 6px; text-decoration: none; color: #13227a; font-size: 14px; white-space: nowrap;">
|
||||
友情链接
|
||||
</a>
|
||||
</div>
|
||||
{% for category in categories %}
|
||||
<!-- 市政府网站下拉框 -->
|
||||
|
||||
<div style="width: 280px;">
|
||||
<select class="form-control"
|
||||
onchange="if(this.value) window.open(this.value)">
|
||||
<option>{{ category.name }}</option>
|
||||
{% for link in category.links.all %}
|
||||
{% if link.is_active %}
|
||||
<!-- 这里可以动态循环 FooterLink 关联的友情链接对象 -->
|
||||
<option value="{{ link.url }}">{{ link.name }}</option>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</select>
|
||||
</div>
|
||||
|
||||
{% empty %}
|
||||
<!-- 如果后台没配置分类，显示默认占位 -->
|
||||
<div style="width: 280px;">
|
||||
<select class="form-control">
|
||||
<option>暂无链接</option>
|
||||
</select>
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
<!-- 页脚主体信息区域 -->
|
||||
<div class="footer-info">
|
||||
<div class="row">
|
||||
|
||||
<!-- 左侧：Logo 图标 -->
|
||||
<div class="col-lg-3 col-md-6 text-center">
|
||||
<img src="{% static 'images/red.png' %}" alt="政府标识">
|
||||
<img class="footerImg" src="{% static 'images/jiucuo.png' %}" alt="找错">
|
||||
</div>
|
||||
|
||||
<!-- 中间：文字信息 -->
|
||||
<div class="col-lg-6 d-none d-xl-block">
|
||||
<!-- 地址与邮编 -->
|
||||
<p class="margin-top-20 font-size-14 line-height-2 footerColor">
|
||||
地址：{{ footer.address }} 邮编：{{ footer.postal }}
|
||||
</p>
|
||||
<!-- 电话与传真 -->
|
||||
<p class="font-size-14 line-height-2 footerColor">
|
||||
服务热线：{{ footer.telephone }} 传真：{{ footer.fax }}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<!-- 右侧：公众号/微博二维码 -->
|
||||
<div class="col-lg-3 col-md-6 text-center">
|
||||
<!-- 微信二维码 -->
|
||||
{% if footer.official_account %}
|
||||
<img src="{{ footer.official_account.url }}" alt="微信公众号"
|
||||
style="width: 50px; height: 50px; margin-right: 10px;">
|
||||
{% else %}
|
||||
<span>暂无二维码</span>
|
||||
{% endif %}
|
||||
|
||||
<!-- 微博二维码 -->
|
||||
{% if footer.weibo %}
|
||||
<img class="footerImg" src="{{ footer.weibo.url }}" alt="政务微博"
|
||||
style="width: 50px; height: 50px;">
|
||||
{% else %}
|
||||
<span>暂无微博</span>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 版权备案信息 -->
|
||||
<div class="copyright text-center line-height-2 padding-bottom-20 padding-top-20">
|
||||
<p class="margin-top-20 font-size-14 line-height-2 footerColor">
|
||||
版权所有：{{ footer.unit }} 备案证号：
|
||||
<a href="http://beian.miit.gov.cn/" target="_blank">
|
||||
{{ footer.filing }}
|
||||
</a>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
@@ -0,0 +1,9 @@
|
||||
{% load static %}
|
||||
|
||||
{% for menu in menus %}
|
||||
<!-- 新闻中心 -->
|
||||
<li class="{% if request.resolver_match.kwargs.url == menu.url %}active{% endif %}">
|
||||
<a href="{% url 'front:menu' main=menu.code %}">{{ menu.title }}</a>
|
||||
</li>
|
||||
{% endfor %}
|
||||
|
||||
@@ -1,45 +0,0 @@
|
||||
{% load static %}
|
||||
<footer class="site-footer">
|
||||
<div class="footer-top">
|
||||
<div class="footer-links">
|
||||
<span class="link-title">友情链接：</span>
|
||||
<select name="links" id="links">
|
||||
<option value="">市政务网站</option>
|
||||
<option value="">国内消防站点</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="footer-bottom">
|
||||
<div class="footer-left">
|
||||
<div class="gov-logo">
|
||||
<img src="{% static 'images/gov_logo.png' %}" alt="政府机关">
|
||||
<img src="{% static 'images/search_logo.png' %}" alt="政府网站找错">
|
||||
</div>
|
||||
<div class="footer-text">
|
||||
<a href="#">关于我们</a>
|
||||
<a href="#">版权声明</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="footer-center">
|
||||
<p><strong>政府服务热线：</strong> 0433-5312088</p>
|
||||
<p><strong>地址：</strong> 长白山保护开发区消防救援支队防火监督与政策法规科</p>
|
||||
</div>
|
||||
|
||||
<div class="footer-right">
|
||||
<div class="qrcode">
|
||||
<img src="{% static 'images/wechat_qr.png' %}" alt="微信公众号">
|
||||
<p>微信公众号</p>
|
||||
</div>
|
||||
<div class="qrcode">
|
||||
<img src="{% static 'images/weibo_qr.png' %}" alt="政务微博">
|
||||
<p>政务微博</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="footer-copyright">
|
||||
<p>版权所有：长白山消防救援支队 | 网站标识码：XXXXXX | 公网安备：XXXXXXXX</p>
|
||||
</div>
|
||||
</footer>
|
||||
@@ -0,0 +1,80 @@
|
||||
{% 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>
|
||||
|
||||
<!-- 3. 附件列表 (如果有附件) -->
|
||||
{% if article.attachments_list %}
|
||||
<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 article.attachments_list %}
|
||||
<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 %}
|
||||
|
||||
<!-- 4. 底部操作栏 -->
|
||||
<div class="d-grid gap-4 d-sm-flex justify-content-sm-center border-top pt-4 mt-5">
|
||||
<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 %}
|
||||
@@ -7,4 +7,4 @@
|
||||
<body>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
@@ -0,0 +1,50 @@
|
||||
{% extends 'base.html' %}
|
||||
|
||||
{% block title %}页面未找到 - 404 - 长白山消防救援支队{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
<div class="container mt-5">
|
||||
<!-- 面包屑导航 -->
|
||||
<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 active" aria-current="page">404</li>
|
||||
</ol>
|
||||
</nav>
|
||||
|
||||
<!-- 404 核心内容区域 -->
|
||||
<div class="row justify-content-center mt-5">
|
||||
<div class="col-md-8 text-center">
|
||||
|
||||
<!-- 错误图标与代码 -->
|
||||
<div class="mb-4">
|
||||
<!-- 使用简单的 SVG 图标，你也可以换成消防相关的图片 -->
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="80" height="80" fill="#dc3545" class="bi bi-exclamation-triangle-fill" viewBox="0 0 16 16">
|
||||
<path d="M8.982 1.566a1.13 1.13 0 0 0-1.96 0L.165 13.233c-.457.778.091 1.767.98 1.767h13.713c.889 0 1.438-.99.98-1.767L8.982 1.566zM8 5c.535 0 .954.462.9.995l-.35 3.507a.552.552 0 0 1-1.1 0L7.1 5.995A.905.905 0 0 1 8 5zm.002 6a1 1 0 1 1 0 2 1 1 0 0 1 0-2z"/>
|
||||
</svg>
|
||||
</div>
|
||||
|
||||
<!-- 错误标题 -->
|
||||
<h1 class="display-1 fw-bold text-danger" style="font-size: 6rem; line-height: 1;">404</h1>
|
||||
|
||||
<!-- 错误描述 -->
|
||||
<h2 class="h3 mb-3">抱歉，您访问的页面不存在</h2>
|
||||
<p class="lead text-muted mb-4">
|
||||
您请求的页面可能已被删除、名称已更改或暂时不可用。<br>
|
||||
请检查网址是否正确，或返回首页查找所需信息。
|
||||
</p>
|
||||
|
||||
<!-- 操作按钮 -->
|
||||
<div class="d-grid gap-30 d-sm-flex justify-content-sm-center" style="gap: 30px;">
|
||||
<a href="/" class="btn btn-primary btn-md w-auto px-3">
|
||||
<i class="bi bi-house-door-fill"></i> 返回首页
|
||||
</a>
|
||||
<button onclick="history.back()" class="btn btn-outline-secondary w-auto btn-md px-3">
|
||||
<i class="bi bi-arrow-left"></i> 返回上一页
|
||||
</button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endblock %}
|
||||
@@ -0,0 +1,60 @@
|
||||
{% extends 'base.html' %}
|
||||
|
||||
{% block title %}服务器内部错误 - 500 - 长白山消防救援支队{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
<div class="container mt-5">
|
||||
<!-- 面包屑导航 -->
|
||||
<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 active" aria-current="page">系统错误</li>
|
||||
</ol>
|
||||
</nav>
|
||||
|
||||
<!-- 500 核心内容区域 -->
|
||||
<div class="row justify-content-center mt-5">
|
||||
<div class="col-md-8 text-center">
|
||||
|
||||
<!-- 错误图标 -->
|
||||
<div class="mb-4">
|
||||
<!-- 使用齿轮/扳手图标，代表系统维护或故障 -->
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="80" height="80" fill="#6c757d" class="bi bi-gear-fill" viewBox="0 0 16 16">
|
||||
<path d="M9.405 1.05c-.413-1.4-2.397-1.4-2.81 0l-.1.34a1.464 1.464 0 0 1-2.105.872l-.31-.17c-1.283-.698-2.686.705-1.987 1.987l.169.311c.446.82.023 1.841-.872 2.105l-.34.1c-1.4.413-1.4 2.397 0 2.81l.34.1a1.464 1.464 0 0 1 .872 2.105l-.17.31c-.698 1.283.705 2.686 1.987 1.987l.311-.169a1.464 1.464 0 0 1 2.105.872l.1.34c.413 1.4 2.397 1.4 2.81 0l.1-.34a1.464 1.464 0 0 1 2.105-.872l.31.17c1.283.698 2.686-.705 1.987-1.987l-.169-.311a1.464 1.464 0 0 1 .872-2.105l.34-.1c1.4-.413 1.4-2.397 0-2.81l-.34-.1a1.464 1.464 0 0 1-.872-2.105l.17-.31c.698-1.283-.705-2.686-1.987-1.987l-.311.169a1.464 1.464 0 0 1-2.105-.872l-.1-.34zM8 10.93a2.929 2.929 0 1 1 0-5.86 2.929 2.929 0 0 1 0 5.858z"/>
|
||||
</svg>
|
||||
</div>
|
||||
|
||||
<!-- 错误标题 -->
|
||||
<h1 class="display-1 fw-bold text-secondary" style="font-size: 6rem; line-height: 1;">500</h1>
|
||||
|
||||
<!-- 错误描述 -->
|
||||
<h2 class="h3 mb-3">系统内部错误</h2>
|
||||
<p class="lead text-muted mb-4">
|
||||
抱歉，服务器遇到了一些意外情况，无法完成您的请求。<br>
|
||||
我们的技术人员已经收到了错误报告，正在紧急排查修复中。
|
||||
</p>
|
||||
|
||||
<!-- 操作按钮 -->
|
||||
<div class="d-grid gap-30 d-sm-flex justify-content-sm-center">
|
||||
<a href="/" class="btn btn-primary btn-lg px-4">
|
||||
<i class="bi bi-house-door-fill"></i> 返回首页
|
||||
</a>
|
||||
<!-- 刷新按钮 -->
|
||||
<button onclick="window.location.reload()" class="btn btn-outline-secondary btn-lg px-4">
|
||||
<i class="bi bi-arrow-clockwise"></i> 重试
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<!-- 技术支持提示 -->
|
||||
<div class="mt-5 p-3 bg-light rounded">
|
||||
<p class="mb-0 text-muted small">
|
||||
<strong>温馨提示：</strong><br>
|
||||
如果您急需办理业务，请稍后再试，或联系网站管理员。<br>
|
||||
联系电话：0433-xxxxxxx (示例)
|
||||
</p>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endblock %}
|
||||
@@ -1,21 +0,0 @@
|
||||
{% load static %}
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>长白山消防救援支队</title>
|
||||
<link rel="stylesheet" href="{% static 'css/style.css' %}">
|
||||
</head>
|
||||
<body>
|
||||
<!-- 顶部 -->
|
||||
<header class="top-header">
|
||||
<div class="container flex" >
|
||||
<img src="{% static 'images/logo.png' %}" class="logo" alt="">
|
||||
<div>
|
||||
<h1>长白山消防救援支队</h1>
|
||||
<p>CHANGBAI MOUNTAIN FIRE AND RESCUE BRIGADE</p>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
</body>
|
||||
</html>
|
||||
@@ -66,9 +66,10 @@
|
||||
<div class="row">
|
||||
{% for section in section_data %}
|
||||
<div class="col-md-6 col-sm-12" style="margin: 15px auto">
|
||||
{% include 'components/_news_card.html' with data=section.data unique_id=section.key %}
|
||||
{% url "front:main_list" main=section.key as card_more_url %}
|
||||
{% include 'components/_news_card.html' with data=section.data unique_id=section.key more_url=card_more_url %}
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
|
||||
{% endblock %}
|
||||
{% endblock %}
|
||||
|
||||
@@ -1,19 +1,21 @@
|
||||
{% extends 'base.html' %}
|
||||
{% block title %}信息公开 - 长白山消防救援支队{% endblock %}
|
||||
{% block title %}{{ main_section.title }} - 长白山消防救援支队{% endblock %}
|
||||
{% block content %}
|
||||
<div class="container">
|
||||
<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 active" aria-current="page">信息公开</li>
|
||||
<li class="breadcrumb-item active" aria-current="page">{{ main_section.title }}</li>
|
||||
</ol>
|
||||
</nav>
|
||||
<div class="row" style="margin: 15px auto ">
|
||||
<div class="row" style="margin: 15px auto ">
|
||||
{% for section in sections %}
|
||||
<div class="col-6" style="margin: auto auto 15px">
|
||||
{% include 'components/_news_card.html' with data=section.data unique_id=section.key %}
|
||||
{% url "front:sub_list" main=main_section.code sub=section.key as card_more_url %}
|
||||
|
||||
{% include 'components/_news_card.html' with data=section.data unique_id=section.key more_url=card_more_url %}
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endblock %}
|
||||
{% endblock %}
|
||||
|
||||
@@ -0,0 +1,172 @@
|
||||
{% extends 'base.html' %}
|
||||
{% block title %}{{ main_section.title }} - 长白山消防救援支队{% endblock %}
|
||||
{% block content %}
|
||||
<div class="container">
|
||||
<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 active" aria-current="page">{{ main_section.title }}</li>
|
||||
</ol>
|
||||
</nav>
|
||||
|
||||
<div class="row" style="height: 100%;margin: 15px auto;margin-right: 0 !important;">
|
||||
<div class="col-3">
|
||||
<ul class="list-group">
|
||||
<li class="list-group-item" style="background: #23418A; color: #f5f5f5">
|
||||
<a href="{% url "front:main_list" main=main_section.code %}"
|
||||
style="color: #F5F5F5;text-decoration: none;">
|
||||
<h5>{{ main_section.title }}</h5>
|
||||
</a>
|
||||
</li>
|
||||
{% for sec in sections %}
|
||||
<li class="list-group-item">
|
||||
<a href="{% url "front:sub_list" main=main_section.code sub=sec.code %}"
|
||||
style="color: #1d2124;text-decoration: none;"> {{ sec.title }}</a>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
|
||||
</div>
|
||||
<div class="col-9" style="width: 100%;padding-right: 0 !important;">
|
||||
<!-- 组件开始 -->
|
||||
<div class="section-header-card">
|
||||
|
||||
<!-- 左侧文字内容 -->
|
||||
<div class="header-content">
|
||||
<div class="header-title">
|
||||
<span class="icon-circle"></span>
|
||||
{{ sub_section.title | default:main_section.title }}
|
||||
</div>
|
||||
<hr class="divider-line">
|
||||
</div>
|
||||
|
||||
{# <!-- 右侧装饰色块 -->#}
|
||||
{# <div class="right-decoration">#}
|
||||
{# <div class="deco-top"></div>#}
|
||||
{# <div class="deco-bottom"></div>#}
|
||||
{# </div>#}
|
||||
<ul class="list-unstyled mb-0" style="width: 100%;padding-right: 38px; margin-left: 0;">
|
||||
{# items 就是当前 key 对应的列表数据，直接使用 #}
|
||||
{% if articles %}
|
||||
{% for item in articles %}
|
||||
<li class="news-item">
|
||||
<div class="news-title-wrapper">
|
||||
<span class="bullet-point"></span>
|
||||
<span class="news-title-text"
|
||||
title="{{ item.title }}">{{ item.title|truncatechars:30 }}</span>
|
||||
</div>
|
||||
<span class="news-date">{{ item.created_at }}</span>
|
||||
</li>
|
||||
{% endfor %}
|
||||
{% else %}
|
||||
<li class="text-muted text-center py-2">暂无数据</li>
|
||||
{% endif %}
|
||||
</ul>
|
||||
</div>
|
||||
<!-- 组件结束 -->
|
||||
<div style="display: flex; justify-content: center; margin-top: 10px;margin-bottom: -5px;">
|
||||
<ul class="pagination" style="margin: auto;">
|
||||
<li class="page-item">
|
||||
<a class="page-link" href="#" aria-label="Previous">
|
||||
<span aria-hidden="true">«</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="page-item"><a class="page-link" href="#">1</a></li>
|
||||
<li class="page-item"><a class="page-link" href="#">2</a></li>
|
||||
<li class="page-item"><a class="page-link" href="#">3</a></li>
|
||||
<li class="page-item">
|
||||
<a class="page-link" href="#" aria-label="Next">
|
||||
<span aria-hidden="true">»</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<style>
|
||||
|
||||
|
||||
/* --- 组件核心样式 --- */
|
||||
.section-header-card {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
{#max-width: 800px; /* 模拟图片中的长宽比 */#} min-height: 720px; /* 设置一个保底高度 */
|
||||
height: auto; /* 高度随内容增加而增加 */
|
||||
background-color: #ffffff;
|
||||
border-radius: 12px; /* 大圆角 */
|
||||
box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08); /* 柔和阴影 */
|
||||
overflow: hidden; /* 确保右侧装饰块不溢出圆角 */
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
padding-left: 30px;
|
||||
{#justify-content: space-between;#}
|
||||
}
|
||||
|
||||
/* 左侧内容区域 */
|
||||
.header-content {
|
||||
z-index: 2; /* 确保内容在装饰块之上 */
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/* 标题部分 */
|
||||
.header-title {
|
||||
font-size: 20px;
|
||||
font-weight: 700;
|
||||
color: #23408A; /* 深蓝色文字 */
|
||||
margin-bottom: 12px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 空心圆圈图标 */
|
||||
.icon-circle {
|
||||
display: inline-block;
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
border: 2px solid #23408A; /* 边框颜色同文字 */
|
||||
border-radius: 50%;
|
||||
margin-right: 10px;
|
||||
box-sizing: border-box; /* 确保边框包含在宽高内 */
|
||||
}
|
||||
|
||||
/* 分割线 */
|
||||
.divider-line {
|
||||
width: 95%; /* 线条长度，不完全贯穿 */
|
||||
height: 2px;
|
||||
background-color: #23408A; /* 线条颜色比文字稍浅一点或保持一致 */
|
||||
border: none;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
/* --- 右侧装饰块 --- */
|
||||
.right-decoration {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
width: 60px; /* 装饰块宽度 */
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
/* 上方深色块 */
|
||||
.deco-top {
|
||||
flex: 1; /* 占据上半部分 */
|
||||
background-color: #5a6da3; /* 深蓝灰色 */
|
||||
min-height: 50%;
|
||||
}
|
||||
|
||||
/* 下方浅色块 */
|
||||
.deco-bottom {
|
||||
flex: 1; /* 占据下半部分 */
|
||||
background-color: #eef4ff; /* 极浅的蓝色 */
|
||||
min-height: 50%;
|
||||
}
|
||||
|
||||
</style>
|
||||
{% endblock %}
|
||||
@@ -8,7 +8,7 @@
|
||||
<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 active" aria-current="page">信息公开</li>
|
||||
<li class="breadcrumb-item active" aria-current="page">新闻中心</li>
|
||||
</ol>
|
||||
</nav>
|
||||
<div style="margin: 0 5px;">
|
||||
@@ -19,4 +19,4 @@
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endblock %}
|
||||
{% endblock %}
|
||||
|
||||
Reference in New Issue
Block a user