gitee:https://gitee.com/singebogo123/django-simpleui
转载：https://mp.weixin.qq.com/s/_HKXaea1entAf9guNRsv4A
接上：配置Django SimpleUI更新后台管理-自定义菜单（https://www.cnblogs.com/singebogo/articles/15993432.html）
对自定义首页有两种方式：
1、重写simplerui的index.html
2、自己编写html 通过urls-view，通过SIMPLEUI_HOME_PAGE指定跳转到指定的页面来充当首页
本次采用第二种方法：
1、settings.py配置首页
SIMPLEUI_HOME_PAGE = '/task/dashboard' SIMPLEUI_HOME_TITLE = 'dashboard' SIMPLEUI_HOME_ICON = 'fa fa-code' # 设置右上角Home图标跳转链接，会以另外一个窗口打开 SIMPLEUI_INDEX = '/task/dashboard'
2、在tasks app中新建urls.py，并且添加
from django.contrib import admin from django.urls import path from .views import dashboard urlpatterns = [ path('dashboard/', dashboard, name='dashboard'), ]
3、在SimpleUI_DEMO的urls.py中添加tasks.url路由配置
from django.contrib import admin from django.urls import path, include urlpatterns = [ path('admin/', admin.site.urls), path('tasks/', include('tasks.urls')), ]
4、在tasks app中views.py新建dashboard方法
from django.shortcuts import render
from django.contrib.auth.models import User
from .models import Task
# Create your views here.
def dashboard(request):
user_count = User.objects.count()
task_count = Task.objects.count()
context = {'user_count': user_count, 'task_count': task_count}
return render(request, 'dashboard.html', context)
5、tasks app中新建templates模板目录，并且新建dashboard.html
在settings.py中修改加载模板
TEMPLATES = [
{
'BACKEND': 'django.template.backends.django.DjangoTemplates',
'DIRS': [os.path.join(BASE_DIR, 'tasks/templates'),],
'APP_DIRS': True,
'OPTIONS': {
'context_processors': [
'django.template.context_processors.debug',
'django.template.context_processors.request',
'django.contrib.auth.context_processors.auth',
'django.contrib.messages.context_processors.messages',
],
},
},
]
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>控制面板</title>
<!-- Tell the browser to be responsive to screen width -->
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Theme style -->
<link rel="stylesheet"
href="https://adminlte.io/themes/AdminLTE/bower_components/bootstrap/dist/css/bootstrap.min.css">
<link rel="stylesheet" href="https://adminlte.io/themes/AdminLTE/dist/css/AdminLTE.min.css">
</head>
<body>
<div class="wrapper">
<!-- Main content -->
<section class="content">
<div class="container-fluid">
<!-- Small boxes (Stat box) -->
<div class="row">
<div class="col-sm-3">
<!-- small box -->
<div class="small-box bg-info">
<div class="inner">
<h3>{{ user_count }}</h3>
<p>用户总数</p>
</div>
<div class="icon">
<i class="ion ion-bag"></i>
</div>
<a href="#" class="small-box-footer">更多信息 <i class="fas fa-arrow-circle-right"></i></a>
</div>
</div>
<!-- ./col -->
<div class="col-sm-3">
<!-- small box -->
<div class="small-box bg-success">
<div class="inner">
<h3>{{ task_count }}</h3>
<p>用例总数</p>
</div>
<div class="icon">
<i class="ion ion-stats-bars"></i>
</div>
<a href="#" class="small-box-footer">更多信息 <i class="fas fa-arrow-circle-right"></i></a>
</div>
</div>
<!-- ./col -->
<div class="col-sm-3">
<!-- small box -->
<div class="small-box bg-info">
<div class="inner">
<h3>{{ user_count}}</h3>
<p>用户总数</p>
</div>
<div class="icon">
<i class="ion ion-bag"></i>
</div>
<a href="#" class="small-box-footer">更多信息 <i class="fas fa-arrow-circle-right"></i></a>
</div>
</div>
<!-- ./col -->
<div class="col-sm-3">
<!-- small box -->
<div class="small-box bg-success">
<div class="inner">
<h3>{{ user_count}}</h3>
<p>用户总数</p>
</div>
<div class="icon">
<i class="ion ion-stats-bars"></i>
</div>
<a href="#" class="small-box-footer">更多信息 <i class="fas fa-arrow-circle-right"></i></a>
</div>
</div>
<!-- ./col -->
</div>
</div>
</section>
</div>
</body>
