基于Django框架的项目搭建后台首页

(1). 创建数据库 osdb

  • 进入MySQL数据库中,创建一个数据库名为:osdb
    通过数据表结构来创建数据表:
    -- 员工信息表
    CREATE TABLE `user` (`id` int(10) unsigned NOT NULL AUTO_INCREMENT COMMENT '员工账号id',`username` varchar(50) DEFAULT NULL COMMENT '员工账号',`nickname` varchar(50) DEFAULT NULL COMMENT '昵称',`password_hash` varchar(100) DEFAULT NULL COMMENT '密码',`password_salt` varchar(50) DEFAULT NULL COMMENT '密码干扰值',`status` tinyint(3) unsigned NOT NULL DEFAULT '1' COMMENT '状态:1正常/2禁用/9删除',`create_at` datetime DEFAULT NULL COMMENT '创建时间',`update_at` datetime DEFAULT NULL COMMENT '修改时间',PRIMARY KEY (`id`)
    ) ENGINE=InnoDB AUTO_INCREMENT=4 DEFAULT CHARSET=utf8;-- 店铺信息表
    CREATE TABLE `shop` (`id` int(10) unsigned NOT NULL AUTO_INCREMENT COMMENT '店铺id',`name` varchar(255) NOT NULL COMMENT '店铺名称',`cover_pic` varchar(255) DEFAULT NULL COMMENT '封面图片',`banner_pic` varchar(255) DEFAULT NULL COMMENT '图标Logo',`address` varchar(255) DEFAULT NULL COMMENT '店铺地址',`phone` varchar(255) DEFAULT NULL COMMENT '联系电话',`status` tinyint(4) NOT NULL DEFAULT '1' COMMENT '状态:1:正常 2:暂停 9:删除',`create_at` datetime DEFAULT NULL COMMENT '添加时间',`update_at` datetime DEFAULT NULL COMMENT '修改时间',PRIMARY KEY (`id`)
    ) ENGINE=InnoDB AUTO_INCREMENT=5 DEFAULT CHARSET=utf8;-- 菜品类别表
    CREATE TABLE `category` (`id` int(10) unsigned NOT NULL AUTO_INCREMENT COMMENT '菜品分类id',`shop_id` int(11) DEFAULT NULL COMMENT '店铺id',`name` varchar(50) DEFAULT NULL COMMENT '分类名称',`status` tinyint(4) NOT NULL DEFAULT '1' COMMENT '状态:1正常 9删除',`create_at` datetime DEFAULT NULL COMMENT '添加时间',`update_at` datetime DEFAULT NULL COMMENT '修改时间',PRIMARY KEY (`id`)
    ) ENGINE=InnoDB AUTO_INCREMENT=9 DEFAULT CHARSET=utf8;-- 菜品信息表
    CREATE TABLE `product` (`id` int(11) unsigned NOT NULL AUTO_INCREMENT COMMENT '菜品id',`shop_id` int(11) DEFAULT NULL COMMENT '店铺id',`category_id` int(11) DEFAULT NULL COMMENT '菜品分类id',`cover_pic` varchar(50) DEFAULT NULL COMMENT '菜品图片',`name` varchar(50) DEFAULT NULL COMMENT '菜品名称',`price` double(6,2) DEFAULT NULL COMMENT '单价',`status` tinyint(4) DEFAULT NULL COMMENT '状态:1:正常  2:停售  9:删除',`create_at` datetime DEFAULT NULL COMMENT '添加时间',`update_at` datetime DEFAULT NULL COMMENT '修改时间',PRIMARY KEY (`id`)
    ) ENGINE=InnoDB AUTO_INCREMENT=18 DEFAULT CHARSET=utf8;-- 会员信息表
    CREATE TABLE `member` (`id` int(10) unsigned NOT NULL AUTO_INCREMENT COMMENT '会员表id',`nickname` varchar(50) DEFAULT NULL COMMENT '昵称',`avatar` varchar(255) DEFAULT NULL COMMENT '头像',`mobile` varchar(50) DEFAULT NULL COMMENT '电话',`status` tinyint(3) unsigned NOT NULL DEFAULT '1' COMMENT '状态:1正常/2禁用/9删除',`create_at` datetime DEFAULT NULL COMMENT '添加时间',`update_at` datetime DEFAULT NULL COMMENT '修改时间',PRIMARY KEY (`id`)
    ) ENGINE=InnoDB AUTO_INCREMENT=5 DEFAULT CHARSET=utf8;-- 订单信息表
    CREATE TABLE `orders` (`id` int(10) unsigned NOT NULL AUTO_INCREMENT COMMENT '订单表id',`shop_id` int(10) unsigned DEFAULT NULL COMMENT '店铺id号',`member_id` int(10) unsigned DEFAULT NULL COMMENT '会员id',`user_id` int(10) unsigned DEFAULT NULL COMMENT '操作员id',`money` double(8,2) DEFAULT NULL COMMENT '金额',`status` tinyint(3) unsigned DEFAULT NULL COMMENT '订单状态:1过行中/2无效/3已完成',`payment_status` tinyint(3) unsigned DEFAULT NULL COMMENT '支付状态:1未支付/2已支付/3已退款',`create_at` datetime DEFAULT NULL COMMENT '添加时间',`update_at` datetime DEFAULT NULL COMMENT '修改时间',PRIMARY KEY (`id`)
    ) ENGINE=InnoDB AUTO_INCREMENT=1 DEFAULT CHARSET=utf8;-- 订单信息详情表
    CREATE TABLE `order_detail` (`id` int(10) unsigned NOT NULL AUTO_INCREMENT COMMENT '订单详情id',`order_id` int(10) unsigned DEFAULT NULL COMMENT '订单id',`product_id` int(10) unsigned DEFAULT NULL COMMENT '菜品id',`product_name` varchar(50) DEFAULT NULL COMMENT '菜品名称',`price` double(6,2) unsigned DEFAULT NULL COMMENT '单价',`quantity` int(10) unsigned NOT NULL DEFAULT '1' COMMENT '数量',`status` tinyint(3) unsigned NOT NULL DEFAULT '1' COMMENT '状态:1正常/9删除',PRIMARY KEY (`id`)
    ) ENGINE=InnoDB AUTO_INCREMENT=1 DEFAULT CHARSET=utf8 CHECKSUM=1 DELAY_KEY_WRITE=1 ROW_FORMAT=DYNAMIC COMMENT='订单详情信息表';-- 支付信息表
    CREATE TABLE `payment` (`id` int(10) unsigned NOT NULL AUTO_INCREMENT COMMENT '支付表id',`order_id` int(10) unsigned DEFAULT NULL COMMENT '订单id',`member_id` int(10) unsigned DEFAULT NULL COMMENT '会员id',`money` double(8,2) unsigned DEFAULT NULL COMMENT '支付金额',`type` tinyint(3) unsigned DEFAULT NULL COMMENT '付款方式:1会员付款/2收银收款',`bank` tinyint(3) unsigned DEFAULT NULL COMMENT '收款银行渠道:1微信/2余额/3现金/4支付宝',`status` tinyint(3) unsigned DEFAULT NULL COMMENT '支付状态:1未支付/2已支付/3已退款',`create_at` datetime DEFAULT NULL COMMENT '添加时间',`update_at` datetime DEFAULT NULL COMMENT '修改时间',PRIMARY KEY (`id`)
    ) ENGINE=InnoDB AUTO_INCREMENT=6 DEFAULT CHARSET=utf8;CREATE TABLE `django_session` (`session_key` varchar(40) NOT NULL,`session_data` longtext NOT NULL,`expire_date` datetime(6) NOT NULL,PRIMARY KEY (`session_key`),KEY `django_session_expire_date_a5c62663` (`expire_date`)
    ) ENGINE=InnoDB DEFAULT CHARSET=utf8;-- 在user上表中添加一条后台管理员账户数据
    insert  into `user`(`id`,`username`,`nickname`,`password_hash`,`password_salt`,`status`,`create_at`,`update_at`) values (1,'zhangsan','张三','1e191d851b3b49a248f4ea62f6b06410','123456',1,'2018-08-08 18:18:18','2018-09-07 08:06:55');
    

(2). 创建项目 myobject 框架和应用 myamdinwebmobile

    # 创建项目框架 `myobject`$ django-admin startproject myobject$ cd myobject# 在项目中创建一个myadmin应用(项目的后台管理)$ python manage.py startapp myadmin# 在项目中再创建一个web应用(项目前台大堂点餐应用)$ python manage.py startapp web# 在项目中再创建一个mobile应用(移动客户点餐端应用)$ python manage.py startapp mobile# 创建模板目录$ mkdir templates$ mkdir templates/myadmin$ mkdir templates/web$ mkdir templates/mobile# 创建静态资源目录$ mkdir static$ mkdir static/myadmin$ mkdir static/web$ mkdir static/mobile$ mkdir static/uploads# 创建前后台应用模板目录,并在里面各创建一个`__init__.py`和`index.py`的空文件$ mkdir myadmin/views$ touch myadmin/views/__init__.py$ touch myadmin/views/index.py$ mkdir web/views$ touch web/views/__init__.py$ touch web/views/index.py$ mkdir mobile/views$ touch mobile/views/__init__.py$ touch mobile/views/index.py# 删除前后台应用的默认模板文件# rm -rf myadmin/views.py# rm -rf web/views.py# rm -rf mobile/views.py# 拷贝路由文件到应用目录中$ cp myobject/urls.py   myadmin/urls.py$ cp myobject/urls.py   web/urls.py$ cp myobject/urls.py   mobile/urls.py# 退出项目目录$ cd ..#查看项目目录结构$ tree myobjectmyobject/├── manage.py├── myobject│   ├── __init__.py│   ├── settings.py│   ├── urls.py│   └── wsgi.py├── myadmin│   ├── admin.py│   ├── apps.py│   ├── __init__.py│   ├── migrations│   │   └── __init__.py│   ├── views│   │   ├── __init__.py│   │   └── index.py│   ├── models.py│   ├── tests.py│   └── urls.py├── web│   ├── admin.py│   ├── apps.py│   ├── __init__.py│   ├── migrations│   │   ├── __init__.py│   ├── views│   │   ├── __init__.py│   │   └── index.py│   ├── models.py│   ├── tests.py│   └── urls.py├── mobile│   ├── admin.py│   ├── apps.py│   ├── __init__.py│   ├── migrations│   │   ├── __init__.py│   ├── views│   │   ├── __init__.py│   │   └── index.py│   ├── models.py│   ├── tests.py│   └── urls.py├── static│   ├── myadmin/│   ├── web/│   ├── mobile/│   └── uploads/└── templates├── myadmin/├── web/└── mobile/

(3). 项目框架配置

注意:此配置需要安装mysql数据库mysqlclient软件包, 如:$ pip install mysqlclient

  • 3.2 编辑myobject/myobject/settings.py文件:
# myobject/myobject/settings.py  项目配置文件# 1. 配置允许访问的主机名信息
ALLOWED_HOSTS = ['*']
或
ALLOWED_HOSTS = ['localhost','127.0.0.1','192.168.2.240']...# 2. 将myadmin和web的应用添加到项目框架结构中
INSTALLED_APPS = ['django.contrib.admin','django.contrib.auth','django.contrib.contenttypes','django.contrib.sessions','django.contrib.messages','django.contrib.staticfiles','myadmin','web','mobile',
]...# 3. 配置模板目录 os.path.join(BASE_DIR,'templates')
TEMPLATES = [{'BACKEND': 'django.template.backends.django.DjangoTemplates','DIRS': [os.path.join(BASE_DIR,'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',],},},
]...# 4. 配置项目的数据库连接信息:
DATABASES = {'default': {'ENGINE': 'django.db.backends.mysql','NAME': 'osdb','USER': 'root','PASSWORD': '','HOST': 'localhost','PORT': '3306',}
}...# 5. 设置时区和语言 
LANGUAGE_CODE = 'zh-hans'TIME_ZONE = 'Asia/Shanghai'...# 6. 配置网站的静态资源目录
STATIC_URL = '/static/'
STATICFILES_DIRS = [os.path.join(BASE_DIR, 'static'),
]

(4). 项目urls路由信息配置

  • 4.1 打开根路由文件:myobject/myobject/urls.py路由文件,编写路由配置信息
# myobject/myobject/urls.py#from django.contrib import admin
from django.urls import include,pathurlpatterns = [#path('admin/', admin.site.urls),path('', include("web.urls")),                # 默认前台大堂点餐端path('myadmin/', include("myadmin.urls")),     # 后台管理端path('mobile/', include("mobile.urls")),    # 移动会员端
]
  • 4.2 打开项目后台管理路由文件:myobject/myadmin/urls.py路由文件,编写路由配置信息
# myobject/myadmin/urls.pyfrom django.urls import pathfrom myadmin.views import indexurlpatterns = [# 后台首页path('', index.index, name="myadmin_index"),]
  • 4.3 打开项目前台大堂点餐端路由文件:myobject/web/urls.py路由文件,编写路由配置信息
# myobject/web/urls.pyfrom django.urls import pathfrom web.views import indexurlpatterns = [# path('', index.index, name="index"),
]
  • 4.4 打开项目移动会员端路由文件:myobject/mobile/urls.py路由文件,编写路由配置信息
# myobject/mobile/urls.pyfrom django.urls import pathfrom web.views import indexurlpatterns = [# path('', index.index, name="index"),
]

(5). 编写后台视图测试

  • 5.1 编辑后台、前台和移动端的视图文件
# myobject/myadmin/views/index.py
from django.shortcuts import render
from django.http import HttpResponse#后台首页
def index(request):return HttpResponse('欢迎进入点餐系统网站后台管理!')
# myobject/web/views/index.py
from django.shortcuts import render
from django.http import HttpResponse#前台首页
def index(request):return HttpResponse('欢迎进入大堂点餐前台首页!')
# myobject/mobile/views/index.py
from django.shortcuts import render
from django.http import HttpResponse#移动端首页
def index(request):return HttpResponse('欢迎进入移动会员端首页!')
  • 5.2 运行测试

  • 在项目根目录下启动服务,并使用浏览器访问测试:http://localhost:8000/myadmin

[root@localhost myobject]# pwd
/python/myobject
[root@localhost myobject]# ls
manage.py  myadmin  myobject  web  mobile  static  templates
[root@localhost myobject]# python manage.py runserver 0.0.0.0:8000
Performing system checks...System check identified no issues (0 silenced).April 06, 2020 - 14:29:36
Django version 1.11, using settings 'myobject.settings'
Starting development server at http://127.0.0.1:8000/
Quit the server with CONTROL-C.
^C[root@localhost myobject]#

(6). 摆放后台首页面:

 

  • 6.1. 使用事先准备好的后台模板:

    • 从github上下载一个后台简洁模板:https://github.com/ColorlibHQ/AdminLTE
    • 将后台模板目录中的资源目录:bower_componentsdistlocalpackage.json复制到项目的后台静态资源目录static/myadmin/
    • templates/myadmin/目录中创建一个基类父模板文件base.html
    • templates/myadmin/index/目录中创建一个首页模板文件index.html
    • templates/myadmin/目录中创建一个信息提示模板文件info.html
    • 修改myobject/myadmin/views/index.py视图文件中index函数中代码:
      def index(request):'''管理后台首页'''return render(request,"myadmin/index/index.html")
      
  • 6.2. 编辑父类模板:/templates/myadmin/base.html

{% load static from staticfiles %}
<!DOCTYPE html>
<html>
<head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><title>订餐系统后台管理</title><!-- 支持响应式布局 --><meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport"><link rel="stylesheet" href="{% static 'myadmin/bower_components/bootstrap/dist/css/bootstrap.min.css'%}"><!-- 象形字体 --><link rel="stylesheet" href="{% static 'myadmin/bower_components/font-awesome/css/font-awesome.min.css'%}"><!-- 图标 --><link rel="stylesheet" href="{% static 'myadmin/bower_components/Ionicons/css/ionicons.min.css'%}"><!-- 主题风格样式 --><link rel="stylesheet" href="{% static 'myadmin/dist/css/AdminLTE.min.css'%}"><!-- AdminLTE 皮肤.这里选择的是skin-blue样式,我们还可以有其他皮肤可以选择. --><link rel="stylesheet" href="{% static 'myadmin/dist/css/skins/skin-blue.min.css'%}"><!-- 兼容IE9以下浏览器 --><!--[if lt IE 9]><script src="{% static 'myadmin/local/js/html5shiv.min.js'%}"></script><script src="{% static 'myadmin/local/js/respond.min.js'%}"></script><![endif]--><!-- Google Font --><link rel="stylesheet" href="{% static 'myadmin/local/css/google_fonts.css'%}">
</head>
<body class="hold-transition skin-blue sidebar-mini">
<div class="wrapper"><!-- Main Header 主体页头 --><header class="main-header"><!-- Logo --><a href="index2.html" class="logo"><!-- 侧栏迷你徽标 mini 50x50 pixels --><span class="logo-mini"><b>餐</b></span><!-- 常规状态标志和移动设备标志 --><span class="logo-lg"><b>订餐系统后台管理</b></span></a><!-- Header Navbar 首部导航栏 --><nav class="navbar navbar-static-top" role="navigation"><!-- Sidebar toggle button 侧边栏切换按钮 --><a href="#" class="sidebar-toggle" data-toggle="push-menu" role="button"><span class="sr-only">切换导航</span></a><!-- 右栏菜单 --><div class="navbar-custom-menu"><ul class="nav navbar-nav"><!-- messages-menu 消息菜单: 样式可以在 dropdown.less 中找到 --><li class="dropdown messages-menu"><!-- Menu toggle button 菜单切换按钮 --><a href="#" class="dropdown-toggle" data-toggle="dropdown"><i class="fa fa-envelope-o"></i><span class="label label-success">4</span></a><ul class="dropdown-menu"><li class="header">你有4个短信息</li><li><!-- 内部菜单:包含消息 --><ul class="menu"><li><!-- start message 信息开始 --><a href="#"><div class="pull-left"><!-- User Image 使用图片 --><img src="{% static 'myadmin/dist/img/user2-160x160.jpg'%}" class="img-circle" alt="User Image"></div><!-- 消息标题和时间 --><h4>我们都支持团队<small><i class="fa fa-clock-o"></i> 5 分钟</small></h4><!-- The message --><p>Why not buy a new awesome theme?</p></a></li><!-- end message --></ul><!-- /.menu --></li><li class="footer"><a href="#">查看所有信息</a></li></ul></li><!-- /.messages-menu --><!-- Notifications Menu 通知菜单 --><li class="dropdown notifications-menu"><!-- Menu toggle button  菜单切换按钮 --><a href="#" class="dropdown-toggle" data-toggle="dropdown"><i class="fa fa-bell-o"></i><span class="label label-warning">10</span></a><ul class="dropdown-menu"><li class="header">你有10条通知信息</li><li><!-- Inner Menu: contains the notifications --><ul class="menu"><li><!-- start notification --><a href="#"><i class="fa fa-users text-aqua"></i> 今天有5名新成员加入</a></li><!-- end notification --></ul></li><li class="footer"><a href="#">查看全部</a></li></ul></li><!-- Tasks Menu 任务菜单 --><li class="dropdown tasks-menu"><!-- Menu Toggle Button 菜单切换按钮 --><a href="#" class="dropdown-toggle" data-toggle="dropdown"><i class="fa fa-flag-o"></i><span class="label label-danger">9</span></a><ul class="dropdown-menu"><li class="header">你有9个任务</li><li><!-- Inner menu: contains the tasks --><ul class="menu"><li><!-- Task item --><a href="#"><!-- Task title and progress text --><h3>设计一些按钮<small class="pull-right">20%</small></h3><!-- The progress bar --><div class="progress xs"><!-- Change the css width attribute to simulate progress --><div class="progress-bar progress-bar-aqua" style="width: 20%" role="progressbar"aria-valuenow="20" aria-valuemin="0" aria-valuemax="100"><span class="sr-only">20% 完成</span></div></div></a></li><!-- end task item --></ul></li><li class="footer"><a href="#">查看所有任务</a></li></ul></li><!-- User Account Menu --><li class="dropdown user user-menu"><!-- Menu Toggle Button --><a href="#" class="dropdown-toggle" data-toggle="dropdown"><!-- The user image in the navbar--><img src="{% static 'myadmin/dist/img/user2-160x160.jpg'%}" class="user-image" alt="User Image"><!-- hidden-xs hides the username on small devices so only the image appears. --><span class="hidden-xs">{{request.session.adminuser.nickname}}</span></a><ul class="dropdown-menu"><!-- The user image in the menu --><li class="user-header"><img src="{% static 'myadmin/dist/img/user2-160x160.jpg'%}" class="img-circle" alt="User Image"><p>张无忌 - 管理员<small>2020年07月16日加入</small></p></li><!-- Menu Footer--><li class="user-footer"><div class="pull-left"><a href="#" class="btn btn-default btn-flat">个人信息</a></div><div class="pull-right"><a href="#" class="btn btn-default btn-flat">退 出</a></div></li></ul></li></ul></div></nav></header><!-- 左侧柱。包含徽标和边栏 --><aside class="main-sidebar"><!-- sidebar: style can be found in sidebar.less --><section class="sidebar"><!-- Sidebar user panel (optional) --><div class="user-panel"><div class="pull-left image"><img src="{% static 'myadmin/dist/img/user2-160x160.jpg'%}" class="img-circle" alt="User Image"></div><div class="pull-left info"><p>张无忌 . 管理员</p><!-- Status --><a href="#"><i class="fa fa-circle text-success"></i> 在线</a></div></div><!-- Sidebar Menu --><ul class="sidebar-menu" data-widget="tree"><li class="header">主要导航</li><!-- 导航列表,你可以自行更改图标 --><li class="active"><a href="admin.html"><i class="fa fa-home"></i> <span>首页</span></a></li><li><a href="member.html"><i class="fa fa-users"></i> <span>会员管理</span></a></li><li><a href="shop.html"><i class="fa fa-sitemap"></i> <span>店铺管理</span></a></li><li class="treeview"><a href="category.html"><i class="fa fa-cutlery"></i> <span>菜品管理</span><span class="pull-right-container"><i class="fa fa-angle-left pull-right"></i></span></a><ul class="treeview-menu"><li><a href="category.html"> <i class="fa fa-circle-o"></i> 菜品分类</a></li><li><a href="product.html"> <i class="fa fa-circle-o"></i> 菜品信息</a></li></ul></li><li><a href="orders.html"><i class="fa fa-shopping-cart"></i> <span>订单管理</span></a></li><li><a href="#"><i class="fa fa-user"></i> <span>账号管理</span></a></li><li><a href="#"><i class="fa fa-key"></i> <span>权限管理</span></a></li><li><a href="#"><i class="fa fa-gear"></i> <span>系统配置</span></a></li><li><a href="#"><i class="fa fa-unlock-alt"></i> <span>认证体系</span></a></li></ul><!-- /.sidebar-menu --></section><!-- /.sidebar --></aside><!-- Content Wrapper. Contains page content --><div class="content-wrapper">{% block main_body %}{% endblock %}</div><!-- /.content-wrapper --><!-- Main Footer --><footer class="main-footer"><!-- To the right --><div class="pull-right hidden-xs"><!--餐饮管理平台--></div><!-- Default to the left --><strong>Copyright &copy; 2020 <a href="#">北京*******有限公司</a>.</strong> 版权所有</footer><!-- 添加侧栏的背景。必须放置此处紧接在控制侧边栏之后 --><div class="control-sidebar-bg"></div>
</div>
<!-- ./wrapper --><!-- edu-model提示框模板 -->
<div id="edu-alert" class="modal"><div class="modal-dialog modal-sm"><div class="modal-content"><div class="modal-header"><button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button><h5 class="modal-title"><i class="fa fa-exclamation-circle"></i> [Title]</h5></div><div class="modal-body small"><p>[Message]</p></div><div class="modal-footer" ><button type="button" class="btn btn-primary ok" data-dismiss="modal">[BtnOk]</button><button type="button" class="btn btn-default cancel" data-dismiss="modal">[BtnCancel]</button></div></div></div>
</div>
<!-- edu-model-end --><!-- REQUIRED JS SCRIPTS --><!-- jQuery 3 -->
<script src="{% static 'myadmin/bower_components/jquery/dist/jquery.min.js'%}"></script>
<!-- Bootstrap 3.3.7 -->
<script src="{% static 'myadmin/bower_components/bootstrap/dist/js/bootstrap.min.js'%}"></script>
<!-- AdminLTE App -->
<script src="{% static 'myadmin/dist/js/adminlte.min.js'%}"></script><script src="{% static 'myadmin/dist/js/edu-modal-alert-confirm.js'%}"></script><!-- 此处可以添加SimLoopl和FastClick插件,用于增强用户体验。 --><script type="text/javascript">//自定义一个用于实现Ajax信息删除的函数function doDelete(del_url){Modal.confirm({msg: "确定要删除吗?",title: ' 信息提示',btnok: '确定',btncl:'取消'}).on(function (e){if(e){ //判断是否点击了确定按钮$.ajax({type:'get',url:del_url,dataType:'json',async: false,success:function(res){Modal.alert({msg:res.info, title:' 信息提示',btnok: '确定',btncl:'取消'});window.location.reload(); //刷新当前页面.},});}});}
</script>
{% block loadjavascript %}
<!-- 此处可加载独立的javascript程序 -->
{% endblock %}
</body>
</html>
  • 6.3. 编辑后台首页模板:/templates/myadmin/index.html
{% extends 'myadmin/base.html' %}{% block main_body %}<!-- Content Header (Page header) --><section class="content-header"><h1>首页<small>订餐系统后台管理</small></h1><ol class="breadcrumb"><li><a href="#"><i class="fa fa-dashboard"></i> Level</a></li><li class="active">Here</li></ol></section><!-- Main content --><section class="content container-fluid"><!-- Small boxes (Stat box) --><div class="row"><div class="col-lg-3 col-xs-6"><!-- small box --><div class="small-box bg-aqua"><div class="inner"><h3>150</h3><p>新订单</p></div><div class="icon"><i class="ion ion-bag"></i></div><a href="#" class="small-box-footer">更多信息 <i class="fa fa-arrow-circle-right"></i></a></div></div><!-- ./col --><div class="col-lg-3 col-xs-6"><!-- small box --><div class="small-box bg-green"><div class="inner"><h3>53<sup style="font-size: 20px">%</sup></h3><p>Bounce Rate</p></div><div class="icon"><i class="ion ion-stats-bars"></i></div><a href="#" class="small-box-footer">更多信息 <i class="fa fa-arrow-circle-right"></i></a></div></div><!-- ./col --><div class="col-lg-3 col-xs-6"><!-- small box --><div class="small-box bg-yellow"><div class="inner"><h3>44</h3><p>用户注册</p></div><div class="icon"><i class="ion ion-person-add"></i></div><a href="#" class="small-box-footer">更多信息 <i class="fa fa-arrow-circle-right"></i></a></div></div><!-- ./col --><div class="col-lg-3 col-xs-6"><!-- small box --><div class="small-box bg-red"><div class="inner"><h3>65</h3><p>Unique Visitors</p></div><div class="icon"><i class="ion ion-pie-graph"></i></div><a href="#" class="small-box-footer">More info <i class="fa fa-arrow-circle-right"></i></a></div></div><!-- ./col --></div></section><!-- /.content -->
{% endblock %}
  • 6.4. 后台公共提示信息模板:/templates/myadmin/info.html
{% extends "myadmin/base.html" %}{% block main_body %}                <!-- Content Header (Page header) --><section class="content-header"><h4>信息提示:</h4></section><div class="pad margin no-print"><div class="callout callout-info" style="margin-bottom: 0!important;padding-left: 50px"><h3><i class="fa fa-exclamation-triangle"></i>  &nbsp; {{ info }}</h3></div></div>
{% endblock %}

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/842015.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

MySQL:图文超详细教程MySQL5.7下载与安装

一、前言 MySQL 5.7 是一个重要的数据库管理系统版本&#xff0c;它带来了多项改进和新特性&#xff0c;本文将超详细的带大家手动安装一下MySQL5.7。 二、下载MySQL5.7版本 MySQL5.7安装包 链接&#xff1a;https://pan.baidu.com/s/1lz5rp9PwfyeHzkEfI_lW6A 提取码&#…

图卷积神经网络的简史 及其与卷积神经网络的异同

图卷积神经网络&#xff08;GCN&#xff09;已经在处理图结构数据方面取得了巨大的成功。在本小节中&#xff0c;我们将深入探讨图卷积神经网络的起源、发展历程&#xff0c;并提供一个简单的Python代码实现示例&#xff0c;以帮助读者更好地理解这一概念。 图卷积神经网络的简…

c# 贪心算法(Greedy Algo)

贪婪是一种算法范式&#xff0c;它逐步构建解决方案&#xff0c;始终选择提供最明显和直接收益的下一个部分。贪婪算法用于解决优化问题。 如果问题具有以下属性&#xff0c;则可以使用贪心法解决优化问题&#xff1a; 每一步&#xff0c;我们都可以做出当前看来最好的选择&…

IDEA 2024.1安装与破解

一、下载 官网地址&#xff1a;https://www.jetbrains.com/idea/download/other.html 二、安装 傻瓜式安装即可 三、破解 3.1 破解程序 网站&#xff1a;https://3.jetbra.in/ 3.2 获取激活码 点击*号部分即可复制成功

Vue——开发前的准备和创建一个vue的工程

文章目录 前言安装 Node js1、下载node.js2、安装node.js3、查看是否安装成功 创建 vue 工程Visual Studio Code 配置目录结构 前言 本篇博客主要讲解Vue开发前的环境配置与一些说明。 安装 Node js 环境需要安装配置一个nodejs 的环境。 vue3 最低nodejs 版本要求为 15.0 1…

[图解]产品经理创新模式01物流变成信息流

1 00:00:01,570 --> 00:00:04,120 有了现状的业务序列图 2 00:00:04,960 --> 00:00:08,490 我们就来改进我们的业务序列图了 3 00:00:08,580 --> 00:00:11,010 把我们要做的系统放进去&#xff0c;改进它 4 00:00:13,470 --> 00:00:15,260 怎么改进&#xff1f;…

揭秘OS模块:文件与文件夹的遍历艺术

新书上架~&#x1f447;全国包邮奥~ python实用小工具开发教程http://pythontoolsteach.com/3 欢迎关注我&#x1f446;&#xff0c;收藏下次不迷路┗|&#xff40;O′|┛ 嗷~~ 目录 一、引言 二、os.listdir()&#xff1a;当前目录的扫描者 三、os.walk()&#xff1a;文件系…

揭秘!EasyRecovery如何轻松救回你的误删文件?

在数字化的今天&#xff0c;数据就像我们生活和工作的血液&#xff0c;流淌在每一个角落。无论是珍贵的家庭照片&#xff0c;还是关键的工作文件&#xff0c;都离不开数据的支撑。然而&#xff0c;数据丢失的情况时有发生&#xff0c;这可能是由于一次误删&#xff0c;一个系统…

PCL 二维凸包切片法计算树冠体积

目录 一、算法原理1、原理概述2、参考文献二、代码实现三、结果展示本文由CSDN点云侠原创,原文链接。如果你不是在点云侠的博客中看到该文章,那么此处便是不要脸的爬虫与GPT。 一、算法原理 1、原理概述 二维凸包法是先将树冠等间隔分层切片,如图(e)采用二维凸包算法对每层…

FullCalendar日历组件集成实战(7)

背景 有一些应用系统或应用功能&#xff0c;如日程管理、任务管理需要使用到日历组件。虽然Element Plus也提供了日历组件&#xff0c;但功能比较简单&#xff0c;用来做数据展现勉强可用。但如果需要进行复杂的数据展示&#xff0c;以及互动操作如通过点击添加事件&#xff0…

Pip,whl,源码编译安装Python库

pip安装 pip 是 Python 包管理工具&#xff0c;用于安装和管理 Python 包。pip 是 Python 开发中不可或缺的工具&#xff0c;能够帮助开发者轻松地管理项目所需的各种库和依赖。无论是安装新包、升级现有包还是卸载不需要的包&#xff0c;pip 都提供了简单而强大的命令来完成这…

中国改革报是什么级别的报刊?在哪些领域具有较高的影响力?

中国改革报是什么级别的报刊&#xff1f;在哪些领域具有较高的影响力&#xff1f; 《中国改革报》是国家发展和改革委员会主管的全国性综合类报纸。它在经济领域和改革发展方面具有重要的影响力&#xff0c;是传递国家政策、反映改革动态的重要平台。该报对于推动中国的经济改…

Pulsar 社区周报 | No.2024-05-24

“ 各位热爱 Pulsar 的小伙伴们&#xff0c;Pulsar 社区周报更新啦&#xff01;这里将记录 Pulsar 社区每周的重要更新&#xff0c;每周发布。 ” Pulsar Weekly Merge Stars 感谢以下的小伙伴&#xff0c;感谢你们本周为 Apache Pulsar 做的精彩贡献&#xff08;排名不分先后&…

C++的数论相关算法

数论是数学的一个分支&#xff0c;主要研究整数的性质和关系。在计算机科学中&#xff0c;数论算法对于密码学、优化问题和算法分析等方面都具有重要作用。C作为一种高效的编程语言&#xff0c;非常适合用来实现这些算法。下面我们将介绍几个C中的数论相关算法&#xff0c;包括…

一篇文章教你入门Python

&#x1f49d;&#x1f49d;&#x1f49d;欢迎莅临我的博客&#xff0c;很高兴能够在这里和您见面&#xff01;希望您在这里可以感受到一份轻松愉快的氛围&#xff0c;不仅可以获得有趣的内容和知识&#xff0c;也可以畅所欲言、分享您的想法和见解。 推荐:「stormsha的主页」…

[Algorihm][简单多状态DP问题][买卖股票的最佳时机含冷冻期][买卖股票的最佳时机含手续费]详细讲解

目录 1.买卖股票的最佳时机含冷冻期1.题目链接买卖股票的最佳时机含冷冻期2.算法原理详解3.代码实现 2.买卖股票的最佳时机含手续费1.题目链接2.算法原理详解3.代码实现 1.买卖股票的最佳时机含冷冻期 1.题目链接 买卖股票的最佳时机含冷冻期 2.算法原理详解 思路&#xff…

基于jeecgboot-vue3的Flowable新建流程定义(三)

因为这个项目license问题无法开源&#xff0c;更多技术支持与服务请加入我的知识星球。 接上一节 8、同时可以进行流程的编辑 /** 编辑流程设计弹窗页面 */const handleLoadXml (row) > {console.log("handleLoadXml row",row)designerData.title "流程设…

SW手势定义

crtle:独立; T:测量;R隐藏;视图>用户界面>动态显示父子关系 crtld:相同零件; alte:草图显示; altw:基准面显示; ALTZ:上一视图;

MyBatis框架的使用:mybatis介绍+环境搭建+基础sql的使用+如何使用Map传入多个参数+返回多个实体用List或者Map接收+特殊sql的使用

MyBatis框架的使用&#xff1a;mybatis介绍环境搭建基础sql的使用如何使用Map传入多个参数返回多个实体用List或者Map接收特殊sql的使用 一、MyBatis介绍1.1 特性1.2 下载地址1.3 和其它持久层技术对比 二、搭建环境2.1配置maven2.2 创建mybatis配置文件2.3 搭建测试环境 三、基…

JAVA:Spring Boot整合MyBatis Plus持久层

1、简述 MyBatis Plus是MyBatis的增强工具包&#xff0c;它在MyBatis的基础上进行了扩展&#xff0c;提供了许多便捷的功能&#xff0c;例如通用CRUD操作、分页插件、代码生成器等。使用MyBatis Plus&#xff0c;开发者可以更加方便地进行持久层操作&#xff0c;并且减少了很多…