《广州市白云区慢性病地理信息系统》项目总结

作者：曾浩源
本次任务完成时间：2018年12月21日～2019年1月15日
开发工具与关键技术：SuperMap iClient JavaScript、VS2015、SuperMap iServer、jquery
完成模块功能：登录、账户管理，角色设置、地图工具箱、区域查询、周边查询、地址查询

一、登录

登录输入账户密码，判断输入是否正确、输入是否为空和用户是否被禁用
账户有前台账户和后台账户

二、后台

（1）后台主页面

登录后台账户，登录到后台主页面
左侧是侧边导航、右侧是个百叶窗

（2）用户管理

1、用户信息

用户信息可看到所有账户的信息，同时可根据前后台类型、角色类型、用户名进行筛选搜索用户
点击添加用户可跳转到添加用户页面
点击右上角删除，需勾选到用户，可进行批量删除
在列表内的编辑按钮，点击后可跳转到编辑用户资料页面
点击列表内的删除按钮，可对该行的用户进行删除

2、添加用户

添加用户页面，利用了layui的表单css和js
以下文本框内凡是写有可为空或拥有可以默认的，才可以为空；输入格式不对的等等，点击提交后都会弹出类似如下提示框和鼠标焦点就会给到提示出错的文本框

填写完整后点击提交，判断无重复和无错后，返回用户信息页面，弹出添加成功提示框

3、编辑用户

编辑页面，除密码，前后台职位、登录名不能修改，其余均可修改、判断机制和新增一样

修改完成后点击提交，判断无重复和无错后，返回用户信息页面，弹出修改成功提示框

4、删除用户

点击删除后弹出提示框
点击确认即可删除该用户

（3）角色管理

1、系统角色树形、数据权限树形、功能权限树形

当点击前台职位，功能树形只显示前台职位所属功能

当点击后台职位，功能树形只显示后台职位所属功能

2、当选择中科室内的职位时，可回填该职位权限

当然，修改内容后，点击保存分配可以保存数据

若该职位无分配，待分配完成后，点击保存分配即可

3、系统角色新增，修改，删除

点击可弹出新增模态框，进行新增操作

点击前，必须选中科室下的某个职位。选中之后点击弹出模态框进行数据回填
点击前，必须选中前后台职位下的科室或者职位进行删除，科室下拥有职位，必须删除全部职位后才可删除科室
点击刷新该系统角色树形

4、相关业务表和关系

5、经典代码

（4）个人信息与退出后台登录

点击个人信息，可跳转到该用户的编辑用户信息页面
点击退出，弹出提示框，点击确认退出登录

三、前台

（1）个人信息与退出前台登录

点击退出，弹出提示框，点击确认退出登录

点击个人信息，可弹出模态框，修改用户个人信息
个人信息只能修改手机号码和邮箱地址
修改密码必须输入正确的原密码

（2）区域定位

点击左侧区域定位选卡，点击某个街道或乡镇，地图将跳转到该街道或乡镇位置

（3）查询搜索

1、地址查询

点击左侧选卡查询搜索，选择地址，输入地址或字段进行模糊查询

2、公司查询

点击左侧选卡查询搜索，选择公司，输入地址或字段进行模糊查询

3、门诊号查询

点击左侧选卡查询搜索，选择门诊号，输入门诊号或数字进行模糊查询
右侧弹出可移动的模态框，点击查询出的门诊号可定位到该门诊号所属哪家医院、药店或杜康

4、卡片号和登记号的查询 与 门诊号查询雷同

（4）周边查询

点击左侧选卡周边分析
点击按钮，选择中心点
并回填中心点坐标
半径默认500米，可自行修改
查询目标，只需勾选到需要查询的类型即可，可多个查询
点击查询出的标记，可出现弹窗，点击周边查询，可进行以该点为中心点进行周边分析

（5）工具箱

1、可移动工具箱，双击工具箱可展开，再次双击可收回

2、距离测量

点按钮可进行距离测量
可以定点距离,从而知道起点到终点之间相距多少。

3、面积测量

点按钮可进行面积测量
可以测算一个面有多大。

4、矩形范围查询

点击框选一个方型区域，自动查询范围内医院,社康等，点击查询的信息点 即可查看该 点的详细信息。

5、圆形范围查询

点击选一个圆形区域，自动查询范围内医院,社康等，点击查询的信息点 即可查看该 点的详细信息。

6、多边形范围查询

点击选一个区域，自动查询范围内医院,社康等，点击查询的信息点 即可查看该 点的详细信息。

7、清除按钮

点击按钮可将地图上的渲染元素（标记，弹窗）进行删除清除

（6）图层管理器

1、可移动迷你图层管理器按钮、双击展开图层管理器

点击图层管理器的关闭按钮可关闭图层管理器，出现迷你图层管理器

2、勾选图层显示出图层

四、开发总结

后台的树形我是第一次做，我用的是zTree_v3，感觉是比较大的难点的就是树形的回填，拥有三个等级的父级和子级差点把我弄得思路混乱，经过这次感觉自己的思维有较大提升。
后台的表单利用了Layui的表单风格，以及它的监听submit提交、表单验证、预设元素属性和Layui的表单监听事件；发现挺方便，样式简洁美观。
关于SuperMap iDesktop的地图制作，它里面的基本操作可以熟练运用，例如：创建文件型工作空间和数据库工作空间、设置比例尺、制作专题图、数据类型装换、地图配准、交通分析等等 。
对于SuperMap iServer，里面的服务管理的切片，上传也是轻车熟路。而较难点就是自己熟悉For JavaScript里的功能运用，通过自己不断地尝试和学习api，对于简单的一些功能也是可以完成。
例如： 地图上绘圆、矩形、多边形、线，还有测量距离、测量面积、范围查询、周边查询等等。当然还在不断努力完善中。
对于这次项目，发现平常的导航真是来之不易，虽然看上去操作简单，但其内部工作量是何其的庞大。