03 django管理系统 - 部门管理 - 部门列表

部门管理

首先我们需要在models里定义Dept类

python 复制代码
# 创建部门表
class Dept(models.Model):
    name = models.CharField(max_length=100)
    head = models.CharField(max_length=100)
    phone = models.CharField(max_length=15)
    email = models.EmailField()
    address = models.CharField(max_length=255)

    def __str__(self):
        return self.name

然后执行下面两句,创建数据表

manage.py@MS > makemigrations

manage.py@MS > migrate

部门列表展示

首先创建视图

python 复制代码
from django.shortcuts import render

"""部门列表"""
def dept_list(request):
    return render(request, 'dept_list.html')

然后配置URL路由

python 复制代码
urlpatterns = [
    # 部门管理
    path("dept/list/", dept.dept_list),
]

接着创建部门列表页面dept_list.html,继承base.html

python 复制代码
{% extends 'base.html' %}

{% block content %}
    
{% endblock %}

看一下效果,是可以访问的。

去bootstrap找个带表格的面板,加进去

html 复制代码
{% extends 'base.html' %}

{% block content %}

    <div class="panel panel-default">
        <!-- Default panel contents -->
        <div class="panel-heading">新建部门</div>
        <div class="panel-body">
            <p>部门列表</p>
        </div>

        <!-- Table -->
        <table class="table">
            <thead>
            <tr>
                <th>#</th>
                <th>First Name</th>
                <th>Last Name</th>
                <th>Username</th>
            </tr>
            </thead>
            <tbody>
            <tr>
                <th scope="row">1</th>
                <td>Mark</td>
                <td>Otto</td>
                <td>@mdo</td>
            </tr>
            <tr>
                <th scope="row">2</th>
                <td>Jacob</td>
                <td>Thornton</td>
                <td>@fat</td>
            </tr>
            <tr>
                <th scope="row">3</th>
                <td>Larry</td>
                <td>the Bird</td>
                <td>@twitter</td>
            </tr>
            </tbody>
        </table>
    </div>

{% endblock %}

效果如下:

ok,接下来可以编写dept_list()函数

python 复制代码
"""
部门列表
department_id:部门ID(主键,自动增长)
name:部门名称
head:部门负责人
phone:联系电话
email:电子邮件
address:地址
"""


def dept_list(request):
    # 查询部门列表数据
    queryset = models.Dept.objects.using('default').all()
    # 把查询到的数据传递到前端
    context = {
        'queryset': queryset
    }
    return render(request, 'dept_list.html', context)

然后在dept_list.html上接收数据

html 复制代码
{% extends 'base.html' %}

{% block content %}

    <div class="panel panel-default">
        <!-- Default panel contents -->
        <div class="panel-heading">新建部门</div>
        <div class="panel-body">
            <p>部门列表</p>
        </div>

        <!-- Table -->
        <table class="table">
            <thead>
            <tr>
                <th>ID</th>
                <th>name</th>
                <th>head</th>
                <th>phone</th>
                <th>email</th>
                <th>address</th>
            </tr>
            </thead>
            <tbody>
            {% for obj in queryset %}
                <tr>
                    <td>{{ obj.id }}</td>
                    <td>{{ obj.name }}</td>
                    <td>{{ obj.head }}</td>
                    <td>{{ obj.phone }}</td>
                    <td>{{ obj.email }}</td>
                    <td>{{ obj.address }}</td>
                </tr>
            {% endfor %}
            </tbody>
        </table>
    </div>

{% endblock %}

效果如下:

相关推荐
IT_陈寒23 分钟前
折腾一天才明白:Vite的热更新为什么偶尔会罢工
前端·人工智能·后端
希望永不加班29 分钟前
SpringBoot 自动配置类加载顺序与优先级
java·spring boot·后端·spring·mybatis
AI茶水间管理员1 小时前
学习ClaudeCode源码之Agent核心循环
前端·人工智能·后端
7年前端辞职转AI1 小时前
Python 文件操作
python·编程语言
龙文浩_1 小时前
AI梯度下降与PyTorch张量操作技术指南
人工智能·pytorch·python·深度学习·神经网络·机器学习·自然语言处理
呱牛do it2 小时前
企业级绩效考核系统设计与实现:基于FastAPI + Vue3的全栈解决方案
python·fastapi
Reart2 小时前
从0解构tinyWeb项目--(Day:2)
javascript·后端·架构
7年前端辞职转AI2 小时前
Python 容器数据类型
python·编程语言
云霄IT2 小时前
安卓开发之java转dex再转smali
android·java·python
果汁华2 小时前
Typer:基于类型提示的现代Python CLI框架
开发语言·网络·python