html5 考勤系统考勤系统界面设计

转载

coolfengsy 2024-07-01 11:00:25

文章标签 html5 考勤系统运维人工智能嵌入式服务器 文章分类 HTML5 移动开发

考勤机作为终端，主动向服务器发送连接请求，服务器可以使用VPN的方式。作为VPN服务器的计算机有两个网卡，一个连接在局域网中，一个连接在广域网中。考勤机采用主动方式连接网络，这样在一个局域网中可以安装多台考勤机。

1、考勤机终端：

终端具有的功能除基本的考勤功能外，还需要留足扩展接口，以便日后扩展。考勤机的扩展主要是这样的扩展：

人脸识别，采用摄像头拍摄照片来进行识别

指纹识别，使用专门的指纹识别模块

2、门禁考勤机主要功能需求：

考勤卡识别功能，读取考勤卡信息，检验考勤卡合格性，如果合格则记录考勤、语音提示成功并显示姓名；如果失败则语音提示不成功。

对于待考勤人员的识别，需要两方面做保证：一方面本地记录了待考勤人员的信息，姓名和卡号对应，在刷卡时查询数据库，验证；另一方面，在本地验证失败时，需要通过网络向服务器验证，验证成功时将验证信息下载到本地考勤机并提示成功，失败时则考勤机提示验证失败。

考勤记录可以存放在本地终端上，也可以通过网络上传到VPN服务器上，可以即时上传或者定时上传。考勤记录和卡号-人员对应表等信息存储在本地SD卡中。

语音提示，真人发声提示

通过U盘上传用户姓名列表，下载门禁考勤记录以及照片（当考勤机支持人脸识别时）

考勤机可以独立使用，无需连接电脑即可以设置考勤机参数，包括人员登记、人脸考勤、存储记录等。

支持考勤机本地信息和服务器信息的同步，同步协议需详细制定。

3、

（1）按键设计

html5 考勤系统考勤系统界面设计_html5 考勤系统

图1按键设计

（2）液晶显示

html5 考勤系统考勤系统界面设计_html5 考勤系统_02

图2 上班界面

html5 考勤系统考勤系统界面设计_运维_03

图3下班界面

html5 考勤系统考勤系统界面设计_人工智能_04

图4设置界面

（3）设置主机IP

如图4中所示设置服务器IP和端口（PORT）

该流程对应的软件流程为

html5 考勤系统考勤系统界面设计_嵌入式_05

图5设置IP软件流程图

（4）导入批量信息到终端

新的考勤机结构

html5 考勤系统考勤系统界面设计_html5 考勤系统_06

图6考勤机结构

html5 考勤系统考勤系统界面设计_服务器_07

图7上位机批量导入信息

（5）终端机输入卡号

通过按键设置开始输入新的卡号

html5 考勤系统考勤系统界面设计_人工智能_08

图8终端输入卡号信息

（6）网线供电（POE,Power Over Ethernet）

这部分与软件无关主要是硬件方面的设计

html5 考勤系统考勤系统界面设计_服务器_09

图9 POE

（7）上班/下班刷卡

我们假设公司设定的上班刷卡时间为7:00—9:00，则在这个时间段内刷卡时不需要按“上班”按钮，系统默认为将刷卡的员工开始上班，在此时间段之外要刷卡上班时需要先按“上班”按钮。下班时也是同理。

html5 考勤系统考勤系统界面设计_服务器_10

图10刷卡上班/下班流程图

4、底层开发方案：

基于linux的嵌入式系统开发是一个层次化的结构。Linux操作系统负责嵌入式系统硬件资源的管理，而应用层软件则负责实现具体功能。Linux系统本身就是一个层次化的系统结构，它由硬件层、设备驱动层、虚拟文件系统VFS层和应用层组成。虚拟文件系统层和设备驱动层完成底层硬件的抽象。Linux将所有的设备都当作文件处理，被称为设备文件。设备又可以细分为网络设备、字符设备和块设备。

设备驱动层需求：

根据应用的需要，系统需要的模块包括如下部分：

USB接口模块

Ethernet模块

SD卡模块

UART模块

MFRC500模块

RTC模块

NandFlash模块

SDRAM接口模块

LCD接口模块

上述这些模块在freesacale提供的支持中很多驱动已经完成，开发需要做的重点是相应模块对应于具体电路板的裁剪、UART接口模块的驱动程序和MFRC500模块的驱动程序。