五、Home主页与个人站点主页

home首页代码：

# views.py视图函数部分代码
def home(request):

    # 将数据库中的所有文章展示到主页

    article_list = models.Article.objects.all()

    return render(request, 'home.html', locals())
<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>BBS论坛</title>

    <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>

    <link rel="stylesheet" href="/static/bootstrap-3.3.7/css/bootstrap.min.css">

    <script src="/static/bootstrap-3.3.7/js/bootstrap.min.js"></script>

</head>

<body>

<nav class="navbar navbar-default">

    <div class="container-fluid">

        <!-- Brand and toggle get grouped for better mobile display -->

        <div class="navbar-header">

            <button type="button" class="navbar-toggle collapsed" data-toggle="collapse"

                    data-target="#bs-example-navbar-collapse-1" aria-expanded="false">

                <span class="sr-only">Toggle navigation</span>

                <span class="icon-bar"></span>

                <span class="icon-bar"></span>

                <span class="icon-bar"></span>

            </button>

            <a class="navbar-brand" href="#">BBS论坛</a>

        </div>

        <!-- Collect the nav links, forms, and other content for toggling -->

        <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">

            <ul class="nav navbar-nav">

                <li class="active"><a href="#">随笔 <span class="sr-only">(current)</span></a></li>

                <li><a href="#">文章</a></li>

            </ul>

            <ul class="nav navbar-nav navbar-right">

                {% if request.user.is_authenticated %}

                    <li><img src="/media/{{ request.user.avatar }}" alt="" width="45px" class="img-circle"></li>

                    <li><a href="/{{ request.user.username }}" id="id_username">{{ request.user.username }}</a></li>

                    <li class="dropdown">

                        <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true"

                           aria-expanded="false">更多操作 <span class="caret"></span></a>

                        <ul class="dropdown-menu">

                            <li><a href="/set_password/">修改密码</a></li>

                            <li><a href="/set_avatar/">修改头像</a></li>

                            <li><a href="/backend/">后台管理</a></li>

                            <li role="separator" class="divider"></li>

                            <li><a href="/logout/">注销</a></li>

                        </ul>

                    </li>

                {% else %}

                    <li><a href="/login/">登录</a></li>

                    <li><a href="/register/">注册</a></li>

                {% endif %}

            </ul>

        </div><!-- /.navbar-collapse -->

    </div><!-- /.container-fluid -->

</nav>

<div class="container-fluid">

    <div class="row">

        <div class="col-md-2">

            <div class="panel panel-success">

                <div class="panel-heading">

                    <h3 class="panel-title">Panel title</h3>

                </div>

                <div class="panel-body">

                    Panel content

                </div>

            </div>

            <div class="panel panel-warning">

                <div class="panel-heading">

                    <h3 class="panel-title">Panel title</h3>

                </div>

                <div class="panel-body">

                    Panel content

                </div>

            </div>

            <div class="panel panel-danger">

                <div class="panel-heading">

                    <h3 class="panel-title">Panel title</h3>

                </div>

                <div class="panel-body">

                    Panel content

                </div>

            </div>

        </div>

        <div class="col-md-8">

            {% for article in article_list %}

                <ul class="media-list">

                    <li class="media">

                        <h4 class="media-heading"><a

                                href="/{{ article.blog.userinfo.username }}/article/{{ article.pk }}">{{ article.title }}</a>

                        </h4>

                        <div class="media-left">

                            <a href="#">

                                <img class="media-object img-circle" src="/media/{{ article.blog.userinfo.avatar }}"

                                     width="60" alt="...">

                            </a>

                        </div>

                        <div class="media-body">

                            {{ article.desc }}

                        </div>

                        <div style="margin-top: 10px; color: darkgrey" class="pull-right">

                            {# zhangsan 发布于 2019-06-22 21:43 评论(0)点赞(159)#}

                            <span><a href="">{{ article.blog.userinfo.username }}&nbsp;&nbsp;</a></span>

                            <span>发布于&nbsp;{{ article.create_time|date:'Y-m-d' }}&nbsp;&nbsp;</span>

                            <span><span class="glyphicon glyphicon-comment"></span>评论({{ article.comment_num }})&nbsp;&nbsp;</span>

                            <span><span class="glyphicon glyphicon-thumbs-up"></span>点赞({{ article.up_num }})&nbsp;&nbsp;</span>

                        </div>

                    </li>

                </ul>

                <hr>

            {% endfor %}

        </div>

        <div class="col-md-2">

            <div class="panel panel-success">

                <div class="panel-heading">

                    <h3 class="panel-title">Panel title</h3>

                </div>

                <div class="panel-body">

                    Panel content

                </div>

            </div>

            <div class="panel panel-warning">

                <div class="panel-heading">

                    <h3 class="panel-title">Panel title</h3>

                </div>

                <div class="panel-body">

                    Panel content

                </div>

            </div>

            <div class="panel panel-danger">

                <div class="panel-heading">

                    <h3 class="panel-title">Panel title</h3>

                </div>

                <div class="panel-body">

                    Panel content

                </div>

            </div>

        </div>

    </div>

</div>

</body>

</html>

home.html

个人站点代码：

def site(request, username, *args, **kwargs):  # kwargs   'condition':'' , 'param':''

    user_obj = models.UserInfo.objects.filter(username=username).first()

    blog = user_obj.blog

    article_list = models.Article.objects.filter(blog=blog)

    if not user_obj:

        return render(request, 'error.html')

    if kwargs:

        condition = kwargs.get('condition')

        param = kwargs.get('param')

        if condition == 'category':

            article_list = article_list.filter(category_id=param)

        elif condition == 'tag':

            article_list = article_list.filter(tags__pk=param)

        else:

            # param = '2018-06'

            year, month = param.split('-')

            article_list = article_list.filter(create_time__year=year, create_time__month=month)

    # # 统计当前用户对应的每一个分类及分类下的文章数

    # category_list = models.Category.objects.filter(blog=blog).annotate(c=Count('article')).values_list('name', 'c', 'pk')

    # print(category_list)

    # # 统计当前用户对应的每一个标签及标签下的文章数

    # tag_list = models.Tag.objects.filter(blog=blog).annotate(c=Count('article')).values_list('name', 'c', 'pk')

    # print(tag_list)

    # # 按日期归档

    # date_list = models.Article.objects.filter(blog=blog).annotate(month=TruncMonth('create_time')).values('month').annotate(

    #     c=Count('pk')).values_list('month', 'c')

    # print(date_list)

    return render(request, 'site.html', locals())

views.py视图函数部分代码

from django import template

from app01 import models

from django.db.models import Count

from django.db.models.functions import TruncMonth

register = template.Library()

@register.inclusion_tag('left_menu.html', name='left_menu')

def left_menu(username):

    user_obj = models.UserInfo.objects.filter(username=username).first()

    blog = user_obj.blog

    # 统计当前用户对应的每一个分类及分类下的文章数

    category_list = models.Category.objects.filter(blog=blog).annotate(c=Count('article')).values_list('name', 'c',

                                                                                                       'pk')

    # print(category_list)

    # 统计当前用户对应的每一个标签及标签下的文章数

    tag_list = models.Tag.objects.filter(blog=blog).annotate(c=Count('article')).values_list('name', 'c', 'pk')

    # print(tag_list)

    # 按日期归档

    date_list = models.Article.objects.filter(blog=blog).annotate(month=TruncMonth('create_time')).values(

        'month').annotate(

        c=Count('pk')).values_list('month', 'c')

    # print(date_list)

    return {'user_obj': user_obj, 'blog': blog, 'category_list': category_list, 'tag_list': tag_list,

            'date_list': date_list}

mytag.py 后端模板逻辑

前端：

base.html 模板

left_menu.html  侧边栏部分内容

site.html 个人站点主页

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>BBS论坛</title>

    <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>

    <link rel="stylesheet" href="/static/bootstrap-3.3.7/css/bootstrap.min.css">

    <script src="/static/bootstrap-3.3.7/js/bootstrap.min.js"></script>

    <link rel="stylesheet" href="/static/css/{{ blog.theme }}.css">

    {% block css %}

    {% endblock %}

</head>

<body>

<!--导航栏开始-->

<nav class="navbar navbar-default">

    <div class="container-fluid">

        <!-- Collect the nav links, forms, and other content for toggling -->

        <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">

            <div>

                <span class="h2">{{ blog.site_title }}de个人博客</span>

                <a href="/home/" class="btn  btn-success pull-right">返回首页</a></div>

        </div><!-- /.navbar-collapse -->

    </div><!-- /.container-fluid -->

</nav>

<!--导航栏结束-->

<div class="container-fluid">

    <div class="row">

         <div class="col-md-2">

            {% load mytag %}

             {% left_menu username %}

        </div>

        <div class="col-md-10">

        {% block content %}

        {% endblock %}

        </div>

    </div>

</div>

{% block js %}

{% endblock %}

</body>

</html>

base.html

<div class="panel panel-success">

  <div class="panel-heading">

    <h3 class="panel-title">文章分类</h3>

  </div>

  <div class="panel-body">

    {% for category in category_list %}

        <p><a href="/{{ user_obj.username }}/category/{{ category.2 }}">{{ category.0 }}({{ category.1 }})</a></p>

    {% endfor %}

  </div>

</div>

<div class="panel panel-warning">

  <div class="panel-heading">

    <h3 class="panel-title">文章标签</h3>

  </div>

  <div class="panel-body">

    {% for tag in tag_list %}

        <p><a href="/{{ user_obj.username }}/tag/{{ tag.2 }}">{{ tag.0 }}({{ tag.1 }})</a></p>

    {% endfor %}

  </div>

</div>

<div class="panel panel-danger">

  <div class="panel-heading">

    <h3 class="panel-title">文章日期</h3>

  </div>

  <div class="panel-body">

    {% for date in date_list %}

        <p><a href="/{{ user_obj.username }}/archive/{{ date.0|date:'Y-m' }}">{{ date.0|date:'Y年m月' }}({{ date.1 }})</a></p>

    {% endfor %}

  </div>

</div>

left_menu.html

{% extends 'base.html' %}

{% block content %}

{% for article in article_list %}

    <ul class="media-list">

        <li class="media">

            <h4 class="media-heading"><a href="/{{ user_obj.username }}/article/{{ article.pk }}">{{ article.title }}</a></h4>

            <div class="media-left">

                <a href="#">

                    <img class="media-object img-circle" src="/media/{{ article.blog.userinfo.avatar }}"

                         width="60" alt="...">

                </a>

            </div>

            <div class="media-body">

                {{ article.desc }}

            </div>

            <div style="margin-top: 10px; color: darkgrey" class="pull-right">

                {# posted @ 2019-06-22 21:43 XXX 评论(0)点赞(159)#}

                <span>posted&nbsp;@&nbsp;{{ article.create_time|date:'Y-m-d' }}&nbsp;</span>

                <span>{{ article.blog.userinfo.username }}&nbsp; </span>

                <span class="glyphicon glyphicon-comment">评论({{ article.comment_num }}&nbsp;</span>

                <span class="glyphicon glyphicon-thumbs-up">点赞({{ article.up_num }})&nbsp; </span>

                <span><a href="">编辑</a></span>

            </div>

        </li>

    </ul>

    <hr>

{% endfor %}

{% endblock %}

site.html

BBS论坛 home主页与个人站点主页的更多相关文章

  1. Httpd服务入门知识-Httpd服务常见配置案例之定义站点主页面及错误页面配置

    Httpd服务入门知识-Httpd服务常见配置案例之定义站点主页面及错误页面配置 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.定义站点主页面 [root@node101.yi ...

  2. python第一百三十天 ---简单的BBS论坛

    简单的BBS论坛 实现功能 git仓库地址:https://github.com/uge3/BBS 1.整体参考“抽屉新热榜” + “博客园” 2.实现不同论坛版块 3.帖子列表展示 4.个人博客主页 ...

  3. BBS论坛 后台管理

    七.后台管理 后台管理页面: <!DOCTYPE html> <html lang="en"> <head> <meta charset= ...

  4. python 学习笔记二十 django项目bbs论坛

    项目:开发一个简单的BBS论坛 需求: 整体参考“抽屉新热榜” + “虎嗅网” 实现不同论坛版块 帖子列表展示 帖子评论数.点赞数展示 在线用户展示 允许登录用户发贴.评论.点赞 允许上传文件 帖子可 ...

  5. Python之路,Day17 - 分分钟做个BBS论坛

    Python之路,Day17 - 分分钟做个BBS论坛   本节内容: 项目:开发一个简单的BBS论坛 需求: 整体参考"抽屉新热榜" + "虎嗅网" 实现不同 ...

  6. Python开发一个简单的BBS论坛

    项目:开发一个简单的BBS论坛 需求: 整体参考“抽屉新热榜” + “虎嗅网” 实现不同论坛版块 帖子列表展示 帖子评论数.点赞数展示 在线用户展示 允许登录用户发贴.评论.点赞 允许上传文件 帖子可 ...

  7. Python之路【第十八篇】Django小项目简单BBS论坛部分内容知识点

    开发一个简单的BBS论坛 项目需求: 整体参考“抽屉新热榜” + “虎嗅网” 实现不同论坛版块 帖子列表展示 帖子评论数.点赞数展示 在线用户展示 允许登录用户发贴.评论.点赞 允许上传文件 帖子可被 ...

  8. Django小项目简单BBS论坛

    开发一个简单的BBS论坛 项目需求: 1 整体参考"抽屉新热榜" + "虎嗅网" 2 实现不同论坛版块 3 帖子列表展示 4 帖子评论数.点赞数展示 5 在线用 ...

  9. bbs论坛浏览器兼容性问题

    一直都是在chrome上进行调试,今天终于把bbs论坛这个项目搭建完了,进入IE.Firefox看了看 吓哭了!!! 火狐 Edge chrome 特别是加了<!DOCTYPE html> ...

随机推荐

  1. 16-vim-查找字符或单词-01-查找

    1.常规查找 查找到指定内容之后,使用n查找下一个出现的位置. 命令 功能 /str 查找str 例:/python n 查找下一个 N 查找上一个 2.单词快速匹配(常用) 命令 功能 * 向下查找 ...

  2. Android开发之程序猿必需要懂得Android的重要设计理念

         前几天去參加了带着自己的作品去參加服务外包大赛,由于签位抽到的比較靠后就等待了蛮久,就跟坐在前面的一起參赛的选手開始讨论Android的开发经验.各自给对方展示了自己的作品,小伙伴就建议我看 ...

  3. neo4j APOC与自定义存储过程环境搭建

    neo4j APOC与自定义存储过程环境搭建 主要参考资料:APOC官网https://neo4j-contrib.github.io/neo4j-apoc-procedures/APOC介绍 PPT ...

  4. 怎么在vue-cli中利用 :class去做一个底层背景或者文字的点击切换

    // html <div class="pusherLists" :class="{hidden: isHidden}"> <span @cl ...

  5. Pytest 通过文件名类名方法执行部分用例

    • 场景:只执行符合要求的某一部分用例,通过类与方法的命名实 现.通常编写测试方法时 • 解决:直接输入文件名,类名 pytest test_class_01.py • pytest -v -s te ...

  6. LeetCode Array Easy 189. Rotate Array

    ---恢复内容开始--- Description Given an array, rotate the array to the right by k steps, where k is non-ne ...

  7. 【记录】安装mysql Install/Remove of the Service Denied!错误的解决办法

    最近安装 Mysql 5.6版本,在安装的过程中出现Install/Remove of the Service Denied!错误!(本人Win10 系统) 出现此问题是由于当前用户权限不够,需要以管 ...

  8. vue Inline JavaScript is not enabled. Is it set in your options?

    Vue 全家桶 vue全面介绍--全家桶.项目实例 https://www.cnblogs.com/nogodie/p/9853660.html vue项目 Inline JavaScript is ...

  9. Ubuntu 图形桌面死机重启（机器不重启）

    Ubuntu的图形界面容易死机,如果正在跑程序的话又不能重启.这时候可以通过终端来_重启_图形界面. 首先按Alt+Ctrl+F1进入终端界面.查看图形界面的进程: ps -t tty7 查看到名为X ...

  10. Tool ALL Framework

    //https://www.cnblogs.com/jiftle/p/10895260.html C++ 资源大全 关于 C++ 框架.库和资源的一些汇总列表,内容包括:标准库.Web应用框架.人工智 ...