Web开发---单页面应用(签到日报)

疫情前期，员工分布在各个地区，需要上报个人的健康状态和位置信息，于是做了一个单页面应用（当时钉钉和微信上的健康上报模板还没出现）

操作流程

进入页面时使用百度地图API定位接口首先定位其位置（经纬度和地址），并弹窗显示。

弹窗确定后进入页面

第一步，点击芳名，弹窗选择“我是谁”。标题显示今天已签到人数，姓名列表中背景绿颜色的是已签到人员，背景蓝颜色是浏览器cookie保存的“我的名字”，方便下次在众多姓名中一眼找出来自己的名字。

选择名字点击确定，第一个菜单显示自己名字，依然可以点击它弹窗更换名字。

第二步，百度地图定位接口可能定位不准确（显示错误）或不精确（不详细），这时候可以点击地址菜单，在弹窗中的地图中手动调整位置。

今天已签到人员在地图上将以红色图标显示。

平移缩放地图时找到地图上的蓝色图标（自己的位置）

如果位置显示错误或不精确，可以拖拽此图标更改调整。

调整后点击确定，弹窗显示调整后的位置，点击确定后地址菜单显示为自己调整后的地址（该过程使用百度地图API来地理编码）

最后在自己的表单中填写信息提交。

同时当天可以多次提交更新。

在这个页面可以滚动查看所有人所填写的表单。选择自己名字后，自己的表单显示在第一个，只能保存更改自己的表单

下一篇文将介绍查看自己的历史签到信息和查看所有人的历史签到信息。