好了,最近水了好多期,终于要写点代码了。 本节内容,我们搞定这个多接口的大用例 列表相关吧,难度基本为0,都是我们之前用到过的。

出现bug或者建议的 小伙伴可以直接留言或进微信群,但是可惜的是微信群创建不到一小时就满200了,然后就需要通过邀请进群了,小伙伴可以加我vx: qingwanjianhua 然后我邀请你进群,群里聊天异常火爆~

首先打开P_cases.html:

我们去复制之前的接口库的列表html然后改改就好:

大家不要着急,本文结尾会放上最新的源码压缩包,群内也会每天分享最新的源码压缩包。

暂时先设计成这样,这是一个大table表格,表头就一行没啥特殊的,表体一行一行的 都是靠这个for循环 展示出来的。

看看效果:

好的,我们去后台找到 进入这个用例库 的函数:

这就是我们之前设计的 函数。我们现在去找到控制各个页面进入时候带的数据的函数:

child_json

给它加上 用例库需要带的数据:

我们现在 需要去数据库去构造这个大用例的表了:

打开models.py:

然后运行我们常用的两句命令 来生效:

运行时注意 要在项目的根目录,也就是能看到manage.py这个层:

然后别忘了 注册到admin.py中,这样我们后台也可以直接操作了:

然后我们重启服务 进入后台,找到这个用例表,去添加俩条数据:

注意这个project_id, 一定要是自己已有的项目哦,我的是1 你看看自己的;

添加好了:

现在让我们返回到

child_json

来补全代码:

然后我们重启服务,刷新页面,进入用例库看看效果:

已经成功显示出来了.但是大家发现 这个id 占的宽度太大了。所以我们要在id的表头th里加上宽度:

然后又变成了这个鬼样子:

原来是因为 所有的th一旦都设置了宽度后,那么你最好让它们加起来=100%或接近,不然就会出现右边空白一大块的窘境:

所以我们考虑再三,给名称的宽度加长:

动态的宽度设置:-webkit-calc(100% - 410px)

大家自行调整哈~

然后我们这里有个遗漏的bug:

就是我们发现 这个页面的顶部菜单上是这样写的:

你会发现,这里需要项目名称 和项目id,但是我们刚刚并没有传进来,所以此时点击顶部菜单 会发生错误进入到空白页面。

所以我们还是要回去views.py中在child_json里 给传过来项目name和id:

可能大家觉得有点麻烦了,后期我们会用更高端的手法重写这个顶部菜单,不过目前我们还是简单点,把精力放在核心功能上。

然后我们重启服务 刷新页面 ,来回切换下接口库 /用例库 ,发现没问题来,项目名称也显示了。

然后我们本节最后,添加一个新增用例的按钮:

放在了这个列表的最下方。

效果如下:

好了,今天的内容就这么多了。下一节我们 要实现 新增/复制/删除 这三个按钮的功能~

目前进度代码压缩包:

链接: https://pan.baidu.com/s/1rW3wu20-XBp1SEBU4B2ogQ  密码: u5qh

最后还是欢迎大家加群一起happy~

加我vx:qingwanjianhua  进群上车欢迎扩散

html调后台接口_接口测试平台代码实现62: 多接口用例2相关推荐

  1. ride上点击用例不能显示edit信息_接口测试平台代码实现61: 多接口用例1

    终于又序更上了,原谅最近作者几天事情不断. 按照我们之前的计划,需要迅速开启很重要的核心多用例接口. 首先,我们要确定,这个功能的大体设计. 就放在在我们的页面 用例库 中: 所以也就是我们很久之前就 ...

  2. unittest 多个测试文件只开一次浏览器_接口测试平台代码实现75: 多接口用例15

    根据我们上一节最后的投票. 引入unittest框架 碾压了第一种.其实我个人也偏向这个.因为我尝试过很多,但是唯独没有引入unittest在接口测试平台中.所以借此机会,也想挑战一下,涨点经验. 请 ...

  3. 请求到后台百分号被删除原因_接口测试平台代码实现85: 全局请求头1

    本节开始要制作一些次要功能,但是也是非常实用的.比如项目内的全局请求头. 首先看我们的前端页面,这个全局请求头的按钮: 我的设计是呢,点击后,出现一个弹层,这个弹层里除了保存/取消按钮 标题外.要有一 ...

  4. html留言板代码_接口测试平台代码实现19.首页优化

    按照最近俩天 小伙伴的反馈激烈程度,本节课准备把首页添加一个非常有用户黏性的一个功能.公司内的各个超链接传送门! 新来的公司的小伙伴经常会因为找不到各个平台/文档的地址而发懵.老员工跨部门工作的时候也 ...

  5. js代码自动排版_接口测试平台代码实现9:菜单常显

    上节我们说到了一个问题:就是如何让菜单出现在每个页面的左侧. 比如我们刚研发好的home.html,配上菜单看才会更好看. 这里有三个方法: 把菜单的html代码复制粘贴到 其他各个页面 特点:完全不 ...

  6. html div分钟刷新一次啊代码_接口测试平台代码实现57首页重构5

    本节我们接着开发首页, 主要内容是 让左侧的请求记录和右侧的请求模块 联动起来. 具体联动需求: 右侧请求一次之后,左侧生成记录 点击左侧记录,右侧则会显示这次记录的请求数据 我们本节课的内容是想办法 ...

  7. 接口测试平台代码实现66: 多接口用例-6

    我们本节继续研究 小步骤接口的 增删设置功能. 打开我们的P_cases.html,找到这个增加小步骤的按钮,给它添加onclick: 然后我们找个地方写好这个js函数: 这个函数很简单,我们直接请求 ...

  8. 接口测试平台代码实现74: 多接口用例-14

    本节开始前我们处理一个小bug: 就是上图这样的排版问题. 这是因为我们右侧的div的高度是固定的,所以导致五个多行文本框超出了.我们现在来修改一下右边这个div 的高度,打开P_cases.html ...

  9. 接口测试平台代码实现138: 关于大用例登陆态干扰bug

    昨天有小伙伴反馈说 他发现了一个bug, 就是当俩个项目 不同大用例 运行时,登陆态干扰问题. 按照他的描述,应该是如下场景触发的: 项目A - 有登陆态接口A (此登陆态接口返回一个字段A)- 大用 ...

最新文章

  1. 怎么通过MQTT查看数据是否上云端_干货 | 设备快速上云,轻松搞定设备与云端通信...
  2. python项目策划书_跟着销售学python系列(1)--实践项目骨架(1)
  3. 学完计算机的感想300,计算机实训总结计算机实训心得300
  4. mybatis 原理_Mybatis工作流程及其原理与解析
  5. Android网络通信的六种方式示例代码
  6. Python学习 Week2 part1
  7. navicat连接PostgreSQL报:column “rolcatupdate” does not exist ...错误的解决办法
  8. 电子围栏判断_电子围栏大用处:进出罐箱指定区域自动通知amp;罐箱库存和使用率自动计算...
  9. SpringBoot:Mybatis + Druid 数据访问
  10. linux全局查找-find,locate,whereis,which,type区别
  11. Java中文汉字转汉语拼音
  12. MySQL数据库微信h5棋牌搭建详解
  13. 《大数据之路:阿里巴巴大数据实践》-第1篇 数据技术篇 -第6章 数据服务
  14. UVM寄存器模型:reg adapter实现和集成
  15. 美国合同法笔记-合同定义
  16. 北斗导航 | EagleEye2000:国产激光雷达走进测绘世界
  17. 线程的条件变量(cond)
  18. 学习笔记(14):C++编程FFMpeg(QT5+OpenCV)实战--实时美颜直播推流-打开rtmp推流输出并从文件读取音视频帧...
  19. h5支付——前端需要处理什么?
  20. C# 保存图片到本地文件夹中

热门文章

  1. highCharts图表入门简介
  2. php数组去重复数据的小例子
  3. 脚本程序gdb 脚本
  4. DOMContentLoaded事件
  5. Java 和C# 最大的不同是对底层的控制能力不同
  6. 数据结构与算法之-----图(代码实现)
  7. 全栈性能测试修炼宝典jmeter实战电子版_JMeter实战(一) 体系结构
  8. tomcat应用服务器有哪些,2014年最流行的应用服务器排行榜 Tomcat第一
  9. android ota不打包_android 6.0系统 make otapackage 错误
  10. VC调试选项说明:md /mdd /ml /mt/mtd