功能逻辑介绍：
管理员通过数据库添加部门数据，前端通过触发部门管理icon，列出已经添加的部门数据。
1：首先创建数据表信息，
我们重点是学会整体思路，避免过多参数复杂了理解，简单点，就先创建两个字段，一个部门id，一个部门名称。
我们在其插入几条数据，数据库建表语句：
SET NAMES utf8;
SET FOREIGN_KEY_CHECKS = 0;
DROP TABLE IF EXISTS `department`;
CREATE TABLE `department` (
`id` int(11) NOT NULL AUTO_INCREMENT,
`name` varchar(255) CHARACTER SET utf8 COLLATE utf8_general_ci NOT NULL,
PRIMARY KEY (`id`) USING BTREE
) ENGINE = InnoDB AUTO_INCREMENT = 7 CHARACTER SET = utf8 COLLATE = utf8_general_ci ROW_FORMAT = Compact;
INSERT INTO `department` VALUES (1, '部门1');
INSERT INTO `department` VALUES (2, '部门2');
INSERT INTO `department` VALUES (3, '部门3');
INSERT INTO `department` VALUES (4, '部门4');
INSERT INTO `department` VALUES (5, '部门5');
INSERT INTO `department` VALUES (6, '部门6');
SET FOREIGN_KEY_CHECKS = 1;
前端在templates下创建homepage.html。用于加载首页。
首页布局暂定为左右结构，也就是模块按钮定义在侧边栏位置，右侧区域动态加载各个模块内容。
在homepage.html实现两个div：
欢迎来到自动化测试平台
点击部门管理后请求后端路由函数/departments.
后端在index.py函数内创建departments路由用于转发到部门管理页面。
@app.route('/departments')
def departments():
return render_template('departments.html')然后在前端在templates下创建继续departments.html前端界面，此界面
通过ajax请求后台数据信息，加载到前端界面进行展示。
定义一个table，其中包含一个tbody和一个thead。
thead是表格头部信息，tbody对应头部信息的真实数据。
部门 ID
部门名称
ajax请求函数实现：
<script>
$(document).ready(function () {
$(document).ready(function () {
$.ajax({
url: '/get-departments',
type: 'GET',
success: function (res) {
let departments = res.departments;
for (let department of departments) {
$('table tbody').append(`
${department.id}
${department.name}
`);
}
},
error: function (err) {
console.error('获取部门数据失败', err);
}
});
});
});
</script>ajax请求的url为后端请求数据路由，因为是向服务端获取数据显示，请求type为get。
此时在后端casecommon.py实现/get-departments路由函数。
此函数需要连接数据库，执行sql查询，将所有数据转换为json格式，返回给前端用于展示。
为了后面查询数据，这里我将数据库查询封装在dbbase.py文件中。此文件类名为DBbase。
数据库连接操作为：
查询sql封装为：
/get-departments路由函数具体实现为：
from flask import jsonify
from app.dbbase import DBbase
db = DBbase()
from app import app
@app.route('/get-departments', methods=['GET'])
def get_departments():
# mycursor.execute("SELECT id, name FROM department")
# departments = mycursor.fetchall()
sql = "SELECT id, name FROM department"
departments = db.select_data(sql)
departments_list = [{'id': d[0], 'name': d[1]} for d in departments]
return jsonify({'departments': departments_list})将查询到的整个departments重新组装数据，每条部门数据装在列表中。
原始查询后departments数据形式{{}，{}，{}}。组装后的形式为
{ "departments":
[ {"id": 1, "name": "部门1"}, {"id": 2, "name": "部门2"}, {"id": 3, "name": "部门3"}, ... ]
}。
将此数据赋值给departments_list。在通过jsonify转换为json格式进行返回给前端。
那么这整个数据的key即为departments，value即为一个装载每条部门信息数据的列表。
前端接收到数据后，jquary会默认将其转换为前端可识别的数据形式。这时候在将数据进行拆分，定义一个res参数用来接收全部数据，在定义一个参数将value值全部获取赋给departments。此时departments数据结构为
[ {"id": 1, "name": "部门1"}, {"id": 2, "name": "部门2"}, {"id": 3, "name": "部门3"}, ...]
遍历departments，for-of循环遍历res.departments数组，每次循环中的变量department都是一个表示部门的对象，你可以直接访问department.id和department.name来获取部门的ID和名称。在找到界面所有的tbody将其append进去。
在函数的主运行入口定义以下内容：
from http import server
from urllib import request
from app import app
if __name__ == '__main__':
app.run(host="0.0.0.0", debug=True,port=9555)
server.logger.info('info log')
server.logger.info('【请求的方法】{}【请求路径】{}【请求地址】{}'.format(request.method, request.path, request.remote_addr))运行后界面展示：
整体部门管理完整实现流程如上。
下一节：项目管理模块实现，敬请期待。