zoukankan      html  css  js  c++  java
  • django页面之间的前端模板继承或者引入详解(上)

    1.{% load staticfiles %}

    2.{% load rbac %}

        {% menu_html request %}           这部分就会变成用inclusion_tag生成的menu_html

     左侧菜单的生成templatetags目录下的rbac.py

    功能;生成页面中的左侧菜单用inclusion_tag标签

    运用:我们只需要在需要用到的文件中引用就可以生成这个菜单部分的内容。

      需要用到的模板文件中:

    #!/usr/bin/env python
    # -*- coding:utf-8 -*-
    import re
    from django.template import Library
    from django.conf import settings
    from collections import OrderedDict
    
    register = Library()
    
    
    @register.inclusion_tag('rbac/static_menu.html')
    def static_menu(request):
        """
        创建一级菜单
        :return:
        """
        menu_list = request.session[settings.MENU_SESSION_KEY]
        return {'menu_list': menu_list}
    
    
    @register.inclusion_tag('rbac/multi_menu.html')
    def multi_menu(request):
        """
        创建二级菜单
        :return:
        """
        menu_dict = request.session[settings.MENU_SESSION_KEY]
    
        # 对字典的key进行排序
        key_list = sorted(menu_dict)
    
        # 空的有序字典
        ordered_dict = OrderedDict()
    
        for key in key_list:
            val = menu_dict[key]
            val['class'] = 'hide'
    
            for per in val['children']:
                regex = "^%s$" % (per['url'],)
                if re.match(regex, request.path_info):
                    per['class'] = 'active'
                    val['class'] = ''
            ordered_dict[key] = val
    
        return {'menu_dict': ordered_dict}
    inclusion_tag生成左侧菜单

    需要的模板文件templates下的menu.html

    menu.html
    # menu.html
    
    <div class="menu">
        {% for k,menu in menu_dic.items %}
            {# 一级菜单 #}
            <div class="menu_first">{{ menu.menu_title }}</div>
    
            {# 二级菜单(就是一级菜单下边的内容) #}
            {% if menu.active %}
                <ul class="">
            {% else %}
                <ul class="hide">
            {% endif %}
    
        {% for child in menu.children %}
            {% if child.active %}
                <li class="menu_second active"><a href="{{ child.permission_url }}">{{ child.permission__title }}</a></li>
            {% else %}
                <li class="menu_second"><a href="{{ child.permission_url }}">{{ child.permission__title }}</a></li>
            {% endif %}
        {% endfor %}
        </ul>
        {% endfor %}
    </div>
    
    

    使用inclusion_tag的文件示例:

    # 这个是django的模板文件
    {% load rbac %}
    
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>{% block title %}模板{% endblock %}</title>
        <link rel="stylesheet" href="{% static 'rbac/bootstrap-3.3.7/css/bootstrap.min.css' %}">
        <link rel="stylesheet" href="{% static 'rbac/menu.css' %}">
        {% block css %} {% endblock css %}
    
    </head>
    <body>
    <div class="container-fluid">
        <div class="row">
            <div class="col-md-2 menu">
                {% block menu %}
                    {% menu_html request %}    {# 用inclusion_tag生成的menu_html #}
                {% endblock menu %}
            </div>
            <div class="col-md-9">
                {% block content %}
                content
                {% endblock %}
            </div>
        </div>
    </div>
    
    inclusion_tag的使用模板文件
  • 相关阅读:
    对万网主机全部使用独立Ip的猜疑
    对windows8在PC上的前景不看好
    漂浮广告代码3
    <!DOCTYPE> 标签一点点问题
    wordpress模板中用到的条件判断语句例1
    不错的漂浮广告代码2
    autoRST Automated TCP RST Exploit
    菜单项说明以提示弹出
    JIRA安装和破解
    谈组装对象以及对象生存期管理
  • 原文地址:https://www.cnblogs.com/cjj-zyj/p/10186189.html
Copyright © 2011-2022 走看看