2022项目实训“异步分布式联邦学习”第十三周报告

在这一周，我们网站中所有界面的建设已经基本全部完成，登录注册、关于、使用说明等界面均已完成。不过这些界面的设计还有一些内容需要继续优化，也还有一些bug错误等待修复，其中就包括最重要的upload方法。

以下阐述本周的工作报告，依旧是分为本周工作报告和下周工作两部分。

一、本周工作报告

1. 前端UI优化

在这一周，我修复了上一周小组讨论时发现的问题——“刷新”按钮不能回显。这个问题说大不大，不过会让使用者产生对于按钮是否起作用产生困扰，因此我在script脚本部分又填加了这么一段，如此就可以使刷新按在点击之后失焦，再辅以blur方法，使其得以达到回显作用。

    /* 刷新当前界面 */
    refresh() {
      // 确保按钮颜色回显
      let target = event.target;
      if(target.nodeName == "I" || target.nodeName == "SPAN"){
        target = event.target.parentNode;
      }
      target.blur();
      // 刷新当前任务数据
      this.getCurrentTask();
    }

此外，我还在本周完成了隐私政策的界面，这里是参考了市面上常见的APP的隐私政策（毕竟我们也没有办法自己写嘛）。

然后是对前端界面以及其中通讯的优化更新：

1. 由于之前没确定到底怎么通讯，就暂定使用websocket，而这周讨论后确定将“任务列表”界面的通讯方法由websocket改为axios。
2. 去掉了“关于"界面的冗余无效代码，增强了代码可读性，优化了“关于"界面的样式。
3. 修复"任务列表"的每一行按钮的参数绑定的bug。
4. 优化了“发布任务”界面，使其能够自适应高度。同时，更改了其中的一些输入内容，将其内容与数据库内的详细属性相匹配。
5. 为“发布任务”界面添加了上传组件，不过后续的通信是个很大的问题。
6. 参照“所有任务”界面设计了“历史任务”的界面，有待后续使用。

2. 对于el-upload组件的探讨和实际实现

本周存在的最大问题是“发布任务”界面中最重要的文件上传功能，这个功能我们使用的是element-plus的el-upload组件，这个组件比较复杂，其如何与后端进行交互仍旧是一个比较难处理的问题。

一开始，我们对于这个组件的HTTP逻辑产生了许多困惑，在查阅大量资料之后，我们得到了结果。el-upload组件首先是获得上传的内容，然后在关闭选择文件的窗口之后即可上传到目标url，其HTTP方法是设定的method属性。不过，我们也可以选择auto-upload=false来