BBS - 首页个人站点ORM

Posted Alice的小屋

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了BBS - 首页个人站点ORM相关的知识,希望对你有一定的参考价值。

1 ajax和用户认证组件
      ----PIL和session

2 ajax和form组件注册功能

  (1) form请求和ajax上传文件
      form请求:
             <form action="" novalidate enctype="multipart/form-data">
             </form>

             request.FILES("avatar")

      ajax:
            formdata=new FormData()
            formdata.append("","")
            $.ajax({
                url:""
                processData:false,
                contentType:false
                data:formdata
            })

            request.FILES("avatar")

  (2)图像预览

  (3)form组件:
        class Userform(forms.Form):
             user=forms.Charfield()
             email=forms.Emailfield()

        def reg():
            if request.method=="GET":
               form=Userform()
               return render(request,"reg.html",locals())
        在reg.html:
            渲染方式:
               1 :{{form.as_p}}
               2 : {{form.user}}  {{form.user.label}}
               3 : {%for field in form%}
                     {{field}}  {{field.label}}
                   {%endfor%}

        def reg():
            if request.method=="POST":
               form=Userform(request.POST)
               if form.is_valid():
                   form.cleaned_data

               else:
                   form.errors

               return ......

  (4) media配置:
        静态文件的处理又包括STATIC和MEDIA两类,这往往容易混淆,在Django里面是这样定义的:

        MEDIA: 指用户上传的文件,比如在Model里面的FileFIeld,ImageField上传的文件。
        STATIC:指服务器自己的文件。


        示例:
            class User():
                avatar = models.FileField(upload_to=\'avatars/\', default="/avatars/default.png")


            if 实例化一个User对象的时候,avatar字段会接收一个文件对象,这个文件对象
            会默认保存到项目的根目录对应的upload_to=\'avatars/\'的位置

        配置1:
            MEDIA_ROOT=os.path.join(BASE_DIR,"blog","media")

            if 实例化一个User对象的时候,avatar字段会接收一个文件对象,这个文件对象
            会默认保存到MEDIA_ROOT对应路径的upload_to=\'avatars/\'的位置

        配置2:
            settings:
                MEDIA_URL="/media/"
            url.py:
                from django.views.static import serve
                from cnblog_s9 import settings
                # media 配置
                url(r\'^media/(?P<path>.*)$\', serve, {\'document_root\': settings.MEDIA_ROOT}),


            http://127.0.0.1:8000/media/avatars/lufei.jpg


博客系统:
    系统首页
    admin:数据库后台管理web页面

    个人站点:

    查询

        基于对象查询(子查询)

        基于queryset查询(join查询)
笔记

一、首页

 

def index(request):
    article_list = Article.objects.all()

    return render(request, \'index.html\',{\'article_list\':article_list})
# 登录    显示   用户名 ,注销 , 修改密码 。。。
# 未登录 显示 登录 , 注册

<
ul class="nav navbar-nav navbar-right"> {% if request.user.username%} <li><a href="">{{ request.user.username }}</a></li> <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Dropdown <span class="caret"></span></a> <ul class="dropdown-menu"> <li><a href="#">注销</a></li> <li><a href="#">修改密码</a></li> <li role="separator" class="divider"></li> <li><a href="#">更换头像</a></li> </ul> </li> {% else %} <li><a href="">登录</a></li> <li><a href="">注册</a></li> {% endif %}

 文章列表显示:以及用户头像点击到站点

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

        <div class="article_list">
            {% for article in article_list %}

                <div class="article_item">
                    <div><h5><a href="">{{ article.title }}</a></h5></div>
                    <div class="row">

                        <div class="col-md-2"><a href="/blog/{{ article.user.username }}"><img width="60" height="60" src="/media/{{ article.user.avatar }}" alt=""></a> </div>
                        <div class="col-md-9 desc">
                            <p>{{ article.desc }}</p>
                        </div>
                    </div>
                    <div class="small">
                        <span><a href="/blog/{{ article.user.username }}">{{ article.user.username }}</a>发布于</span>&nbsp;&nbsp;&nbsp;
                        <span>{{ article.create_time|date:\'Y-m-d\' }}</span>&nbsp;&nbsp;&nbsp;&nbsp;
                        <span class="glyphicon glyphicon-comment"></span>评论({{ article.comment_count }})&nbsp;&nbsp;&nbsp;
                        {#  <span class="glyphicon glyphicon-comment"></span>评论({{ article.comment_set.count }})&nbsp;&nbsp;&nbsp;#}
                        <span class="glyphicon glyphicon-thumbs-up"></span>赞({{ article.up_count }})
                    </div>
                </div>
                <hr>

            {% endfor %}

        </div>

    </div>

 

注意点:

1. img 的 src 

<img width="60" height="60" src="/media/{{ article.user.avatar }}" alt="">

 2.小图标 点赞数 评论数 

<span class="glyphicon glyphicon-comment"></span>评论({{ article.comment_count }})
<span class="glyphicon glyphicon-thumbs-up"></span>赞({{ article.up_count }})

  因为:点赞数 评论数 要频繁的查,如果每次跨表,效率会低!

 <span class="glyphicon glyphicon-comment"></span>评论({{ article.comment_set.count }})

 所以 不使用这个,跨表查询 article.comment_set.count     而是 新加字段 comment_count 

 之后,在进行一次数据库迁移:makemigrations migrate

 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>index</title>
    <link rel="stylesheet" href="/static/bootstrap-3.3.7/css/bootstrap.css">
    <link rel="stylesheet" href="/static/css/login.css">
    <style type="text/css">
        .article_item .desc{ margin-left: -40px;}
    </style>
</head>
<body>

{# 导航条#}
<nav class="navbar navbar-inverse">
    <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="#">博客园</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="#">Link <span class="sr-only">(current)</span></a></li>
                <li><a href="#">Link</a></li>
                <li class="dropdown">
                    <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Dropdown <span class="caret"></span></a>
                    <ul class="dropdown-menu">
                        <li><a href="#">Action</a></li>
                        <li><a href="#">Another action</a></li>
                        <li><a href="#">Something else here</a></li>
                        <li role="separator" class="divider"></li>
                        <li><a href="#">Separated link</a></li>
                        <li role="separator" class="divider"></li>
                        <li><a href="#">One more separated link</a></li>
                    </ul>
                </li>

            </ul>

            <ul class="nav navbar-nav navbar-right">
                {% if request.user.username%}
                     <li><a href="">{{ request.user.username }}</a></li>
                    <li class="dropdown">
                    <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Dropdown <span class="caret"></span></a>
                    <ul class="dropdown-menu">
                        <li><a href="#">注销</a></li>
                        <li><a href="#">修改密码</a></li>
                        <li role="separator" class="divider"></li>
                        <li><a href="#">更换头像</a></li>
                    </ul>
                </li>
                {% else %}

                    <li><a href="">登录</a></li>
                    <li><a href="">注册</a></li>
                {% endif %}

            </ul>
        </div><!-- /.navbar-collapse -->
    </div><!-- /.container-fluid -->
</nav>


<div class="container-fluid">

    <div class="col-md-2">
        <div class="panel panel-primary">
            <div class="panel-heading">Panel heading without title</div>
            <div class="panel-body">
                Panel content
            </div>
        </div>
        <div class="panel panel-info">
            <div class="panel-heading">Panel heading without title</div>
            <div class="panel-body">
                Panel content
            </div>
        </div>
        <div class="panel panel-warning">
            <div class="panel-heading">Panel heading without title</div>
            <div class="panel-body">
                Panel content
            </div>
        </div>

    </div>
    <div class="col-md-7">

        <div class="article_list">
            {% for article in article_list %}

                <div class="article_item">
                    <div><h5><a href="">{{ article.title }}</a></h5></div>
                    <div class="row">

                        <div class="col-md-2"><a href="/blog/{{ article.user.username }}"><img width="60" height="60" src="/media/{{ article.user.avatar }}" alt=""></a> </div>
                        <div class="col-md-9 desc">
                            <p>{{ article.desc }}</p>
                        </div>
                    </div>
                    <div class="small">
                        <span><a href="/blog/{{ article.user.username }}">{{ article.user.username }}</a>发布于</span>&nbsp;&nbsp;&nbsp;
                        <span>{{ article.create_time|date:\'Y-m-d\' }}</span>&nbsp;&nbsp;&nbsp;&nbsp;
                        <span class="glyphicon glyphicon-comment"></span>评论({{ article.comment_count }})&nbsp;&nbsp;&nbsp;
                        <span class="glyphicon glyphicon-thumbs-up"></span>赞({{ article.up_count }})
                    </div>
                </div>
                <hr>

            {% endfor %}


        </div>


    </div>

    <div class="col-md-3">
        <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>



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

</body>
</BBS--功能4:个人站点页面设计(ORM跨表与分组查询)

BBS项目需求分析及表格创建

BBS那些事儿

BBS项目之个人站点

django bbs框架开发2

DAY87-BBS项目 数据库设计与简单登陆验证码