20.零基础快速入门Python Web开发——综合项目：图书管理系统

白皮书搬运家

已于 2024-03-12 22:57:01 修改

阅读量529

点赞数 6

分类专栏： Python Web开发文章标签： python 前端 sqlite 数据库 django css 开发语言

于 2024-03-12 22:56:34 首次发布

本文链接：https://blog.csdn.net/qq_37002374/article/details/136665820

版权

Python Web开发专栏收录该内容

10 篇文章

订阅专栏

综合实训——图书管理系统的增、删、改、查

本节结合前面所学知识点，基于Django的form组件——ModelForm进行实战练习，实现一个简单的图书系统的增、删、改、查功能。效果页面如图所示。

图图书管理页面

1.1 功能描述

1. 项目首页展示图书列表，列表依次包含书籍ID、书名、出版社、作者。

2. 列表中的每条记录对应分别一个链接“编辑”和“删除”。单击对应记录编辑，跳转修改页面进行数据修改，单击对应记录的删除链接，该记录将被删除。

3. 项目首页展示图书列表上方设置一个添加按键，点击添加按键，页面跳转到添加页面进行数据添加。

4. 在添加、删除、编辑结束后，URL都需要重定向到首页图书列表（index)。

5. 对表单样式进行优化。

6. 设计登录界面Welcome to My Book Management System，并使用css对界面样式进行优化。

1.2 操作流程

模型(model):定义模型，根基功能要求设置表单字段，字段类型和参数。代码如下。

from django.db import models



class Book(models.Model):

    book_name = models.CharField(max_length=30)

    book_publisher = models.CharField(max_length=20)

    book_author = models.CharField(max_length=20)



    class Meta:

        db_table = 'book_tb'

模型定义完成后，对模型进行数据迁移。

编辑index页面模板，在templates文件夹下创建index.html来显示图书列表。

<!doctype html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta name="viewport"

          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">

    <meta http-equiv="X-UA-Compatible" content="ie=edge">

    <title>Index</title>

</head>

<body>

    <div style="width: 60%;margin-left: 200px;">

        <button><a href="/add/">添加</a></button>

        <table style="width: 100%">

            <tr>

                <th style="border: red 1px solid">ID</th>

                <th style="border: red 1px solid">书名</th>

                <th style="border: red 1px solid">出版社</th>

                <th style="border: red 1px solid">作者</th>

                <th style="border: red 1px solid">编辑</th>

                <th style="border: red 1px solid">删除</th>

            </tr>

            {% for book in books %}

                <tr>

                    <td style="border: red 1px solid">{{ book.id }}</td>

                    <td style="border: red 1px solid">{{ book.book_name }}</td>

                    <td style="border: red 1px solid">{{ book.book_publisher }}</td>

                    <td style="border: red 1px solid">{{ book.book_author }}</td>

                    <td style="border: red 1px solid"><button><a href="/edit/?id={{ book.id }}">编辑</a></button></td>  {# 需要传入要编辑的书籍的id #}

                    <td style="border: red 1px solid"><button><a href="/delete/?id={{ book.id }}">删除</a></button></td> {# 需要传入要删除的书籍的id #}

                </tr>

            {% endfor %}



        </table>

    </div>

</body>

</html>

编辑添加（add)页面模板，在templates文件夹下创建add.html来显示图书添加页面。

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>添加页面</title>

</head>

<body>

    <div style="width: 60%;margin-left: 200px;">

        <form action="" method="post">

            {% csrf_token %}

            <div>

                {{ b_obj.as_p }}

            </div>



            <input type="submit" value="提交">

        </form>

    </div>

</body>

</html>

编辑修改（edit)页面模板，在templates文件夹下创建edit.html来显示图书修改页面。

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>编辑页面</title>

</head>

<body>

    <div style="width: 60%;margin-left: 200px;">

        <form action="" method="post">

            {% csrf_token %}

            <div>

                {{ b_obj.as_p }}

            </div>



            <input type="submit" value="提交">

        </form>

    </div>

</body>

</html>

编辑视图函数，使用ModelForm方式创建BookForm表单，并定义视图函数来实现表单中书籍信息的增、删、改、查和展示登录页面等功能。

from django.shortcuts import render,HttpResponse,redirect

from django import forms

from .models import Book



#定义一个form表单的类，使用Book模型

class BookForm(forms.ModelForm):

    class Meta:

        model = Book

        fields = ['book_name','book_publisher','book_author']   #生成表单的时候显示的字段



#首页展示所有书籍（常规操作）

def index(request):

    books = Book.objects.all()

    return render(request,'index.html',{'books': books})



#添加书籍（使用ModelForm的功能）

def add(request):

    if request.method == 'GET':

        b_obj = BookForm()

        return render(request,'add.html',{'b_obj': b_obj})  #返回一个添加页面，展示一个空的form表单

    else:

        b_obj = BookForm(request.POST)  #当用户提交数据后实例化一个拥有提交了的数据的对象

        if b_obj.is_valid():            #如果数据通过校验

            b_obj.save()                #保存到数据库中，添加一条记录

        return redirect('/index/')      #提交成功后跳转到首页



#编辑书籍（使用ModelForm的功能）

def edit(request):

    id = request.GET.get('id')  #获取要编辑的书籍的id

    book = Book.objects.get(id=id)  #取出id值对应的书籍对象

    if request.method == 'GET':

        b_obj = BookForm(instance=book)  #这一步实例化的时候，需要传入书籍对象,生成表单的时候就会默认填充这些数据

        return render(request,'edit.html',{'b_obj': b_obj})

    else:

        b_obj = BookForm(instance=book,data=request.POST)  # 此处需要传入编辑的书籍对象，和提交的数据

        if b_obj.is_valid():

            b_obj.save()

        return redirect('/index/')



#删除书籍（常规操作）

def delete(request):

    id = request.GET.get('id')  # 获取要删除的书籍的id

    book = Book.objects.get(id=id)  # 取出id值对应的书籍对象

    book.delete()      #从数据库中删除这个书籍对象

    return redirect('/index/')   #删除后跳转至首页



#登录界面

def login(request):

    return render(request,'login.html')

为视图函数配置URL

#登录界面

from django.urls import path

from . import views



urlpatterns = [

    path('',views.login),

    path('index/',views.index),     #首页的路由

    path('add/',views.add),         #添加数据的路由

    path('edit/',views.edit),       #编辑数据的路由

    path('delete/',views.delete)    #删除数据的路由

]

对登录界面进行样式优化，在项目同名文件夹下创建static文件夹，将css样式单文件login.css放入static文件夹内。在login.css内添加如下代码进行页面优化。

h1{color:red ;

    text-align:center;

    margin: 0 auto;

    padding-top: 160px;}

div{

    text-align:center;

    padding-top: 60px;

}

body{

    background:bisque no-repeat center center fixed;

    background-size: cover;

    padding-top: 20px;}

补充知识点：Django中使用css文件进行样式优化，需要在要被优化的模板文件中， head标签之前，添加下面一行代码导入{% load static %}，并在</titel>之后、</head>之前，添加如下一行代码<link href="{% static 'CSS路径' %}" rel='stylesheet'>。

以本项目为例，在templates文件下创建login.html文件，在“templates\login.html”中添加如下代码。加深代码为django中使用css进行样式优化所需添加代码。

<!DOCTYPE html>

<html lang="en">

{% load static %}

<head>

    <meta charset="UTF-8">

    <title>Title</title>

    <link href="{% static 'login.css' %}" rel='stylesheet'>

</head>



<body>

<h1>Welcome to My Book Management System</h1>

<div>

       <a href="http://127.0.0.1:8000/index">欢迎来到我的书籍管理系统</a>

</div>

</body>

</html>

浏览器中访问http://127.0.0.1:8000，登录页面如图所示。