`审核人：孙雨珩` `被审核代码负责人：谢洋` `代码地址：http://192.168.1.170/hyfe/demo-project/tree/master/demo-xieyang` # 技侦全息指挥系统代码审查 #### 1、组件拆分 页面上使用的条形图，地图，甚至查询条件都应该组件化，而不是放在同一个js里进行初始化。这种做法不利于组件的重复利用，以及项目的维护 解决方案：对页面上使用到的元素组件化，在页面入口只负责对各个组件初始化。查询条件组件的条件发生变化时重新拉取数据，并把数据更新到组件中去 #### 2、地图应使用d3实现，区域的id应使用地图数据中的id而不是自己定义 使用ajax拉取地图数据后，应用d3将地图画出来。现在这种方式可操作性太低，如果需要渲染其他地图还要重新制作svg 解决方案：将地图数据看成是组件外部数据进行设置，组件本身根据数据画制svg。地图数据可以到我做的项目里复制一份。 #### 3、查询条件发生变化时，页面上显示的时间间隔也应发生变化 解决方案：将查询条件组件化，并设置一个状态属性（本月，本周，今日），当状态发生变化时展示的时间间隔也应发生变化 #### 4、进度条的数量应与数据数组的长度进行关联 现在的设计下，如果数据数组的长度不足7条时会发生问题 解决方案：引入d3进行操作，进度条的数量根据数据数组长度的变化进行添加/删除 #### 5、条形图中柱状体的数量应与数据数组的长度进行关联 现在的设计下，如果数据数组的长度不足5条时会发生问题 解决方案：引入d3进行操作，柱状体的数量根据数据数组长度的变化进行添加/删除 #### 6、每次获得数据后，地图上的饼图每一个都要重新创建dom 现在的设计下，会在渲染饼图时会清空画板上的内容，应对已有的饼图进行复用 解决方案：引入d3进行操作，饼图的数量根据数据数组的长度进行添加/删除，然后再根据数据更新饼图的位置以及显示的数值 #### 7、右侧警令发布，要情发布，每日值班未实现数据绑定 右侧这三个面板的数据也应根据请求回来的数据重新渲染 解决方案：实现对应的组件，并暴露数据更新的接口。警令发布和要情发布功能类似，所以还应实现两个具有数据更新功能的组件。 #### 8、 页面上各个组件的模板直接写在了html中 这会导致当需要复用组件时，还需要在html中粘贴一份组件模板，如果组件模板需要更改时，所有用到这个组件的html都要进行更改 解决方案：将初始化模板的逻辑放入组件中