Django教程第2章| Web开发实战 |用户管理模块

前言

从第2章开始,我们正式以实战为核心开发用户管理系统,计划实现效果图所有模块功能。

本章我们将开始实现我们第一个功能模块:用户管理。

技术栈

Boostrap、jQuery、​​​Django

功能模块

模块进度功能点
部门管理完成增删改查,搜索,分页
用户管理完成增删改查,搜索,分页
认证完成登录/验证码/修改密码
数据统计完成echarts折线图,柱状图,饼图
文件上传完成解析文件到db,form表单上传图片

效果图

format,png

format,png

 用户管理案例

基于mysite项目创建名为 ums 的app

1.创建应用程序

python manage.py startapp ums

模板文件和静态文件分别放入templates和static文件夹,django会自动加载到容器。

如果你像放到其他位置可以在 settings.py 里面搜索template和static进行更改路径(非特殊需求不建议更改)。

bce840905fe84fe395ca71358f46a400.png

2.数据库配置

mysite/settings.py文件中配置你的MySQL连接信息

DATABASES = {'default': {'ENGINE': 'django.db.backends.mysql','NAME': 'ums','HOST': '127.0.0.1','PORT': 3306,'USER': 'root','PASSWORD': '123456',}
}

3.下载mysqlclient

mysqlclient是django 数据库连接库,负责数据的操作和持久化,初始化表结构。

pip install mysqlclient

4.定义模型

ums/models.py 放入以下内容

class UserInfo(models.Model):username = models.CharField(verbose_name='用户名', max_length=32)password = models.CharField(verbose_name='密码', max_length=64)age = models.IntegerField(verbose_name='年龄')salary = models.DecimalField(verbose_name='工资', max_digits=10, decimal_places=2)gender_choices =((1, '男'),(2, '女'))gender = models.SmallIntegerField(verbose_name='性别', choices=gender_choices)create_time = models.DateTimeField(verbose_name='创建时间')

初始化表结构

$ python manage.py makemigrations$ python manage.py migrate

5、编写视图

ums/views.py 编写用户增删改查

def user_list(request):""" 查询用户列表 """# 获取所有用户列表 [obj,obj,obj]queryset = models.UserInfo.objects.all()return render(request, 'user_list.html', {'queryset': queryset})def user_add(request):""" 添加用户 """if request.method == "GET":context = {'gender_choices': models.UserInfo.gender_choices,"dept_list": models.Department.objects.all()}return render(request, 'user_add.html', context)# 获取用户提交的数据user = request.POST.get('username')pwd = request.POST.get('pwd')age = request.POST.get('age')salary = request.POST.get('salary')ctime = request.POST.get('ctime')gender = request.POST.get('gd')dept = request.POST.get('dp')# 添加到数据库中models.UserInfo.objects.create(username=user, password=pwd, age=age,salary=salary, create_time=ctime,gender=gender, dept_id=dept)# 返回到用户列表页面return redirect("/user/list/")def user_delete(request, nid):""" 删除用户 """models.UserInfo.objects.filter(id=nid).delete()return redirect('/user/list/')def user_edit(request, nid):""" 编辑用户 """row_object = models.UserInfo.objects.filter(id=nid).first()if request.method == "GET":# 根据ID去数据库获取要编辑的那一行数据(对象)form = UserModelForm(instance=row_object)return render(request, 'user_edit.html', {'form': form})form = UserModelForm(data=request.POST, instance=row_object)if form.is_valid():# 默认保存的是用户输入的所有数据,如果想要再用户输入以外增加一点值# form.instance.字段名 = 值form.save()return redirect('/user/list/')return render(request, 'user_edit.html', {"form": form})from django import formsclass UserModelForm(forms.ModelForm):username = forms.CharField(min_length=3, label="用户名")class Meta:model = models.UserInfofields = ["username", "password", "age", 'salary', 'create_time', "gender", "dept"]def __init__(self, *args, **kwargs):super().__init__(*args, **kwargs)# 循环找到所有的插件,添加了class="form-control"for name, field in self.fields.items():field.widget.attrs = {"class": "form-control", "placeholder": field.label}

6、编写模板

templates下编写模板

user_list.html

{% extends 'layout.html' %}{% block content %}<div class="container"><div style="margin-bottom: 10px"><a class="btn btn-success" href="/user/add/"><span class="glyphicon glyphicon-plus-sign" aria-hidden="true"></span>新建用户</a></div><div class="panel panel-default"><!-- Default panel contents --><div class="panel-heading"><span class="glyphicon glyphicon-th-list" aria-hidden="true"></span>用户列表</div><!-- Table --><table class="table table-bordered"><thead><tr><th>ID</th><th>用户名</th><th>密码</th><th>年龄</th><th>工资</th><th>创建时间</th><th>性别</th><th>所属部门</th><th>操作</th></tr></thead><tbody>{% for obj in queryset %}<tr><th>{{ obj.id }}</th><td>{{ obj.name }}</td><td>{{ obj.password }}</td><td>{{ obj.age }}</td><td>{{ obj.salary}}</td><td>{{ obj.create_time|date:"Y-m-d" }}</td><td>{{ obj.get_gender_display }}</td><td>{{ obj.dept.name}}</td><td><a class="btn btn-primary btn-xs" href="/user/{{ obj.id }}/edit/">编辑</a><a class="btn btn-danger btn-xs" href="/user/{{ obj.id }}/delete/">删除</a></td></tr>{% endfor %}</tbody></table></div></div>
{% endblock %}

user_add.html 

{% extends 'layout.html' %}{% block content %}<div class="container"><div class="panel panel-default"><div class="panel-heading"><h3 class="panel-title"> 新建用户 </h3></div><div class="panel-body"><form method="post">{% csrf_token %}<div class="form-group"><label>用户名</label><input type="text" class="form-control" placeholder="姓名" name="username" /></div><div class="form-group"><label>密码</label><input type="text" class="form-control" placeholder="密码" name="pwd"/></div><div class="form-group"><label>年龄</label><input type="text" class="form-control" placeholder="年龄" name="age"/></div><div class="form-group"><label>余额</label><input type="text" class="form-control" placeholder="工资" name="salary"/></div><div class="form-group"><label>创建时间</label><input type="text" class="form-control" placeholder="创建时间" name="ctime"/></div><div class="form-group"><label>性别</label><select class="form-control" name="gd">{% for item in gender_choices %}<option value="{{ item.0 }}">{{ item.1 }}</option>{% endfor %}</select></div><div class="form-group"><label>部门</label><select class="form-control" name="dp">{% for item in dept_list %}<option value="{{ item.id }}">{{ item.name}}</option>{% endfor %}</select></div><button type="submit" class="btn btn-primary">提 交</button></form></div></div></div>
{% endblock %}

user_edit.html

{% extends 'layout.html' %}{% block content %}<div class="container"><div class="panel panel-default"><div class="panel-heading"><h3 class="panel-title"> 编辑用户 </h3></div><div class="panel-body"><form method="post" novalidate>{% csrf_token %}{% for field in form %}<div class="form-group"><label>{{ field.label }}</label>{{ field }}<span style="color: red;">{{ field.errors.0 }}</span></div>{% endfor %}<button type="submit" class="btn btn-primary">提 交</button></form></div></div></div>
{% endblock %}

layout.html

{% load static %}
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title><link rel="stylesheet" href="{% static 'plugins/bootstrap-3.4.1/css/bootstrap.min.css' %}"><style>.navbar {border-radius: 0;}</style>
</head>
<body>
<nav class="navbar navbar-default"><div class="container"><div class="navbar-header"><button type="button" class="navbar-toggle collapsed" data-toggle="collapse"data-target="#bs-example-navbar-collapse-1" aria-expanded="false"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a class="navbar-brand" href="#"> 用户管理系统 </a></div><div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"><ul class="nav navbar-nav"><li><a href="/user/list/">用户管理</a></li><li><a href="#">Link</a></li></ul><ul class="nav navbar-nav navbar-right"><li><a href="#">登录</a></li><li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true"aria-expanded="false">Johnny<span class="caret"></span></a><ul class="dropdown-menu"><li><a href="#">个人资料</a></li><li><a href="#">我的信息</a></li><li role="separator" class="divider"></li><li><a href="#">注销</a></li></ul></li></ul></div></div>
</nav><div>{% block content %}{% endblock %}
</div><script src="{% static 'js/jquery-3.6.0.min.js' %}"></script>
<script src="{% static 'plugins/bootstrap-3.4.1/js/bootstrap.min.js' %}"></script>
</body>
</html>

7、配置路由

mysite/urls.py 配置路由

from django.contrib import admin
from django.urls import path
from app01 import viewsurlpatterns = [# 用户管理path('user/list/', views.user_list),path('user/add/', views.user_add),path('user/<int:nid>/edit/', views.user_edit),path('user/<int:nid>/delete/', views.user_delete),
]

启动程序

python manage.py runserver

启动后,访问127.0.0.1:8000/user/list

需要完整源代码评论区留言:想要源码

如果本文对你有帮助,记得点赞+关注,你的支持是我最大的动力!

下一章:Django教程第3章| Web开发实战 | 用户登录

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

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

相关文章

nodejs+vue+ElementUi音乐分享社交网站77l8j

本文介绍的系统主要分为两个部分&#xff1a;一是前台界面&#xff1a;用户通过注册登录可以实现音乐播放、新闻浏览、留言评论等功能&#xff1b;另一个是后台界面&#xff1a;音乐网站管理员对用户信息进行管理&#xff0c;上传更新音乐资源&#xff0c;发布最新音乐资讯等功…

NUS CS1101S:SICP JavaScript 描述:五、使用寄存器机进行计算

原文&#xff1a;5 Computing with Register Machines 译者&#xff1a;飞龙 协议&#xff1a;CC BY-NC-SA 4.0 我的目标是表明天堂机器不是一种神圣的生命体&#xff0c;而是一种钟表&#xff08;相信钟表有灵魂属性的人将制造者的荣耀归功于作品&#xff09;&#xff0c;因为…

debian12部署Gitea服务之二——部署git-lfs

Debian安装gitlfs: 先更新下软件包版本 sudo apt update 安装 sudo apt install git-lfs 验证是否安装成功 git lfs version cd到Gitea仓库目录下 cd /mnt/HuHDD/Git/Gitea/Repo/hu/testrepo.git 执行lfs的初始化命令 git lfs install客户机Windows端在官网下载并安装Git-Lfs 再…

Origin中将 x、y 轴设置为等长度

---------------------------------------------------------------------- 记录一个画图小技巧&#xff1a; 如何在 Origin 中等轴画图 第一步&#xff1a;起初画出来的图如下&#xff0c;y 轴长于 x 轴 第二步&#xff1a;点击画板的空白处&#xff0c;任意一个地方即可 第…

第十六章 i18n国际化

第十六章 i18n国际化 1.什么是i18n国际化2.i18n国际化三要素介绍3.i18n国际化基础示例4.通过请求头实现国际化5.通过语言类型选择实现国际化6.通过JSTL标签库fmt实现国际化 1.什么是i18n国际化 2.i18n国际化三要素介绍 3.i18n国际化基础示例 如果我要准备一个国际化的信息&…

Web3的应用发展及其影响

Web3&#xff0c;又被称为去中心化Web&#xff0c;是互联网发展的一个阶段&#xff0c;其核心特点是数据的去中心化和用户自主权。近年来&#xff0c;随着区块链技术的不断成熟&#xff0c;Web3的应用也得到了广泛的关注和发展。在这篇文章中&#xff0c;我们将深入探讨Web3目前…

猫狗大战(猫狗识别)

1.问题简介 1.1问题描述 在这个问题中&#xff0c;你将面临一个经典的机器学习分类挑战——猫狗大战。你的任务是建立一个分类模型&#xff0c;能够准确地区分图像中是猫还是狗。 1.2预期解决方案 你的目标是通过训练一个机器学习模型&#xff0c;使其在给定一张图像时能够准…

Open3D对产生偏差的点云数据进行校正

由于相机安装问题&#xff0c;导致点云数据两边翘起来&#xff0c;为了计算把翘起来的部分拉平整 import time import open3d as o3d; import numpy as np; import matplotlib.pyplot as plt from scipy.signal import find_peaks import pandas as pdOriginalPly o3d.io.rea…

【代码随想录04】24. 两两交换链表中的节点 19. 删除链表的倒数第 N 个结点 面试题 02.07. 链表相交 142. 环形链表 II

24. 两两交换链表中的节点 题目描述 给你一个链表&#xff0c;两两交换其中相邻的节点&#xff0c;并返回交换后链表的头节点。你必须在不修改节点内部的值的情况下完成本题&#xff08;即&#xff0c;只能进行节点交换&#xff09;。 做题思路 可以设置虚拟头结点cur和画图…

MySQL 从零开始:05 MySQL 数据类型

文章目录 1、数值类型1.1 整形数值1.2 浮点型数值1.3 布尔值 2、日期和时间类型3、字符串类型3.1 CHAR 和 VARCHAR3.2 BINARY 和 VARBINARY3.3 BLOB 和 TEXT3.4 ENUM 类型3.5 SET 类型 4、空间数据类型5、JSON 数据类型5、JSON 数据类型 前面的讲解中已经接触到了表的创建&…

跟着cherno手搓游戏引擎【5】layer(层)

编写基类层&#xff1a; Layer.h:提供Attach链接、Detach解绑、Update刷新、Event事件、GetName方法 #pragma once #include"YOTO/Core.h" #include"YOTO/Event/Event.h" namespace YOTO {class YOTO_API Layer{public:Layer(const std::string& nam…

基于kkFileView实现万能文件预览

基于kkFileView实现万能文件预览 1.简介 文档在线预览项目解决方案&#xff0c;项目使用流行的spring boot搭建&#xff0c;易上手和部署。万能的文件预览开源项目&#xff0c;基本支持主流文档格式预览 官网&#xff1a;https://kkview.cn/zh-cn/docs/home.html github地址…

使用 Docker 进行 Go 应用程序引导指南

为在 Docker 中部署的 Go 应用程序做准备 在使用 Go 开发 Web 应用程序时&#xff0c;无论是用于 HTTP 还是其他类型的服务&#xff0c;部署到不同的阶段或环境&#xff08;本地开发、生产环境等&#xff09;都是一个常见的考虑因素。在本文中&#xff0c;我们将探讨在 Docker …

浅析Linux进程管理:current宏实现

本文基于Linux 5.10.186版本内核源码进行分析。 文章目录 current概述早期内核版本实现最新版本内核实现x86体系下的current宏实现ARMv8体系下的current实现 相关参考 current概述 Linux内核在运行时经常需要访问当前运行进程的task_struct指针&#xff0c;于是&#xff0c;系…

CRM-如何做好客户管理

客户是企业最重要的资源&#xff0c;也是客户360视图管理的主数据&#xff0c;企业的运转都是围绕客户来开展的&#xff0c;如何做好客户数据的管理是一门学问&#xff0c;也需要企业动态的调整战略。 客户分为企业客户&#xff08;Account&#xff09;与个人客户&#xff08;…

NUS CS1101S:SICP JavaScript 描述:前言、序言和致谢

前言 原文&#xff1a;Foreword 译者&#xff1a;飞龙 协议&#xff1a;CC BY-NC-SA 4.0 我有幸在我还是学生的时候见到了了不起的 Alan Perlis&#xff0c;并和他交谈了几次。他和我共同深爱和尊重两种非常不同的编程语言&#xff1a;Lisp 和 APL。跟随他的脚步是一项艰巨的任…

大创项目推荐 深度学习疫情社交安全距离检测算法 - python opencv cnn

文章目录 0 前言1 课题背景2 实现效果3 相关技术3.1 YOLOV43.2 基于 DeepSort 算法的行人跟踪 4 最后 0 前言 &#x1f525; 优质竞赛项目系列&#xff0c;今天要分享的是 &#x1f6a9; **基于深度学习疫情社交安全距离检测算法 ** 该项目较为新颖&#xff0c;适合作为竞赛…

基于深度学习的婴儿啼哭识别项目详解

基于深度学习的婴儿啼哭识别项目详解 基于深度学习的婴儿啼哭识别项目详解一、项目背景1.1 项目背景1.2 数据说明 二、PaddleSpeech环境准备三、数据预处理3.1 数据解压缩3.2 查看声音文件3.3 音频文件长度处理 四、自定义数据集与模型训练4.1 自定义数据集4.2 模型训练4.3 模型…

Linux截图方法推荐

因为经常会遇到以图为证的情况&#xff0c;而办公设备基本都是linux,所以汇总一下常见的linux截图方式。 1&#xff1a;在 Linux 中系统集成的截图的默认方式 你想要截取整个屏幕&#xff1f;屏幕中的某个区域&#xff1f;某个特定的窗口&#xff1f; 如果只需要获取一张屏幕…

Servlet-体系结构

一、思考 读者阅读完上一篇关于Servlet基本概念的文章后&#xff0c;我们知道每次实现一个Servlet&#xff0c;都需要覆盖五个接口&#xff0c;我们对除service接口外的其它四个接口&#xff0c;我们通常不会做什么处理。那么&#xff0c;这种实现方式是否有些繁琐呢&#xff…