标签：blog banner request 站点密码 user article password BBS

修改密码

后台

@login_required(login_url='/login/')
def change_password(request):
    # 1 取出原密码---校验原密码是否正确
    old_password = request.POST.get('old_password')
    if request.user.check_password(old_password):
        new_password = request.POST.get('new_password')
        re_new_password = request.POST.get('re_new_password')
        # 2 取出新密码和确认新密码
        if new_password == re_new_password:
            request.user.set_password(new_password)
            request.user.save()  # 一定不要忘了
            return JsonResponse({'code': 100, 'msg': '修改成功'})
        else:
            return JsonResponse({'code': 101, 'msg': '两次密码不一致'})
    else:
        return JsonResponse({'code': 102, 'msg': '原密码错误'})

前台

<div>
                <div class="modal fade" tabindex="-1" role="dialog" aria-labelledby="gridSystemModalLabel"
                     id="gridSystemModal">
                    <div class="modal-dialog" role="document">
                        <div class="modal-content">
                            <div class="modal-header">
                                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
                                        aria-hidden="true">×</span></button>
                                <h4 class="modal-title" id="gridSystemModalLabel">修改密码</h4>
                            </div>
                            <div class="modal-body">
                                <div class="alert alert-warning alert-dismissible fade in hidden" role="alert"
                                     id="alert_error">
                                    <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span
                                            aria-hidden="true">×</span></button>
                                    <strong>密码修改成功</strong>
                                </div>
                                <form>
                                    {% csrf_token %}
                                    <div class="form-group">
                                        <label for="">原密码</label>
                                        <input type="password" name="old_password" class="form-control">
                                    </div>
                                    <div class="form-group">
                                        <label for="">新密码</label>
                                        <input type="password" name="new_password" class="form-control">
                                    </div>
                                    <div class="form-group">
                                        <label for="">确认新密码</label>
                                        <input type="password" name="re_new_password" class="form-control">
                                    </div>
                                </form>
                            </div>
                            <div class="modal-footer">
                                <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                                <button type="button" class="btn btn-primary" id="id_submit">确定</button>
                            </div>
                        </div><!-- /.modal-content -->
                    </div><!-- /.modal-dialog -->
                </div><!-- /.modal -->


            </div>

 $('#id_submit').click(function () {
        // 让按钮不可点击
        //$(this).addClass('disabled')
        // jquery 都是给标签修改属性--attr-自定义属性和prop->自有属性的区别
        $(this).prop('disabled', true)
        $.ajax({
            url: '/change_password/',
            method: 'post',
            data: {
                old_password: $('[name="old_password"]').val(),
                new_password: $('[name="new_password"]').val(),
                re_new_password: $('[name="re_new_password"]').val(),
                csrfmiddlewaretoken: $('[name="csrfmiddlewaretoken"]').val()

            },
            success: function (data) {
                console.log(data)
                // 显示错误信息，并显示
                $('#alert_error').removeClass('hidden').children('strong').html(data.msg)
                // 让按钮可以点击
                $('#id_submit').prop('disabled', false)
                if (data.code == 100) {
                    $('#alert_error').addClass('hidden')
                    // 模态框消失
                    $('#gridSystemModal').modal('hide')
                    // 跳到登录，重新登录
                    location.href = '/login/'
                } else {
                    // 3s 后，错误提示消失
                    setTimeout(function () {
                        $('#alert_error').addClass('hidden')
                    }, 3000)
                }

            }
        })
    })

轮播图

　　轮播图----多张大小完全一致 ——介于数据库中找

render显示

后台

def index(request):
    # 取出所有文章--》没有加分页
    article_list = Article.objects.all().order_by('create_time')
    # 推荐文章--》按阅读数高的排-->取5条
    # article_hot = Article.objects.all().order_by('点赞数')

    # 去 banner表中取出头三张轮播图图片---》把对象---》转成--》列表套字典形式
    '''
    [{url:/media/banner/1.png,msg:广告,to:'/article/1.html/'},{url:/media/banner/1.png,msg:广告,to:'/article/1.html/'}]
    '''
    banner_list = [
        {'url': '/media/banner/1.png', 'msg': '我们有篇好文章欢迎你观看', 'to': '/article/1.html/'},
        {'url': '/media/banner/2.png', 'msg': '快来注册把', 'to': '/register/'}, ]

    return render(request, 'index.html', {'article_list': article_list, 'banner_list': banner_list})

前台

 <div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
                <ol class="carousel-indicators">
                    <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
                    <li data-target="#carousel-example-generic" data-slide-to="1"></li>
                </ol>
                <div class="carousel-inner" role="listbox">
                    {% for banner in banner_list %}

                        {% if forloop.first %}
                            <div class="item active">
                        {% else %}
                            <div class="item">
                        {% endif %}
                    <a href="{{ banner.to }}">
                        <img src="{{ banner.url }}" alt="..." class="img">
                        <div class="carousel-caption">
                            {{ banner.msg }}
                        </div>
                    </a>
                    </div>

                    {% endfor %}
                    <!-- Controls -->
                    <a class="left carousel-control" href="#carousel-example-generic" role="button"
                       data-slide="prev">
                        <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
                        <span class="sr-only">Previous</span>
                    </a>
                    <a class="right carousel-control" href="#carousel-example-generic" role="button"
                       data-slide="next">
                        <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
                        <span class="sr-only">Next</span>
                    </a>
                    </div>

                </div>

ajax显示

后端

def get_banner(request):
    banner_list = [
        {'url': '/media/banner/3.png', 'msg': '看yy', 'to': '/login/'},
        {'url': '/media/banner/3.png', 'msg': '看xx', 'to': 'http://www.baidu.com'}, ]
    return JsonResponse({'code': 100, 'results': banner_list})

前端

 js 渲染轮播图---》之前用render渲染轮播图---》当页面加载成功---》发送ajax--》获取图片---》使用js写在页面上
    $(function () {
        // 发送ajax请求
        $.ajax({
            url: '/get_banner/',
            method: 'get',
            success: function (data) {
                console.log(data)

                // js 写到页面上
                $('.img').each(function (i, v) {
                    console.log(i)
                    console.log(v)
                    // v 是原生dom对象，不是jq的对象，使用$(v) 转成jq对象，支持链式调用
                    $(v).attr('src', data.results[i].url).parent().attr('href', data.results[i].to).children('div').html(data.results[i].msg)

                })

            }
        })
    })

个人站点页面

# 设计  路由 
# 路由
# 个人站点路由放最后---》上面所有都匹配完了--->再看是不是个人站点
path('<str:username>', views.site),
# re_path('(?P<username>\w+)', views.site),


# 视图函数
def site(request, username):
    # 个人站点不存在---》根据用户名查不到用户，就是404
    user = UserInfo.objects.filter(username=username).first()
    if user:
        # 查出当前用户，所有的文章
        article_list = Article.objects.filter(blog_id=user.blog.id).all()
        # article_list=Article.objects.filter(blog=user.blog).all()
        return render(request, 'site.html', locals())
    else:
        return render(request, '404.html')

base.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="/static/js/jquery.min.js"></script>
    <link rel="stylesheet" href="/static/bootstrap/css/bootstrap.min.css">
    <script src="/static/bootstrap/js/bootstrap.min.js"></script>
    {% block header %}

    {% endblock %}

</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="/">博客园</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>
            {% if  request.user.is_authenticated %}
                <ul class="nav navbar-nav navbar-right">
                    <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">更多操作 <span class="caret"></span></a>
                        <ul class="dropdown-menu">
                            <li><a href="#">后台管理</a></li>
                            <li><a href="#"><span data-target="#gridSystemModal" data-toggle="modal">修改密码</span></a>
                            </li>
                            <li><a href="#">修改头像</a></li>
                            <li role="separator" class="divider"></li>
                            <li><a href="/logout/">退出</a></li>
                        </ul>
                    </li>
                </ul>
            {% else %}
                <ul class="nav navbar-nav navbar-right">
                    <li><a href="/login/">登录</a></li>
                    <li><a href="/register/">注册</a></li>

                </ul>
            {% endif %}


        </div><!-- /.navbar-collapse -->
    </div><!-- /.container-fluid -->
</nav>
<div class="container-fluid">
    <div class="row">
        <div class="col-md-2">
            {% block left %}

            {% endblock %}
        </div>
        <div class="col-md-9">
            {% block content %}
            
            {% endblock %}
            
            
        </div>
    </div>
</div>


</body>
</html>

site.html

{% extends 'base.html' %}
{% block header %}
    <link rel="stylesheet" href="/static/font-awesome/css/font-awesome.min.css">
{% endblock %}

{% block left %}
    <div class="panel panel-primary">
        <div class="panel-heading"><h3 class="panel-title">标签</h3></div>
        <div class="panel-body">

        </div>
    </div>
    <div class="panel panel-info">
        <div class="panel-heading"><h3 class="panel-title">分类</h3></div>
        <div class="panel-body">


        </div>
    </div>
    <div class="panel panel-danger">
        <div class="panel-heading"><h3 class="panel-title">时间</h3></div>
        <div class="panel-body"> Panel content</div>
    </div>
{% endblock %}


{% block content %}
    {% for article in article_list %}
        <div class="media">
            <h3 class="media-heading"><a href="">{{ article.title }}</a></h3>
            <div class="clearfix">
                <div class="media-left pull-right">

                    <a href="#">
                        <img alt="64x64" class="media-object" style="width: 64px; height: 64px;"
                             src="/media/{{ article.blog.userinfo.avatar }}">
                    </a>
                </div>
                <div class="media-body">
                    {{ article.desc }}
                </div>
            </div>
            <div class="bottom-article pull-right" style="margin-top: 8px">
                <span>posted @</span>
                <span>{{ article.create_time|date:'Y-m-d H:i:s' }}</span>
                <span class="glyphicon glyphicon-thumbs-up">{{ article.up_number }}</span>
                <span><i class="fa fa-address-card-o"
                         style="margin-right: 10px"></i><span>{{ article.commit_number }}</span></span>
                <span><a href="">编辑</a></span>
            </div>
        </div>
        <hr>
    {% endfor %}

{% endblock %}

侧边栏筛选

id   title                         create_time                 create_date
1	快速认识什么是：		   2023-12-08 11:22:35.329031	   2023-12
2	c高并发必备技巧（三）	 	  2023-12-08 11:22:59.018692	  2023-12
3	虚拟机运行Hadoop  	      2023-12-08 11:23:19.949809	   2023-12
5	基于DotNetty实现自动发布	2023-12-11 12:30:00.119046	    2023-12


4	【UniApp】-uni-app概述	    2023-12-08 11:23:43.763246	    2023-11

后端

def site(request, username):
    # 个人站点不存在---》根据用户名查不到用户，就是404
    user = UserInfo.objects.filter(username=username).first()
    if user:
        # 查出当前用户（不是当前登录用户），所有的文章
        article_list = Article.objects.filter(blog_id=user.blog.id).all()
        # article_list=Article.objects.filter(blog=user.blog).all()
        # 分类：比较复杂的查询---》查询当前传入名字的用户 ---》所有的分类---》及分类下文章数---》分组
        # Category.objects.all().filter(blog=user.blog) # 当前用户所有分类查出来了
        # 我们的目标是查询 当前用户 所有文章，按分类分组--》数每个分组下的文章数
        '''
        -annotate：
    	filter在annotate前：表示过滤，where条件
        values在annotate前：表示分组的字段，如果不写表示按整个表分组
        filter在annotate后：表示 having条件
        values在annotate后：表示取字段---》只能取分组字段和聚合函数字段
        
        '''
        res_category = Article.objects.filter(blog=user.blog).values('category_id').annotate(
            article_count=Count('id')).values(
            'category__id', 'category__name', 'article_count')
        print(res_category)
        res_tag = Article.objects.filter(blog=user.blog).values('tag__id').annotate(article_count=Count('id')).values(
            'tag__id', 'tag__name', 'article_count')
        print(res_tag)

        # 按时间分组--
        # 查询当前站点下某年某月的文章数（分组依据，日期：年月），不需要连表
        #         from django.db.models.functions import TruncMonth, TruncDay, TruncYear, TruncHour
        #         Sales.objects
        #         .annotate(month=TruncMonth('timestamp'))  # Truncate to month and add to select list
        #         .values('month')  # Group By month
        #         .annotate(c=Count('id'))  # Select the count of the grouping
        #         .values('month', 'c')  # (might be redundant, haven't tested) select month and count
        #         '''
        res_date = Article.objects.filter(blog=user.blog).annotate(create_date=TruncMonth('create_time')).values(
            'create_date').annotate(aritcle_count=Count('id')).values('create_date', 'aritcle_count')
        print(res_date)

        return render(request, 'site.html', locals())
    else:
        return render(request, '404.html')

前端

{% block left %}
    <div class="panel panel-primary">
        <div class="panel-heading"><h3 class="panel-title">我的标签</h3></div>
        <div class="panel-body">
            {% for tag in res_tag %}
                <p><a href="">{{ tag.tag__name }}({{ tag.article_count }})</a></p>
                {% if not forloop.last %}

                    <hr>
                {% endif %}

            {% endfor %}


        </div>
    </div>
    <div class="panel panel-info">
        <div class="panel-heading"><h3 class="panel-title">随笔分类</h3></div>
        <div class="panel-body">

            {% for category in res_category %}
                <p><a href="">{{ category.category__name }}({{ category.article_count }})</a></p>
                {% if not forloop.last %}

                    <hr>
                {% endif %}

            {% endfor %}


        </div>
    </div>
    <div class="panel panel-danger">
        <div class="panel-heading"><h3 class="panel-title">随笔档案</h3></div>
        <div class="panel-body">
            {% for item in res_date %}
                <p><a href="">{{ item.create_date|date:'Y年m月' }}({{ item.aritcle_count }})</a></p>
                {% if not forloop.last %}

                    <hr>
                {% endif %}

            {% endfor %}</div>
    </div>
{% endblock %}

标签：blog,banner,request,站点,密码,user,article,password,BBS
From： https://www.cnblogs.com/wzh366/p/17894594.html

BBS 密码修改个人站点 ……

修改密码

后台

前台

轮播图

render显示

后台

前台

ajax显示

后端

前端

个人站点页面

base.html

site.html

侧边栏筛选

后端

前端

相关文章

赞助商

阅读排行

BBS 密码修改 个人站点 ……

修改密码

后台

前台

轮播图

render显示

后台

前台

ajax显示

后端

前端

个人站点页面

base.html

site.html

侧边栏筛选

后端

前端

相关文章

赞助商

阅读排行

BBS 密码修改个人站点 ……