系統(tǒng)：Windows 7
語言版本：Anaconda3-4.3.0.1-Windows-x86_64
編輯器：pycharm-community-2016.3.2
Django：2.1.4
Python：3.6.0
- 本系列介紹如何搭建一個網(wǎng)站，后端使用django框架
- 今天開始介紹一個單獨的項目app
- 主要功能包括：學習成績查詢，數(shù)據(jù)統(tǒng)計分析
- 涉及前端模塊：Datatables、ECharts、JQuery
Part 1：目標
- 提前在數(shù)據(jù)庫中錄入一部分成績信息，選擇特定條件查詢
- 上篇文章中已經(jīng)介紹了前端的實現(xiàn)代碼，本文說說對應的后端代碼
數(shù)據(jù)庫
2.png
查詢-動圖
1.gif
查詢-靜圖
1.png
Part 2：代碼邏輯
- 通過上一篇文章的前端代碼，前端從后端獲取的關鍵信息如下，也就是說后端傳過來的數(shù)據(jù)為data.lookup，后續(xù)的顯示工作全部交給前端：
success: function(data) {
var str_lookup_result = JSON.stringify(data.lookup);
var array_lookup_result = JSON.parse(str_lookup_result);
...
}
- 我們看看前后端如何傳遞數(shù)據(jù)，我們看一個簡單示例：如下圖當選擇學生姓名為張三，查詢結(jié)果如下
- 前端向后端傳遞數(shù)據(jù)：張三
- 后端向前端傳遞了表格數(shù)據(jù)，對應后端的信息如下圖
示例
1.png
后端關鍵數(shù)據(jù)
2.png
- 以上截圖包括兩個數(shù)據(jù)：
- 前端向后端傳遞的數(shù)據(jù)：一個字典，對應查詢條件
- 后端向前端傳遞的數(shù)據(jù)：一個列表，列表中每一個元素為一個字典，每個元素對應前端輸出的一行數(shù)據(jù)。字典中每個鍵為前端的columns信息，也就是說后端傳遞過來的數(shù)據(jù)是通過columns的列名與字典的鍵信息實現(xiàn)一一對應的效果
"columns": [
{ data: "class_name",
className:'table-center',},
{ data: "student_name",
className:'table-center',},
{ data: "exam_info",
className:'table-center',},
{ data: "course_name",
className:'table-center-hide',
createdCell: function(nTd, sData, oData, iRow, iCol){
$(nTd).attr('title',sData);
},
},
{ data: "grades",
className:'table-center-hide',
createdCell: function(nTd, sData, oData, iRow, iCol){
if(sData < 60) {
$(nTd).css("background-color", "#FFB6C1");
};
},},
],
Part 3：后端代碼
url部分：對應前端地址url:'/sg/showNotes/', 通過url地址將前后端連接起來，相當于提供了一個通道
from django.urls import re_path, path
from .views import *
app_name = "school_grades"
urlpatterns = [
re_path('^gradesinput/$', SGInputAndCheckView.as_view(), name='gradesinput'),
re_path('^showNotes/$', SGShowNotesView.as_view(), name='showNotes'),
]
代碼截圖
3.png
views部分
class SGShowNotesView(View):
def post(self, request):
dict_data = json.loads(request.body)
print(dict_data)
# 獲取前端傳送數(shù)據(jù)
class_name = dict_data["class_name"]
student_name = dict_data["student_name"]
course_name = dict_data["course_name"]
exam_info = dict_data["exam_info"]
list_condition = [class_name, student_name, course_name, exam_info]
list_fields_name = ["class_name", "student_name", "course_name", "exam_info", "grades"]
if not any(list_condition):
lookup_result = StudentGrades.objects.values(*list_fields_name).all()
else:
filter_condition = Q()
filter_condition.connector = "AND"
if class_name:
filter_condition.children.append(('class_name', class_name))
if student_name:
filter_condition.children.append(('student_name', student_name))
if course_name:
filter_condition.children.append(('course_name', course_name))
if exam_info:
filter_condition.children.append(('exam_info', exam_info))
lookup_result = StudentGrades.objects.values(*list_fields_name). \
filter(filter_condition)
list_lookup_result = list(lookup_result)
data = dict()
data['lookup'] = list_lookup_result
print(list_lookup_result)
return JsonResponse(data)
代碼截圖
4.png
Part 4：部分代碼解讀
- 前端向后端傳遞信息，注意在views剛開始的地方引入以下模塊
-
dict_data = json.loads(request.body)，通過該語句將前端的數(shù)據(jù)轉(zhuǎn)換為后端的字典。 - 因為js與Python語言的不同，類似的結(jié)構(gòu)需要進行一個轉(zhuǎn)換工作，這類轉(zhuǎn)換代碼記住即可
-
import json
from django.db.models import Q
from django.shortcuts import render
from django.views.generic.base import View
from django.http import JsonResponse
from school_grades.models import Constants, StudentGrades
前端json數(shù)據(jù)
5.png
- 多條件查詢，ORM查詢
- 引入
Q()模式，將多條件查詢簡單化，再也不用超級長的SQL語句，對于寫代碼人員太便捷了，也容易識別錯誤 -
filter_condition.connector = "AND"，多個條件是邏輯與的關系，那么是否還有其它模式，后續(xù)有用到再介紹 -
filter_condition.children.append(('class_name', class_name))增加新的檢索條件，在本示例中，因為有4個條件，結(jié)合if判斷使用
filter_condition = Q()
filter_condition.connector = "AND"
if class_name:
filter_condition.children.append(('class_name', class_name))
if student_name:
filter_condition.children.append(('student_name', student_name))
if course_name:
filter_condition.children.append(('course_name', course_name))
if exam_info:
filter_condition.children.append(('exam_info', exam_info))
lookup_result = StudentGrades.objects.values(*list_fields_name). \
filter(filter_condition)
- 后端向前端輸出數(shù)據(jù)
-
JsonResponse(data)，其中data是一個字典，其中鍵lookup與前端對應
data = dict()
data['lookup'] = list_lookup_result
print(list_lookup_result)
return JsonResponse(data)
以上為本次的學習內(nèi)容，下回見
長按圖片識別二維碼，關注本公眾號
Python 優(yōu)雅 帥氣
12x0.8.jpg
