项目框架：登录跳转页面

  • 运行结果：
  • 代码整体布局：
  • 代码如下：
    • proj_hr_yzh7.sql ：（数据表备份代码）
    • pom.xml:
    • web.xml:
    • ForwardController :
    • EmpMapper.xml:
    • db.properties:
    • mybatis-config.xml
    • spring-mvc.xml:
    • spring-mybatis.xml:
    • emp.jsp:
    • login.jsp:
    • main.jsp:

运行结果：





代码整体布局：


代码如下：

proj_hr_yzh7.sql ：（数据表备份代码）

/*
Navicat MySQL Data TransferSource Server         : aaa
Source Server Version : 80012
Source Host           : localhost:3306
Source Database       : proj_hr_yzh7Target Server Type    : MYSQL
Target Server Version : 80012
File Encoding         : 65001Date: 2022-08-29 11:12:39
*/SET FOREIGN_KEY_CHECKS=0;-- ----------------------------
-- Table structure for tbl_dept
-- ----------------------------
DROP TABLE IF EXISTS `tbl_dept`;
CREATE TABLE `tbl_dept` (`dept_id` int(11) NOT NULL AUTO_INCREMENT,`dept_name` varchar(20) DEFAULT NULL,`dept_desc` varchar(100) DEFAULT NULL,`state_flag` int(11) DEFAULT '0',`del_flag` int(11) DEFAULT '0',`create_by` varchar(20) DEFAULT NULL,`create_time` datetime DEFAULT NULL,`update_by` varchar(20) DEFAULT NULL,`update_time` datetime DEFAULT NULL,PRIMARY KEY (`dept_id`)
) ENGINE=InnoDB AUTO_INCREMENT=4 DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_0900_ai_ci;-- ----------------------------
-- Records of tbl_dept
-- ----------------------------
INSERT INTO `tbl_dept` VALUES ('1', '人事部', '管理员工', '0', '0', 'admin', '2022-08-29 10:17:41', null, null);
INSERT INTO `tbl_dept` VALUES ('2', 'IT部', '管理系统', '0', '0', 'admin', '2022-08-29 10:17:41', null, null);-- ----------------------------
-- Table structure for tbl_emp
-- ----------------------------
DROP TABLE IF EXISTS `tbl_emp`;
CREATE TABLE `tbl_emp` (`emp_id` int(11) NOT NULL AUTO_INCREMENT,`emp_name` varchar(20) NOT NULL COMMENT '姓名',`username` varchar(20) DEFAULT NULL COMMENT '账号',`password` varchar(200) DEFAULT NULL COMMENT '密码',`sex` char(1) NOT NULL COMMENT '性别',`birthday` date DEFAULT NULL COMMENT '生日',`phone` varchar(11) NOT NULL COMMENT '手机',`email` varchar(50) NOT NULL COMMENT '邮箱',`address` varchar(100) DEFAULT NULL COMMENT '籍贯',`hire_date` date DEFAULT NULL COMMENT '入职日期',`leave_date` date DEFAULT NULL COMMENT '离职日期',`state_flag` int(11) DEFAULT '0' COMMENT '在职状态:0在职 1离职',`del_flag` int(11) DEFAULT '0' COMMENT '是否删除:0未删除 1删除',`avatar` varchar(200) DEFAULT NULL COMMENT '头像',`dept_id` int(11) DEFAULT NULL COMMENT '部门编号',`create_by` varchar(20) DEFAULT NULL COMMENT '创建人',`create_time` datetime DEFAULT NULL COMMENT '创建时间',`update_by` varchar(20) DEFAULT NULL COMMENT '修改人',`update_time` datetime DEFAULT NULL COMMENT '修改时间',PRIMARY KEY (`emp_id`)
) ENGINE=InnoDB AUTO_INCREMENT=4 DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_0900_ai_ci;-- ----------------------------
-- Records of tbl_emp
-- ----------------------------
INSERT INTO `tbl_emp` VALUES ('1', '张三', 'zhangsan', '123456', '男', '2000-01-01', '13112345678', 'aaa@qq.com', '河南', '2010-10-10', null, '0', '0', null, '1', 'admin', '2022-08-29 10:23:02', null, null);
INSERT INTO `tbl_emp` VALUES ('2', '李四', 'lisi', '123456', '女', '2001-01-01', '13112345677', 'a22@qq.com', '河南', '2013-10-10', null, '0', '0', null, '2', 'admin', '2022-08-29 10:23:02', null, null);-- ----------------------------
-- Table structure for tbl_emp_role
-- ----------------------------
DROP TABLE IF EXISTS `tbl_emp_role`;
CREATE TABLE `tbl_emp_role` (`id` int(11) NOT NULL AUTO_INCREMENT,`emp_id` int(11) NOT NULL,`role_id` int(11) NOT NULL,PRIMARY KEY (`id`)
) ENGINE=InnoDB AUTO_INCREMENT=3 DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_0900_ai_ci;-- ----------------------------
-- Records of tbl_emp_role
-- ----------------------------
INSERT INTO `tbl_emp_role` VALUES ('1', '1', '1');
INSERT INTO `tbl_emp_role` VALUES ('2', '2', '2');-- ----------------------------
-- Table structure for tbl_menu
-- ----------------------------
DROP TABLE IF EXISTS `tbl_menu`;
CREATE TABLE `tbl_menu` (`menu_id` int(11) NOT NULL,`menu_name` varchar(100) NOT NULL COMMENT '菜单名字',`parent_id` int(11) DEFAULT NULL COMMENT '父级菜单编号',`menu_type` varchar(10) DEFAULT NULL COMMENT '菜单类型',`url` varchar(100) DEFAULT NULL COMMENT '菜单链接',`icon` varchar(100) DEFAULT NULL COMMENT '菜单图标',`create_by` varchar(20) DEFAULT NULL,`create_time` datetime DEFAULT NULL,`update_by` varchar(20) DEFAULT NULL,`update_time` datetime DEFAULT NULL,PRIMARY KEY (`menu_id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_0900_ai_ci;-- ----------------------------
-- Records of tbl_menu
-- ----------------------------
INSERT INTO `tbl_menu` VALUES ('1', '系统管理', '0', 'M', '#', null, null, null, null, null);
INSERT INTO `tbl_menu` VALUES ('2', '性格测试', '0', 'M', '#', null, null, null, null, null);
INSERT INTO `tbl_menu` VALUES ('3', '问卷调查', '0', 'M', '#', null, null, null, null, null);
INSERT INTO `tbl_menu` VALUES ('4', '日志监控', '0', 'M', '#', null, null, null, null, null);
INSERT INTO `tbl_menu` VALUES ('5', '部门管理', '1', 'C', '/forward/toDept', null, null, null, null, null);
INSERT INTO `tbl_menu` VALUES ('6', '员工管理', '1', 'C', '/forward/toEmp', null, null, null, null, null);
INSERT INTO `tbl_menu` VALUES ('7', '角色管理', '1', 'C', '/forward/toRole', null, null, null, null, null);
INSERT INTO `tbl_menu` VALUES ('8', '权限管理', '1', 'C', '/forward/toMenu', null, null, null, null, null);
INSERT INTO `tbl_menu` VALUES ('9', '题目管理', '2', 'C', '/forward/toQuestion', null, null, null, null, null);
INSERT INTO `tbl_menu` VALUES ('10', '测试管理', '2', 'C', '/forward/toQuestionTester', null, null, null, null, null);
INSERT INTO `tbl_menu` VALUES ('11', '报表统计', '2', 'C', '/forward/toQuestionReport', null, null, null, null, null);
INSERT INTO `tbl_menu` VALUES ('12', '问卷管理', '3', 'C', '/forward/toQuestionnaire', null, null, null, null, null);
INSERT INTO `tbl_menu` VALUES ('13', '操作日志', '4', 'C', '/forward/toLog', null, null, null, null, null);-- ----------------------------
-- Table structure for tbl_role
-- ----------------------------
DROP TABLE IF EXISTS `tbl_role`;
CREATE TABLE `tbl_role` (`role_id` int(11) NOT NULL AUTO_INCREMENT,`role_name` varchar(20) NOT NULL,`role_desc` varchar(200) NOT NULL,`state_flag` int(11) DEFAULT '0',`del_flag` int(11) DEFAULT '0',`create_by` varchar(20) DEFAULT NULL,`create_time` datetime DEFAULT NULL,`update_by` varchar(20) DEFAULT NULL,`update_time` datetime DEFAULT NULL,PRIMARY KEY (`role_id`)
) ENGINE=InnoDB AUTO_INCREMENT=4 DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_0900_ai_ci;-- ----------------------------
-- Records of tbl_role
-- ----------------------------
INSERT INTO `tbl_role` VALUES ('1', '管理员', '管理员', '0', '0', 'admin', '2022-08-29 10:25:38', null, null);
INSERT INTO `tbl_role` VALUES ('2', '人事经理', '人事经理', '0', '0', 'admin', '2022-08-29 10:25:38', null, null);
INSERT INTO `tbl_role` VALUES ('3', '测试人员', '测试人员', '0', '0', 'admin', '2022-08-29 10:25:38', null, null);-- ----------------------------
-- Table structure for tbl_role_menu
-- ----------------------------
DROP TABLE IF EXISTS `tbl_role_menu`;
CREATE TABLE `tbl_role_menu` (`id` int(11) NOT NULL AUTO_INCREMENT,`role_id` int(11) DEFAULT NULL,`menu_id` int(11) DEFAULT NULL,PRIMARY KEY (`id`)
) ENGINE=InnoDB AUTO_INCREMENT=23 DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_0900_ai_ci;-- ----------------------------
-- Records of tbl_role_menu
-- ----------------------------
INSERT INTO `tbl_role_menu` VALUES ('1', '1', '1');
INSERT INTO `tbl_role_menu` VALUES ('2', '1', '2');
INSERT INTO `tbl_role_menu` VALUES ('3', '1', '3');
INSERT INTO `tbl_role_menu` VALUES ('4', '1', '4');
INSERT INTO `tbl_role_menu` VALUES ('5', '1', '5');
INSERT INTO `tbl_role_menu` VALUES ('6', '1', '6');
INSERT INTO `tbl_role_menu` VALUES ('7', '1', '7');
INSERT INTO `tbl_role_menu` VALUES ('8', '1', '8');
INSERT INTO `tbl_role_menu` VALUES ('9', '1', '9');
INSERT INTO `tbl_role_menu` VALUES ('10', '1', '10');
INSERT INTO `tbl_role_menu` VALUES ('11', '1', '11');
INSERT INTO `tbl_role_menu` VALUES ('12', '1', '12');
INSERT INTO `tbl_role_menu` VALUES ('13', '1', '13');
INSERT INTO `tbl_role_menu` VALUES ('16', '2', '1');
INSERT INTO `tbl_role_menu` VALUES ('17', '2', '5');
INSERT INTO `tbl_role_menu` VALUES ('18', '2', '6');
INSERT INTO `tbl_role_menu` VALUES ('19', '2', '7');
INSERT INTO `tbl_role_menu` VALUES ('20', '2', '8');

pom.xml:

<?xml version="1.0" encoding="UTF-8"?><project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd"><modelVersion>4.0.0</modelVersion><groupId>org.example</groupId><artifactId>lesson0829_HRProj</artifactId><version>1.0-SNAPSHOT</version><packaging>war</packaging><name>lesson0829_HRProj Maven Webapp</name><!-- FIXME change it to the project's website --><url>http://www.example.com</url><properties><maven.compiler.source>8</maven.compiler.source><maven.compiler.target>8</maven.compiler.target><servlet.version>4.0.1</servlet.version><jsp.version>2.2</jsp.version><jstl.version>1.2</jstl.version><spring.version>5.3.14</spring.version><commons-dbcp.version>1.4</commons-dbcp.version><mybatis.version>3.4.6</mybatis.version><mybatis-spring.version>1.3.3</mybatis-spring.version><mysql-connector-java.version>8.0.11</mysql-connector-java.version><fastjson.version>1.2.78</fastjson.version></properties><dependencies><!-- 添加javaEE支持 --><dependency><groupId>javax.servlet</groupId><artifactId>javax.servlet-api</artifactId><version>${servlet.version}</version><!-- provided只在编译时支持，发布时不拷贝文件 --><scope>provided</scope></dependency><dependency><groupId>javax.servlet.jsp</groupId><artifactId>jsp-api</artifactId><version>${jsp.version}</version><!-- provided只在编译时支持，发布时不拷贝文件 --><scope>provided</scope></dependency><dependency><groupId>jstl</groupId><artifactId>jstl</artifactId><version>${jstl.version}</version></dependency><!--引入spring基础模块--><dependency><groupId>org.springframework</groupId><artifactId>spring-webmvc</artifactId><version>${spring.version}</version></dependency><dependency><groupId>org.springframework</groupId><artifactId>spring-jdbc</artifactId><version>${spring.version}</version></dependency><!-- dbcp连接池 --><dependency><groupId>commons-dbcp</groupId><artifactId>commons-dbcp</artifactId><version>${commons-dbcp.version}</version></dependency><!-- mybatis --><dependency><groupId>org.mybatis</groupId><artifactId>mybatis</artifactId><version>${mybatis.version}</version></dependency><!-- mybatis spring整合 --><dependency><groupId>org.mybatis</groupId><artifactId>mybatis-spring</artifactId><version>${mybatis-spring.version}</version></dependency><!--mybatis插件PageHelper--><dependency><groupId>com.github.pagehelper</groupId><artifactId>pagehelper</artifactId><version>5.1.0</version></dependency><dependency><groupId>com.github.abel533</groupId><artifactId>mapper</artifactId><version>3.0.1</version></dependency><!-- mysql驱动类 --><dependency><groupId>mysql</groupId><artifactId>mysql-connector-java</artifactId><version>${mysql-connector-java.version}</version></dependency><!--fastjson处理json数据--><dependency><groupId>com.alibaba</groupId><artifactId>fastjson</artifactId><version>${fastjson.version}</version></dependency><!--lombok 简化实体内容--><dependency><groupId>org.projectlombok</groupId><artifactId>lombok</artifactId><version>1.18.24</version></dependency><dependency><groupId>com.fasterxml.jackson.core</groupId><artifactId>jackson-databind</artifactId><version>2.13.2.2</version></dependency></dependencies>
</project>

web.xml:

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns="http://xmlns.jcp.org/xml/ns/javaee"xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_4_0.xsd"version="4.0"><!--定义spring的配置文件，用于在spring监听器监听网站启动的时候，创建spring容器--><context-param><param-name>contextConfigLocation</param-name><param-value>classpath:spring-mybatis.xml</param-value></context-param><!--配置spring监听器，用于创建spring容器--><listener><listener-class>org.springframework.web.context.ContextLoaderListener</listener-class></listener><!--配置spring的编码过滤器--><filter><filter-name>characterEncodingFilter</filter-name><filter-class>org.springframework.web.filter.CharacterEncodingFilter</filter-class><init-param><param-name>encoding</param-name><param-value>UTF-8</param-value></init-param></filter><filter-mapping><filter-name>characterEncodingFilter</filter-name><url-pattern>/*</url-pattern></filter-mapping><!--配置springMVC前端控制器--><servlet><servlet-name>springMVC</servlet-name><servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class><init-param><!--springMVC需要配置相关的组件(处理器映射器,适配器。。。)因此我们要自己定义配置文件，在配置文件中定义这些组件。如果自己没有定义这个配置文件,springMVC的前端控制器默认加载 servlet名字+servlet.xml这个文件找不到则报错。一般情况下，我们要自己在init-param中配置这个文件，param-name固定是contextConfigLocation--><param-name>contextConfigLocation</param-name><param-value>classpath:spring-mvc.xml</param-value></init-param><load-on-startup>1</load-on-startup></servlet><servlet-mapping><servlet-name>springMVC</servlet-name><!--凡是以.do结尾的请求都让springMVC来处理<url-pattern>*.do</url-pattern>--><!-- 斜杠配置（/）:表示所有的默认请求都交给DisaptherServlet来处理导致的问题就是请求静态资源的时候无法处理--><url-pattern>/</url-pattern></servlet-mapping>
</web-app>

ForwardController :

package com.aaa.hr.controller;import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;@Controller
@RequestMapping("/forward")
public class ForwardController {@RequestMapping(path = {"/toLogin","/"})public String toLogin(){return "login";}@RequestMapping("/toMain")public String toMain(Model model){//应该查询左侧菜单数据，渲染到页面上return "main";}@RequestMapping("/toEmp")public String toEmp(){return "emp";}
}

EmpMapper.xml:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN""http://mybatis.org/dtd/mybatis-3-mapper.dtd"><mapper namespace="com.aaa.mapper.EmpMapper"></mapper>

db.properties:

jdbc.driver=com.mysql.cj.jdbc.Driver
jdbc.url=jdbc:mysql://localhost:3306/proj_hr_yzh7?useSSL=false&serverTimezone=Asia/Shanghai&characterEncoding=utf8&allowPublicKeyRetrieval=true
jdbc.username=root
jdbc.password=123456

mybatis-config.xml

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE configurationPUBLIC "-//mybatis.org//DTD Config 3.0//EN""http://mybatis.org/dtd/mybatis-3-config.dtd">
<configuration><settings><!-- 配置日志工具 --><setting name="logImpl" value="STDOUT_LOGGING"/><!--配置将下划线字段转为小驼峰--><setting name="mapUnderscoreToCamelCase" value="true"/></settings><!--配置分页插件和通用Mapper插件--><plugins><!--拦截器--><plugin interceptor="com.github.pagehelper.PageInterceptor"><property name="offsetAsPageNum" value="true"/><!--配置数据库方言 4.0版本以后不用写--><!--<property name="helperDialect" value="mysql"/>--><!--是否做count查询--><property name="rowBoundsWithCount" value="true"/><!--合理化分页--><property name="reasonable" value="true"/></plugin><plugin interceptor="com.github.abel533.mapperhelper.MapperInterceptor"><!--主键自增回写方法,默认值MYSQL --><!--<property name="IDENTITY" value="MYSQL" />--><!--通用Mapper默认接口，我们定义的Mapper需要实现该接口 --><property name="mappers" value="com.github.abel533.mapper.Mapper" /></plugin></plugins>
</configuration>

spring-mvc.xml:

<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"xmlns:context="http://www.springframework.org/schema/context"xmlns:mvc="http://www.springframework.org/schema/mvc"xsi:schemaLocation="http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans.xsd http://www.springframework.org/schema/context https://www.springframework.org/schema/context/spring-context.xsd http://www.springframework.org/schema/mvc https://www.springframework.org/schema/mvc/spring-mvc.xsd"><!--扫描controller包，管理其中定义的controller类--><context:component-scan base-package="com.aaa.hr.controller"/><!--启用注解方式配置 springMVC请求使用的相关组件处理器映射器，处理器适配器，处理器(Controller...其他注解)--><mvc:annotation-driven/><!--视图解析器--><bean class="org.springframework.web.servlet.view.InternalResourceViewResolver"><!--配置视图前缀--><property name="prefix" value="/WEB-INF/page/"/><!--配置视图后缀--><property name="suffix" value=".jsp"/></bean><!--配置DefaultServlet处理其他请求(静态资源)--><mvc:default-servlet-handler/></beans>

spring-mybatis.xml:

<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"xmlns:context="http://www.springframework.org/schema/context"xsi:schemaLocation="http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans.xsd http://www.springframework.org/schema/context https://www.springframework.org/schema/context/spring-context.xsd"><!--配置spring扫描包--><context:component-scan base-package="com.aaa.hr.service"/><!--通过spring配置数据库的连接属性文件--><context:property-placeholder location="classpath:db.properties"/><!--通过spring来配置数据库连接池的数据源对象--><bean id="ds" class="org.apache.commons.dbcp.BasicDataSource"destroy-method="close"><!--配置连接池数据源需要使用四大金刚(数据库连接属性)--><property name="driverClassName" value="${jdbc.driver}"/><property name="url" value="${jdbc.url}"/><property name="username" value="${jdbc.username}"/><property name="password" value="${jdbc.password}"/></bean><!--通过spring来配置mybatis的会话工厂和其他相关配置原来的时候，mybatis的会话工厂由程序员来创建，现在通过spring来创建管理这个就体现了Spring的IoC特征(控制反转)--><bean id="sqlSessionFactory" class="org.mybatis.spring.SqlSessionFactoryBean"><!--配置SqlSession依赖的数据源对象--><property name="dataSource" ref="ds"/><!--配置mybatis要使用的类型别名定义--><property name="typeAliasesPackage" value="com.aaa.demo.entity"/><!--配置mybatis的主配置文件的路径,spring会自动加载mybatis的配置文件--><property name="configLocation" value="classpath:mybatis-config.xml"/><!--配置mybatis的Mapper文件的路径:spring中Mapper接口和Mapper文件路径可以由区别--><property name="mapperLocations" value="classpath:com/mapper/*.xml"/></bean><!--通过spring来配置Mybatis的Mapper接口通过包扫描的方式进行配置--><bean class="org.mybatis.spring.mapper.MapperScannerConfigurer"><!--配置Mybatis的Mapper接口--><property name="basePackage" value="com.aaa.demo.mapper"/><!--配置可以创建Mapper接口对象的SqlSession使用的SqlSessionFactory对象的名字--><property name="sqlSessionFactoryBeanName" value="sqlSessionFactory"/></bean></beans>


emp.jsp:

<%--Created by IntelliJ IDEA.User: henryDate: 2022/8/29Time: 10:48To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html>
<head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"><title>后台主页</title><link rel="stylesheet" href="${pageContext.request.contextPath}/assets/layui/css/layui.css"><script src="${pageContext.request.contextPath}/assets/layui/layui.all.js"></script>
</head>
<body style=""><form style="display: none;" class="layui-form" lay-filter="staffForm" id="staffForm"><input name="sfid" style="display: none;"><div class="layui-form-item"><label class="layui-form-label">员工姓名</label><div class="layui-input-inline"><input type="text" name="sfname" placeholder="请输入员工姓名" autocomplete="off" class="layui-input"></div></div><div class="layui-form-item"><label class="layui-form-label">性别</label><div class="layui-input-inline"><select name="sfsex" id="sfsex"><option value="">-请选择-</option><option value="男">男</option><option value="女">女</option></select><div class="layui-unselect layui-form-select"><div class="layui-select-title"><input type="text" placeholder="-请选择-" value="" readonly="" class="layui-input layui-unselect"><i class="layui-edge"></i></div><dl class="layui-anim layui-anim-upbit"><dd lay-value="" class="layui-select-tips">-请选择-</dd><dd lay-value="男" class="">男</dd><dd lay-value="女" class="">女</dd></dl></div></div></div><div class="layui-form-item"><label class="layui-form-label">年龄</label><div class="layui-input-inline"><input type="text" name="sfage" id="sfage" placeholder="请输入年龄" autocomplete="off" class="layui-input"></div></div><div class="layui-form-item"><label class="layui-form-label">身份证号</label><div class="layui-input-inline"><input type="text" name="sfcode" id="sfcode" placeholder="请输入身份证号" autocomplete="off" class="layui-input"></div></div><div class="layui-form-item"><label class="layui-form-label">电话号</label><div class="layui-input-inline"><input type="text" name="sftel" id="sftel" placeholder="请输入电话号" autocomplete="off" class="layui-input"></div></div><div class="layui-form-item" id="area-picker"><div class="layui-input-inline" style="width: 100px;margin-left: 30px"><select name="province" class="province-selector" data-value="请选择" lay-filter="province-1" id="province"><option value=""></option><option value="北京市">北京市</option><option value="天津市">天津市</option><option value="河北省">河北省</option><option value="山西省">山西省</option><option value="内蒙古自治区">内蒙古自治区</option><option value="辽宁省">辽宁省</option><option value="吉林省">吉林省</option><option value="黑龙江省">黑龙江省</option><option value="上海市">上海市</option><option value="江苏省">江苏省</option><option value="浙江省">浙江省</option><option value="安徽省">安徽省</option><option value="福建省">福建省</option><option value="江西省">江西省</option><option value="山东省">山东省</option><option value="河南省">河南省</option><option value="湖北省">湖北省</option><option value="湖南省">湖南省</option><option value="广东省">广东省</option><option value="广西壮族自治区">广西壮族自治区</option><option value="海南省">海南省</option><option value="重庆市">重庆市</option><option value="四川省">四川省</option><option value="贵州省">贵州省</option><option value="云南省">云南省</option><option value="西藏自治区">西藏自治区</option><option value="陕西省">陕西省</option><option value="甘肃省">甘肃省</option><option value="青海省">青海省</option><option value="宁夏回族自治区">宁夏回族自治区</option><option value="新疆维吾尔自治区">新疆维吾尔自治区</option><option value="台湾省">台湾省</option><option value="香港特别行政区">香港特别行政区</option><option value="澳门特别行政区">澳门特别行政区</option><option value="海外">海外</option></select><div class="layui-unselect layui-form-select"><div class="layui-select-title"><input type="text" placeholder="请选择" value="" readonly="" class="layui-input layui-unselect"><i class="layui-edge"></i></div><dl class="layui-anim layui-anim-upbit"><dd lay-value="" class="layui-select-tips">请选择</dd><dd lay-value="北京市" class="">北京市</dd><dd lay-value="天津市" class="">天津市</dd><dd lay-value="河北省" class="">河北省</dd><dd lay-value="山西省" class="">山西省</dd><dd lay-value="内蒙古自治区" class="">内蒙古自治区</dd><dd lay-value="辽宁省" class="">辽宁省</dd><dd lay-value="吉林省" class="">吉林省</dd><dd lay-value="黑龙江省" class="">黑龙江省</dd><dd lay-value="上海市" class="">上海市</dd><dd lay-value="江苏省" class="">江苏省</dd><dd lay-value="浙江省" class="">浙江省</dd><dd lay-value="安徽省" class="">安徽省</dd><dd lay-value="福建省" class="">福建省</dd><dd lay-value="江西省" class="">江西省</dd><dd lay-value="山东省" class="">山东省</dd><dd lay-value="河南省" class="">河南省</dd><dd lay-value="湖北省" class="">湖北省</dd><dd lay-value="湖南省" class="">湖南省</dd><dd lay-value="广东省" class="">广东省</dd><dd lay-value="广西壮族自治区" class="">广西壮族自治区</dd><dd lay-value="海南省" class="">海南省</dd><dd lay-value="重庆市" class="">重庆市</dd><dd lay-value="四川省" class="">四川省</dd><dd lay-value="贵州省" class="">贵州省</dd><dd lay-value="云南省" class="">云南省</dd><dd lay-value="西藏自治区" class="">西藏自治区</dd><dd lay-value="陕西省" class="">陕西省</dd><dd lay-value="甘肃省" class="">甘肃省</dd><dd lay-value="青海省" class="">青海省</dd><dd lay-value="宁夏回族自治区" class="">宁夏回族自治区</dd><dd lay-value="新疆维吾尔自治区" class="">新疆维吾尔自治区</dd><dd lay-value="台湾省" class="">台湾省</dd><dd lay-value="香港特别行政区" class="">香港特别行政区</dd><dd lay-value="澳门特别行政区" class="">澳门特别行政区</dd><dd lay-value="海外" class="">海外</dd></dl></div></div><div class="layui-input-inline" style="width: 100px;margin-left: 10px"><select name="city" class="city-selector" data-value="请选择" lay-filter="city-1" id="city"><option value=""></option></select><div class="layui-unselect layui-form-select"><div class="layui-select-title"><input type="text" placeholder="请选择" value="" readonly="" class="layui-input layui-unselect"><i class="layui-edge"></i></div><dl class="layui-anim layui-anim-upbit"><dd lay-value="" class="layui-select-tips">请选择</dd></dl></div></div><div class="layui-input-inline" style="width:100px;margin-left: 10px"><select name="county" class="county-selector" data-value="请选择" lay-filter="county-1" id="county"><option value=""></option></select><div class="layui-unselect layui-form-select"><div class="layui-select-title"><input type="text" placeholder="请选择" value="" readonly="" class="layui-input layui-unselect"><i class="layui-edge"></i></div><dl class="layui-anim layui-anim-upbit"><dd lay-value="" class="layui-select-tips">请选择</dd></dl></div></div></div><div class="layui-form-item"><label class="layui-form-label">家庭住址</label><div class="layui-input-inline"><input type="text" name="sfaddress" placeholder="请输入地址" autocomplete="off" class="layui-input" id="address" lay-verify="address"></div></div><div class="layui-form-item"><div class="layui-inline"><label class="layui-form-label">入职日期</label><div class="layui-input-inline"><input type="text" class="layui-input" name="sfentry" id="test11" placeholder="yyyy年MM月dd日" lay-key="2"></div></div></div><div class="layui-form-item" id="dp"><label class="layui-form-label">部门类型</label><div class="layui-input-inline"><select name="dpid" id="dpType"><option value="">--请选择--</option><option value="1">管理部</option><option value="2">人事部</option><option value="4">盘点部</option></select><div class="layui-unselect layui-form-select"><div class="layui-select-title"><input type="text" placeholder="--请选择--" value="" readonly="" class="layui-input layui-unselect"><i class="layui-edge"></i></div><dl class="layui-anim layui-anim-upbit"><dd lay-value="" class="layui-select-tips">--请选择--</dd><dd lay-value="1" class="">管理部</dd><dd lay-value="2" class="">人事部</dd><dd lay-value="4" class="">盘点部</dd></dl></div></div></div><div class="layui-form-item" id="ps"><label class="layui-form-label">职位类型</label><div class="layui-input-inline"><select name="rid" id="psType"><option value="">--请选择--</option><option value="1">店长</option><option value="2">盘点员</option><option value="7">普通员工</option><option value="8">财务员</option><option value="9">老板</option></select><div class="layui-unselect layui-form-select"><div class="layui-select-title"><input type="text" placeholder="--请选择--" value="" readonly="" class="layui-input layui-unselect"><i class="layui-edge"></i></div><dl class="layui-anim layui-anim-upbit"><dd lay-value="" class="layui-select-tips">--请选择--</dd><dd lay-value="1" class="">店长</dd><dd lay-value="2" class="">盘点员</dd><dd lay-value="7" class="">普通员工</dd><dd lay-value="8" class="">财务员</dd><dd lay-value="9" class="">老板</dd></dl></div></div></div><div class="layui-form-item" id="sta"><label class="layui-form-label">员工状态</label><div class="layui-input-inline"><select name="sfstatus"><option value="">--请选择--</option><option value="1">任职</option><option value="2">冻结</option></select><div class="layui-unselect layui-form-select"><div class="layui-select-title"><input type="text" placeholder="--请选择--" value="" readonly="" class="layui-input layui-unselect"><i class="layui-edge"></i></div><dl class="layui-anim layui-anim-upbit"><dd lay-value="" class="layui-select-tips">--请选择--</dd><dd lay-value="1" class="">任职</dd><dd lay-value="2" class="">冻结</dd></dl></div></div></div><div class="layui-form-item"><div class="layui-input-inline"><button class="layui-btn" lay-submit="" lay-filter="formDemo" style="margin-left: 110px">立即提交</button><button type="reset" class="layui-btn layui-btn-primary" style="margin: -38px 0 0 210px">重置</button></div></div>
</form>
<form style="display: none;" class="layui-form" lay-filter="branchForm" id="branchForm"><input name="sfid" style="display: none;"><div class="layui-form-item"><label class="layui-form-label">平调员工</label><div class="layui-input-inline"><input type="text" name="sfname" autocomplete="off" class="layui-input" readonly="readonly"></div></div><div class="layui-form-item"><label class="layui-form-label">所属分店</label><div class="layui-input-inline"><input type="text" name="brname" id="brone" autocomplete="off" class="layui-input" readonly="readonly"></div></div><div class="layui-form-item"><label class="layui-form-label">所属职位</label><div class="layui-input-inline"><input type="text" name="pttype" id="rone" autocomplete="off" class="layui-input" readonly="readonly"></div></div><div class="layui-form-item"><label class="layui-form-label">所属部门</label><div class="layui-input-inline"><input type="text" name="dpname" id="dpone" autocomplete="off" class="layui-input" readonly="readonly"></div></div><div class="layui-form-item"><label class="layui-form-label">平调分店</label><div class="layui-input-inline"><select name="brid" id="brType1"><option value="">--请选择--</option></select><div class="layui-unselect layui-form-select"><div class="layui-select-title"><input type="text" placeholder="--请选择--" value="" readonly="" class="layui-input layui-unselect"><i class="layui-edge"></i></div><dl class="layui-anim layui-anim-upbit"><dd lay-value="" class="layui-select-tips">--请选择--</dd></dl></div></div></div><div class="layui-form-item"><label class="layui-form-label">平调部门</label><div class="layui-input-inline"><select name="dpid" id="dpType1"><option value="">--请选择--</option><option value="1">管理部</option><option value="2">人事部</option><option value="4">盘点部</option></select><div class="layui-unselect layui-form-select"><div class="layui-select-title"><input type="text" placeholder="--请选择--" value="" readonly="" class="layui-input layui-unselect"><i class="layui-edge"></i></div><dl class="layui-anim layui-anim-upbit"><dd lay-value="" class="layui-select-tips">--请选择--</dd><dd lay-value="1" class="">管理部</dd><dd lay-value="2" class="">人事部</dd><dd lay-value="4" class="">盘点部</dd></dl></div></div></div><div class="layui-form-item"><label class="layui-form-label">平调职位</label><div class="layui-input-inline"><select name="rid" id="psType1"><option value="">--请选择--</option><option value="1">店长</option><option value="2">盘点员</option><option value="7">普通员工</option><option value="8">财务员</option><option value="9">老板</option></select><div class="layui-unselect layui-form-select"><div class="layui-select-title"><input type="text" placeholder="--请选择--" value="" readonly="" class="layui-input layui-unselect"><i class="layui-edge"></i></div><dl class="layui-anim layui-anim-upbit"><dd lay-value="" class="layui-select-tips">--请选择--</dd><dd lay-value="1" class="">店长</dd><dd lay-value="2" class="">盘点员</dd><dd lay-value="7" class="">普通员工</dd><dd lay-value="8" class="">财务员</dd><dd lay-value="9" class="">老板</dd></dl></div></div></div><div class="layui-form-item"><div class="layui-input-inline"><button class="layui-btn" lay-submit="" lay-filter="formDemo2" style="margin-left: 150px">提交审核</button></div></div>
</form><div class="layui-collapse"><div class="layui-colla-item"><h2 class="layui-colla-title">搜索<i class="layui-icon layui-colla-icon"></i></h2><div class="layui-colla-content layui-show"><div class="demoTable layui-form"><div class="layui-inline"><input class="layui-input" placeholder="请输入员工编号" name="sfid" id="sfid" autocomplete="off"></div><div class="layui-inline"><input class="layui-input" placeholder="请输入员工姓名" name="sfname" id="sfname" autocomplete="off"></div><div class=" layui-input-inline"><select name="dpid" id="searchType"><option value="">--请选择部门--</option><option value="1">管理部</option><option value="2">人事部</option><option value="4">盘点部</option></select><div class="layui-unselect layui-form-select"><div class="layui-select-title"><input type="text" placeholder="--请选择部门--" value="" readonly="" class="layui-input layui-unselect"><i class="layui-edge"></i></div><dl class="layui-anim layui-anim-upbit"><dd lay-value="" class="layui-select-tips">--请选择部门--</dd><dd lay-value="1" class="">管理部</dd><dd lay-value="2" class="">人事部</dd><dd lay-value="4" class="">盘点部</dd></dl></div></div><div class=" layui-input-inline" id="brths"><select name="brid" id="branchType"><option value="">--请选择分店--</option><option value="1">总店</option><option value="2">北京二号店</option><option value="14">北京一号店1</option><option value="20">北京朝阳区分店</option><option value="21">河南</option><option value="22">郑州一号店</option></select><div class="layui-unselect layui-form-select"><div class="layui-select-title"><input type="text" placeholder="--请选择分店--" value="" readonly="" class="layui-input layui-unselect"><i class="layui-edge"></i></div><dl class="layui-anim layui-anim-upbit"><dd lay-value="" class="layui-select-tips">--请选择分店--</dd><dd lay-value="1" class="">总店</dd><dd lay-value="2" class="">北京二号店</dd><dd lay-value="14" class="">北京一号店1</dd><dd lay-value="20" class="">北京朝阳区分店</dd><dd lay-value="21" class="">河南</dd><dd lay-value="22" class="">郑州一号店</dd></dl></div></div><div class="layui-inline"><input type="text" class="layui-input" name="testtime" id="test10" placeholder="入职日期时间范围" lay-key="1"></div><button class="layui-btn" id="staffSearch" data-type="reload">搜索</button></div></div></div>
</div>
<table id="demo" lay-filter="test" style="margin-top: -10px;"></table><div class="layui-form layui-border-box layui-table-view" lay-filter="LAY-table-1" lay-id="test" style=" "><div class="layui-table-tool"><div class="layui-table-tool-temp"> <div class="layui-btn-container"> <button class="layui-btn layui-btn-sm" lay-event="add">新增</button> <button class="layui-btn layui-btn-sm" lay-event="refresh">刷新</button> </div> </div><div class="layui-table-tool-self"><div class="layui-inline" title="筛选列" lay-event="LAYTABLE_COLS"><i class="layui-icon layui-icon-cols"></i></div><div class="layui-inline" title="导出" lay-event="LAYTABLE_EXPORT"><i class="layui-icon layui-icon-export"></i></div><div class="layui-inline" title="打印" lay-event="LAYTABLE_PRINT"><i class="layui-icon layui-icon-print"></i></div></div></div><div class="layui-table-box"><div class="layui-table-header"><table class="layui-table" lay-even="" cellspacing="0" cellpadding="0" border="0"><thead><tr><th data-field="sfid" data-key="1-0-0" class=" layui-unselect"><div class="layui-table-cell laytable-cell-1-0-0" align="center"><span>员工编号</span><span class="layui-table-sort layui-inline"><i class="layui-edge layui-table-sort-asc" title="升序"></i><i class="layui-edge layui-table-sort-desc" title="降序"></i></span></div></th><th data-field="sfname" data-key="1-0-1" class=""><div class="layui-table-cell laytable-cell-1-0-1" align="center"><span>姓名</span></div></th><th data-field="sfsex" data-key="1-0-2" class=" layui-unselect"><div class="layui-table-cell laytable-cell-1-0-2" align="center"><span>性别</span><span class="layui-table-sort layui-inline"><i class="layui-edge layui-table-sort-asc" title="升序"></i><i class="layui-edge layui-table-sort-desc" title="降序"></i></span></div></th><th data-field="sfage" data-key="1-0-3" class=""><div class="layui-table-cell laytable-cell-1-0-3" align="center"><span>年龄</span></div></th><th data-field="sfcode" data-key="1-0-4" class=""><div class="layui-table-cell laytable-cell-1-0-4"><span>身份证号</span></div></th><th data-field="sftel" data-key="1-0-5" class=""><div class="layui-table-cell laytable-cell-1-0-5"><span>电话号</span></div></th><th data-field="sfaddress" data-key="1-0-6" class=""><div class="layui-table-cell laytable-cell-1-0-6"><span>家庭住址</span></div></th><th data-field="sfentry" data-key="1-0-7" class=" layui-unselect"><div class="layui-table-cell laytable-cell-1-0-7"><span>入职时间</span><span class="layui-table-sort layui-inline"><i class="layui-edge layui-table-sort-asc" title="升序"></i><i class="layui-edge layui-table-sort-desc" title="降序"></i></span></div></th><th data-field="sfquit" data-key="1-0-8" class="layui-hide"><div class="layui-table-cell laytable-cell-1-0-8"><span>离职时间</span></div></th><th data-field="dpid" data-key="1-0-9" class="layui-hide"><div class="layui-table-cell laytable-cell-1-0-9"><span>部门编号</span></div></th><th data-field="rid" data-key="1-0-10" class="layui-hide"><div class="layui-table-cell laytable-cell-1-0-10"><span>职位编号</span></div></th><th data-field="position.pttype" data-key="1-0-11" class=""><div class="layui-table-cell laytable-cell-1-0-11" align="center"><span>职位</span></div></th><th data-field="department.dpname" data-key="1-0-12" class=""><div class="layui-table-cell laytable-cell-1-0-12" align="center"><span>部门</span></div></th><th data-field="branch.brname" data-key="1-0-13" class=""><div class="layui-table-cell laytable-cell-1-0-13" align="center"><span>分店</span></div></th><th data-field="sfstatus" data-key="1-0-14" class=""><div class="layui-table-cell laytable-cell-1-0-14" align="center"><span>员工状态</span></div></th><th data-field="15" data-key="1-0-15" class=" layui-table-col-special"><div class="layui-table-cell laytable-cell-1-0-15"><span>操作</span></div></th></tr></thead></table></div><div class="layui-table-body layui-table-main"><table class="layui-table" lay-even="" cellspacing="0" cellpadding="0" border="0"><tbody><tr data-index="0" class=""><td data-field="sfid" data-key="1-0-0" class="" align="center"><div class="layui-table-cell laytable-cell-1-0-0">1</div></td><td data-field="sfname" data-key="1-0-1" class="" align="center"><div class="layui-table-cell laytable-cell-1-0-1">老王</div></td><td data-field="sfsex" data-key="1-0-2" data-content="女" class="" align="center"><div class="layui-table-cell laytable-cell-1-0-2">  <span style="color: #F581B1;">女</span>  </div></td><td data-field="sfage" data-key="1-0-3" class="" align="center"><div class="layui-table-cell laytable-cell-1-0-3">19</div></td><td data-field="sfcode" data-key="1-0-4" class=""><div class="layui-table-cell laytable-cell-1-0-4">412569875615356489</div></td><td data-field="sftel" data-key="1-0-5" class=""><div class="layui-table-cell laytable-cell-1-0-5">16359489654</div></td><td data-field="sfaddress" data-key="1-0-6" class=""><div class="layui-table-cell laytable-cell-1-0-6">河南省洛阳市伊川县</div></td><td data-field="sfentry" data-key="1-0-7" class=""><div class="layui-table-cell laytable-cell-1-0-7">2021-07-26 00:00:00</div></td><td data-field="sfquit" data-key="1-0-8" class="layui-hide"><div class="layui-table-cell laytable-cell-1-0-8"></div></td><td data-field="dpid" data-key="1-0-9" class="layui-hide"><div class="layui-table-cell laytable-cell-1-0-9"></div></td><td data-field="rid" data-key="1-0-10" class="layui-hide"><div class="layui-table-cell laytable-cell-1-0-10"></div></td><td data-field="position.pttype" data-key="1-0-11" data-content="" class="" align="center"><div class="layui-table-cell laytable-cell-1-0-11">老板</div></td><td data-field="department.dpname" data-key="1-0-12" data-content="" class="" align="center"><div class="layui-table-cell laytable-cell-1-0-12">管理部</div></td><td data-field="branch.brname" data-key="1-0-13" data-content="" class="" align="center"><div class="layui-table-cell laytable-cell-1-0-13">总店</div></td><td data-field="sfstatus" data-key="1-0-14" data-content="1" class="" align="center"><div class="layui-table-cell laytable-cell-1-0-14">  <button class="layui-btn layui-btn-sm" lay-event="add">任职中</button>  </div></td><td data-field="15" data-key="1-0-15" data-off="true" class="layui-table-col-special"><div class="layui-table-cell laytable-cell-1-0-15"> <button class="layui-btn layui-btn-warm layui-btn-xs" id="pdbranch" lay-event="pdUpdate">平调</button> <a class="layui-btn layui-btn-xs" lay-event="updateStaff">编辑</a>  <button class="layui-btn layui-btn-warm layui-btn-xs" lay-event="upStatus">冻结</button>  <button class="layui-btn layui-btn-danger layui-btn-xs" lay-event="upQuitStatus">解雇</button> </div></td></tr><tr data-index="1" class=""><td data-field="sfid" data-key="1-0-0" class="" align="center"><div class="layui-table-cell laytable-cell-1-0-0">29</div></td><td data-field="sfname" data-key="1-0-1" class="" align="center"><div class="layui-table-cell laytable-cell-1-0-1">老李</div></td><td data-field="sfsex" data-key="1-0-2" data-content="男" class="" align="center"><div class="layui-table-cell laytable-cell-1-0-2">  <span style="color: #499C54;">男</span>  </div></td><td data-field="sfage" data-key="1-0-3" class="" align="center"><div class="layui-table-cell laytable-cell-1-0-3">2</div></td><td data-field="sfcode" data-key="1-0-4" class=""><div class="layui-table-cell laytable-cell-1-0-4">165635945896535648</div></td><td data-field="sftel" data-key="1-0-5" class=""><div class="layui-table-cell laytable-cell-1-0-5">12313123111</div></td><td data-field="sfaddress" data-key="1-0-6" class=""><div class="layui-table-cell laytable-cell-1-0-6">北京市北京市丰台区</div></td><td data-field="sfentry" data-key="1-0-7" class=""><div class="layui-table-cell laytable-cell-1-0-7">2021-07-15 12:59:50</div></td><td data-field="sfquit" data-key="1-0-8" class="layui-hide"><div class="layui-table-cell laytable-cell-1-0-8"></div></td><td data-field="dpid" data-key="1-0-9" class="layui-hide"><div class="layui-table-cell laytable-cell-1-0-9"></div></td><td data-field="rid" data-key="1-0-10" class="layui-hide"><div class="layui-table-cell laytable-cell-1-0-10"></div></td><td data-field="position.pttype" data-key="1-0-11" data-content="" class="" align="center"><div class="layui-table-cell laytable-cell-1-0-11">店长</div></td><td data-field="department.dpname" data-key="1-0-12" data-content="" class="" align="center"><div class="layui-table-cell laytable-cell-1-0-12">管理部</div></td><td data-field="branch.brname" data-key="1-0-13" data-content="" class="" align="center"><div class="layui-table-cell laytable-cell-1-0-13">北京一号店1</div></td><td data-field="sfstatus" data-key="1-0-14" data-content="1" class="" align="center"><div class="layui-table-cell laytable-cell-1-0-14">  <button class="layui-btn layui-btn-sm" lay-event="add">任职中</button>  </div></td><td data-field="15" data-key="1-0-15" data-off="true" class="layui-table-col-special"><div class="layui-table-cell laytable-cell-1-0-15"> <button class="layui-btn layui-btn-warm layui-btn-xs" id="pdbranch" lay-event="pdUpdate">平调</button> <a class="layui-btn layui-btn-xs" lay-event="updateStaff">编辑</a>  <button class="layui-btn layui-btn-warm layui-btn-xs" lay-event="upStatus">冻结</button>  <button class="layui-btn layui-btn-danger layui-btn-xs" lay-event="upQuitStatus">解雇</button> </div></td></tr><tr data-index="2" class=""><td data-field="sfid" data-key="1-0-0" class="" align="center"><div class="layui-table-cell laytable-cell-1-0-0">31</div></td><td data-field="sfname" data-key="1-0-1" class="" align="center"><div class="layui-table-cell laytable-cell-1-0-1">老张</div></td><td data-field="sfsex" data-key="1-0-2" data-content="男" class="" align="center"><div class="layui-table-cell laytable-cell-1-0-2">  <span style="color: #499C54;">男</span>  </div></td><td data-field="sfage" data-key="1-0-3" class="" align="center"><div class="layui-table-cell laytable-cell-1-0-3">12</div></td><td data-field="sfcode" data-key="1-0-4" class=""><div class="layui-table-cell laytable-cell-1-0-4">410329200007081514</div></td><td data-field="sftel" data-key="1-0-5" class=""><div class="layui-table-cell laytable-cell-1-0-5">12653654896</div></td><td data-field="sfaddress" data-key="1-0-6" class=""><div class="layui-table-cell laytable-cell-1-0-6">辽宁省沈阳市苏家屯区</div></td><td data-field="sfentry" data-key="1-0-7" class=""><div class="layui-table-cell laytable-cell-1-0-7">2021-07-29 04:34:39</div></td><td data-field="sfquit" data-key="1-0-8" class="layui-hide"><div class="layui-table-cell laytable-cell-1-0-8"></div></td><td data-field="dpid" data-key="1-0-9" class="layui-hide"><div class="layui-table-cell laytable-cell-1-0-9"></div></td><td data-field="rid" data-key="1-0-10" class="layui-hide"><div class="layui-table-cell laytable-cell-1-0-10"></div></td><td data-field="position.pttype" data-key="1-0-11" data-content="" class="" align="center"><div class="layui-table-cell laytable-cell-1-0-11">店长</div></td><td data-field="department.dpname" data-key="1-0-12" data-content="" class="" align="center"><div class="layui-table-cell laytable-cell-1-0-12">管理部</div></td><td data-field="branch.brname" data-key="1-0-13" data-content="" class="" align="center"><div class="layui-table-cell laytable-cell-1-0-13">北京朝阳区分店</div></td><td data-field="sfstatus" data-key="1-0-14" data-content="1" class="" align="center"><div class="layui-table-cell laytable-cell-1-0-14">  <button class="layui-btn layui-btn-sm" lay-event="add">任职中</button>  </div></td><td data-field="15" data-key="1-0-15" data-off="true" class="layui-table-col-special"><div class="layui-table-cell laytable-cell-1-0-15"> <button class="layui-btn layui-btn-warm layui-btn-xs" id="pdbranch" lay-event="pdUpdate">平调</button> <a class="layui-btn layui-btn-xs" lay-event="updateStaff">编辑</a>  <button class="layui-btn layui-btn-warm layui-btn-xs" lay-event="upStatus">冻结</button>  <button class="layui-btn layui-btn-danger layui-btn-xs" lay-event="upQuitStatus">解雇</button> </div></td></tr><tr data-index="3" class=""><td data-field="sfid" data-key="1-0-0" class="" align="center"><div class="layui-table-cell laytable-cell-1-0-0">32</div></td><td data-field="sfname" data-key="1-0-1" class="" align="center"><div class="layui-table-cell laytable-cell-1-0-1">老白</div></td><td data-field="sfsex" data-key="1-0-2" data-content="男" class="" align="center"><div class="layui-table-cell laytable-cell-1-0-2">  <span style="color: #499C54;">男</span>  </div></td><td data-field="sfage" data-key="1-0-3" class="" align="center"><div class="layui-table-cell laytable-cell-1-0-3">12</div></td><td data-field="sfcode" data-key="1-0-4" class=""><div class="layui-table-cell laytable-cell-1-0-4">213123659458635456</div></td><td data-field="sftel" data-key="1-0-5" class=""><div class="layui-table-cell laytable-cell-1-0-5">15689654532</div></td><td data-field="sfaddress" data-key="1-0-6" class=""><div class="layui-table-cell laytable-cell-1-0-6">河北省石家庄市藁城区</div></td><td data-field="sfentry" data-key="1-0-7" class=""><div class="layui-table-cell laytable-cell-1-0-7">2021-07-29 09:54:18</div></td><td data-field="sfquit" data-key="1-0-8" class="layui-hide"><div class="layui-table-cell laytable-cell-1-0-8"></div></td><td data-field="dpid" data-key="1-0-9" class="layui-hide"><div class="layui-table-cell laytable-cell-1-0-9"></div></td><td data-field="rid" data-key="1-0-10" class="layui-hide"><div class="layui-table-cell laytable-cell-1-0-10"></div></td><td data-field="position.pttype" data-key="1-0-11" data-content="" class="" align="center"><div class="layui-table-cell laytable-cell-1-0-11">店长</div></td><td data-field="department.dpname" data-key="1-0-12" data-content="" class="" align="center"><div class="layui-table-cell laytable-cell-1-0-12">管理部</div></td><td data-field="branch.brname" data-key="1-0-13" data-content="" class="" align="center"><div class="layui-table-cell laytable-cell-1-0-13">北京二号店</div></td><td data-field="sfstatus" data-key="1-0-14" data-content="1" class="" align="center"><div class="layui-table-cell laytable-cell-1-0-14">  <button class="layui-btn layui-btn-sm" lay-event="add">任职中</button>  </div></td><td data-field="15" data-key="1-0-15" data-off="true" class="layui-table-col-special"><div class="layui-table-cell laytable-cell-1-0-15"> <button class="layui-btn layui-btn-warm layui-btn-xs" id="pdbranch" lay-event="pdUpdate">平调</button> <a class="layui-btn layui-btn-xs" lay-event="updateStaff">编辑</a>  <button class="layui-btn layui-btn-warm layui-btn-xs" lay-event="upStatus">冻结</button>  <button class="layui-btn layui-btn-danger layui-btn-xs" lay-event="upQuitStatus">解雇</button> </div></td></tr><tr data-index="4" class=""><td data-field="sfid" data-key="1-0-0" class="" align="center"><div class="layui-table-cell laytable-cell-1-0-0">37</div></td><td data-field="sfname" data-key="1-0-1" class="" align="center"><div class="layui-table-cell laytable-cell-1-0-1">小王</div></td><td data-field="sfsex" data-key="1-0-2" data-content="男" class="" align="center"><div class="layui-table-cell laytable-cell-1-0-2">  <span style="color: #499C54;">男</span>  </div></td><td data-field="sfage" data-key="1-0-3" class="" align="center"><div class="layui-table-cell laytable-cell-1-0-3">18</div></td><td data-field="sfcode" data-key="1-0-4" class=""><div class="layui-table-cell laytable-cell-1-0-4">413029194551549781</div></td><td data-field="sftel" data-key="1-0-5" class=""><div class="layui-table-cell laytable-cell-1-0-5">18337954615</div></td><td data-field="sfaddress" data-key="1-0-6" class=""><div class="layui-table-cell laytable-cell-1-0-6">辽宁省沈阳市皇姑区</div></td><td data-field="sfentry" data-key="1-0-7" class=""><div class="layui-table-cell laytable-cell-1-0-7">2021-07-28 21:44:45</div></td><td data-field="sfquit" data-key="1-0-8" class="layui-hide"><div class="layui-table-cell laytable-cell-1-0-8"></div></td><td data-field="dpid" data-key="1-0-9" class="layui-hide"><div class="layui-table-cell laytable-cell-1-0-9"></div></td><td data-field="rid" data-key="1-0-10" class="layui-hide"><div class="layui-table-cell laytable-cell-1-0-10"></div></td><td data-field="position.pttype" data-key="1-0-11" data-content="" class="" align="center"><div class="layui-table-cell laytable-cell-1-0-11">店长</div></td><td data-field="department.dpname" data-key="1-0-12" data-content="" class="" align="center"><div class="layui-table-cell laytable-cell-1-0-12">管理部</div></td><td data-field="branch.brname" data-key="1-0-13" data-content="" class="" align="center"><div class="layui-table-cell laytable-cell-1-0-13">总店</div></td><td data-field="sfstatus" data-key="1-0-14" data-content="1" class="" align="center"><div class="layui-table-cell laytable-cell-1-0-14">  <button class="layui-btn layui-btn-sm" lay-event="add">任职中</button>  </div></td><td data-field="15" data-key="1-0-15" data-off="true" class="layui-table-col-special"><div class="layui-table-cell laytable-cell-1-0-15"> <button class="layui-btn layui-btn-warm layui-btn-xs" id="pdbranch" lay-event="pdUpdate">平调</button> <a class="layui-btn layui-btn-xs" lay-event="updateStaff">编辑</a>  <button class="layui-btn layui-btn-warm layui-btn-xs" lay-event="upStatus">冻结</button>  <button class="layui-btn layui-btn-danger layui-btn-xs" lay-event="upQuitStatus">解雇</button> </div></td></tr></tbody></table></div><div class="layui-table-fixed layui-table-fixed-r" style="right: -1px;"><div class="layui-table-header"><table class="layui-table" lay-even="" cellspacing="0" cellpadding="0" border="0"><thead><tr><th data-field="15" data-key="1-0-15" class=" layui-table-col-special"><div class="layui-table-cell laytable-cell-1-0-15"><span>操作</span></div></th></tr></thead></table><div class="layui-table-mend"></div></div><div class="layui-table-body" style="height: 195px;"><table class="layui-table" lay-even="" cellspacing="0" cellpadding="0" border="0"><tbody><tr data-index="0" class=""><td data-field="15" data-key="1-0-15" data-off="true" class="layui-table-col-special"><div class="layui-table-cell laytable-cell-1-0-15"> <button class="layui-btn layui-btn-warm layui-btn-xs" id="pdbranch" lay-event="pdUpdate">平调</button> <a class="layui-btn layui-btn-xs" lay-event="updateStaff">编辑</a>  <button class="layui-btn layui-btn-warm layui-btn-xs" lay-event="upStatus">冻结</button>  <button class="layui-btn layui-btn-danger layui-btn-xs" lay-event="upQuitStatus">解雇</button> </div></td></tr><tr data-index="1" class=""><td data-field="15" data-key="1-0-15" data-off="true" class="layui-table-col-special"><div class="layui-table-cell laytable-cell-1-0-15"> <button class="layui-btn layui-btn-warm layui-btn-xs" id="pdbranch" lay-event="pdUpdate">平调</button> <a class="layui-btn layui-btn-xs" lay-event="updateStaff">编辑</a>  <button class="layui-btn layui-btn-warm layui-btn-xs" lay-event="upStatus">冻结</button>  <button class="layui-btn layui-btn-danger layui-btn-xs" lay-event="upQuitStatus">解雇</button> </div></td></tr><tr data-index="2" class=""><td data-field="15" data-key="1-0-15" data-off="true" class="layui-table-col-special"><div class="layui-table-cell laytable-cell-1-0-15"> <button class="layui-btn layui-btn-warm layui-btn-xs" id="pdbranch" lay-event="pdUpdate">平调</button> <a class="layui-btn layui-btn-xs" lay-event="updateStaff">编辑</a>  <button class="layui-btn layui-btn-warm layui-btn-xs" lay-event="upStatus">冻结</button>  <button class="layui-btn layui-btn-danger layui-btn-xs" lay-event="upQuitStatus">解雇</button> </div></td></tr><tr data-index="3" class=""><td data-field="15" data-key="1-0-15" data-off="true" class="layui-table-col-special"><div class="layui-table-cell laytable-cell-1-0-15"> <button class="layui-btn layui-btn-warm layui-btn-xs" id="pdbranch" lay-event="pdUpdate">平调</button> <a class="layui-btn layui-btn-xs" lay-event="updateStaff">编辑</a>  <button class="layui-btn layui-btn-warm layui-btn-xs" lay-event="upStatus">冻结</button>  <button class="layui-btn layui-btn-danger layui-btn-xs" lay-event="upQuitStatus">解雇</button> </div></td></tr><tr data-index="4" class=""><td data-field="15" data-key="1-0-15" data-off="true" class="layui-table-col-special"><div class="layui-table-cell laytable-cell-1-0-15"> <button class="layui-btn layui-btn-warm layui-btn-xs" id="pdbranch" lay-event="pdUpdate">平调</button> <a class="layui-btn layui-btn-xs" lay-event="updateStaff">编辑</a>  <button class="layui-btn layui-btn-warm layui-btn-xs" lay-event="upStatus">冻结</button>  <button class="layui-btn layui-btn-danger layui-btn-xs" lay-event="upQuitStatus">解雇</button> </div></td></tr></tbody></table></div></div></div><div class="layui-table-page"><div id="layui-table-page1"><div class="layui-box layui-laypage layui-laypage-default" id="layui-laypage-1"><a href="javascript:;" class="layui-laypage-prev layui-disabled" data-page="0"><i class="layui-icon"></i></a><span class="layui-laypage-curr"><em class="layui-laypage-em"></em><em>1</em></span><a href="javascript:;" data-page="2">2</a><a href="javascript:;" class="layui-laypage-next" data-page="2"><i class="layui-icon"></i></a><span class="layui-laypage-skip">到第<input type="text" min="1" value="1" class="layui-input">页<button type="button" class="layui-laypage-btn">确定</button></span><span class="layui-laypage-count">共 8 条</span><span class="layui-laypage-limits"><select lay-ignore=""><option value="5" selected="">5 条/页</option><option value="10">10 条/页</option><option value="15">15 条/页</option><option value="20">20 条/页</option></select></span></div></div></div><style>.laytable-cell-1-0-0{  }.laytable-cell-1-0-1{  }.laytable-cell-1-0-2{  }.laytable-cell-1-0-3{  }.laytable-cell-1-0-4{  }.laytable-cell-1-0-5{  }.laytable-cell-1-0-6{  }.laytable-cell-1-0-7{  }.laytable-cell-1-0-8{  }.laytable-cell-1-0-9{  }.laytable-cell-1-0-10{  }.laytable-cell-1-0-11{  }.laytable-cell-1-0-12{  }.laytable-cell-1-0-13{  }.laytable-cell-1-0-14{  }.laytable-cell-1-0-15{ width: 220px; }</style></div><script type="text/html" id="toolbarDemo"><div class="layui-btn-container"><button class="layui-btn layui-btn-sm" lay-event="add">新增</button><button class="layui-btn layui-btn-sm" lay-event="refresh">刷新</button></div>
</script><script type="text/html" id="barDemo"><button class="layui-btn layui-btn-warm layui-btn-xs" id="pdbranch" lay-event="pdUpdate">平调</button><a class="layui-btn layui-btn-xs" lay-event="updateStaff">编辑</a>{{#  if(d.sfstatus == 1){ }}<button class="layui-btn layui-btn-warm layui-btn-xs" lay-event="upStatus">冻结</button>{{#  } else if(d.sfstatus == 2){ }}<button class="layui-btn layui-btn-normal layui-btn-xs" lay-event="upStatus">解冻</button>{{#  } }}<button class="layui-btn layui-btn-danger layui-btn-xs" lay-event="upQuitStatus">解雇</button>
</script><script type="text/html" id="titleTpl">{{#  if(d.sfstatus == 1){ }}<button class="layui-btn  layui-btn-sm" lay-event="add">任职中</button>{{#  } else if(d.sfstatus == 2){ }}<button class="layui-btn layui-btn-danger layui-btn-sm" lay-event="add">冻结中</button>{{#  } }}
</script>
<script>layui.config({base: '/huawei/./mods/', version: '1.0'});
</script>
<script>//地区三级联动layui.use(['layer', 'form', 'jquery', 'layarea_lc'], function () {var layer = layui.layer, form = layui.form, $ = layui.jquery, layarea_lc = layui.layarea_lc;layarea_lc.render({elem: '#area-picker',data: {province: '--选择省--',city: '--选择市--',county: '--选择区--',},name: "name", change: function (res) {//选择结果}});form.on('select(county-1)', function (data) {var p = $("#province").val();var c = $("#city").val();var a = $("#county").val();$("#address").attr("value", p + c + a);});})
</script>
<script type="text/html" id="sexTpl">{{#  if(d.sfsex === '女'){ }}<span style="color: #F581B1;">{{ d.sfsex }}</span>{{#  } else { }}<span style="color: #499C54;">{{ d.sfsex }}</span>{{#  } }}
</script>
<script>//js方式获取本地时间+1天Date.prototype.toLocaleStringTomorrow = function () {var dateTime = new Date();dateTime = dateTime.setDate(dateTime.getDate() + 1);dateTime = new Date(dateTime);var y = dateTime.getFullYear();var m = dateTime.getMonth() + 1;m = m < 10 ? '0' + m : m;var d = dateTime.getDate();d = d < 10 ? ("0" + d) : d;return y + "-" + m + "-" + d;}layui.use(['table', 'form', 'jquery', 'layer', 'laydate', 'element'], function () {var table = layui.table;var form = layui.form;var $ = layui.jquery;var layer = layui.layer;var laydate = layui.laydate;var element = layui.element;var tomorrowTime = (new Date()).toLocaleStringTomorrow();//日期时间范围$("#test10").focus(function () {$("#test10").val("");})laydate.render({elem: '#test10', type: 'datetime', range: true, max: tomorrowTime});//入职时间laydate.render({elem: '#test11', format: 'yyyy-MM-dd', max: tomorrowTime});//生效function sx() {$("#sub").attr("disabled", true)}//失效function xx() {$("#sub").attr("disabled", false)}//身份证验证$("#sfcode").blur(function () {var aaa2 = $("#sfcode").val();var lastIDNum = aaa2.charAt(17);if (aaa2.length != 18) {layer.msg("身份证号位数有误")} else if (isNaN(parseInt(aaa2.charAt(i))) && lastIDNum.toLowerCase() != 'x') {layer.msg("您输入的身份证号码最后一位不是数字也不是x");}for (i = 0; i < aaa2.length - 1; i++) {if (isNaN(parseInt(aaa2.charAt(i)))) {bbbb();layer.msg("您输入的身份证号码前17位包含有字母");}}})$("#sfage").blur(function () {var cc1 = $("#sfage").val();if(!(/^[0-9]+$/.test( cc1 ))||cc1<18 || cc1 >60){layer.msg("年龄不符合我公司规定呀");sx();}})$("#sftel").blur(function () {var aaa1 = $("#sftel").val();if (aaa1.length != 11) {layer.msg("手机号位数有误")sub = sub + 1;} else if (aaa1.substring(0, 1) != 1) {layer.msg("手机号格式错误");sub = sub + 1;}})$("#sfcode").bind("input", function () {$.post("/huawei/staff/getSfCode", {"sfcode": $("#sfcode").val()}, function (backdata) {if (backdata.code == 2) {sub = sub + 1;layer.msg('身份证号重复呢，请重新填写', {icon: 5})sx();} else {sub = 0;xx();}}, 'json')});/*/!*员手机号验证*!/*/$("#sftel").blur(function () {var phone = $("#sftel").val();$.ajax({url:'/huawei/staff/getTel',type:"POST",data:{"sftel":sftel},async: false,dataType:"json",success:function (result) {if (result.code==1){//手机号不重复xx();}else{//手机号重复layer.msg("手机号重复");sx();}}})})//页面加载完后  填充部门类型的下拉框$.ajax({url: "/huawei/department/getAllDepartment",type: "get",dataType: "json",success: function (dptypes) {//将查到的部门类型信息填充到类型下拉框中$.each(dptypes, function (i, obj) {$("#dpType").append($("<option>").attr("value", obj["dpid"]).text(obj["dpname"]))$("#dpType1").append($("<option>").attr("value", obj["dpid"]).text(obj["dpname"]))$("#searchType").append($("<option>").attr("value", obj["dpid"]).text(obj["dpname"]))})//执行表单的更新渲染方法form.render('select');/*$.each(types,function (i, obj) {})*/}})$.ajax({url: "/huawei/position/getAllPosition2",type: "get",dataType: "json",success: function (pstypes) {//将查到的职位类型信息填充到类型下拉框中$.each(pstypes, function (i, obj) {$("#psType").append($("<option>").attr("value", obj["rid"]).text(obj["pttype"]))$("#psType1").append($("<option>").attr("value", obj["rid"]).text(obj["pttype"]))})//执行表单的更新渲染方法form.render('select');/*$.each(types,function (i, obj) {})*/}})$.ajax({url: "/huawei/branch/getAllBranch",type: "get",dataType: "json",success: function (brtypes) {//将查到的部门类型信息填充到类型下拉框中$.each(brtypes, function (i, obj) {$("#brType").append($("<option>").attr("value", obj["brid"]).text(obj["brname"]))$("#branchType").append($("<option>").attr("value", obj["brid"]).text(obj["brname"]))})//执行表单的更新渲染方法form.render('select');/*$.each(types,function (i, obj) {})*/}})//表单的提交事件//监听事件form.on('submit(formDemo)', function (data) {//向后台发送请求$.ajax({url: '/huawei/staff/addOrUpdStaff',type: "POST",data: data.field,//因为layui 在表单提交时 有时候会自动拦截我们的异步请求//所以此处改位同步请求async: false,dataType: "json",success: function (result) {layer.closeAll();if (result.code == 1) {//重载表格layer.msg(result.msg, {icon: 1});table.reload("test");} else {layer.msg(result.msg, {icon: 5});}}})return false;});form.on('submit(formDemo2)', function (data) {//向后台发送请求$.ajax({url: '/huawei/move/moveStaff',type: "POST",data: data.field,//因为layui 在表单提交时 有时候会自动拦截我们的异步请求//所以此处改位同步请求async: false,dataType: "json",success: function (result) {layer.closeAll();if (result.code == 1) {layer.msg(result.msg, {icon: 1});table.reload("test");} else {layer.msg(result.msg, {icon: 5});}}})return false;});//搜索时，执行表格的重载事件$("#staffSearch").click(function () {table.reload('test', {page: {curr: 1 //重新从第 1 页开始},where: { //设定异步数据接口的额外参数，任意设sfid: $("#sfid").val(),sfname: $("#sfname").val(),dpid: $("#searchType").val(),testtime: $("#test10").val(),brid: $("#branchType").val()}}); //只重载数据})//加载表格的实例table.render({id: "test",//elem element 元素---》表格的容器elem: '#demo'//table标签的id属性值, cellMinWidth: 80, url: '/huawei/staff/getAllStaff' //数据接口, toolbar: '#toolbarDemo' //开启头部工具栏，并为其绑定左侧模板, cols: [[ //表头{field: 'sfid', title: '员工编号', sort: true, align: 'center'}, {field: 'sfname', title: '姓名', align: 'center'}, {field: 'sfsex', title: '性别', align: 'center', sort: true, templet: '#sexTpl'}, {field: 'sfage', title: '年龄', align: 'center'}, {field: 'sfcode', title: '身份证号'}, {field: 'sftel', title: '电话号'}, {field: 'sfaddress', title: '家庭住址'}, {field: 'sfentry', title: '入职时间', sort: true}, {field: 'sfquit', title: '离职时间', hide: true}, {field: 'dpid', title: '部门编号', hide: true}, {field: 'rid', title: '职位编号', hide: true}, {field: 'position.pttype', title: '职位', align: 'center', templet: function (data) {return data.position.pttype;}}, {field: 'department.dpname', title: '部门', align: 'center', templet: function (data) {return data.department.dpname;}}, {field: 'branch.brname', title: '分店', align: 'center', templet: function (data) {return data.branch.brname;}}, {field: 'sfstatus', title: '员工状态', align: 'center', templet: '#titleTpl'}, {fixed: 'right', title: '操作', width: 220, toolbar: '#barDemo'}]],even: true,page: true,//开启分页limit: 5,//默认每页显示的条数limits: [5, 10, 15, 20]//自定义分页条数的选择});//头工具栏事件//toolbar()括号中的参数就是  table容器中 lay-filter属性的值table.on('toolbar(test)', function (obj) {var checkStatus = table.checkStatus(obj.config.id);switch (obj.event) {/*** case后边的具体字符串跟 toolbarDemo中的 lay-event属性值一样*/case 'add':$("#area-picker").css("display", "block");$("#dp").css("display", "block");$("#ps").css("display", "block");$("#sta").css("display", "block");//先执行清空表单的方法，再打开弹出框$("#staffForm")[0].reset();layer.open({type: 1,title: '新增员工信息',content: $("#staffForm"), //这里content是一个普通的Stringarea: ['400px', '640px'],offset: 't'});break;case 'refresh':table.reload('test', {page: {curr: 1 //重新从第 1 页开始}}); //只重载数据break;};});//监听行工具事件tool()括号中的参数就是  table容器中 lay-filter属性的值table.on('tool(test)', function (obj) {//取出当前点击的行的数据var data = obj.data;if (obj.event === 'upStatus') {layer.confirm("真的要解冻/冻结吗？", function (index) {$.ajax({type: 'get', url: '/huawei/staff/updStatus', data: {"sfid": data.sfid, "sfstatus": data.sfstatus}, dataType: 'json', success: function (result) {if (result.code == 1) {layer.msg(result.msg, {icon: 5});table.reload("test");}layer.msg(result.msg, {icon: 1});}})layer.close(index);})} else if (obj.event === 'upQuitStatus') {layer.confirm("确定要炒他鱿鱼吗？", function (index) {$.ajax({type: 'get', url: '/huawei/staff/updQuitStatus', data: {"sfid": data.sfid, "sfstatus": data.sfstatus}, dataType: 'json', success: function (result) {if (result.code == 1) {layer.msg(result.msg, {icon: 5});table.reload("test");}layer.msg(result.msg, {icon: 1});}})layer.close(index);})} else if (obj.event === 'updateStaff') {$("#area-picker").css("display", "none");$("#dp").css("display", "none");$("#ps").css("display", "none");$("#sta").css("display", "none");//先执行清空表单的方法，再打开弹出框$("#staffForm")[0].reset();layer.open({type: 1,title: '修改员工信息',content: $("#staffForm"), //这里content是一个普通的Stringarea: ['400px', '480px'],offset: 't'});//填充表单data.dpid = data.department.dpid;data.rid = data.position.rid;form.val('staffForm', data);} else if (obj.event === 'pdUpdate') {layer.open({type: 1,title: '员工平调',content: $("#branchForm"), //这里content是一个普通的Stringarea: ['400px', '480px'],offset: 't'})form.val('branchForm', {"sfid": data.sfid,"brname": data.branch.brname,"sfname": data.sfname,"dpname": data.department.dpname,"pttype": data.position.pttype,"dpid": "","rid": "","brid": ""});$.ajax({url: "/huawei/branch/getAllNotId",type: "get",dataType: "json",data: {"brid":1},success: function (brtypes) {$("#branchType").empty()$("#branchType").append($("<option>").attr("value", "").text('--请选择分店--'))//将查到的部门类型信息填充到类型下拉框中$.each(brtypes, function (i, obj) {$("#brType1").append($("<option>").attr("value", obj["brid"]).text(obj["brname"]))})//执行表单的更新渲染方法form.render('select');}})}});});
</script></body>
</html>

login.jsp:

<%--Created by IntelliJ IDEA.User: henryDate: 2022/8/29Time: 10:47To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html>
<head><meta charset="utf-8"><title></title><link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/assets/layui/css/layui.css"/><style type="text/css">body{background-image: url("assets/img/bj.jpeg");background-repeat:no-repeat;-moz-background-size:100% 100%;background-attachment:fixed;}.layui-card{background:rgba(256,256,256,0.9);width: 400px;height: 250px;box-shadow: -15px 15px 15px rgba(6, 17, 47, 0.7);position: absolute;top:0px;left:0px;right:0px;bottom:0px;margin:auto;}.layui-card-body{width: 350px;height: 350px;}</style>
</head>
<body>
<div class="layui-card"><div class="layui-card-header layui-bg-blue">欢迎登录</div><div class="layui-card-body"><form class="layui-form" method="post"><div class="layui-form-item"><label class="layui-form-label">用户名</label><div class="layui-input-inline"><input type="text" name="username" required  lay-verify="required" placeholder="请输入用户名" autocomplete="off" class="layui-input" id="username"></div></div><div class="layui-form-item"><label class="layui-form-label">密码</label><div class="layui-input-inline"><input type="password" name="password" required  lay-verify="required" placeholder="请输入密码" autocomplete="off" class="layui-input" id="password"></div></div><div class="layui-form-item"><label class="layui-form-label"></label><div class="layui-input-inline"><button type="button" class="layui-btn" lay-submit="" lay-filter="login">登录</button><button type="reset" class="layui-btn layui-btn-primary">重置</button></div></div></form></div>
</div><script src="${pageContext.request.contextPath}/assets/layui/layui.all.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">layui.use(["form","layer"],function(){var form = layui.form;var layer = layui.layer;form.on("submit(login)",function(data){//layer.msg(JSON.stringify(data.field),{time:2000});//$.ajax({});window.location.href="${pageContext.request.contextPath}/forward/toMain";})})// 防止后退history.pushState(null, null, document.URL);window.addEventListener("popstate", function() {history.pushState(null, null, document.URL);});
</script>
</body>
</html>

main.jsp:

<%--Created by IntelliJ IDEA.User: henryDate: 2022/8/29Time: 10:47To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<!DOCTYPE html>
<html>
<head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"><title>后台主页</title><link rel="stylesheet" href="${pageContext.request.contextPath}/assets/layui/css/layui.css"></head>
<style></style>
<body class="layui-layout-body">
<div class="layui-layout layui-layout-admin"><div class="layui-header"><div class="layui-logo">LayUI后台管理系统</div><ul class="layui-nav layui-layout-right"><li class="layui-nav-item"><a href="javascript:;"><img src="assets/img/tx.jpeg" class="layui-nav-img">张三</a><dl class="layui-nav-child"><dd><a class="site-demo-active" data-url="baseData" data-id="baseData" data-title="基本资料" data-type="ltabAdd"href="#">基本资料</a></dd><dd><a class="site-demo-active" data-url="updPsw" data-id="updPsw" data-title="修改密码" data-type="ltabAdd" href="#">修改密码</a></dd></dl></li><li class="layui-nav-item"><a id="aaa" href="${pageContext.request.contextPath}/user/exit">退出</a></li></ul></div><div class="layui-side layui-bg-black"><div class="layui-side-scroll"><!-- 左侧导航区域（可配合layui已有的垂直导航） --><!-- <ul class="layui-nav layui-nav-tree" lay-filter="test"><c:forEach var="fatherMenu" items="${requestScope.menus}"><li class="layui-nav-item"><a class="" href="javascript:;">${fatherMenu.mname}</a><dl class="layui-nav-child"><c:forEach items="${fatherMenu.sonMenu}" var="sonmenu"><dd><a data-url="${pageContext.request.contextPath}/${sonmenu.murl}" data-id="${sonmenu.mid}" class="site-demo-active"data-title="${sonmenu.mname}" data-type="ltabAdd" href="#">${sonmenu.mname}</a></dd></c:forEach></dl></li></c:forEach></ul> --><ul class="layui-nav layui-nav-tree" lay-filter="test"><li class="layui-nav-item"><a class="" href="javascript:;">人事管理<span class="layui-nav-more"></span></a><dl class="layui-nav-child"><dd><a data-url="${pageContext.request.contextPath}/forward/toEmp" data-id="301" class="site-demo-active" data-title="员工信息" data-type="ltabAdd"href="#">员工信息</a></dd><dd><a data-url="./page1.html" data-id="201" class="site-demo-active" data-title="部门信息" data-type="ltabAdd"href="#">部门信息</a></dd><dd><a data-url="./page3.html" data-id="401" class="site-demo-active" data-title="角色信息" data-type="ltabAdd"href="#">角色信息</a></dd></dl></li><li class="layui-nav-item"><a class="" href="javascript:;">商品管理<span class="layui-nav-more"></span></a><dl class="layui-nav-child"><dd><a data-url="./page4.html" data-id="501" class="site-demo-active" data-title="商品信息" data-type="ltabAdd"href="#">商品信息</a></dd></dl></li><li class="layui-nav-item"><a class="" href="javascript:;">统计管理<span class="layui-nav-more"></span></a><dl class="layui-nav-child"><dd><a data-url="./page5.html" data-id="901" class="site-demo-active" data-title="统计信息" data-type="ltabAdd"href="#">统计信息</a></dd></dl></li><span class="layui-nav-bar" style="top: 202.5px; height: 0px; opacity: 0;"></span></ul></div></div><div class="layui-body" style="background-color: #FFFCF5;"><!-- 内容主体区域 --><div><div id="tabHead" class="layui-tab layui-tab-brief" lay-filter="demo" lay-allowclose="true"><ul class="layui-tab-title"><li class="layui-this layui-icon layui-icon-home" id="home"></li><!--描述：存放tab--></ul><!--描述：tab右键功能--><ul class="rightmenu" class="layui-nav layui-nav-tree" style=" display: none;position: absolute;background: #2F4056;font-family: '微软雅黑';"><li id="yue" style="color: red;cursor:pointer; margin: 10px 10px 10px 10px" data-id="" data-type="closethis"class="layui-nav-item"><a href="#" style="color: #ffffff;cursor:pointer;" data-type="closethis"><span class="layui-badge-dot layui-bg-red"></span> 关闭当前</a><hr class="layui-bg-red"></li><li data-type="closeall" class="layui-nav-item" style="color: red;cursor:pointer;margin: 10px 10px 10px 10px"><a href="#" style="color: #ffffff;cursor:pointer;" data-id="" data-type="closeall"><span class="layui-badge-dot layui-bg-orange"></span> 关闭所有</a><hr class="layui-bg-orange"></li><li data-type="closeothe" class="layui-nav-item" style="color: red;cursor:pointer; margin: 10px 10px 10px 10px"><a href="#" style="color: #ffffff;cursor:pointer;" data-id="" data-type="closeothe"><span class="layui-badge-dot layui-bg-green"></span> 关闭其他</a><hr class="layui-bg-green"></li></ul><div class="layui-tab-content"><div class="layui-tab-item layui-show"><iframe src="./page5.html" frameborder="0" width="95%" height="85%" style="margin-left: 30px"></iframe></div></div></div></div></div><div id="test1" data-id="test" class="layui-panel-window"><input class="layui-table-box" title="9999999" /></div><div class="layui-footer"><!-- 底部固定区域 --><h3>LayUI后台管理系统</h3></div></div>
<script src="${pageContext.request.contextPath}/assets/layui/layui.all.js"></script>
<script>var ids = 0;layui.use('element', function() {var $ = layui.jquery,element = layui.element; //Tab的切换功能，切换事件监听等，需要依赖element模块//触发事件var active = {tabAdd: function() {//新增一个Tab项element.tabAdd('demo', {title: '新选项' + (Math.random() * 1000 | 0) //用于演示,content: '内容' + (Math.random() * 1000 | 0),id: new Date().getTime() //实际使用一般是规定好的id，这里以时间戳模拟下})},tabDelete: function(id) {//删除指定Tab项element.tabDelete('demo', id); //删除：“商品管理”ids = 0;//othis.addClass('layui-btn-disabled'); 添加样式},tabDeleteAll: function(idss) {$.each(idss, function(i, item) {element.tabDelete('demo', item); //删除所有});ids = 0;},tabChange: function(id) {//切换到指定Tab项element.tabChange('demo', id); //切换到：用户管理//tabDelete(id);//ltabAdd();},ltabAdd: function(url, id, name) {//新增一个Tab项 传入三个参数，分别对应其标题，tab页面的地址，还有一个规定的id，是标签中data-id的属性值//关于tabAdd的方法所传入的参数可看layui的开发文档中基础方法部分element.tabAdd('demo', {title: name,content: '<iframe data-frameid="' + id + '" scrolling="auto" frameborder="0" src="' + url +'" style="width:100%;height:99%;" ></iframe>',id: id //规定好的id});CustomRightClick(id); //给tab绑定右击事件FrameWH(); //计算ifram层的大小}};$("#aaa").click(function() {layer.confirm('是否重新登录?', function(index) {top.location.href = "${pageContext.request.contextPath}/login.jsp";});})//当点击有site-demo-active属性的标签时，即左侧菜单栏中内容 ，触发点击事件$('.site-demo-active').on('click', function() {var dataid = $(this);//这时会判断右侧.layui-tab-title属性下的有lay-id属性的li的数目，即已经打开的tab项数目if ($(".layui-tab-title li[lay-id]").length <= 0) {//如果比零小，则直接打开新的tab项active.ltabAdd(dataid.attr("data-url"), dataid.attr("data-id"), dataid.attr("data-title"));} else {//否则判断该tab项是否以及存在var isData = false; //初始化一个标志，为false说明未打开该tab项 为true则说明已有$.each($(".layui-tab-title li[lay-id]"), function() {//如果点击左侧菜单栏所传入的id 在右侧tab项中的lay-id属性可以找到，则说明该tab项已经打开if ($(this).attr("lay-id") == dataid.attr("data-id")) {isData = true;}})if (isData == false) {//标志为false 新增一个tab项active.ltabAdd(dataid.attr("data-url"), dataid.attr("data-id"), dataid.attr("data-title"));}}//最后不管是否新增tab，最后都转到要打开的选项页面上active.tabChange(dataid.attr("data-id"));});//Hash地址的定位var layid = location.hash.replace(/^#test=/, '');element.tabChange('test', layid);element.on('tab(test)', function(elem) {location.hash = 'test=' + $(this).attr('lay-id');});function FrameWH() {// var h = $(window).height() -41- 10 - 60 -10-44 -10;var h = $(document).height() - 41 - 10 - 60 - 10 - 44 - 10 - 12;//alert(h);$("iframe").css("height", h + "px");}$(window).resize(function() {FrameWH();});function CustomRightClick(id) {//取消右键  rightmenu属性开始是隐藏的 ，当右击的时候显示，左击的时候隐藏$('.layui-tab-title li').on('contextmenu', function() {return false;})$('.layui-tab-title,.layui-tab-title li').click(function() {$('.rightmenu').hide();ids = 0;});//桌面点击右击$('.layui-tab-title li').on('contextmenu', function(e) {var popupmenu = $(".rightmenu");ids += 1;if (ids > 1) {return true;}popupmenu.find("li").attr("data-id", id); //在右键菜单中的标签绑定id属性//判断右侧菜单的位置l = ($(document).width() - e.clientX) < popupmenu.width() ? (e.clientX - popupmenu.width()) : e.clientX;t = ($(document).height() - e.clientY) < popupmenu.height() ? (e.clientY - popupmenu.height()) : e.clientY;popupmenu.css({left: l - 190,top: t - 50}).show(); //进行绝对定位//alert("右键菜单")return false;});}$(".rightmenu li").click(function() {//右键菜单中的选项被点击之后，判断type的类型，决定关闭所有还是关闭当前。if ($(this).attr("data-type") == "closethis") {//如果关闭当前，即根据显示右键菜单时所绑定的id，执行tabDeleteactive.tabDelete($(this).attr("data-id"));} else if ($(this).attr("data-type") == "closeall") {var tabtitle = $(".layui-tab-title li");var ids = new Array();$.each(tabtitle, function(i) {ids[i] = $(this).attr("lay-id");})//如果关闭所有 ，即将所有的lay-id放进数组，执行tabDeleteAllactive.tabDeleteAll(ids);} else if ($(this).attr("data-type") == "closeothe") {var id = $(this).attr("data-id");var tabtitle = $(".layui-tab-title li");var ids = new Array();$.each(tabtitle, function(i) {if (id != $(this).attr("lay-id")) {ids[i] = $(this).attr("lay-id");}})active.tabDeleteAll(ids);}$('.rightmenu').hide(); //最后再隐藏右键菜单})});
</script>
</body>
</html>

项目框架：登录跳转页面相关推荐

  1. element-ui框架下通过SockJS、stompjs实现PC端扫码登录跳转页面（二）

    上一篇介绍了PC扫码登录通过微信接口获取不限制的小程序码,此篇介绍剩下的内容 element-ui框架下通过SockJS.stompjs实现PC端扫码登录跳转页面(一) 2.已扫描待确认阶段 流程图中 ...

  2. java登录跳转页面

    java登录跳转页面 java文件的编辑方式,任意文本加.java后缀即可,一个java文件只能有一个主类,用public调用,如果要打包成程序包,每个文件前先声明包命,如com.QQH,调试单个文件 ...

  3. JavaScript 登录跳转页面效果

    要求: 有两个页面:index.html和login.html.在login.html页面中点击登录,会跳转到index.html,并将输入的用户名传递到index.html. 实现效果: 实现思路: ...

  4. vue 页面闪烁的问题_vue项目解决路由跳转页面闪烁问题(过度动画)

    1.问题描述: 页面跳转是出现卡顿感,闪烁感明显,降低用户体验. 2.解决方案: 利用动画缓解页面跳转闪烁感 3.具体实现 export default { data() { return {}; } ...

  5. php表单登录跳转页面跳转页面,form表单页面跳转方式提交练习

    该楼层疑似违规已被系统折叠 隐藏此楼查看此楼 //form表单提交练习 /*新建一个form.html网页用来书写前端HTML表单*/ 表单提交练习 姓名: 年龄: 电话: 地址: QQ: 自我评价: ...

  6. 2.vue3医疗在线问诊项目 - _登录模块 ==＞ 代码片段、css变量主题定制、cp-nav-bar组件封装、svg打包精灵图插件、cp-icon组件封装、表单校验、密码登录、短信验证码登录及两者

    2.医疗在线问诊项目 - _登录模块 ==> 代码片段.css变量主题定制.cp-nav-bar组件封装.svg打包精灵图插件.cp-icon组件封装.表单校验.密码登录.短信验证码登录及两者的 ...

  7. 小兔鲜注册页面验证、阶段案例（登录、首页页面）（重点）、小兔鲜放大镜效果——DOM

    目录 1. 小兔鲜注册页面验证 2. 阶段案例(登录.首页页面)(重点) 3. 小兔鲜放大镜效果 1. 小兔鲜注册页面验证 验证码模块有个小问题: 连续点击获取验证码会导致触发多次计时器,会导致计时出 ...

  8. 跳转页面时报错 java.lang.NumberFormatException: null

    问题描述: 在测试项目时,跳转页面查看一级分类下的书籍信息,发现页面报错500,提示信息为: java.lang.NumberFormatException: null 报错页面的URL为: http ...

  9. 从0开始写Vue项目-Vue页面主体布局和登录、注册页面

    1.从0开始写Vue项目-环境和项目搭建_慕言要努力的博客-CSDN博客 2. 从0开始写Vue项目-Vue2集成Element-ui和后台主体框架搭建_慕言要努力的博客-CSDN博客 一.主体布局 ...

最新文章

  1. 通用解题法——回溯算法（理解+练习）
  2. python 正则表达式 前瞻_正则表达式 For Python
  3. 如何使用Redux-saga和ReactDnD测试React和Redux（哇！）
  4. SAP WM LQ02 为供应商寄售库存去K的时候，如果有Open TO单，则不能成功为物料去K？
  5. Android面试真题解析火爆全网，薪资翻倍
  6. vue双向绑定原理源码解析
  7. iOS本地化项目上传到gitHub
  8. ACL 2020 | 多编码器是否能够捕获篇章级信息？
  9. CDH集群调优：内存、Vcores和DRF
  10. 如何设置Linux时区为东八区
  11. (转)J2ME中随机数字的生成
  12. Oracle修改字段类型方法总结
  13. 整理了 40 多套 Java 完整实战项目，各个精品！
  14. FPGA跨时钟域打两拍和三拍问题
  15. secureCRT无限循环脚本
  16. 怎样用python提取英文字母_python如何获取一次获取26个英文字母
  17. 关于517coding的10月月赛
  18. 送给去IT培训机构的猿们的一些毒鸡汤
  19. 大头儿子和小头爸爸的战斗--java字符和字符串
  20. lnmp的一键部署（脚本）

热门文章

  1. 传统图像处理（滤波算子、边缘、角点、特征提取）算法大全
  2. php动漫随机图源码,随机图片API源码
  3. 百度昆仑芯片独立背后，或向汽车芯片发起进军
  4. 图像二值化分割阈值的算法——OTSU
  5. 秉持H2H理念，58同城如何在移动互联网时代开拓市场
  6. [学习笔记] Matrix tree定理
  7. rpm -qa|grep xxx 命令详解
  8. JavaScript中的Date日期、String字符串、Array数组、Math提供对数据的数学计算
  9. php开发宝典例8.2,PHP学习宝典-第八章(二)
  10. 修改Windows的git bash的主题（样式）