备案控制台
开发者社区 开发与运维 文章 正文

Django系统开发（中）

2024-01-25 45
版权
版权声明：
本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《 阿里云开发者社区用户服务协议》和 《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写 侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
简介： Django系统开发

Django系统开发（上）：


7.模板的继承


  • 部门列表
  • 添加部门
  • 编辑部门


定义模板

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="{% static 'plugins/bootstrap-3.4.1-dist/css/bootstrap.min.css' %}">
    {% block css %}{% endblock %}
</head>
<body>
<h1>标题</h1>
<div>
    {% block content %}{% endblock %}
</div>
<h1>底部</h1>
<script src="{% static 'js/jquery-3.6.3.min.js' %}"></script>
<script src="{% static 'plugins/bootstrap-3.4.1-dist/js/bootstrap.min.js' %}"></script>
{% block js %}{% endblock %}
</body>
</html>


继承模板

{% extends 'test.html' %}
{% block css %}
  ...
{% endblock %}
{% block content %}
    <h1>首页</h1>
{% endblock%}
{% block js %}
  ...
{% endblock %}


将部门列表，添加部门，编辑部门改造成继承模板


父模板（导航条，CSS，JS）

{% load static %}
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        .navbar {
            border-radius: 0;
        }
    </style>
    <link rel="stylesheet" href="{% static 'plugins/bootstrap-3.4.1-dist/css/bootstrap.min.css' %}">
</head>
<body>
<nav class="navbar navbar-default">
    <div class="container-fluid">
        <!-- Brand and toggle get grouped for better mobile display -->
        <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>
        <!-- Collect the nav links, forms, and other content for toggling -->
        <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
            <ul class="nav navbar-nav">
                <li class="active"><a href="#">部门管理 <span class="sr-only">(current)</span></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">姓名 <span class="caret"></span></a>
                    <ul class="dropdown-menu">
                        <li><a href="#">Action</a></li>
                        <li><a href="#">Another action</a></li>
                        <li><a href="#">Something else here</a></li>
                        <li role="separator" class="divider"></li>
                        <li><a href="#">Separated link</a></li>
                    </ul>
                </li>
            </ul>
        </div><!-- /.navbar-collapse -->
    </div><!-- /.container-fluid -->
</nav>
{% block content %}{% endblock %}
<script src="{% static 'js/jquery-3.6.3.min.js' %}"></script>
<script src="{% static 'plugins/bootstrap-3.4.1-dist/js/bootstrap.min.js' %}"></script>
</body>
</html>


添加部门：

{% extends 'layout.html' %}
{% block content %}
<div>
    <div class="container">
        <div class="panel panel-default">
            <div class="panel-heading">
                <h3 class="panel-title" href="/depart/add">新建部门</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="title" />
                    </div>
                    <button type="submit" class="btn btn-primary">保 存</button>
                </form>
            </div>
        </div>
    </div>
</div>
{% endblock %}


编辑部门：

{% extends 'layout.html' %}
{% block content %}
    <div>
        <div class="container">
            <div class="panel panel-default">
                <div class="panel-heading">
                    <h3 class="panel-title" href="/depart/add">编辑部门</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="title"
                                   value="{{ row_object.title }}"/>
                        </div>
                        <button type="submit" class="btn btn-primary">保 存</button>
                    </form>
                </div>
            </div>
        </div>
    </div>
{% endblock %}


部门列表：

{% extends 'layout.html' %}
{% block content %}
<div>
    <div class="container">
        <div style="margin-bottom: 10px">
            <a class="btn btn-success" href="/depart/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>
                </tr>
                </thead>
                <tbody>
                {% for obj in queryset %}
                <tr>
                    <td>{{ obj.id }}</td>
                    <td>{{ obj.title }}</td>
                    <td>
                        <a class="btn-primary btn-xs" href="/depart/{{ obj.id }}/edit">编辑</a>
                        <a class="btn-danger btn-xs" href="/depart/delete?nid={{ obj.id }}">删除</a>
                    </td>
                </tr>
                {% endfor %}
                </tbody>
            </table>
        </div>
    </div>
</div>
{% endblock %}


8.用户管理


插入数据：

insert into app01_userinfo(name,password,age,account,create_time,gender,depart_id) values("刘备","666",23,100.68,"2023-01-01",1,1);
insert into app01_userinfo(name,password,age,account,create_time,gender,depart_id) values("关羽","999",23,99.68,"2023-01-02",1,2);
insert into app01_userinfo(name,password,age,account,create_time,gender,depart_id) values("张飞","333",23,98.68,"2023-01-03",1,2);



在视图函数中获取数据库数据，传递给HTML

def user_list(request):
    queryset = models.UserInfo.objects.all()
    """
    for obj in queryset:
        print(obj.name, obj.password, obj.age, obj.account, obj.create_time.strftime("%Y-%m-%d"), obj.get_gender_display(), obj.depart.title)
    """
    return render(request, 'user_list.html', {"queryset": queryset})


新知识点 - 转换语法（在Python中的使用）：


obj.create_time.strftime(“%Y-%m-%d”)

obj.get_gender_display()

obj.depart.title


在模板语法中循环展示数据

{% for obj in queryset %}
<tr>
    <td>{{ obj.id }}</td>
    <td>{{ obj.name }}</td>
    <td>{{ obj.password }}</td>
    <td>{{ obj.account }}</td>
    <td>{{ obj.create_time|date:"Y-m-d" }}</td>
    <td>{{ obj.get_gender_display }}</td>
    <td>{{ obj.depart.title }}</td>
    <td>
        <a class="btn-primary btn-xs">编辑</a>
        <a class="btn-danger btn-xs">删除</a>
    </td>
</tr>
{% endfor %}


新知识点 - 转换语法（在模板语法中的使用）：


obj.create_time|date:“Y-m-d”

get_gender_display

obj.depart.title


新建用户：


  • 原始方法
- 用户提交数据没有校验。
- 错误，页面上应有错误提示。
- 页面上，每一个字段都需要重新写一遍。
- 关联的数据，手动去获取并展示循环展示在页面


  • Django组件
  • Form组件（简便）
  • ModelForm组件（超级简便）


8.1 初识Form


1.views.py

class MyForm(Form):   # 定义一个类 在里面定义定义输入框，渲染到HTML中，则可以在HTML中调用成Input框
    user = forms.CharField(widget=forms.Input)
    pwd = forms.CharField(widget=forms.Input)
    email = forms.CharField(widget=forms.Input)
    account = forms.CharField(widget=forms.Input)
    create_time = forms.CharField(widget=forms.Input)
    depart = forms.CharField(widget=forms.Input)
    gender = forms.CharField(widget=forms.Input)
def user_add(request):
    if request.method == "GET":
        form = MyForm()
        return render(request, 'user_add.html', context, {"form":form})


2.user_add.html


一个个生成Input框

<form method="post">
    {{ form.user }}   <!-- 通过渲染传入的form，使用模板语法，生成Input框 -->
    {{ form.pwd }}
    {{ form.email }}
    <!-- <input type="text" class="form-control" placeholder="姓名" name="user"/> -->
</form>


循环生成Input框

<form method="post">
    {% for field in form %}   <!-- 通过渲染传入的form，使用模板语法，循环生成Input框 -->
      {{ field }}
    {% endfor %}
    <!-- <input type="text" class="form-control" placeholder="姓名" name="user"/> -->
</form>


8.2 ModelForm


models.py

class UserInfo(models.Model):
    name = models.CharField(verbose_name="姓名", max_length=16)
    password = models.CharField(verbose_name="密码", max_length=64)
    age = models.IntegerField(verbose_name="年龄")
    account = models.DecimalField(verbose_name="账户余额", max_digits=10, decimal_places=2, default=0)
    create_time = models.DateTimeField(verbose_name="入职时间")
    depart = models.ForeignKey(to="Department", to_field="id", on_delete=models.CASCADE)
    gender_choices = (
        (1, "男"),
        (2, "女"),
    )
    gender = models.SmallIntegerField(verbose_name="性别", choices=gender_choices)


views.py

class MyForm(Form):
    xx = forms.CharField()    # 可自定义字段
    class Meta:
        model = UserInfo    # 实例化UserInfo对象iang
        fields = ["name","password","age","xx"] # 可获取UserInfo中的字段
def user_add(request):
    if request.method == "GET":
        form = MyForm()
        return render(request, 'user_add.html', context, {"form":form})


  • 部门管理
  • 用户管理
  • 用户列表
  • 新建用户
- ModelForm，针对数据库中的某个表。
- Form


8.3 编辑用户


  • 点击编辑，跳转到编辑页面（将编辑行的ID携带过去）
  • 编辑页面（存放默认数据，根据ID获取并设置到页面中）
  • 提交：
  • 错误提示
  • 数据校验
  • 在数据库更新


9.靓号管理


9.1 表结构


根据表结构的需求，在models.py中创建类（由类生成数据库中的表）

class PrettyNum(models.Model):
    mobile = models.CharField(verbose_name="手机号", max_length=11)
    price = models.IntegerField(verbose_name="价格", default=0)
    level_choices = (
        (1, "1级"),
        (2, "2级"),
        (3, "3级"),
        (4, "4级"),
        (5, "5级"),
    )
    level = models.SmallIntegerField(verbose_name="级别", choices=level_choices, default=1)
    status_choices = (
        (1, "已占用"),
        (2, "为占用"),
    )
    status = models.SmallIntegerField(verbose_name="状态", choices=status_choices, default=2)


模拟创建一些数据：

mysql> select * from app01_prettynum;
+----+-------------+-------+-------+--------+
| id | mobile      | price | level | status |
+----+-------------+-------+-------+--------+
|  1 | 12345678911 |    10 |     1 |      1 |
|  2 | 12345678911 |    10 |     1 |      1 |
|  3 | 12345678911 |    10 |     1 |      1 |
+----+-------------+-------+-------+--------+


9.2 靓号列表


  • URL
  • 函数
  • 获取所有的靓号
  • 结合html+render将靓号罗列出来
id  手机号 价格  级别（中文）  状态（中文）

def pretty_list(request):
    """ 靓号列表 """
    queryset = models.PrettyNum.objects.all().order_by("-id")
    return render(request, 'pretty_list.html', {"queryset": queryset})

{% extends 'layout.html' %}
{% block content %}
    <div>
        <div class="container">
            <div style="margin-bottom: 10px">
                <a class="btn btn-success" href="/pretty/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>
                    </tr>
                    </thead>
                    <tbody>
                    {% for obj in queryset %}
                        <tr>
                            <td>{{ obj.id }}</td>
                            <td>{{ obj.mobile }}</td>
                            <td>{{ obj.price }}</td>
                            <td>{{ obj.get_level_display }}</td>
                            <td>{{ obj.get_status_display }}</td>
                            <td>
                                <a class="btn-primary btn-xs" href="/user/{{ obj.id }}/edit">编辑</a>
                                <a class="btn-danger btn-xs" href="/user/{{ obj.id }}/delete">删除</a>
                            </td>
                        </tr>
                    {% endfor %}
                    </tbody>
                </table>
            </div>
        </div>
    </div>
{% endblock %}


Django系统开发（下）：https://developer.aliyun.com/article/1427948

文章标签：
Python
数据库
JavaScript
前端开发
Brucye
目录
相关文章
by灵感
|
11天前
|
BI Python
103-Django开发投票选举系统
这是一个基于 Python 3.11 和 Django 的全功能投票选举系统，提供用户认证、首页展示、投票功能、投票内容管理、数据统计与展示、用户管理和权限分配。系统支持第三方登录、搜索过滤、投票详情查看、选项选择及统计，并具有良好的扩展性和第三方系统集成能力。适用于各种选举场景，如学校选举、公司投票或在线调查。
by灵感
20 0
Brucye
|
11天前
|
关系型数据库 MySQL 数据库
Django系统开发（上）
Django系统开发
Brucye
34 0
Brucye
|
11天前
|
存储 前端开发 JavaScript
Django系统开发（下）
Django系统开发
Brucye
47 0
小小张说故事
|
9月前
|
SQL 数据库 Python
Django中级指南：理解并实现Django的模型和数据库迁移
Django 是一个极其强大的 Python Web 框架，它提供了许多工具和特性，能够帮助我们更快速、更便捷地构建 Web 应用。在本文中，我们将会关注 Django 中的模型（Models）和数据库迁移（Database Migrations）这两个核心概念。
小小张说故事
70 0
Django中级指南：理解并实现Django的模型和数据库迁移
oxcxgh4wwskfm
|
10月前
|
设计模式 前端开发 JavaScript
django搭建图书管理系统
django搭建图书管理系统
oxcxgh4wwskfm
99 0
小杰911
|
11月前
|
存储 前端开发 JavaScript
基于Django的学生信息管理系统的设计与实现
基于Django的学生信息管理系统的设计与实现
小杰911
345 0
foofish
|
安全 关系型数据库 测试技术
Django 最佳实践
Django 最佳实践
foofish
125 0
布小禅
|
SQL 数据库 开发者
Django启航（三）Django模型
Django启航（三）Django模型
布小禅
131 0
袁勇i
|
关系型数据库 测试技术 数据库
django 项目需要注意的一些点
1.创建新项目    把静态文件夹的名字放在settings文件里面 STATIC_URL = '/static/' STATICFILES_DIRS=[ os.path.join(BASE_DIR,"static") ] 2.
袁勇i
1448 0
袁勇i
|
数据库 Python Shell
Django之路——2 Django的安装
Django的安装分为两种方式，一种是命令行安装，另外一种是pycharm安装。在这里只说一种在命令行里面安装的 1.命令行安装 这个自不必多说，直接上干货，如果遇到pip版本过低，安装失败的，请自自行按照命令行的提示更新pip版本。
袁勇i
1253 0

热门文章

最新文章

  • 1
    云服务器 ECS 建站教程：SVN的搭建和使用
  • 2
    阿里云code登录，阿里云code使用教程
  • 3
    【Python】*args 和 **kwargs的用法
  • 4
    ​阿里巴巴“新六脉神剑”背后的故事
  • 5
    重启大法好！线上常见问题排查手册
  • 6
    一分钟了解阿里云产品：阿里云解析概述
  • 7
    为什么网站安装SSL证书如此重要？
  • 8
    CoinDesk区块链报告：比特币泡沫与过去不同
  • 9
    SilverLight1.1 之旅（一）：Hello World
  • 10
    Swift 柯里化(Currying)
  • 1
    基于SpringBoot+Vue的飘香水果购物网站附带文章和源代码
    21
  • 2
    基于SpringBoot+Vue的宠物咖啡馆平台附带文章和源代码
    16
  • 3
    基于SpringBoot+Vue的旅游管理系统附带文章和源代码
    18
  • 4
    基于SpringBoot+Vue的医院管理系统附带文章和源代码
    17
  • 5
    Python中的函数与模块：核心概念与实践
    14
  • 6
    基于SpringBoot+Vue的星之语明星周边产品销售网站附带文章和源代码
    14
  • 7
    基于SpringBoot+Vue的在线教育系统附带文章和源代码
    16
  • 8
    基于SpringBoot+Vue的校园资料分享平台附带文章和源代码
    15
  • 9
    基于SpringBoot+Vue的大学生就业招聘系统附带文章和源代码
    11
  • 10
    基于SpringBoot+Vue的古典舞在线交流平台附带文章和源代码
    14

    • 相关课程

    更多
  • Python Web 框架 Django 快速入门
  • Python Web 框架 Flask 快速入门

    • 相关电子书

    更多
  • 低代码开发师（初级）实战教程
  • 冬季实战营第三期：MySQL数据库进阶实战
  • 阿里巴巴DevOps 最佳实践手册

    • 相关实验场景

    更多
  • 零基础部署一个Django Blog到Serverless架构
    • 下一篇
    2024年阿里云免费云服务器及学生云服务器申请教程参考