stark组件base.html
stark 组件基础页面base.html 文件
base.html
1. base.html 页面是 : stark组件增,删,改,查页面的公共部分,如头部导航栏,左侧的用户权限列表栏等。
2. base.html 页面结构:
(1)公共部分的代码区域。(其他模板通过继承)。
(2)css 自定义部分,js 自定义部分,内容自定义部分,权限栏部分等(红色区域部分)。
下面问stark组件base.html文件
{% load staticfiles %}
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>CRM</title>
    <link rel="stylesheet" href="/static/bootstrap/css/bootstrap.css">
    <link rel="shortcut icon" href="/static/imgs/luffy-study-logo.png">
    <link rel="stylesheet" href="/static/font-awesome/css/font-awesome.css">
    <link rel="stylesheet" href="/static/css/commons.css ">
    <link rel="stylesheet" href="/static/css/nav.css">
    <script src="/static/js/jquery-3.3.1.min.js"></script>
    <style>
        .pg-body > .left-menu {
            background-color: #F3F3F3;
            position: absolute;
            left: 1px;
            top: 60px;
            bottom: 0;
            width: 220px;
            overflow: auto;
        }
        .pg-body > .right-body {
            position: absolute;
            left: 225px;
            right: 0;
            top: 60px;
            bottom: 0;
            overflow: scroll;
            border-top: 0;
            font-size: 13px;
            min-width: 755px;
            padding: 20px;
        }
        .dropdown-menu {
            top: 118%;
            left: -108px;
        }
        a:hover{
                text-decoration: none!important;
            }
    </style>
   {% block css %}
   {% endblock %}
</head>
<body>
<div class="pg-header">
    <div class="nav">
        <div class="logo-area left">
            <a href="#">
                <img class="logo" src="{% static 'imgs/logo.svg' %}">
                <span style="font-size: 18px;">CRM </span>
            </a>
        </div>
        <div class="left-menu left">
            <a class="menu-item">资产管理</a>
            <a class="menu-item">用户信息</a>
            <a class="menu-item">权限管理</a>
            <div class="menu-item">
                <span>使用说明</span>
                <i class="fa fa-caret-down" aria-hidden="true"></i>
                <div class="more-info">
                    <a href="#" class="more-item">666</a>
                    <a href="#" class="more-item">888</a>
                </div>
            </div>
        </div>
        <div class="right-menu right clearfix">
            <!-- Single button -->
            <div class="btn-group user-info right">
              <img class="dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" width="50" height="50" class="img-circle" src="{% static 'imgs/default.jpg' %}">
              <ul class="dropdown-menu small">
                <li><a href="#" class="more-item">个人信息</a></li>
                <li><a href="/logout/" class="more-item">注销</a></li>
                <li><a href="/home/">修改密码</a></li>
                <li><a href="/home/">更换头像</a></li>
              </ul>
            </div>
            <a class="user-menu right">
                <i class="fa fa-user" aria-hidden="true"></i>
                <span>{{ request.user }}</span>
            </a>
            <a class="user-menu right">
                消息
                <i class="fa fa-commenting-o" aria-hidden="true"></i>
                <span class="badge bg-success">2</span>
            </a>
            <a class="user-menu right">
                通知
                <i class="fa fa-envelope-o" aria-hidden="true"></i>
                <span class="badge bg-success">2</span>
            </a>
            <a class="user-menu right">
                任务
                <i class="fa fa-bell-o" aria-hidden="true"></i>
                <span class="badge bg-danger">4</span>
            </a>
        </div>
    </div>
</div>
<div class="pg-body">
        <div class="left-menu">
             {% block side_bar %}
                {% load rbac %}
                {% get_menu request %}
             {% endblock side_bar %}
        </div>
    <div class="right-body">
         {% block content %}
         {% endblock content %}
    </div>
</div>
{% block js %}
 {% endblock %}
</body>
</html>
(3).stark组件增删改查页面的,继承语句
{% extends "stark/base.html" %}
以change._view.html 页面为例:
{% extends "stark/base.html" %}
{% block css %}
<style>
        .error{
            color: red;
        }
        h3{
            text-align: center;
        }
    </style>
{% endblock %}
{% block content %}
<div class="container-fluid">
    <div class="row">
        <div class="col-md-6 col-md-offset-3">
            <h3>编辑{{ table_name }}</h3>
            {% include "stark/formbase.html" %}
        </div>
    </div>
</div>
{% endblock %}
change_view.html

(4) stark 组件中,一些静态文件,font-awesome 字体图标文件夹。以及js,bootstrap.css文件等,主要是组件的依赖文件。imgs 主要用于base.html 导航栏中的图片。
stark组件base.html的更多相关文章
- stark组件的分页,模糊查询,批量删除
		
1.分页组件高阶 2.整合展示数据showlist类 3.stark组件之分页 3.stark组件之search模糊查询 4.action批量处理数据 4.总结 1.分页组件高阶 1.分页的class ...
 - day 68crm(5) 分页器的进一步优化,以及在stark上使用分页器,,以及,整理代码,以及stark组件search查询
		
前情提要: 本节内容 自定制分页器 保存及查询记录 代码整理, stark组件search 查询 一:自定制分页器 page 1:创建类 Pagination # 自定制分页器 _ _init ...
 - 【django之stark组件】
		
一.需求 仿照django的admin,开发自己的stark组件.实现类似数据库客户端的功能,对数据进行增删改查. 二.实现 1.在settings配置中分别注册这三个app # Applicatio ...
 - django 之 stark组件
		
----------------------------------------------------------------烦恼没完没了,内心动荡不安,呜呼哀哉. 一.有个特殊的需求,需要用sta ...
 - 设计stark组件
		
设计stark组件 作者:Eric 微信:loveoracle11g 新建Django项目crm_1随便起名 然后再创建一个App manage.py@crm_1 > startapp star ...
 - stark组件配置,二层URL
		
1.django的admin配置 2 stark组件开发 3.2层url分发 4.小结 1.django的admin配置 model.py from django.db import models # ...
 - CRM项目之stark组件
		
. stark也是一个app(用startapp stark创建),目标时把这个做成一个可以拔插的组件 . setting文件下INSTALLED_APPS 路径要配置好(app的注册) . 写好si ...
 - stark组件开发之列表页面应用示例
		
已经解决的,自定义的扩展函数,功能.但是 不可能返回. 一个 固定的页面把! 应该是,点击那条 记录之后的编辑, 就会跳转到相应的,编辑页面.所以 这个标签的 <a href="/ ...
 - Django之stark组件
		
现在让我说啥是stark组件,我也说不清楚.反正从今天讲的知识来看,今天完成的就是自己写一个模块,这个模块包含了admin后台管理工具的一些比较好用的功能,我们把它提炼出来,也就是相当于自己写一个ad ...
 
随机推荐
- hdu1358 Period kmp求循环节
			
链接 http://acm.hdu.edu.cn/showproblem.php?pid=1358 思路 当初shenben学长暑假讲过,当初太笨了,noip前几天才理解过来.. 我也没啥好说的 代码 ...
 - 【ContextLoaderListener】Web项目启动报错java.lang.ClassNotFoundException: ContextLoaderListener
			
错误原因: 进入到tomcat的部署路径.metadata\.plugins\org.eclipse.wst.server.core\tmp0\wtpwebapps\下检查了一下,发现工程部署后在WE ...
 - 【配置】log4j.properties 详解与配置步骤
			
一.Log4j基本使用方法 Log4j由三个重要的组件构成:[日志信息的优先级],[日志信息的输出目的地],[日志信息的输出格式]. 日志信息的优先级从高到低有ERROR.WARN. INFO.DEB ...
 - How can I move a MySQL database from one server to another?
			
My favorite way is to pipe a sqldump command to a sql command. You can do all databases or a specifi ...
 - PL/SQL Developer几个使用小技巧
			
1.选中sql语句的当前行 鼠标连续点击所在行3次. 2.记住登陆密码 工具 -> 首选项 -> Oracle -> 登录历史,勾选“带口令存储”. 3.查看Oracle的tnsna ...
 - using Redis in .net core
			
Using Redis Cache in .net Core Distributed Cache using Redis and ASP.NET Core ASP.NET Core Data Prot ...
 - Ural 1297 Palindrome(后缀数组+最长回文子串)
			
https://vjudge.net/problem/URAL-1297 题意: 求最长回文子串. 思路: 先将整个字符串反过来写在原字符串后面,中间需要用特殊字符隔开,那么只需要某两个后缀的最长公共 ...
 - JsonKey小写
			
System.Text.RegularExpressions.MatchCollection ms = System.Text.RegularExpressions.Regex.Matches(eca ...
 - React Native 组建之IOS和Android通用抽屉
			
/** * Sample React Native App * https://github.com/facebook/react-native * @flow *npm:https://www.np ...
 - _ai_gameobject