提交 2a132fcf 编写于 作者: Y yournamenomico271

modify README.md

上级 73e91403
......@@ -22,6 +22,7 @@
准备部分主要包括数据库建表、SSM框架的搭建启动。
**1 数据库建表**
tbl_emp表:
```
DROP TABLE IF EXISTS `tbl_emp`;
......@@ -49,6 +50,7 @@ CREATE TABLE `tbl_dept`(
**2 SSM项目搭建与启动**
(1)首先导入项目中可能用到的依赖包:
见pom.xml.
......@@ -69,9 +71,11 @@ CREATE TABLE `tbl_dept`(
这一章主要完成数据库底层的CRUD代码实现与测试工作.
**1. MyBasits配置文件**
见resources/MyBatis.xml.
**2. DAO层代码**
首先编写实体类Employee 与 表tbl_emp相关操作代码。
EmployeeMapper.java主要接口有:
```
......@@ -111,11 +115,13 @@ int countEmps();
下面首先Bootstrap3去搭建前端页面。
#### **1 主页面的静态搭建**
主页面的HTML代码实现放在webapp/static/html/hrms_main.html,(此处仅仅为了方便查看和参考)。
整个主页面完成后,分别将其中公共部分的代码提取出来,如导航栏,左侧栏,尾部这3个部分都属于公共部分,
分别见hrms_head.html、hrms_foot.html、hrms_leftsidebar.html三个部分。
#### **2 公共页面的JSP实现及分层**
下面将上述公共部分的HTML代码用JSP实现,详细见WEB-INF/jsp/commom目录下的head.jsp、foot.jsp、leftsidebar.jsp。
然后实现主页面的内容,主要包括三个公共部分(导航栏+左侧栏+尾部+轮播部分),实现效果如下:
......@@ -126,6 +132,7 @@ int countEmps();
#### **3 员工操作/部门操作的静态页面实现**
员工操作页面与主页面3个公共部分相同,不同之处在于中间部分展示的是员工信息的表格显示,而主页面是一个轮播图。
![Alt text](./1520601459034.png)
......@@ -138,6 +145,7 @@ int countEmps();
## 四、员工CRUD操作前后端实现
#### **1 员工信息查询的数据显示**
页面搭建完成以后,就要将从后台获取到的数据展示在对应的页面中。页面数据展示部分主要实现是利用JSP的JSTL表达式和AJAX+jQuery,将从后台获取到的数据显示在页面对应的位置。
由于部门操作与员工操作类似,下面主要讲解员工显示页面的实现。
......@@ -269,6 +277,7 @@ leftsidebar.jsp:
至此,员工信息的显示部分基本完成。
#### **2 员工添加**
接下来将会实现员工的新增操作,以及对新增数据的简单验证。
完成的页面效果如下:
![Alt text](./1520588009736.png)
......@@ -339,6 +348,7 @@ leftsidebar.jsp:
#### **3 员工更改**
员工修改操作完成页面如下:
![Alt text](./1520587529370.png)
![Alt text](./1520587549441.png)
......@@ -373,6 +383,7 @@ leftsidebar.jsp:
#### **4 员工删除**
员工删除操作完成页面如下:
![Alt text](./1520587790035.png)
......@@ -429,6 +440,7 @@ leftsidebar.jsp:
#### **5 登录页面**
最后,为求项目的完整性,加上一个登陆页面,实现的效果
图如下:
![Alt text](./1520599502796.png)
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册