05 django管理系统 - 部门管理

05 django管理系统 - 部门管理 - 修改部门

news2024/12/1 2:30:04

04我们已经实现了新增部门的功能，下面开始修改部门模块的实现。

按道理来说，应该是做成弹框样式的，通过ajax悄咪咪的发数据，然后更新前端数据，但是考虑到实际情况，先用页面跳转的方式实现，后面再用ajax的方式优化一下。

下面开始修改部门的操作。

首先给每一列数据新增一个操作动作，即删除/编辑。

{% extends 'base.html' %}

{% block content %}

    <div class="container-fluid">
        <div style="margin-bottom: 10px" class="clearfix">
            <div class="panel panel-default">
                <!-- Default panel contents -->
                <div class="panel-heading">
                    <a class="btn btn-primary" href="/dept/add/" role="button">添加部门</a>
                </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>
                        <th>操作</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>

                            <td>
                                <a class="btn btn-success" href="/dept/{{ obj.id }}/edit_detail/" role="button">编辑部门</a>
                                <a class="btn btn-danger" href="/#" role="button">删除部门</a>
                        </tr>

                    {% endfor %}
                    </tbody>
                </table>
            </div>
        </div>
    </div>

{% endblock %}

效果如下：

下面我们来实现编辑的功能

配置URL路径

urlpatterns = [
    # 部门管理
    path("dept/list/", dept.dept_list),
    path("dept/add/", dept.dept_add),
    path("dept/<int:nid>/edit_detail/", dept.dept_editdetail),
]

定义dept_editdetail函数

"""修改部门"""
def dept_editdetail(request, nid):
    return render(request, 'dept_editdetail.html')

定义dept_editdetail.html

主要用于展示一个包含表单的页面：
1 继承基础模板：{% extends 'base.html' %} 表示该页面继承自 base.html 模板。
2 定义内容块：{% block content %}...{% endblock %} 定义了一个名为 content 的块，用于填充 base.html 中对应的内容区域。
3 显示标题：通过 {{ title }} 显示从 admin_add() 函数返回的标题。
4 生成表单：使用 {% csrf_token %} 添加 CSRF 保护；通过循环 {% for field in form %} 动态生成表单字段及其标签、错误信息。
5 提交按钮：提供一个“保存”按钮用于提交表单。

{% extends 'base.html' %}

{% block content %}
    <div class="container">


        <div class="panel panel-default">
            <div class="panel-heading">
                <!--title从admin_add()的return返回值中获取，通过模板变量title-->
                <h4 class="panel-title">{{ title }}</h4>
            </div>
        </div>


        <div class="panel-body">
            <form method="post" action="" novalidate>
                <!-- 如果在django中以post 方式提交表单，需要添加csrf_token -->
                {% csrf_token %}

                {% for field in form %}
                    <div class="form-group">
                        <label class="form-control">{{ field.label }}</label>
                        {{ field }}
                        <div class="text-danger">{{ field.errors.as_text }}</div>
                    </div>
                {% endfor %}

                <button type="submit" class="btn btn-success">保 存</button>
            </form>
        </div>


    </div>
{% endblock %}

重新回到dept_editdetail函数，编写业务逻辑

1 通过nid获取指定ID的部门对象。
2 若对象不存在，重定向至部门列表页。
3 对GET请求，生成编辑表单并渲染页面。
4 对POST请求，验证表单数据后更新数据库或返回错误信息。

def dept_editdetail(request, nid):
    title = "修改部门"
    # 根据id，获取当前数据
    row_obj = models.Dept.objects.using('default').get(id=nid)
    print("row_obj", row_obj)

    # 如果数据不存在，则返回部门列表
    if not row_obj:
        print("数据不存在")
        return redirect('/dept/list')

    # 获取表单信息
    if request.method == 'GET':
        form = DeptEditModelForm(instance=row_obj)
        return render(request, 'dept_editdetail.html', {'form': form, 'title': title})

    form = DeptEditModelForm(data=request.POST, instance=row_obj)
    # print("当前的form", form)

    print("form.errors", form.errors)
    if form.is_valid():
        form.save()
        return redirect('/dept/list')
    return render(request, 'dept_editdetail.html', {'form': form, 'title': title})

效果如下：