部门管理（体验，最原始方法来做，Django+mysql）
本人初学，写完代码在此记录和复盘
在创建和注册完APP之后（我的命名是employees），编写models.py文件创建表
手动插入了几条数据
1.部门查询
urls.py和views.py在编写之前，都要注意导入对应的库
urls.py：from employees import views （用于导入视图函数）
views.py：from employees import models （用于导入表）
def depart_list(request):
# 从数据库中获取所有部门信息，返回一个查询集
queryset = models.Department.objects.all()
# 渲染 'depart_list.html' 模板，传递查询集数据到模板中
return render(request, 'depart_list.html', {"queryset": queryset})
在templates文件夹中创建对应的html文件
depart_list.html
{% load static %}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<link rel="stylesheet" href="{% static 'plugins/bootstrap-5.3.3/css/bootstrap.css' %}">
<link rel="stylesheet" href="{% static 'plugins/font-awesome-4.7.0/css/font-awesome.css' %}">
<style>
.c1{
margin-top: 20px;
margin-bottom: 20px;
}
</style>
</head>
<body>
<nav class="navbar navbar-expand-lg bg-light">
<div class="container">
<a class="navbar-brand" href="#">部门管理系统</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse"
data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent"
aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
<li class="nav-item">
<a class="nav-link active" aria-current="page" href="/depart/list/">部门首页</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/depart/add">部门管理</a>
</li>
<form class="d-flex">
<input class="form-control me-2" type="search" placeholder="Search" aria-label="Search">
<button class="btn btn-outline-success" type="submit">Search</button>
</form>
</ul>
</div>
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
<li class="nav-item">
<a class="nav-link active" aria-current="page" href="#">登录</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">注册</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="log" role="button"
data-bs-toggle="dropdown" aria-expanded="false">
豆腐乳
</a>
<ul class="dropdown-menu" aria-labelledby="navbarDropdown">
<li><a class="dropdown-item" href="#">个人资料</a></li>
<li><a class="dropdown-item" href="#">我的账户</a></li>
<li><a class="dropdown-item" href="#">修改密码</a></li>
<li>
<hr class="dropdown-divider">
</li>
<li><a class="dropdown-item" href="#">注销</a></li>
</ul>
</li>
</ul>
</div>
</nav>
<div>
<div class="container">
<div class="c1">
<a class="btn btn-success" href="/depart/add">新建部门</a>
</div>
<div class="card c1">
<div class="card-header">
<i class="fa fa-list" aria-hidden="true"></i>
部门列表
</div>
<div class="card-body p-0">
<div class="table-responsive">
<table class="table table-striped table-bordered table-hover mb-0">
<thead>
<tr>
<th>ID</th>
<th>名称</th>
<th>操作</th>
</tr>
</thead>
<tbody>
{% for obj in queryset %}
<tr>
<th scope="row">{{ obj.id }}</th>
<td>{{ obj.title }}</td>
<td>
<a class="btn btn-primary btn-xs" href="/depart/{{ obj.id }}/edit/">编辑</a>
<a class="btn btn-danger btn-xs" href="/depart/delete/?nid={{ obj.id }}">删除</a>
</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
</div>
</div>
<nav aria-label="Page navigation example">
<ul class="pagination">
<li class="page-item">
<a class="page-link" href="#" aria-label="Previous">
<span aria-hidden="true">«</span>
</a>
</li>
<li class="page-item"><a class="page-link" href="#">1</a></li>
<li class="page-item"><a class="page-link" href="#">2</a></li>
<li class="page-item"><a class="page-link" href="#">3</a></li>
<li class="page-item">
<a class="page-link" href="#" aria-label="Next">
<span aria-hidden="true">»</span>
</a>
</li>
</ul>
</nav>
</div>
</div>
<script src="{% static 'plugins/bootstrap-5.3.3/js/bootstrap.bundle.min.js' %}"></script>
</body>
</html>-
视图函数
depart_list：
查询数据库中的部门表（Department），将所有部门数据传递给模板depart_list.html。 -
模板循环：
遍历queryset中的每个部门对象，生成表格行，显示部门 ID、名称，并提供“编辑”和“删除”操作链接。-
编辑：跳转至
/depart/{id}/edit/ -
删除：跳转至
/depart/delete/?nid={id}
-
2.部门增加
def depart_add(request):
# 处理 GET 请求：返回添加部门的页面
if request.method == 'GET':
return render(request, 'depart_add.html')
# 处理 POST 请求：获取表单中的部门名称并保存到数据库
title = request.POST.get("title") # 从 POST 请求中获取部门名称
models.Department.objects.create(title=title) # 创建新部门
# 添加成功后，重定向到部门列表页面
return redirect("/depart/list")depart_list.html
{% load static %}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<link rel="stylesheet" href="{% static 'plugins/bootstrap-5.3.3/css/bootstrap.css' %}">
<link rel="stylesheet" href="{% static 'plugins/font-awesome-4.7.0/css/font-awesome.css' %}">
<style>
.c1{
margin-top: 20px;
margin-bottom: 20px;
}
</style>
</head>
<body>
<nav class="navbar navbar-expand-lg bg-light">
<div class="container">
<a class="navbar-brand" href="#">部门管理系统</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse"
data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent"
aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
<li class="nav-item">
<a class="nav-link active" aria-current="page" href="/depart/list/">部门首页</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/depart/add">部门管理</a>
</li>
<form class="d-flex">
<input class="form-control me-2" type="search" placeholder="Search" aria-label="Search">
<button class="btn btn-outline-success" type="submit">Search</button>
</form>
</ul>
</div>
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
<li class="nav-item">
<a class="nav-link active" aria-current="page" href="#">登录</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">注册</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="log" role="button"
data-bs-toggle="dropdown" aria-expanded="false">
豆腐乳
</a>
<ul class="dropdown-menu" aria-labelledby="navbarDropdown">
<li><a class="dropdown-item" href="#">个人资料</a></li>
<li><a class="dropdown-item" href="#">我的账户</a></li>
<li><a class="dropdown-item" href="#">修改密码</a></li>
<li>
<hr class="dropdown-divider">
</li>
<li><a class="dropdown-item" href="#">注销</a></li>
</ul>
</li>
</ul>
</div>
</nav>
<div>
<div class="container">
<div class="c1">
<a class="btn btn-success" href="/depart/add">新建部门</a>
</div>
<div class="card c1">
<div class="card-header">
新建部门
</div>
<div class="card-body">
<form method="post">
{% csrf_token %}
<div class="mb-3">
<label for="inputtitle" class="form-label">标题</label>
<input type="text" class="form-control" id="inputtitle" placeholder="标题" name="title">
</div>
<button type="submit" class="btn btn-primary">提交</button>
</form>
</div>
</div>
</div>
</div>
<script src="{% static 'plugins/bootstrap-5.3.3/js/bootstrap.bundle.min.js' %}"></script>
</body>
</html>运行
3.部门删除
def depart_delete(request):
# 获取请求中传递的 'nid' 参数，即要删除的部门 ID
nid = request.GET.get("nid")
# 根据 'nid' 参数过滤部门对象并删除
models.Department.objects.filter(id=nid).delete()
# 删除完成后，重定向回部门列表页面
return redirect("/depart/list")
depart_delete 函数效果：运行/depart/delete/?nid=1，就会删除id为1的数据
当用户点击“删除”按钮时，会触发 depart_delete 函数，该函数根据部门的 ID 删除对应的部门数据，并重定向回部门列表页面。
运行
4.部门修改
<int:nid>：这是一个捕获组，它告诉 Django 该部分的路径将匹配一个整数，并将这个整数作为参数传递给视图函数。在这里，nid 是变量名，表示部门的 ID。
def depart_edit(request, nid):
# 如果请求方法是 GET（即用户访问编辑页面），获取对应部门的信息
if request.method == 'GET':
# 根据部门 ID 获取部门对象，并将其传递给模板
row_object = models.Department.objects.filter(id=nid).first()
return render(request, 'depart_edit.html', {"row_object": row_object})
# 如果请求方法是 POST（即用户提交表单），更新部门信息
title = request.POST.get("title")
# 更新数据库中对应部门的标题
models.Department.objects.filter(id=nid).update(title=title)
# 更新完成后，重定向到部门列表页面
return redirect("/depart/list")
当用户访问 /depart/<nid>/edit/ URL 时，depart_edit 函数会根据部门 ID (nid) 获取该部门的现有信息并显示在表单中，用户可以修改部门名称并提交表单。提交表单后，depart_edit 函数会更新数据库中对应部门的标题，并将用户重定向回部门列表页面。
depart_edit.py
{% load static %}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<link rel="stylesheet" href="{% static 'plugins/bootstrap-5.3.3/css/bootstrap.css' %}">
<link rel="stylesheet" href="{% static 'plugins/font-awesome-4.7.0/css/font-awesome.css' %}">
<style>
.c1{
margin-top: 20px;
margin-bottom: 20px;
}
</style>
</head>
<body>
<nav class="navbar navbar-expand-lg bg-light">
<div class="container">
<a class="navbar-brand" href="#">部门管理系统</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse"
data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent"
aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
<li class="nav-item">
<a class="nav-link active" aria-current="page" href="/depart/list/">部门首页</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/depart/add">部门管理</a>
</li>
<form class="d-flex">
<input class="form-control me-2" type="search" placeholder="Search" aria-label="Search">
<button class="btn btn-outline-success" type="submit">Search</button>
</form>
</ul>
</div>
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
<li class="nav-item">
<a class="nav-link active" aria-current="page" href="#">登录</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">注册</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="log" role="button"
data-bs-toggle="dropdown" aria-expanded="false">
豆腐乳
</a>
<ul class="dropdown-menu" aria-labelledby="navbarDropdown">
<li><a class="dropdown-item" href="#">个人资料</a></li>
<li><a class="dropdown-item" href="#">我的账户</a></li>
<li><a class="dropdown-item" href="#">修改密码</a></li>
<li>
<hr class="dropdown-divider">
</li>
<li><a class="dropdown-item" href="#">注销</a></li>
</ul>
</li>
</ul>
</div>
</nav>
<div>
<div class="container">
<div class="card c1">
<div class="card-header">
修改部门
</div>
<div class="card-body">
<form method="post">
{% csrf_token %}
<div class="mb-3">
<label for="inputtitle" class="form-label">标题</label>
<input type="text" class="form-control" id="inputtitle" placeholder="标题" name="title" value="{{ row_object.title }}"/>
</div>
<button type="submit" class="btn btn-primary">提交</button>
</form>
</div>
</div>
</div>
</div>
<script src="{% static 'plugins/bootstrap-5.3.3/js/bootstrap.bundle.min.js' %}"></script>
</body>
</html>运行
改成“媒体”
学习：【最新Python的web开发全家桶（django+前端+数据库）-哔哩哔哩】 https://b23.tv/O0w3SND