为django的网页用layui写一个admin后台管理系统
时间: 2024-05-07 19:23:05 浏览: 161
基于django制作的一个后台管理系统
好的,下面是一个简单的 Django 后台管理系统,使用 layui 实现。
首先,安装 Django 和 layui:
```
pip install django
```
下载 layui 并解压到你的项目中的 static 目录下。
接下来,创建一个 Django 项目和一个 app:
```
django-admin startproject myproject
cd myproject
python manage.py startapp myapp
```
在 myproject/settings.py 中添加 myapp 到 INSTALLED_APPS 中:
```python
INSTALLED_APPS = [
...
'myapp',
]
```
在 myapp/views.py 中编写视图函数:
```python
from django.shortcuts import render
def index(request):
return render(request, 'admin.html')
```
在 myapp/urls.py 中添加路由:
```python
from django.urls import path
from . import views
urlpatterns = [
path('admin/', views.index),
]
```
在 myapp/templates 目录下创建一个名为 admin.html 的模板文件:
```html
{% extends 'base.html' %}
{% block content %}
<div class="layui-container">
<div class="layui-row">
<div class="layui-col-md6 layui-col-md-offset3 layui-col-sm6 layui-col-sm-offset3">
<div class="layui-card">
<div class="layui-card-body">
<form class="layui-form" action="">
<div class="layui-form-item">
<label class="layui-form-label">用户名</label>
<div class="layui-input-block">
<input type="text" name="username" required lay-verify="required" placeholder="请输入用户名" autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">密码</label>
<div class="layui-input-block">
<input type="password" name="password" required lay-verify="required" placeholder="请输入密码" autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<div class="layui-input-block">
<button class="layui-btn" lay-submit lay-filter="login">登录</button>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
{% endblock %}
```
在 myapp/templates 目录下创建一个名为 base.html 的模板文件,它将作为 admin.html 的父模板:
```html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>后台管理系统</title>
<link rel="stylesheet" href="{% static 'layui/css/layui.css' %}">
</head>
<body>
{% block content %}{% endblock %}
<script src="{% static 'layui/layui.js' %}"></script>
<script>
layui.use(['form'], function(){
var form = layui.form;
//监听提交
form.on('submit(login)', function(data){
layer.msg(JSON.stringify(data.field));
return false;
});
});
</script>
</body>
</html>
```
最后,在 myproject/urls.py 中添加 myapp 的路由:
```python
from django.contrib import admin
from django.urls import path, include
urlpatterns = [
path('admin/', admin.site.urls),
path('', include('myapp.urls')),
]
```
现在,启动 Django 服务并访问 http://127.0.0.1:8000/admin/,你应该能看到登录页面了。输入用户名和密码并点击登录按钮,你会看到一个弹出框显示你输入的内容。
这只是一个简单的例子,你可以根据自己的需求和业务逻辑来修改模板和视图函数。
阅读全文