信阳市公安刑侦信息管理系统

学 号：3182022021136
题目类型： 设 计
(设计、论文、报告)

桂林理工大学
GUILIN UNIVERSITY OF TECHNOLOGY

本科毕业设计(论文)

题目： 公安刑侦信息管理系统的设计与实现

      系  ( 院 )： 信息科学与工程学院
      专业(方向)：     软件工程      
      班      级：软件工程2018-3班 
      学      生：      张骏驰      
      指导教师：      杨呈永      

2022年5月25日

摘 要
伴随着社会发展与进一步对外开放，人们的生活与社会经济形态特在迅速变化，犯罪分子和刑事案件数量日益增长。为掌握刑事犯罪情报，做好刑事案件归档记录，都离不开刑侦信息技术，它是刑事侦查工作的基础，为侦破案件提供了强大的技术支持，也是科技强警战略的强大推动力。
通过Web开发和数据库应用，构建出一个能记录刑事案件信息及犯罪嫌疑人的信息管理系统。推动建设符合当前社会环境的信息化刑侦工作的发展。 全面提高刑侦工作人员的工作效率，做到信息收集，信息传递和信息共享[1]。
本文对刑侦案件信息管理系统进行了详细的分析与研究。讲述了系统设计原型及构思，研究了系统的相应模块功能，该系统使用B/S架构模式，通过使用vue+ant-design+springboot+mybatisplus对系统功能模块进行了详细的分析与设计，通过系统的使用，可以使刑侦工作管理计算机化，提高各级刑侦部门的办案效率和综合业务管理水平，加强刑侦队伍建设，加快刑侦工作信息化建设，探索新时代公安机关大刑侦体系构建模式。
关键词：刑侦信息；打击犯罪；Vue；前后端分离

Design and implementation of public security criminal investigation information management system
Student:JUN Chi-Zhang Bin Teacher:CHENG Yong-Yang

Abstract:With the development of society and further opening to the outside world, people's life and social and economic forms are changing rapidly, and the number of criminals and criminal cases is increasing day by day. Criminal investigation information technology is indispensable for grasping criminal information and filing criminal cases. It is the basis of criminal investigation and provides strong technical support for investigating criminal cases. It is also a powerful driving force of science and technology to strengthen police strategy.
Through Web development and database application, an information management system which can record the information of criminal cases and criminal suspects is constructed. Promote the construction of information criminal investigation work in line with the current social environment. Comprehensively improve the work efficiency of criminal investigation staff, do information collection, information transfer and information sharing.
This article has carried on the detailed analysis and research to the criminal investigation case information management system. This paper describes the system design prototype and conception, and studies the corresponding module functions of the system. The system uses B/S architecture mode, and analyzes and designs the system function modules in detail by using VUE + Ant-Design + Springboot + Mybatisplus. Through the use of the system, It can make the management of criminal investigation work computerized, improve the efficiency of handling cases and the level of comprehensive business management of criminal investigation departments at all levels, strengthen the construction of criminal investigation team, speed up the information construction of criminal investigation work, and explore the construction mode of criminal investigation system of public security organs in the new era.
Keywords: Forensic information；Governance crime；Vue；Front end separation

目 次

摘要 I
Abstract II

1 绪论 1
1.1 研究背景及意义 1
1.2 国内外相关研究 1
1.3 关键技术介绍 2
1.3.1 Vue.js技术介绍 2
1.3.2 SpringBoot框架介绍 2
1.3.3 MybatisPlus简介 2
1.4 需求分析 2
1.5 可行性分析 3
1.5.1 经济可行性 3
1.5.2 技术可行性 3
2 系统分析 4
2.1 功能分析 4
2.2 运行分析 4
2.3 系统开发环境配置 4
3 总体设计 5
3.1 系统功能模块设计 5
3.2 系统总体逻辑设计 8
3.3 数据库概要设计 10
4 详细设计 13
4.1 数据库表设计 13
4.2 有关程序模块设计 17
4.2.1 登录模块设计 17
4.2.2 管理员端系统功能模块设计 18
4.2.3 公安用户端系统功能模块设计 20
5 系统实现 23
5.1 管理员端系统有关模块的实现 23
5.1.1 用户管理模块 23
5.1.1 角色管理模块 25
5.1.2 在线用户模块 26
5.2 公安用户端系统有关模块的实现 27
5.2.1 案件管理模块 27
5.2.2 公文通告模块 29
5.2.3 我的消息模块 31
5.2.4 物证管理模块 33
6 系统测试 35
6.1登录模块测试 35
6.2案件管理测试 35
6.3公文通告测试 35
6.4新增用户测试 36
6.5强退测试 36
6.6部门管理测试 36
6.7未读通告模块测试 37
6.8日志管理模块测试 37
6.9警员管理模块测试 37
6.10嫌犯管理模块测试 38
7 总结 39

致谢 40
参考文献 41

1 绪论
1.1 研究背景及意义
近年来，犯罪分子数量伴随着市场经济增长在不断增多，作案手段也逐渐花样化，这一切给我国公安部门刑侦工作带来了新的需求。与刑侦案件有关的资料主要来源于刑事犯罪情报数据，它是公安部门刑侦管理数字化、信息化的一个重要组成部分。为贯彻科技强警战略，以计算机技术，网络技术和通信技术等为代表的现代信息技术被越来越多地应用于公安系统，刑事侦查管理信息系统（简称刑侦管理信息系统）的设计和实施极大地提高了公安刑侦管理的水平和效率。随着我国加入WTO,我国公安刑侦工作将面临着更加严峻的考验和挑战。因此，如何利用先进的计算机科学技术来改善当前公安刑侦信息管理的现状，已成为摆在我们面前的重要任务[2]。与此同时，为提高刑侦信息共享水平，利用现代信息技术改进设计并实现一个系统功能更加完善、系统性能更加稳定并能满足公安刑侦管理部门的管理信息系统已成为公安刑侦部门当前的实际需求。
公安刑侦信息管理系统可以对公安的打击犯罪给予较全面的支持。满足刑侦部门业务工作需要，运行稳定，能够实现刑侦信息资源共享。该系统采用B/S架构模式、前后端分离设计、数据仓库、信息传输与通信、MVC架构等。
刑侦信息管理系统的成功构建和应用将会给专业领域很强的公安刑侦部门带来积极的经济价值和良好的社会影响。首先，传统刑侦案件由各主办单位自行掌握，信息无法共享，不利于部门间的联动协查。在如今网络通讯先进的社会中，无论是技术角度还是经济角度都足以构建以网络为基础的信息共享与交流系统。在该系统中向公安人员提供了最新的案件信息、在线讨论、工作安排和内部通讯录。其次，通过该系统的运用，可以节省办案成本、提高案件调阅速度、有利于全市联动、协同案件、加快破案速度。从而产生了积极的社会影响并为公安民警树立了良好的办公形象。
1.2 国内外相关研究
自20世纪70年代末以来，我国有一些企业开始使用信息系统，在这一时期，有一些示范企业取得了良好的效果，并获得了比较丰富的经验。国内计算机应用是在20世纪80年代，随着技术的飞速发展，越来越多的行业开始使用计算机技术，越来越多的企业利用计算机网络技术来构建数据管理信息系统。经过多年的不断发展，各行各业越来越依赖计算机应用，计算机网络信息管理系统正成为不可缺少的管理工具，其功能也越来越强大和高效，带来的不仅是高效的管理，还有巨大的经济效益。在经济高速发展的今天，区域范围内的人口流量、数量呈几何连续增长，随之而来的负面社会效应也日益增大，使公安部门保持良好的社会秩序成了难题。面对社会发展的新形势，结合公安工作的特殊性，在互联网技术飞速发展的当前，公安部门计算机信息系统建设一定要以犯罪为基础，保持社会和谐稳定，给社会主义经济发展提供一个良好的社会环境。
近年来，特别是2010年后，国内公安部门在业务体制内改革运行机制，建立适应时代大数据时代的新网络信息管理平台，实现“大报”体制改革是重中之重，这对全国各级公安机关的改革目标提出了更高的要求[3]。社会环境比前者在信息时代有了颠倒，犯罪出现了跨区域、高智商、集体化的趋势。在这种严峻形势下，各级公安机关要化压力为动力，化挑战为机遇，彻底实现公安事业模式的转变，探索出具有自身特点的信息化建设。
1.3 关键技术介绍
该系统为B/S模式，SpringBoot的MVC作为本系统的支撑架构，使用Vue.js+SpringBoot +MySQL+MybatisPlus进行实现。下面对Vue，SpringBoot，MybatisPlus做些简单的介绍。
1.3.1 Vue.js技术介绍
Vue核心库专注视图层，容易与其他库集成。
1.3.2 SpringBoot框架介绍
SpringBoot是一个基于Spring框架的应用的快捷开发框架开源的框架，它也是SpringCloud构建微服务分布式系统的基础设施。
SpringBoot的主要特色包括构建独立的Spring应用、嵌入式的Web容器、固化的starter依赖、自动装配Spring模块或第三方库、产品就绪特性（日志、指标、健康检查、外部化配置等）、避免或简化XML配置等特性[4]。
1.3.3 MybatisPlus简介
MybatisPlus是一个Mybatis的增强工具，提供给我们很多实用的插件。
它的特性包括支持XML热加载、支持关键词自动转义等。
1.4 需求分析
近年来，犯罪分子数量伴随着市场经济增长在不断增多，作案手段也逐渐花样化，这一切给我国公安部门刑侦工作带来了新的需求。为提高刑侦信息管理水平，利用现代信息技术改进设计并实现一个系统功能更加完善、系统性能更加稳定并能满足公安刑侦管理部门的管理信息系统已成为公安刑侦部门当前的实际需求。
1.5 可行性分析
系统研究不仅涉及到研究过程在技术上是否合理的问题，还必须做好综合全面的可行性分析，一个体系能否被顺利的研究起来，不但要求有完善的技术手段，还必须有足够的研究资金投入作为保障。对本次开发的系统，将会进行经济方面的可行性分析，也会进行技术方面的可行性研究。
1.5.1 经济可行性
经济可行性分析是用来对系统开发过程中的软硬件工具成本、时间成本、人力资源成本进行分析，然后得出系统开发所需的经济成本，并对系统开发进程表进行粗略的估计。以安卓平台的开发成本来说，所需的软件系统开发规模不是很大，开发软件、开发人员等都无需投资过大的前期资金，所以经济上是比较合理的。
1.5.2 技术可行性
本系统使用了B/S模式进行设计及开发。前端页面使用Vue.js+AntDesign，后台框架采用SpringBoot，数据库选择MySql5.7，tomcat搭建web服务器。使用WebSokect负责用户之间交互。相关技术较为成熟，所以本系统在技术上也是可行的。

2 系统分析
2.1 功能分析
现阶段实现以下功能是本系统做到的：案件管理、警员管理、嫌犯管理、物证管理、物证出入记录和系统管理。未来在计算机软硬件和网络技术不断更新发展情况下，系统通过升级可以支持更多的拓展功能，同时对于较大量级的业务数据的处理和调用，系统的性能也可以变得更加有力和稳定。

图1-1系统图1-1系统功能结构图
2.2 运行分析
软件条件：Windows 11 IE8.0及以上。
2.3 系统开发环境配置
（1）开发工具：Intellij idea2020.1.3
（2）数据库：MySQL5.7
（3）服务器 ：阿帕奇 Tomcat8.0 web服务器
（4）运行环境 ：Node16.14.0、JDK1.8及以上。
（5）开发技术：Vue.js、Ant-Design、SpringBoot框架。

3 总体设计
3.1 系统功能模块设计
根据系统的功能需求和总体的设计思想，整个刑侦信息管理系统主要分为两个部分，即管理员部分和公安用户端部分，系统总体结构参见图2-1：

图2-1系统总体结构图
管理员端又可分为3个子模块，分别为系统管理、系统监控和系统工具。
系统管理模块中有：
用户管理：对系统用户进行增删改查、配置密码、冻结及解冻用户。
部门管理：给部门增加下级、批量删除、点击部门查看部门信息及相应权限。
角色管理：对角色信息进行增删改查，该系统将角色分为市级、市直属分局、县局三个级别，可以查看每个级别角色的用户，并对这些角色进行权限控制。
菜单管理：配置系统菜单，添加下级。
管理员端系统管理模块功能图参见图2-2。

图2-2 管理员端功能图（系统管理模块）
系统监控模块中有：
在线用户：统计当前系统实时在线用户数，可对用户进行强退操作。
日志管理：日志管理包括登录日志和操作日志，分别记录系统登录登出用户信息和进行的操作。
性能监控：其中包含redis监控、请求追踪、服务器信息、磁盘监控等功能。
管理员端系统监控模块功能图参见图2-3。

图2-3 管理员端功能图（系统监控模块）
系统工具模块中有：
该模块用于配置相关功能模板，包括结果页、异常页、表单页、详情页等。
管理员端系统工具模块功能图参见图2-4。

图2-4 管理员端功能图（系统工具模块）
公安用户端分为7个子模块，分别为案件管理、嫌犯管理、警员管理、物证管理、物证出入记录、消息中心、系统管理。
案件管理：对案件信息进行增删改查。
嫌犯管理：对嫌犯信息进行增删改查。
警员管理：对警员信息进行增删改查。
物证管理：对物证信息进行增删改查。
物证出入记录：记录物证的提取时间，提取人等信息。
消息中心：可查看我的消息，查看后消息由未读变为已读。
系统管理：包含通讯录和公文通告，通讯录可查看各级单位信息及联系方式，公文通告可对下级部门发送公告，并可指定发送对象。该功能仅市局用户有权限操作。
用户端功能图参见图2-5。

图2-5 公安用户端功能图
3.2 系统总体逻辑设计
系统首先需要登录，后台获取登录当前账户的角色类型，不同账号的不同角色会有一个不一样的主界面。管理员角色登录后，可以进行用户管理、角色管理、部门管理和菜单管理。而公安角色登录之后，进入到公安用户主界面，该刑侦系统会提示当前登录用户是否有未读消息，可以进行案件管理、嫌犯管理、警员管理、物证管理等。
数据库总体ER参见图2-8

图2-8系统数据库总体ER图
系统总体逻辑流程图如图2-7所示。

图2-7 系统总体逻辑流程图
3.3 数据库概要设计
案件管理实体属性图参见图2-9。

图2-9案件管理实体属性图
嫌犯管理实体属性图参见图2-10。

图2-10嫌犯管理实体属性图
物证管理实体属性图参见图2-11。

图2-11物证管理实体属性图
警员管理实体属性图参见图2-12。

图2-12 警员管理实体属性图
物证出入记录实体属性图参见图2-13。

图2-13物证出入记录实体属性图
4 详细设计
4.1 数据库表设计
该系统数据库设计有五张业务表，通常在有案事件发生时会有嫌疑犯和物证物品相关信息，所以在添加案件信息后，需要添加嫌疑人或者物证物品等信息。我以此关联关系为本系统设计数据库表，首先需要案件管理表、嫌犯管理表、物证信息表三张表，在三张表中通过涉案编号（case_num）字段联系。在处理案件时，各单位通常需要调取物证，为了与物证信息表相关联，需要在物证出入记录表中保存了物证信息表的物证id字段。
此外有四张系统表，再添加用户时，同时添加角色信息和部门信息，通过角色来控制权限，将权限信息与角色信息绑定，所以首先需要用户表、部门表、角色表、权限表，新增sys_user_depart、sys_user_role、sys_role_permission两张中间表用来联系它们之间的关系。
以下为该系统的数据库表及相应的表结构。
表3-1 用户表(sys_user)
编号 字段名 类型 字段长度 说明
1 id varchar 32 主键id
2 username varchar 100 登录账号
3 realname varchar 100 真实姓名
4 password varchar 255 密码
5 salt varchar 45 md5密码盐
6 avatar varchar 255 头像
7 birthday datetime 0 生日
8 sex tinyint 1 性别
9 phone varchar 45 手机号
10 depart varchar 100 部门
11 email varchar 100 邮箱
12 status tinyint 1 状态

表3-2 角色表(sys_role)
编号 字段名 类型 字段长度 说明
1 id varchar 32 主键id
2 role_code varchar 100 角色编码
3 role_name varchar 200 角色名称
3 create_time datetime 0 创建时间

表3-3 权限表(sys_permission)
编号 字段名 类型 字段长度 说明
1 id varchar 32 主键id
2 parent_id varchar 32 父id
3 name varchar 100 菜单标题
4 url varchar 500 路径
5 component varchar 500 组件
6 component_name varchar 100 组件名字
7 redirect varchar 255 一级菜单跳转地址
8 menu_type int 11 菜单类型
9 perms varchar 255 菜单权限编码
10 perms_type varchar 10 权限策略1显示2禁用
11 sort_no double 8 菜单排序
12 always_show tinyint 1 聚合子路由: 1是0否
13 is_route tinyint 1 是否路由菜单: 0:不是 1:是（默认值1）
14 is_leaf tinyint 1 是否叶子节点: 1:是 0:不是
15 hidden tiny 1 是否隐藏路由: 0否,1是

表3-4 部门表(sys_depart)
编号 字段名 类型 字段长度 说明
1 id varchar 32 主键id
2 parent_id varchar 32 父机构id
3 depart_name varchar 100 部门名称
4 org_code varchar 64 部门编码

表3-5 案件管理表(xy_case_management)
编号 字段名 类型 字段长度 说明
1 id varchar 32 主键id
2 case_num varchar 100 案件编号
3 case_title varchar 100 案件标题
4 case_category varchar 100 案件类别
5 case_address varchar 100 案发地点
6 criminal varchar 300 嫌犯
7 police varchar 80 办案民警
8 accept_time date 0 受理日期
9 case_content varchar 1000 简要案情

表3-6 嫌犯管理表(xy_criminal_management)
编号 字段名 类型 字段长度 说明
1 id varchar 32 主键id
2 name varchar 32 姓名
3 used_name varchar 32 曾用名
4 sex varchar 32 性别
5 nation varchar 32 民族
6 id_number varchar 100 身份证号
7 address varchar 300 户籍地
8 now_address varchar 32 现住址
9 education_level varchar 80 文化程度
10 matital_status varchar 32 婚姻状况
11 age varchar 32 年龄
12 case_num varchar 200 涉案编号
13 remark varchar 200 备注

表3-7 物证管理表(xy_evidence_management)
编号 字段名 类型 字段长度 说明
1 id varchar 32 主键id
2 case_number varchar 32 涉案编号
3 evidence_file varchar 1000 物证详情
4 entry_time date 0 入库时间
5 evidence_room varchar 100 管理室
6 operator varchar 32 操作员
7 status varchar 32 状态
8 case_num varchar 32 涉案编号
9 evidence_id varchar 32 物证id

表3-8 物证出入记录表(xy_evidence_record)
编号 字段名 类型 字段长度 说明
1 id varchar 32 主键id
2 extract_people varchar 32 提取人
3 department varchar 80 所属部门
4 purpose varchar 200 目的
5 extract_time date 0 提取时间
6 return_time date 0 归还时间
7 approver varchar 32 审批人
8 evidence_record_id varchar 200 物证出入记录编号
9 evidence_id varchar 200 物证id

表3-9 警员管理表(xy_pc_management)
编号 字段名 类型 字段长度 说明
1 id varchar 32 主键id
2 pc_number varchar 32 警号
3 name varchar 32 姓名
4 sex varchar 32 性别
5 nation varchar 32 民族
6 birth_date date 0 出生日期
7 politics_status varchar 32 政治面貌
8 address varchar 100 地址
9 phone_number int 11 手机号
10 department varchar 100 部门

4.2 有关程序模块设计
4.2.1 登录模块设计
用户输入账号、密码和验证码，点击登录后，把当前账号信息传给后台，后台先比较验证码，正确则根据当前账号信息和数据库中用户账号信息做比对。失败则提示输入信息不正确，成功则根据用户id查询角色相关信息，并且根据当前账号信息生成一个token值，将token、用户信息和部门信息返回给前端，然后前端每次发送请求会将这个token值放入请求头，后端判断请求头中有无token，没有则跳回登录界面，如果有则处理当前请求。该模块程序流程图如图3-1所示。

图3-1 系统登录流程图
4.2.2 管理员端系统功能模块设计
4.2.2.1 统计在线用户及强退模块设计
用户登陆的时候，会在redis里缓存用户的token值，查询在线用户的时候，后台会从redis拿出所有关于存储在线用户的token值，然后根据token值获取当前在线用户的username，根据username拿到当前在线用户的所有账号信息，然后将所有用户放在一个list集合中返回给前端。
强制退出用户的时候，判断当前用户是否有权限进行此操作，如果有，则会在redis里获取当前在线用户token值，根据当前token值拿到用户账号信息，再调用用户的退出登录方法，强制用户退出。该模块程序流程图如图3-2所示。

图3-2 强退在线用户模块流程图
4.2.2.2 新增用户模块设计
当管理员用户点击左侧导航栏中的“用户管理”时，跳转到“用户管理”页面。在该页面点击“添加用户”按钮，出现一个弹窗，需要填写“用户账号”、“用户密码”、“用户姓名”、“角色分配”和“工号”等，并且需要为该用户选择部门。
新增用户模块的整个执行过程比较复杂。其中涉及了五个表，分别为用户表sys_user、角色表sys_role、部门表sys_depart、中间表sys_user_role和sys_user_depart。执行过程可以分为三个阶段，首先把用户信息插入用户表，用户表会生成一条对应记录，获取该记录的唯一id，然后查询提交数据保存的角色id，在sys_user_role在中间表生成一条记录保存用户id和角色id，并为该条记录生成一个唯一id，部门表同理。
把有关信息插入用户表，有利于其他模块对该信息的使用。当用户或管理员需要查询已经添加角色和部门的用户和未添加角色和部门的用户时，可以通过两个中间表的状态，选择出相应的信息。该模块程序流程图如图3-3所示。

图3-3新增用户模块流程图

4.2.3 公安用户端系统功能模块设计
4.2.3.1 发布通告模块设计
根据通告类型先判断是全体通告还是指向性通告，如果是指向性通告，会根据前端传过来的需要接收该通告的用户id数组，后端遍历该数组，将需要接收的通告信息与用户id封装到一个通告对象中，作为一条条记录存储到数据库与之对应的通告消息表中，当需要接收通告消息的用户登录时，会自动请求后端查询数据库当前用户的所有未处理通告消息。该模块程序流程图如图3-4所示。

图3-4 发布通告模块流程图
4.2.3.2 新增警员模块设计
通过该模块，用户可以选择单条新增和批量导入。如果是单条新增，用户点击新增按钮出现填写警员信息的form表单，表单会逐项进行校验是否为空以及数据类型判断，警员编号会自动生成，不能进行填写操作。该模块涉及的输入参数较多，对数据的加工也较为复杂。消息录入完毕后点击确认，以对象形式传给后端，后端将数据加入数据库，提示新增成功，页面自动刷新。如果是批量导入，会以格式一致的excel形式导入，后端处理数据，批量加入到数据库xy_pc_management中。该模块程序流程图如图3-5所示。

图3-5 新增警员模块系统流程图

5 系统实现
下面介绍系统的主要部分的实现。
5.1 管理员端有关模块的实现
5.1.1 用户管理模块
管理员可以通过用户管理模块新增用户。在该新增用户页面中，需要填写“账号”、“登录密码”、“工号”和“手机号码”，并且需要为该用户进行“角色分配”和“部门分配”。其中点击“角色分配”会出现五种角色可供选择，包括“市局”，“市直属分局”，“县局”，“管理员”，“临时角色”，不同角色有不同的权限，点击“部门分配”会出现整个信阳市的公安机关部门，填写完毕后，点击“提交”，则把这些填写的信息交由后台程序进行处理，用户列表可以自动刷新。
管理员可以对已添加的用户相应操作，可以将用户表“导出”成excel表格，点击用户前面的选择框，会在工具栏出现一个“批量操作”的按钮组，能进行批量的“删除”，“冻结”和“解冻”，对于已删除的用户，通过回收站能够进行“还原”。具体实现界面参见图4-1：

图4-1用户管理界面
用户管理的功能代码如下：
// 还原用户
handleRevert(userIds) {
this.$confirm({
title: ‘恢复用户’,
content: 您确定要恢复这 ${userIds.length} 个用户吗？,
centered: true,
onOk: () => {
putAction(this.url.putRecycleBin,{userIds:userIds.join(‘,’)}).then((res)=>{
if(res.success){
this.handleOk()
this.handleClearSelection()
this.$message.success(还原 ${userIds.length} 个用户成功！)
}
})
}
})
}
// 冻结用户
handleFrozen: function (id, status, username) {
let that = this;
//TODO 后台校验管理员角色
if (‘admin’ == username) {
that.KaTeX parse error: Expected 'EOF', got '}' at position 48: … return; }̲ frozenBatch(…message.success(res.message);
that.loadData();
} else {
that.$message.warning(res.message);
}
});
}
5.1.2 角色管理模块
管理员通过角色管理模块新增角色。在该新增角色页面中，需要填写“角色编码”和“角色名称”，点击操作栏中的“用户”，会统计当前角色下的用户信息，并在此可以进行“新增用户”、选择“已有用户”，并且可以对用户信息进行编辑。

图4-2角色管理界面
角色管理的功能代码如下：
handleSubmit(exit) {
let that = this;
let params = {
roleId:that.roleId,
permissionIds:that.checkedKeys.join(“,”),
lastpermissionIds:that.defaultCheckedKeys.join(“,”),
};
that.loading = true;
console.log(“请求参数：”,params);
saveRolePermission(params).then((res)=>{
if(res.success){
that.KaTeX parse error: Expected 'EOF', got '}' at position 120: … } }̲else { …message.error(res.message);
that.loading = false;
if (exit) {
that.close()
}
}
this.loadData();
})
},
loadData(){
queryTreeListForRole().then((res) => {
this.treeData = res.result.treeList
this.allTreeKeys = res.result.ids
queryRolePermission({roleId:this.roleId}).then((res)=>{
this.checkedKeys = […res.result];
this.defaultCheckedKeys = […res.result];
this.expandedKeysss = this.allTreeKeys;
console.log(this.defaultCheckedKeys)
})
})
}
5.1.3 在线用户模块
当管理员点击左侧导航栏的“在线用户”，就会进入到“在线用户”页面，该页面会显示出该系统当前在线用户，统计在线用户个数，并且会显示每位用户的基本信息，操作栏有个“强退”按钮，点击能对用户进行强制退出系统操作，被强退用户会自动退出系统，重新跳回登录界面。在线用户界面如图4-2所示。

图4-3在线用户界面
在线用户的功能代码如下：
handleForce(record) {
let that = this;
let forceParam = {
token: record.token
}
return forceLogout(forceParam).then((res) => {
if (res.success) {
that.loadData();
this.KaTeX parse error: Expected 'EOF', got '}' at position 56: …e+'“成功！'); }̲ else { t…message.warning(res.message);
}
})
}
5.2 公安用户端有关模块的实现
5.2.1 案件管理模块
用户登录系统后，点击左侧导航栏的“案件管理”，该页面可进行案件录入功能，点击“新增”按钮，会出现弹窗填写案件信息，“案件编号”根据当前日期随机生成，顶部查询栏可进行条件检索，右侧操作栏有三个操作按钮，通过获取当前row.id可以对该条案件进行“编辑”，“删除”和查看“详情”操作。界面实现图如图4-5所示

图4-5 案件管理界面
该模块代码如下：
computed: {
formDisabled(){
return this.disabled
},
},
created () {
//备份model原始值
this.modelDefault = JSON.parse(JSON.stringify(this.model));
},
submitForm () {
const that = this;
// 触发表单验证
this.KaTeX parse error: Expected '}', got 'EOF' at end of input: … that.message.success(res.message);
that.KaTeX parse error: Expected 'EOF', got '}' at position 21: …'ok'); }̲else{ …message.warning(res.message);
}
}).finally(() => {
that.confirmLoading = false;
})
}
})
}
5.2.2 公文通告模块
该“公文通告”模块可以向系统其他用户发送消息通告，只能由上级向下级发送，所以该系统只有信阳市局有该权限。点击“新增”按钮即可录入消息，消息类型有“通知公告”和“系统消息”有两种，录入接收用户有“全体用户”，也可以“指定用户”，点击“指定用户”后，会出现一个树形选择框，该选择框会加载全部用户，也可以通过“账号”进行快速搜索，右半部分会列出“已选用户”，并可进行“删除”操作。公告信息录入完毕后，点击“确定”，消息自动加到当前记录中。
通过右侧操作按钮，可以对已录入还未发布的通告进行“编辑”，点击“更多”，可以进行“删除”，“查看”详情和“发布”操作，点击“发布”后，通告即可向其他用户发送。对于已发布通告，点击“更多”会有“撤销”操作。界面实现图如图4-6，4-7所示

图4-6公文通告模块图

图4-7公文通告模块用户选择图
该模块代码如下：
//执行发布操作
releaseData: function (id) {
console.log(id);
var that = this;
doReleaseData({id: id}).then((res) => {
if (res.success) {
that.KaTeX parse error: Expected 'EOF', got '}' at position 59: …adData(1); }̲ else { t…message.warning(res.message);
}
});
},
//执行撤销操作
reovkeData: function (id) {
var that = this;
doReovkeData({id: id}).then((res) => {
if (res.success) {
that.KaTeX parse error: Expected 'EOF', got '}' at position 88: …dNotic(id) }̲ else { t…message.warning(res.message);
}
});
}
5.2.3 我的消息模块
这个模块查看用户接收的消息，通过“标题”，“发布人”等条件进行查询，消息记录中会显示通告的一些基本信息，点击右侧操作栏的“查看”后，阅读状态会自动变成已读，顶部栏有一个消息图标，能回显未读消息个数，点击图标能查看未读消息类型及消息发布时间、紧急类型，通过点击“查看更多”，可直接跳转到“我的消息”界面。界面实现图如图4-7所示

图4-7 我的消息模块图
有关实现代码如下：
handleDetail: function(record){
this.$refs.sysAnnouncementModal.detail(record);this.$refs.sysAnnouncementModal.title=“查看”;
},
showAnnouncement(record){
putAction(this.url.editCementSend,{anntId:record.anntId}).then((res)=>{
if(res.success){
this.loadData();
this.syncHeadNotic(record.anntId)
}
});
if(record.openType===‘component’){
this.openPath = record.openPage;
this.formData = {id:record.busId};
this.KaTeX parse error: Expected 'EOF', got '}' at position 34: …ce.detail(); }̲else{ this.refs.ShowAnnouncement.detail(record);
}
},
5.2.4 物证管理模块
点击左侧导航栏的“物证管理”，该页面可进行无证信息的录入功能，点击“新增”按钮，会出现弹窗填写物证信息，一个案件的物证“涉案编号”要与案件管理的“案件编号”保持一致，“物证详情”以文件形式上传，不限格式，录入完成后可在当前页面进行查看，通过“编辑”按钮可改变物证的“状态”。界面实现图如图4-8所示

图4-8 物证管理模块图
有关实现代码如下：
getProjectNum() {
const projectTime = new Date() //当前中国标准时间
const Year = projectTime.getFullYear() //获取当前年份 支持IE和火狐
const Month = projectTime.getMonth() + 1 //获取中国区月份
const Day = projectTime.getDate() //获取几号
let CurrentDate = String(Year)
if(Month >= 10) {
CurrentDate += Month
} else {
CurrentDate += ‘0’ + Month
}
if(Day >= 10) {
CurrentDate += Day
} else {
CurrentDate += ‘0’ +Day
}
return CurrentDate
},
add () {
this.edit(this.modelDefault);
this.model.documentNum=‘GW’+this.getProjectNum()+Math.floor(Math.random() * 10000)
}

6 系统测试
对该系统的测试，主要侧重了功能方面的测试，所以使用了黑盒测试方法。黑盒测试方法将系统视为一种封闭的状态，只关注给系统注入的参数和输出的结构是否符合系统正确性的要求[5]。
测试实例如下：
6.1登录模块测试
表5-1登录模块测试结果表
测试内容 输入 预期结果 实际结果
用户名错误测试 不存在的用户名 提示用户名或密码不正确 符合预期
密码错误测试 存在的用户名，不符合该用户名的密码 提示用户名或密码不正确 符合预期
登录成功测试 存在的用户名，正确的密码，相符的用户角色 根据用户角色进入到相应的用户界面 符合预期
应对异常测试 用户名、密码、用户角色均为空 提示用户名或密码不正确 符合预期

6.2案件管理测试
表5-2新增案件测试结果表
测试内容 输入 预期结果 实际结果
批量删除测试 选取每条案件前的复选框，点击批量删除 提示删除成功，表单刷新 符合预期
新增案件判空测试 所有输入框均不输入任何内容，点击提交 提示表单元素未填写完整 符合预期

6.3公文通告测试
表5-3公文通告测试结果表
测试内容 输入 预期结果 实际结果
新增通告判空测试 所有输入框均不输入任何内容，点击确定 提示表单元素未填写完整 符合预期
发布功能测试 点击发布 提示发布成功，操作栏按钮组改变，接收用户收到未读消息提示 符合预期
撤销功能测试 点击已发布消息操作栏中的撤销 提示撤销成功，当前行发布状态由已发布变成已撤销，接收用户的消息记录该条消息自动删除 符合预期
6.4新增用户测试
表5-4新增用户测试结果表
测试内容 输入 预期结果 实际结果
登录密码确认密码不一致测试 登录密码输入Zz123456@，确认密码输入Zz654321@ 提示两次的密码输入不一致 符合预期
判空测试 所有输入框均不输入任何内容，点击提交 提示表单元素未填写完整 符合预期
冻结用户测试 点击冻结 提示冻结成功，用户状态变成冻结，用已冻结账号登录时，提示该用户已冻结 符合预期

6.5强退测试
表5-5维护测验结果表
测试内容 输入 预期结果 实际结果
强退在线用户测试 点击强退 提示强退成功，在线用户列表刷新，被强退用户跳转至登录界面 符合预期
6.6部门管理测试
表5-6上传资源验结果表
测试内容 输入 预期结果 实际结果
添加部门判空测试 所有输入框均不输入任何内容，点击提交 提示表单元素未填写完整 符合预期
部门基本信息及权限显示测试 点击树形选择框下的每个部门 右侧出现该部门基本信息和相应权限 符合预期

6.7 未读通告模块测试
表5-7 未读消息模块测试结果表
测试内容 输入 预期结果 实际结果
提醒消息功能正确性（用户存在未读消息） 用户登录，并且该用户存在未读的消息通告 跳转到用户端主界面，头部工具栏提示未读消息个数，点击查看，未读消息变为已读 符合预期
提醒消息功能正确性（用户不存在未读的消息） 用户登录，并且该用户不存在未读的消息通告 跳转到用户端主界面，未提示新消息 符合预期

6.8 日志管理模块测试
表5-8 Microsoft Agent向学生推荐资源模块测试结果表
测试内容 输入 预期结果 实际结果
登录日志测试 选取三个用户分别登录退出系统，时间间隔为半小时 登录日志新增六条记录，并记录相应操作人，操作时间，登录ip 符合预期
操作日志测试 登入管理员用户，进入用户管理，分别进行新增，查询，删除操作 操作日志新增三条记录，操作类型分别为添加，查询，删除，并显示 符合预期
6.9警员管理测试
表5-9新增、删除警员测试结果表
测试内容 输入 预期结果 实际结果
批量删除测试 选取每位警员前的复选框，点击批量删除 提示删除成功，表单刷新 符合预期
新增警员判空测试 所有输入框均不输入任何内容，点击提交 提示表单元素未填写完整 符合预期
6.10嫌犯管理测试
表5-10新增、删除嫌犯测试结果表
测试内容 输入 预期结果 实际结果
批量删除测试 选取每个嫌犯前的复选框，点击批量删除 提示删除成功，表单刷新 符合预期
新增嫌犯判空测试 所有输入框均不输入任何内容，点击提交 提示表单元素未填写完整 符合预期

7 总结
本次毕业设计主要研究了一个基于Web的公安刑侦信息管理系统的设计与实现，并同时学习开源框架的使用。通过这次毕业设计，我以信阳市为原型设计了公安刑侦信息管理系统，完成了发送公文通告、管理案件信息、添加嫌犯、警员管理、记录物证等基本功能。在整个刑侦系统的开发流程中，有每个功能的具体实现过程。
该系统具有以下优点：无需下载程序，输入网址即可办公。界面设计简洁大方，无复杂引用关系，仅用作信息管理，易上手。通过划定角色权限，对不同等级用户的功能进行限制，不用开发单独的系统，强调了该系统的复用性。
系统也有缺点和需要完善的地方，例如数据量过少，首页大屏接口未对接到数据库，不能实时更新。页面设计和布局并不精巧，在今后的学习过程中会逐渐完善。通过浏览开发文档，信息系统的开发也由稚嫩逐渐走向成熟，值得我去花费的大量时间与研究。而在设计的过程中必须注意到许多地方，要求我们的细致度和耐心，通过不断调试与修正，才能实现一个令人满意的应用系统。
毕业设计的制作流程，使我明白了自身的欠缺问题。就例如，由于对很多软件应用技术还不了解，对部分代码并不了解与掌握，对书本上的基础知识并没有更好的利用到实际情况中，所以在今后的工作中，就需要训练自身接触新鲜事物的能力，以便于更好的培养自身的创新以及学习能力。
针对我的设计，已经实现所需要的所有功能。不过仍然有不少需要改进的地方。如数据优化显示，界面实现技术，开源代码优化等。而这些都需要自己去了解更深的东西去加以完善。在接下来的设计工作中，我会强化自己对专业知识的掌握。

致 谢
时光匆匆，已经到了毕业的时候。在桂林理工大学的四年学习时光里，感谢各位老师，老师认真负责，讲课细致，关心学生，让我受益匪浅，不仅学到了知识，也学会了一些生活哲理。
本次毕业设计，得到了杨呈永老师的指导。杨老师专业、严谨、细致。在毕业设计中，经常通过微信、电话与我进行交流，对我的系统设计给出建议，对系统的关键技术选型给予指导，耐性、细致的点评论文。感谢杨老师抽出时间在毕业设计中给予我指导，杨老师认真、细致、严谨的态度让我敬佩，是我今后学习的榜样。
在毕业设计中，宿舍的同学、同班的同学也给予了我很大的帮助。通过与他们进行讨论，让我对有关知识有了更深的了解，也让我产生了系统设计的新灵感。他们还经常对我提出建议，在我感到困难的时刻给予我鼓励，感谢他们的帮助。
最后，感谢在忙碌的工作充抽出时间对本文进行评价和审阅，评议和参与本人毕业答辩的各位评审老师。

参考文献
[1] 马忠红.论刑事案件的构成要素[J]. 中国人民公安大学学报(社会科学
版)，2012(05)
[2] 管光承,鄢晓实.论刑事案件信息系统[J]. 吉林公安高等专科学校学报，2008(03)
[3] 朱二华.基于Vue.js的Web前端应用研究[J].科技与创新，2017(20)
[4] 杨红卫.基于J2EE的刑侦综合信息系统设计[D]. 国防科学技术大学，2007
[5] 萨师煊，王珊．数据库系统概论．高等教育出版社，2004(7)：18—19
[6] 王志任. 基于Vue.js 的开发平台的设计与实现[D]. 广东工业大学.2018.
[7] 沈中林. 基于B/S模式的高校科研管理信息系统的设计[J].中国民航学院学报，2014，05(4):61-64.
[8] Dave Crane，Eric Pascarello，Darren James．Ajax实战[M]．北京：人民邮电出版社， 2006，275-373.
[9] 萨师煊，王珊．数据库系统概论(第三版)[M]．北京：高等教育出版社，2002，127-26.
[10] 赵斌. 软件测试技术经典教程. 第2版. 科学出版社. 2011.
[11] 耶鲁大学，里海大学，印度理工学院数据库系统概念. 第5版. 机械工业出版社. 2006
[12] 陈鹤松．设备管理信息系统的研究与开发[D]．南京理工大学，2004．
[13] 任福兵．信息管理模式的演化与发展—从数据管理到智慧管理[J]．图书情报工作，2017，61(02)：4149.
[14] 吕建强. 高校学生信息管理系统的研究与技术分析[J]. 科技情报开发与经济，2006
Vol.16 No. 8
[15] 翟润平，信息管理方法[M]．北京：中国人民公安大学出版社．2002
[16] Sebastian Naumann, Rober Hoyer. Using Simulation for Designing Floating Car
Observers.Sim Vis,2007,(2):285-298.
[17] M.E.Fouladvand,A.H.Darooneh.Statistical analysis of floating-car data:an
empirical study.Eur.Phus,J.2005:319-328.
[18] Jianchun Fan & Subbarao Kambhampati.A snapshot of public web services[C]. Newsletter ACM SIGMOD Record Homepage archive Volume 34 Issue 1,2005
[19] 李珩，徐夏. 基于 C/S、B/S 结构的信息系统的设计与实现，电脑知识与技术，
2008
[20] 冉春玉等，基于 B/S 和 C/S 模式的信息系统的设计和实现[J]. 武汉理工大学学
报.2003，6(12):8-11.
[21] 王笑京, 齐彤岩, 蔡华.面向对象原理与应用[M]. 北京: 中国机械版社, 2004.14