后台页面左侧页面搭建

【二】前端

<div class="container-fluid">
    <div class="row">
        <div class="col-md-2">
            {% load CommonInclusionTags %}
            {% backend_left request %}
        </div>
        <div class="col-md-10"> 
        </div>
          
</div>

<div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true"
     style="height: auto;width: 200px">
    <div class="panel panel-primary">
        <div class="panel-heading" role="tab" id="headingOne">
            <h4 class="panel-title text-center">

                <a role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseOne"
                   aria-expanded="true" aria-controls="collapseOne" class="text-center">
                    随笔管理
                </a>
            </h4>
        </div>
        <div id="collapseOne" class="panel-collapse collapse in" role="tabpanel"
             aria-labelledby="headingOne">
            <div class="panel-body">
                <p class="left_title"><a href="">新建随笔</a></p>
                <p class="left_title"><a href="">随笔模板</a></p>
                <p class="left_title"><a href="">导入随笔</a></p>
                <p class="left_title"><a href="">草稿箱</a></p>


            </div>
        </div>
    </div>
    <div class="panel panel-primary">
        <div class="panel-heading" role="tab" id="headingTwo">
            <h4 class="panel-title text-center">
                <a class="collapsed " role="button" data-toggle="collapse" data-parent="#accordion"
                   href="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
                    分类管理
                </a>
            </h4>
        </div>
        <div id="collapseTwo" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingTwo">
            <div class="panel-body">

                <p class="left_title glyphicon glyphicon-plus "><span class="icon_temple"></span><a href="">新建分类</a>
                </p>
                <br>
                <p class="left_title glyphicon glyphicon glyphicon-list "><span class="icon_temple"></span><a href="">分类列表</a>
                </p>
                <div>{% for category_data in article_category_class_data %}
                    <p class="glyphicon glyphicon-folder-open"><span class="icon_temple"></span><a
                            href="">{{ category_data.name }}</a>
                    </p>
                {% endfor %}
                </div>


            </div>
        </div>
    </div>
    <div class="panel panel-primary">
        <div class="panel-heading" role="tab" id="headingThree">
            <h4 class="panel-title text-center">
                <a class="collapsed" role="button" data-toggle="collapse" data-parent="#accordion"
                   href="#collapseThree" aria-expanded="false" aria-controls="collapseThree">
                    标签管理
                </a>
            </h4>
        </div>
        <div id="collapseThree" class="panel-collapse collapse" role="tabpanel"
             aria-labelledby="headingThree">
            <div class="panel-body">
                <p class="left_title glyphicon glyphicon-plus "><span class="icon_temple"></span><a href="">新建标签</a>
                </p>
                <br>
                <p class="left_title glyphicon glyphicon glyphicon-list "><span class="icon_temple"></span><a href="">标签列表</a>
                </p>
                <div>{% for tag_data in article_category_tag_data %}
                    <p class="glyphicon glyphicon-folder-open"><span class="icon_temple"></span><a
                            href="">{{ tag_data.name }}</a>
                    </p>
                {% endfor %}
                </div>
            </div>
        </div>
    </div>
</div>

【三】后端

@register.inclusion_tag("inclusion_tags/backend_left.html")
def backend_left(request):
    # 获取到当前用户下的所有文章和文章分类
    article_category_class_data = CategoryClass.objects.filter(blog=request.user.blog).annotate(
        # 统计当前用户下各个分类的文章数
        article_num=Count("article__pk")
    ).values("id", "name", "article_num")

    # 获取当前用户下的所有标签和标签下的文章数
    article_category_tag_data = CategoryTag.objects.filter(blog=request.user.blog).annotate(
        article_num=Count("article__pk")
    ).values("id", "article_num", "name")
    return locals()