Arce 发表于 2021-7-1 17:10:51

接口测试平台代码实现150:加密算法继续实现

  上节课我们可以成功的 打开加密算法的设置弹层。
  现在我们来立马实现一下 取消和保存功能:
  取消功能很简单,我们写个刷新即可:注意修改俩个按钮的onclick:

  好,继续开始,我们去写保存功能:

  这个函数并不复杂,但是我依然要按部就班的去实现。
  首先是获取选中的加密插入位置,是url还是body。

  注意这个单选框radio,我是怎么命名和设置属性的。以及js里是怎么提取的。
  name必须是一样的,value是要获取的值当然不一样,id是由前面相同后面不同。 
  然后提取是靠一段jquery 实现,如果是js则太过麻烦了。
  接下来是提取输入框的内容,也就是加密表达式:

  好提取成功后,我们写个请求给后台:

  注意,其中传递了项目id,和加密插入位置 和加密表达式。
  然后去urls.py中:

  然后去views.py中:

  注意,这里我们发现了一个设计上的遗漏,就是这个配置应该包括 俩部分,即插入位置,和表达式子。 而我们数据库一开始的时候只新增了一个字段。所以这里我们要去变更一下 数据库models.py的字段才行,改成如下:

  执行同步命令:

  注意,提示是否修改字段,输入y 按回车继续。
  然后回到views.py中继续写:

  这里我们成功保存了这个加密算法配置。
  然后我们可以去试试看:

  如上图,我设置好,点击保存。
  没有出现任何报错,然后去后台看看 是否保存成功:

  可以注意到,是成功保存了的。
  然后,我们前端的展示旧数据的html-dom部分此时也要进行修改。
  首先是表达式部分,改成如下:

  然后是 这个单选框,单选框比较麻烦,我们必须要通过js来决定谁被选中。
  所以encryption_show()这个函数,此时要继续扩写了。
  这里我们仍然用jquery来快速实现这个功能,代码如下:

  这里我采用了拼接方案,用数据库的值直接就拼成了 目标选框的id, 这也是我一开始起id的时候故意设计,是不是很讨巧。
  别抄错少了引号哦,可以复制如下代码:

[*] 
$(':radio').attr('checked',true)  好了,刷新页面,打开,可以看到显示的结果如之前我保存的一样:


  
页: [1]
查看完整版本: 接口测试平台代码实现150:加密算法继续实现