4 图书信息模块
Django中每一个项目应用的开发基本上都遵循同样的步骤：
- 如果需要用到数据库，首先在模型文件models.py中定义数据库字段，并执行迁移命令。
- 在项目根目录的urls.py中导入项目App的urls.py文件，采用include()的方式导入。
- 编写项目App的urls.py文件，设置URL地址信息。
- 根据设置的URL地址信息编写相对应的视图函数。
图书信息应该来自数据库，因此，首先我们需要定义图书信息表的模型：
#book 的 models.py
from django.db import models
#图书分类表
class Catagory(models.Model):
cata_id = models.AutoField('序号', primary_key=True)#图书类别的id
cata_name = models.CharField('类别', max_length=50)#图书类别的名称
parent_cata = models.ForeignKey('self', verbose_name="父级分类", on_delete=models.CASCADE, blank=True, null=True)#父级分类
def __str__(self):
return self.cata_name
class Meta:
verbose_name = '图书类别'
verbose_name_plural = '图书类别'
#图书信息表
class Book_info(models.Model):
book_id = models.AutoField('序号', primary_key=True)#图书id，主键
book_sku_id = models.CharField('SKU_ID', max_length=8)#京东图书的sku_id
book_name = models.CharField('书名', max_length=150)#图书的名称
book_author = models.CharField('著者', max_length=100)#图书的著者
book_pic = models.CharField(max_length=150)#图书封面的图片文件路径
book_isbn = models.CharField('标准号', max_length=20)#图书的ISBN号
book_size = models.CharField('开本', max_length=5)#图书的开本
book_press = models.CharField('出版社', max_length=50)#图书的出版社
book_pub_date = models.CharField('出版日期', max_length=20)#图书的出版日期
book_pack = models.CharField('包装', max_length=2)#图书的包装，精装/平装
book_edition = models.IntegerField('版次')#图书的版次
book_page = models.IntegerField('页数')#图书的页数
book_price = models.FloatField('定价', max_length=8)#图书的定价
book_substract = models.TextField('简介')#图书的简介
cata_id = models.ForeignKey(Catagory, on_delete=models.CASCADE, verbose_name='图书分类')#外键，连接图书分类表
def __str__(self):
return self.book_name
class Meta:
verbose_name = '图书信息'
verbose_name_plural = '图书信息'
这里我们定义了两个模型，分别是图书分类表和图书信息表对应的模型，需要注意的是，在定义模型时，由于图书信息表Book_info有外键指向图书分类表Catagory，因此，图书分类表Catagory的模型定义应该放在图书信息表Book_info的前面，否则程序在定义图书信息表时会因找不到图书分类表Catagory而报错。
然后在终端输入迁移命令：
#项目终端下依次输入
E:\MyProject\JiangXiongGo>python manage.py makemigrations
E:\MyProject\JiangXiongGo>python manage.py migrate
命名执行完成后，在数据库中可以看到我们创建的数据表。
image.png
上面的book_book_info和book_catagory就是我们定义的模型在数据库中对应的数据表，以“应用名+类名”的格式来命名的，book是我们正在开发的应用名，book_info和catagory是我们在模型文件models.py中定义的类名。
image.png
定义好模型以后，我们开始配置URL地址信息，首先在项目的urls.py中导入book的urls.py
#JiangXiongGo 的 urls.py
from django.contrib import admin
from django.urls import path, include
urlpatterns = [
path('admin/', admin.site.urls),
path('book/', include('book.urls')),
]
然后在book应用的urls.py中编写URL地址信息，这里先定义一个首页的URL地址，代码如下：
#book 的 urls.py
from django.urls import path
from . import views
#设置URL的地址信息
urlpatterns = [
path('index/', views.indexView, name='index'),
]
最后就是编写视图函数indexView，这里可以先测试一下URL的指向是否正确，在视图函数中添加以下代码：
#book 的 views.py
from django.shortcuts import render
from django.http import HttpResponse
def indexView(request):
return HttpResponse('这是首页')
运行项目，在浏览器输入http://127.0.0.1:8000/book/index/，得到如下结果：
image.png
运行正常！
首页
接下来就是实现首页的功能。博主没有前端设计的艺术细胞，主要还是以后台逻辑的功能实现为主。首页的模板主要包括网页头、导航、图片轮播和一个搜索入口，其中 网页头包括一个logo和一个登录按钮。大致如下图这样：
image.png
由于目前我们编写的图书信息模块，因此这里只实现图书搜索的功能，登录先用按钮占位、图片轮播作为宣传展示后期在后台实现添加删除轮播的图片，暂且不管。这里我采用的bootstrap4构建的前端页面，图书搜索的HTML代码如下：
<div class="container">
<form action="{% url 'book_list' 1 %}" method="POST">
{% csrf_token %}
<div class="input-group mb-3">
<input type="text" name="search" class="form-control" autocomplete="off" required placeholder="搜索图书，开始荐购...">
<div class="input-group-append">
<button class="btn btn-success" type="submit">搜索</button>
</div>
</div>
</form>
</div>
代码结构很简单，一个form表单，定义方法为POST，里面包含一个 name 为 search 的input文本输入框，input的属性中，autocomplete="off"表示关闭文本自动完成，该功能在移动端不太友好， required表示该字段为必填字段。用户点击搜索提交表单后，系统将用户输入的数据提交给url 'book_list/1'，即图书列表页，这里再回顾以下图书列表页的URL地址信息：
path('book_list/<int:page>/', views.Book_listView, name='book_list'),
然后编写对应的视图函数Book_listView，以实现图书搜索的功能，book_listView的主要代码如下：
def Book_listView(request, page):
#判断请求的方法，如果是POST请求，则进行下一步判断
if request.method == 'POST':
keyword = request.POST.get('search')
book_list = Book_info.objects.filter(Q(book_name=keyword) | Q(book_author=keyword) | Q(book_press=keyword))
result_num = len(book_list)
if result_num == 0:
recommending = True
searching = True
else:
#获取数据表Book_info的全部数据
book_list = Book_info.objects.order_by('book_id').all()
result_num = len(book_list)
return render(request, 'book_list.html', locals())
上面的代码中，首先判断请求的方法，如果是POST请求，则说明是用户提交的搜索请求，通过request.POST.get('search')获取用户的检索词，然后通过Book_info模型查询数据库中书名、作者或出版社与检索词相匹配的记录列表，如果数据库中没有记录，那么还要通过模板变量recommending来向用户展示一个手工录入图书信息的表单，最后将模板变量searching 设为True，向用户展示搜索信息。以检索词“老舍”为例，如下图所示：
老舍检索词结果
如果随便输入一个不存在的书名，那么展示的页面应该如下：
输入我是测试的检索结果
那么图书信息模块在首页上的功能基本实现，接下来继续实现列出全部图书列表信息的功能。
图书列表页
实际上图书列表页在上一部实现搜索功能的时候已经实现了部分功能，在读者发起GET请求的时候，Book_listView视图函数会查询数据库中所有图书，并返回给模板。
接下来只要要实现分页功能即可。
虽然Django已为开发者内置了分页功能，只需调用Django内置分页功能的函数即可实现数据分页功能。
但是这里我们不采用django的内置分页功能，因为 我们的网站后台数据将来会是几十万甚至上百万的数据量，Django内置的分页Paginator对象每次都要查询数据库中所有数据，在开发时数据量较小影响不大，一旦上线部署数据量达到几十万以后响应将会非常缓慢。
因此，这里我采用了一种取巧的方法，根据每次传递的页码，取一定范围的数据返回给用户。比如每页设定20条数据，当前页码是5，那么数据库取出的是100-120条数据。在分页上，由于要照顾到手机等移动端的用户，不采用页码分页，只保留上一页和下一页，这样视图函数每次获取当前页码渲染模板的时候，顺便把上一页和下一页的页码也传递给模板，就实现了分页功能。
视图函数的主要代码如下：
#book 的 views.py
def Book_listView(request, page):
#判断请求的方法，如果是POST请求，则进行下一步判断
if request.method == 'POST':
keyword = request.POST.get('search')
book_list = Book_info.objects.filter(Q(book_name=keyword) | Q(book_author=keyword) | Q(book_press=keyword))
result_num = len(book_list)
if result_num == 0:
recommending = True
searching = True
else:
#获取数据表Book_info的全部数据
result_num = len(Book_info.objects.order_by('book_id').all())
last_page = math.floor(result_num/20)
if page > last_page:
page = last_page
pre_page = page -1
next_page = page + 1
book_list = Book_info.objects.order_by('book_id').all()[(page-1)*20:(page*20)]
return render(request, 'book_list.html', locals())
模板文件中的分页部分就比较简单了：
{# 分页导航 #}
<div class="container center">
<ul class="pagination">
{# 上一页的URL地址 #}
{% if page > 1 %}
<li><a href="{% url 'book_list' pre_page %}">上一页</a></li>
{% endif %}
{# 下一页的URL地址 #}
{% if page < last_page %}
<li><a href="{% url 'book_list' next_page %}">下一页</a></li>
{% endif %}
</ul>
</div>
实现的效果如下：
image.png
图书分类
接下来我们做一个图书浏览的页面，在首页导航中添加分类浏览链接
#base.html
<a class="nav-link" href="{% url 'catagory' %}">分类浏览</a>
然后到urls.py中配置URL地址信息
#图书分类页
path('catagory/', views.catagoryView, name="catagory"),
#图书分类列表页
path('cata_list/', views.cata_listView, name="cata_list"),
最后编写对应的视图函数catagoryView和cataDetailView。
def catagoryView(request):
catagorys = Catagory.objects.all()
return render(request, 'catagory.html', locals())
def cata_listView(request):
cata_id = request.GET.get('cata_id')
page = int(request.GET.get('p'))
result_num = Book_info.objects.filter(cata_id=cata_id).count()
last_page = math.floor(result_num/20)
if last_page:
if page > last_page:
page = last_page
pre_page = page -1
next_page = page + 1
book_list = Book_info.objects.order_by('book_id').filter(cata_id=cata_id)[(page-1)*20:(page*20)]
return render(request, 'cata_list.html', locals())
catagoryView视图函数比较简单，查询所有的分类数据传递给模板就可以了，cataDetailView视图函数根据用户的点击不同类别，通过GET方法获取到类别的cata_id以及当前页码p，然后查询该cata_id类别的所有图书返回给模板cata_list.html即可。
模板文件如下：
#book 的 catagory.html
{% extends 'base.html' %}
{% load staticfiles %}
<link rel="stylesheet" href="{% static 'css/mycss.css' %}">
{% block body %}
<div class="container">
<div id="accordion">
{% for item in catagorys %}
{% if item.parent_cata == NULL %}
<div class="card">
<div class="card-header">
<a class="card-link" data-toggle="collapse" href="#{{ item.cata_id }}"> {{ item.cata_name }}</a>
</div>
<div id="{{ item.cata_id }}" class="collapse" data-parent="#accordion">
<div class="card-body">
{# 这里采用catagory_set.all查询了模型中item该字段对应的所有关联字段 #}
{% for sub_item in item.catagory_set.all %}
<a href="{% url 'cata_list' %}?cata_id={{ sub_item.cata_id }}&p=1">{{ sub_item.cata_name }}</a> |
{% endfor %}
</div>
</div>
</div>
{% endif %}
{% endfor %}
</div>
</div>
{% endblock %}
#book 的 cata_list.html
{% extends "base.html" %}
{% load staticfiles %}
<link rel="stylesheet" href="{% static 'css/mycss.css' %}">
{% block body %}
<div class="container clearfix">
<div class="container"><span>该类别下 检索到图书记录 {{ result_num }} 条</span></div>
{% for item in book_list %}
<div class="responsive">
<div class="img">
<a target="_blank" href="{% url 'book_detail' %}?ids={{ item.book_id }}">
<img src="{{ item.book_pic }}" alt="" width="300" height="200">
</a>
<div class="desc">{{ item.book_name }}</div>
<div class="desc"><span>{{ item.book_press }}</span></div>
</div>
</div>
{% endfor %}
</div>
{# 分页导航 #}
<div class="container center">
<ul class="pagination">
{# 上一页的URL地址 #}
{% if page > 1 %}
<li><a href="{% url 'cata_list' %}?cata_id={{ cata_id }}&p={{ pre_page }}">上一页</a></li>
{% endif %}
{# 下一页的URL地址 #}
{% if page < last_page %}
<li><a href="{% url 'cata_list' %}?cata_id={{ cata_id }}&p={{ next_page }}">下一页</a></li>
{% endif %}
</ul>
</div>
{% endblock %}
实现效果如下图：
分类页面
点击子分类进入该分类图书列表
这里的逻辑很简单，但是由于我对Django的模板和模型的操作不太熟练，一直没搞懂django关联查询是怎么回事，在分类这里走了点弯路，特别加粗提醒一下！Django不用从视图函数传递数据库中的数据也可以直接在模板中使用模型的，所以上面的catagory.html模板中，代码可以精简的。比如视图函数可以只传递父类数据信息，在模板中就不需要额外判断是不是父类的元素。
#views.py 的 catagoryView
roots = Catagory.objects.filter(parent_cata=None)
#catagory.html
{% for item in roots %}
<!-- {% if item.parent_cata == NULL %} -->
<div class="card">
<div class="card-header">
<a class="card-link" data-toggle="collapse" href="#{{ item.cata_id }}"> {{ item.cata_name }}</a>
</div>
<div id="{{ item.cata_id }}" class="collapse" data-parent="#accordion">
<div class="card-body">
{# 这里采用catagory_set.all查询了模型中item该字段对应的所有关联字段 #}
{% for sub_item in item.catagory_set.all %}
<a href="{% url 'cata_list' %}?cata_id={{ sub_item.cata_id }}&p=1">{{ sub_item.cata_name }}</a> |
{% endfor %}
</div>
</div>
</div>
<!-- {% endif %} -->
{% endfor %}
图书详情页
图书信息模块还有最后一个图书详情页要实现，还是老样子，首先定义图书详情页的URL地址信息、模板和视图函数。
#book 的 urls部分
#图书详情页
path('book_detail/', views.book_detailView, name="book_detail"),
#book_detail.html
{% extends "base.html" %}
{% load staticfiles %}
<link rel="stylesheet" href="{% static 'css/mycss.css' %}">
{% block body %}
{# 面包屑导航#}
<nav class="breadcrumb">
<a class="breadcrumb-item" href="{% url 'book_list' %}">全部图书</a>
<a class="breadcrumb-item" href="#">{{ book_details.cata_id.parent_cata }}</a>
<a class="breadcrumb-item" href="{% url 'cata_list' %}?cata_id={{ book_details.cata_id.cata_id }}&p=1">{{ book_details.cata_id }}</a>
<span class="breadcrumb-item active">{{ book_details.book_name }}</span>
</nav>
{# 详情主页面 #}
<div class="container" style="margin-top:30px">
<div class="row">
<div class="col-sm-4">
<div class="fakeimg border">
<img class="img-fluid img-responsive" src="{{ book_details.book_pic }}">
</div>
<ul class="nav nav-pills flex-column ">
<li class="nav-item">
<a class="nav-link active text-center" href="#">荐购</a>
</li>
</ul>
<hr class="d-sm-none">
</div>
<div class="col-sm-8">
<h5 class="font-weight-bold">{{ book_details.book_name }}</h5>
<table>
<tr>
<th>著者：</th>
<td>
{{ book_details.book_author }}
</td>
</tr>
<tr>
<th>ISBN: </th>
<td>{{ book_details.book_isbn}}</td>
</tr>
<tr>
<th>出版社:</th>
<td>{{ book_details.book_press}}</td>
</tr>
<tr>
<th>出版日期：</th>
<td> {{ book_details.book_pub_date}}</td>
</tr>
<tr>
<th>页数:</th>
<td>{{ book_details.book_page}}</td>
</tr>
<tr>
<th>开本:</th>
<td> {{ book_details.book_size}}</td>
</tr>
<tr>
<th>装帧:</th>
<td>{{ book_details.book_pack}}</td>
</tr>
<tr>
<th>版次:</th>
<td>{{ book_details.book_edition}}</td>
</tr>
<tr>
<th>价格:</th>
<td>{{ book_details.book_price}}</td>
</tr>
</table>
<div class="fakeimg">简介: {{ book_details.book_substract}}</div>
</div>
</div>
</div>
{% endblock %}
#book 的 views.py 的 book_detailView函数
def book_detailView(request):
if request.method == "GET":
if request.GET.get('ids'):
book_id = request.GET.get('ids')
book_details = Book_info.objects.get(book_id=book_id)
root_cata = book_details.cata_id.parent_cata
return render(request, 'book_detail.html', locals())
上面的book_detailView函数通过GET方法接收模板传过来的ids参数，该参数表示图书的book_id，通过book_id查询该条记录的数据传给模板book_detail.html，最终显示的页面如下：
image.png
那么，图书信息模块到这里基本上实现了我们所需要的功能，我们实现了全部图书的分页显示，图书的模糊查询，图书的详情页面，还实现了图书的分类浏览。
