五、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. Python面试题之下面代码会输出什么

    def f(x,l=[]): for i in range(x): l.append(i*i) print l f(2) f(3,[3,2,1]) f(3) 答案: [0, 1] [3, 2, 1, ...

  2. 小部分安卓手机 reload 等方法不执行

    自己解析 url 来赋值刷新页面  方法如下:// location.href function updateUrl(url, key) {     var key = (key || 't') + ...

  3. Windows 下安装 nvm 管理 nodejs 版本

    摘自https://segmentfault.com/a/1190000007612011 1. 下载安装与使用 Github: Download nvm-windows --- nvm-setup. ...

  4. dubbo-源码阅读之Filter实现原理

    最近完成一个需求,使用阿里Arms需要在log里面加上traceId,但是发现dubbo异常 被ExceptionFilter捕获 并打印  打印不出traceI,然后百度搜索如何重写Filter 参 ...

  5. Hbase速览

    一.概述 理解为hadoop中的key-value存储,数据按列存储,基于HDFS和Zookeeper 1.应用 2.场景 适用场景: 存储格式:半结构化数据,结构化数据存储,Key-Value存储 ...

  6. 深入理解Magento – 第七章 – 自定义Magento系统配置

    Magento拥有十分强大的后台管理系统.作为一名开发人员,这套后台管理系统可以让你的用户简单直接的配置Magento系统或者你创建的模块.和Magento的其他功能一样,你第一次使用这套管理系统的时 ...

  7. springMVC配置文件 的约束

    <?xml version="1.0" encoding="UTF-8"?><beans xmlns="http://www.spr ...

  8. Android中对应用程序的行为拦截实现方式概要

    这次是真的好长时间都没有写博客了,主要不是因为工作上的事,主要还是这个问题真的有点复杂,实现起来有点麻烦,所以研究了很长时间(大约有一个月的时间).但是幸好最后问题搞定了~~ 一.问题场景 想实现36 ...

  9. vue简单的input校验手机号

    <input class="phone input-style " :class="{'err-input' : phone.err}" v-model= ...

  10. docker仓库管理(9)

    使用公共 Registry Docker Hub 是 Docker 公司维护的公共 Registry.用户可以将自己的镜像保存到 Docker Hub 免费的 repository 中.如果不希望别人 ...