众筹系统RBAC权限项目
0 推荐视频：尚硅谷RBAC权限实战
链接：https://pan.baidu.com/s/1fJIiEhG-NCfgWhn-eyRtZA 提取码：dqvy 在第4部分，课件也在里面。课件中没有数据库sql，本文添加。代码就不怎么贴了，网盘里都有。
一 项目结构划分：
项目结构划分：Manager管理网站，portal门户网站，共同的项目common，所有的项目依赖关系parent。不能把manager和portal打包成war包，因为我们要当成整体运行，只运行一个war包，所以需要通过web的war包实现形成一个整体。这5个项目都作为maven项目创建，依赖关系可以通过maven的pom.xml体现。
1.1 parent
parent是一个maven项目。作为父项目，只做管理，不做开发，打包方式是pom方式。文件结构很简单。parent项目中不存放任何代码，只是管理多个项目之间公共的依赖。
parent-pom文件如下。可以在其中设置log、spring、jdbc等内容，以便后续项目继承parent后可以直接使用，无需再配置。也可以在后面最后的web项目的liabrary中看到这些内容。
主要是有个pom.xml，配置在这里的好处是版本变化时只需改一处。
<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>com.atguigu</groupId>
<artifactId>atcrowdfunding-parent</artifactId>
<version>0.0.1-SNAPSHOT</version>
<packaging>pom</packaging>
<dependencies>
<dependency>
<groupId>javax.servlet</groupId>
<artifactId>servlet-api</artifactId>
<version>2.5</version>
</dependency>
<dependency>
<groupId>javax.servlet.jsp</groupId>
<artifactId>jsp-api</artifactId>
<version>2.1.3-b06</version>
</dependency>
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-core</artifactId>
<version>4.0.0.RELEASE</version>
</dependency>
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-context</artifactId>
<version>4.0.0.RELEASE</version>
</dependency>
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-jdbc</artifactId>
<version>4.0.0.RELEASE</version>
</dependency>
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-orm</artifactId>
<version>4.0.0.RELEASE</version>
</dependency>
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-web</artifactId>
<version>4.0.0.RELEASE</version>
</dependency>
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-webmvc</artifactId>
<version>4.0.0.RELEASE</version>
</dependency>
<dependency>
<groupId>com.mchange</groupId>
<artifactId>c3p0</artifactId>
<version>0.9.2</version>
</dependency>
<dependency>
<groupId>cglib</groupId>
<artifactId>cglib</artifactId>
<version>2.2</version>
</dependency>
<dependency>
<groupId>org.aspectj</groupId>
<artifactId>aspectjweaver</artifactId>
<version>1.6.8</version>
</dependency>
<!-- Spring整合MyBatis -->
<!-- MyBatis中延迟加载需要使用Cglib -->
<!-- https://mvnrepository.com/artifact/org.mybatis/mybatis -->
<dependency>
<groupId>org.mybatis</groupId>
<artifactId>mybatis</artifactId>
<version>3.2.8</version>
</dependency>
<dependency>
<groupId>org.mybatis</groupId>
<artifactId>mybatis-spring</artifactId>
<version>1.2.2</version>
</dependency>
<!-- 控制日志输出：结合log4j -->
<dependency>
<groupId>log4j</groupId>
<artifactId>log4j</artifactId>
<version>1.2.17</version>
</dependency>
<dependency>
<groupId>org.slf4j</groupId>
<artifactId>slf4j-api</artifactId>
<version>1.7.7</version>
</dependency>
<dependency>
<groupId>org.slf4j</groupId>
<artifactId>slf4j-log4j12</artifactId>
<version>1.7.7</version>
</dependency>
<dependency>
<groupId>mysql</groupId>
<artifactId>mysql-connector-java</artifactId>
<version>5.1.37</version>
</dependency>
<dependency>
<groupId>jstl</groupId>
<artifactId>jstl</artifactId>
<version>1.2</version>
</dependency>
<!-- ********其他****************************** -->
<!-- Ehcache二级缓存 -->
<dependency>
<groupId>net.sf.ehcache</groupId>
<artifactId>ehcache</artifactId>
<version>1.6.2</version>
</dependency>
<!-- 石英调度 - 开始 -->
<dependency>
<groupId>org.quartz-scheduler</groupId>
<artifactId>quartz</artifactId>
<version>1.8.5</version>
</dependency>
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-context-support</artifactId>
<version>4.0.0.RELEASE</version>
</dependency>
<dependency>
<groupId>commons-collections</groupId>
<artifactId>commons-collections</artifactId>
<version>3.1</version>
</dependency>
<!-- 石英调度 - 结束 -->
<dependency>
<groupId>org.codehaus.jackson</groupId>
<artifactId>jackson-mapper-asl</artifactId>
<version>1.9.2</version>
</dependency>
<dependency>
<groupId>org.apache.poi</groupId>
<artifactId>poi</artifactId>
<version>3.9</version>
</dependency>
<dependency>
<groupId>org.jfree</groupId>
<artifactId>jfreechart</artifactId>
<version>1.0.19</version>
</dependency>
<dependency>
<groupId>commons-fileupload</groupId>
<artifactId>commons-fileupload</artifactId>
<version>1.3.1</version>
</dependency>
<dependency>
<groupId>org.freemarker</groupId>
<artifactId>freemarker</artifactId>
<version>2.3.19</version>
</dependency>
<dependency>
<groupId>org.activiti</groupId>
<artifactId>activiti-engine</artifactId>
<version>5.15.1</version>
</dependency>
<dependency>
<groupId>org.activiti</groupId>
<artifactId>activiti-spring</artifactId>
<version>5.15.1</version>
</dependency>
<dependency>
<groupId>org.apache.commons</groupId>
<artifactId>commons-email</artifactId>
<version>1.3.1</version>
</dependency>
<dependency>
<groupId>org.activiti</groupId>
<artifactId>activiti-explorer</artifactId>
<version>5.15.1</version>
<exclusions>
<exclusion>
<artifactId>groovy-all</artifactId>
<groupId>org.codehaus.groovy</groupId>
</exclusion>
</exclusions>
</dependency>
</dependencies>
</project>
这样后面在使用parent标签可以包含这些依赖。但是如果有的项目想用一部分依赖，另外一部分不需要，则可以在parent项目中用<dependencyManagement></dependencyManagement>标签指定，然后需要使用的项目写<dependency><group><artifactId>即可，不需要写版本号
在子项目B中，通过引用的项目A，可以使用A项目中中的依赖，但是不能调用A项目中自己定义的类和方法；子项目C中通过依赖的A,两者却都可以调用。
1.2 common
common是一个共同性的项目。有一些共同的代码，所以打包方式是jar包。创建maven项目。文件结构比parent多一些。主要是有一些bean、spring-context.xml、spring-mvc.xml、mybatis-config.xml
其中bean内容可以简单概括为：（这里我把get set方法删去了，应该加上）
public class User {//用户
private Integer id;
private String username;
private String loginacct;
private String userpswd;
private String email;
private String createtime;
}
public class Role {//角色
private Integer id;
private String name;
}
public class Permission {//权限
private Integer id;
private String name;
private String url;
private Integer pid;
private boolean open = true;
private boolean checked = false;
private String icon;
private List<Permission> children = new ArrayList<Permission>();
}
public class Page<T> {
private List<T> datas;
private int pageno;
private int totalno;
private int totalsize;
}
public class AJAXResult {//操作是否成功与返回的数据
private boolean success;
private Object data;
}
pom.xml
<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>
<artifactId>atcrowdfunding-common</artifactId>
<!-- parent标签代表继承，但只继承依赖，不继承java类 -->
<parent>
<groupId>com.atguigu</groupId>
<artifactId>atcrowdfunding-parent</artifactId>
<version>0.0.1-SNAPSHOT</version>
</parent>
</project>
1.3 manager
打包方式是jar包。
主要是有控制层，业务层，持久层、sql映射文件xml
<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>com.atguigu</groupId>
<artifactId>atcrowdfunding-manager</artifactId>
<version>0.0.1-SNAPSHOT</version>
<dependencies>
<dependency>
<groupId>com.atguigu</groupId>
<artifactId>atcrowdfunding-common</artifactId>
<version>0.0.1-SNAPSHOT</version>
</dependency>
</dependencies>
</project>
1.4 portal
打包方式是jar包
<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>com.atguigu</groupId>
<artifactId>atcrowdfunding-portal</artifactId>
<version>0.0.1-SNAPSHOT</version>
<dependencies>
<dependency>
<groupId>com.atguigu</groupId>
<artifactId>atcrowdfunding-common</artifactId>
<version>0.0.1-SNAPSHOT</version>
</dependency>
</dependencies>
</project>
1.5 web
打包方式是war。此时创建maven项目结束后web项目会报错。因为web项目中会有一个web.xml文件，但我们创建maven后web.xml并没有被创建。解决方式是：右键项目、Project Facets–>去掉勾选Dynamic Web Module，点击应用，再勾选Dynamic Web Module，下方出现Further configuration availabble，点击它，会让填写上下文根地址+上下文目录，将第二个content directory填写为/src/main/webapp。再点应用。此时就不报错了，也在/src/main/webapp下生成了web.xml。
因为web的pom.xml需要关联manager和portal项目，所以打开pom.xml后点击下方的dependencies，搜索后可以直接出现，编译器就自动写好到xml中。也可以直接在pom.xml中手写。
WEB-INF中有一些JSP的view
- controller:testController.java映射的是
test/开头的页面。测试springmvc的框架，实际没什么用途。 - dispatcherController：与登录相关的控制器，没有与登录无关的其余的控制器
- LoginInterceptor：
- ServerStartupListener：
APP_PATH路径设置到application域中，以让css和js可以在JSP中使用绝对路径。
<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>com.atguigu</groupId>
<artifactId>atcrowdfunding-web</artifactId>
<version>0.0.1-SNAPSHOT</version>
<packaging>war</packaging>
<dependencies>
<dependency>
<groupId>com.atguigu</groupId>
<artifactId>atcrowdfunding-manager</artifactId>
<version>0.0.1-SNAPSHOT</version>
</dependency>
<dependency>
<groupId>com.atguigu</groupId>
<artifactId>atcrowdfunding-portal</artifactId>
<version>0.0.1-SNAPSHOT</version>
</dependency>
</dependencies>
</project>
二 ssm框架解释：
主要解释web.xml、springContext.xml、springmvc.xml、mybatis-config.xml
建议每句都记录。我讲这部分内容写在别的文档中了。
三 权限模型
Role-Based Access Control (RBAC)
不同的角色拥有不太的权限，只要你充当了某个角色，你就拥有了相对应的功能。
四 功能实现
权限模型介绍：
多对多：双向一对多。学生与课程的案例。
需要三张表，增加一个关系表。把外键放到多的一方表中
studentID courseID
所以在权限限制中，我们有用户表、角色表、权限表 三张基本表。还有两张关系表是用户角色关联表、角色权限关联表。
此外还有很多表。
RBAC的四个级别
RBAC0
RBAC核心模型，其他的级别都建立在该级别的基础上。
一个用户最终用于的许可=这个用户拥有的角色对应的许可的合集。
一个用户可以有多个角色。权限是并集。
RBAC1
基于RBAC0模型，进行了角色的分层，也就是说角色上有了上下级的区别。有些角色是互斥的。
需要的功能
增加编辑删除用户。
分页查询。
控制器user controller;
@Controller
@RequestMapping("/user")
public class UserController{
@RequestMapping("/index")
public String index(){
}
}
相对路径和绝对路径
当jsp文件变了地方的时候，如果写的css和js文件是相对路径，很可能路径就不对了。
相对路径
- 不以
/开头：默认情况下，相对路径的基准路径是以当前资源的访问路径为基准。所以我们看到的jsp并不是我们的当前资源。而是访问的路径。 - 路径以
/开头，表示的是特殊的相对路径，在不同的场景中，相对的位置会发生变化。- 前台路径：浏览器解析的。
<a href="">、<img src="">。/相对服务器的根。即http://localhost:8080 - 后台路径：服务器解析的。
forward、xml中路径。/相对web应用的根。即http://localhost:8080/u2s
- 前台路径：浏览器解析的。
http://localhost:8080/u2s/test/test.html
EL表达式的对象不对不会报错，但方法不对会报错
为了防止基准路径出错，可以写一个监听器。实现ServletContextListener接口。
public class ServerStartupListener implements ServletContextListener{
public void contextInitialized(ServletContextEvent sce){
// 将web应用名称（路径）保存到application范围中
ServletContext application = sre.getServletContext();
String path = application.getContextPath();
application.setAttribute("APP_PATH",path);
}
public void contextDestroyed(ServletContextEvent sce){
}
}
然后在web.xml中配置监听器
<listener>
<listener-class>ServerStartupListener全类名</listener-class>
</listener>
但只适用于JSP中。
需要的功能：实现用户的增删分页查询。
分页查询
package com.atguigu.atcrowdfunding.controller;
@Controller
@RequestMapping("/user")
public class UserController {
@ResponseBody
@RequestMapping("/pageQuery")
public Object pageQuery( String queryText, Integer pageno, Integer pagesize ) {
AJAXResult result = new AJAXResult();
try {
// 分页查询
Map<String, Object> map = new HashMap<String, Object>();
map.put("start", (pageno-1)*pagesize);
map.put("size", pagesize);
map.put("queryText", queryText);
List<User> users = userService.pageQueryData( map );
// 当前页码
// 总的数据条数
int totalsize = userService.pageQueryCount( map );
// 最大页码（总页码）
int totalno = 0;
if ( totalsize % pagesize == 0 ) {
totalno = totalsize / pagesize;
} else {
totalno = totalsize / pagesize + 1;
}
// 分页对象
Page<User> userPage = new Page<User>();
userPage.setDatas(users);
userPage.setTotalno(totalno);
userPage.setTotalsize(totalsize);
userPage.setPageno(pageno);
result.setData(userPage);
result.setSuccess(true);
} catch ( Exception e ) {
e.printStackTrace();
result.setSuccess(false);
}
return result;
}
/**
* 用户首页
* @return
*/
@RequestMapping("/index1")
public String index1(
@RequestParam(required=false, defaultValue="1")Integer pageno,
@RequestParam(required=false, defaultValue="2")Integer pagesize,
Model model ) {
// 传进来的是页码和页面大小。sql中是开始位置和大小，所以需要转换
// 分页查询
// limit start, size
Map<String, Object> map = new HashMap<String, Object>();
map.put("start", (pageno-1)*pagesize);
map.put("size", pagesize);
List<User> users = userService.pageQueryData( map );
model.addAttribute("users", users);
// 当前页码
model.addAttribute("pageno", pageno);
// 总的数据条数
int totalsize = userService.pageQueryCount( map );
// 最大页码（总页码）
int totalno = 0;
if ( totalsize % pagesize == 0 ) {
totalno = totalsize / pagesize;
} else {
totalno = totalsize / pagesize + 1;
}
model.addAttribute("totalno", totalno);
return "user/index";
}
}
总：
2 crowdfunding-common
这里主要是pojo/bean
public class User {
private Integer id;
private String username;
private String loginacct;
private String userpswd;
private String email;
private String createtime;
}
public class Role {
private Integer id;
private String name;
}
public class Permission {
private Integer id;
private String name;
private String url;
private Integer pid;
private boolean open = true;
private boolean checked = false;
private String icon;
private List<Permission> children = new ArrayList<Permission>();
}
public class Page<T> {
private List<T> datas;//所在页码的数据
private int pageno;//页码
private int totalno;//总页码
private int totalsize;//总大小
}
public class AJAXResult {//操作是否成功与返回的数据
private boolean success;
private Object data;
}
3 crowdfunding-manager
控制层
UserController.java
package com.atguigu.atcrowdfunding.controller;
import java.text.SimpleDateFormat;
import java.util.ArrayList;
import java.util.Date;
import java.util.HashMap;
import java.util.List;
import java.util.Map;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.ResponseBody;
import com.atguigu.atcrowdfunding.bean.AJAXResult;
import com.atguigu.atcrowdfunding.bean.Page;
import com.atguigu.atcrowdfunding.bean.Role;
import com.atguigu.atcrowdfunding.bean.User;
import com.atguigu.atcrowdfunding.service.RoleService;
import com.atguigu.atcrowdfunding.service.UserService;
@Controller
@RequestMapping("/user")
public class UserController {
@Autowired
private UserService userService;//关联用户service层
@Autowired
private RoleService roleService;
@ResponseBody
@RequestMapping("/deletes")
public Object deletes( Integer[] userid ) {//删除全部选中的
AJAXResult result = new AJAXResult();
try {
Map<String, Object> map = new HashMap<String, Object>();
map.put("userids", userid);
userService.deleteUsers(map);
result.setSuccess(true);
} catch ( Exception e ) {
e.printStackTrace();
result.setSuccess(false);
}
return result;
}
@ResponseBody
@RequestMapping("/delete")
public Object delete( Integer id ) {
AJAXResult result = new AJAXResult();
try {
userService.deleteUserById(id);
result.setSuccess(true);
} catch ( Exception e ) {
e.printStackTrace();
result.setSuccess(false);
}
return result;
}
@ResponseBody
@RequestMapping("/update")//提交编辑内容
public Object update( User user ) {
AJAXResult result = new AJAXResult();
try {
userService.updateUser(user);
result.setSuccess(true);
} catch ( Exception e ) {
e.printStackTrace();
result.setSuccess(false);
}
return result;
}
@RequestMapping("/edit")// 编辑按钮
public String edit( Integer id, Model model ) {
User user = userService.queryById(id);
model.addAttribute("user", user);
return "user/edit";
}
@RequestMapping("/assign")//查询数据库中用户的角色(未分配/已分配)信息后显示
public String assign( Integer id, Model model ) {
User user = userService.queryById(id);
model.addAttribute("user", user);
List<Role> roles = roleService.queryAll();
List<Role> assingedRoles = new ArrayList<Role>();
List<Role> unassignRoles = new ArrayList<Role>();
// 获取关系表的数据
List<Integer> roleids = userService.queryRoleidsByUserid(id);//通过id查出角色
for ( Role role : roles ) {
if ( roleids.contains(role.getId()) ) {
assingedRoles.add(role);
} else {
unassignRoles.add(role);
}
}
model.addAttribute("assingedRoles", assingedRoles);
model.addAttribute("unassignRoles", unassignRoles);
return "user/assign";
}
@ResponseBody
@RequestMapping("/doAssign")//修改用户的角色信息(增加)
public Object doAssign( Integer userid, Integer[] unassignroleids ) {
AJAXResult result = new AJAXResult();
try {
// 增加关系表数据
Map<String, Object> map = new HashMap<String, Object>();
map.put("userid", userid);
map.put("roleids", unassignroleids);
userService.insertUserRoles(map);
result.setSuccess(true);
} catch ( Exception e ) {
e.printStackTrace();
result.setSuccess(false);
}
return result;
}
@ResponseBody
@RequestMapping("/dounAssign")//取消分配角色
public Object dounAssign( Integer userid, Integer[] assignroleids ) {
AJAXResult result = new AJAXResult();
try {
// 删除关系表数据
Map<String, Object> map = new HashMap<String, Object>();
map.put("userid", userid);
map.put("roleids", assignroleids);
userService.deleteUserRoles(map);
result.setSuccess(true);
} catch ( Exception e ) {
e.printStackTrace();
result.setSuccess(false);
}
return result;
}
@ResponseBody
@RequestMapping("/insert")//填写后提交//添加用户并且即时显示该条数据给用户//按时间排序
public Object insert( User user ) {
AJAXResult result = new AJAXResult();
try {
SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss");// 用来格式化日期的类
user.setCreatetime(sdf.format(new Date()));
user.setUserpswd("123456");//新增用户的默认密码
userService.insertUser(user);
result.setSuccess(true);
} catch ( Exception e ) {
e.printStackTrace();
result.setSuccess(false);
}
return result;//新增用户后应该让用户马上看到刚创建的
}
@RequestMapping("/add")//新增用户页面
public String add() {
return "user/add";
}
@ResponseBody
@RequestMapping("/pageQuery")
public Object pageQuery( String queryText, Integer pageno, Integer pagesize ) {
AJAXResult result = new AJAXResult();
try {
// 分页查询
Map<String, Object> map = new HashMap<String, Object>();
map.put("start", (pageno-1)*pagesize);
map.put("size", pagesize);
map.put("queryText", queryText);//模糊查询文本
List<User> users = userService.pageQueryData( map );
// 当前页码
// 总的数据条数
int totalsize = userService.pageQueryCount( map );
// 最大页码（总页码）
int totalno = 0;
if ( totalsize % pagesize == 0 ) {
totalno = totalsize / pagesize;
} else {
totalno = totalsize / pagesize + 1;
}
// 分页对象
Page<User> userPage = new Page<User>();
userPage.setDatas(users);
userPage.setTotalno(totalno);
userPage.setTotalsize(totalsize);
userPage.setPageno(pageno);
result.setData(userPage);
result.setSuccess(true);
} catch ( Exception e ) {
e.printStackTrace();
result.setSuccess(false);
}
return result;
}
@RequestMapping("/index")
public String index() {
return "user/index";
}
@RequestMapping("/index1")//分页查询
public String index1(
@RequestParam(required=false, defaultValue="1")Integer pageno, //第一页的时候是没有传参数的，所以设置默认值为1页
@RequestParam(required=false, defaultValue="2")Integer pagesize,
Model model ) {
// 分页查询 // 将页码转换成起始位置。
// limit start, size
Map<String, Object> map = new HashMap<String, Object>();
map.put("start", (pageno-1)*pagesize);
map.put("size", pagesize);
List<User> users = userService.pageQueryData( map );
model.addAttribute("users", users);//将返回结果保存到model中
// 当前页码
model.addAttribute("pageno", pageno);
// 总的数据条数
int totalsize = userService.pageQueryCount( map );
// 最大页码（总页码）
int totalno = 0;
if ( totalsize % pagesize == 0 ) {
totalno = totalsize / pagesize;
} else {
totalno = totalsize / pagesize + 1;
}
model.addAttribute("totalno", totalno);
return "user/index";
}
}
RoleController.java
package com.atguigu.atcrowdfunding.controller;
import java.util.HashMap;
import java.util.List;
import java.util.Map;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;
import com.atguigu.atcrowdfunding.bean.AJAXResult;
import com.atguigu.atcrowdfunding.bean.Page;
import com.atguigu.atcrowdfunding.bean.Role;
import com.atguigu.atcrowdfunding.service.RoleService;
@Controller
@RequestMapping("/role")
public class RoleController {
@Autowired
private RoleService roleService;
@ResponseBody
@RequestMapping("/pageQuery")//传递模糊查询内容，页码，页面大小
public Object pageQuery( String queryText, Integer pageno, Integer pagesize ) {
AJAXResult result = new AJAXResult();
try {
// 分页查询
Map<String, Object> map = new HashMap<String, Object>();
map.put("start", (pageno-1)*pagesize);
map.put("size", pagesize);
map.put("queryText", queryText);
List<Role> roles = roleService.pageQueryData( map );
// 当前页码
// 总的数据条数
int totalsize = roleService.pageQueryCount( map );
// 最大页码（总页码）
int totalno = 0;
if ( totalsize % pagesize == 0 ) {
totalno = totalsize / pagesize;
} else {
totalno = totalsize / pagesize + 1;
}
// 分页对象
Page<Role> rolePage = new Page<Role>();
rolePage.setDatas(roles);
rolePage.setTotalno(totalno);
rolePage.setTotalsize(totalsize);
rolePage.setPageno(pageno);
result.setData(rolePage);
result.setSuccess(true);
} catch ( Exception e ) {
e.printStackTrace();
result.setSuccess(false);
}
return result;
}
@ResponseBody
@RequestMapping("/doAssign")
public Object doAssign( Integer roleid, Integer[] permissionids ) {
AJAXResult result = new AJAXResult();
try {
Map<String, Object> paramMap = new HashMap<String, Object>();
paramMap.put("roleid", roleid);
paramMap.put("permissionids", permissionids);
roleService.insertRolePermission(paramMap);
result.setSuccess(true);
} catch ( Exception e ) {
e.printStackTrace();
result.setSuccess(false);
}
return result;
}
@RequestMapping("/assign")
public String assign() {
return "role/assign";
}
@RequestMapping("/index")
public String index() {
return "role/index";
}
}
PermissionController.java
package com.atguigu.atcrowdfunding.controller;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;
import com.atguigu.atcrowdfunding.bean.AJAXResult;
import com.atguigu.atcrowdfunding.bean.Permission;
import com.atguigu.atcrowdfunding.service.PermissionService;
@Controller
@RequestMapping("/permission")
public class PermissionController {
@Autowired
private PermissionService permissionService;
@ResponseBody
@RequestMapping("/delete")
public Object delete( Permission permission ) {
AJAXResult result = new AJAXResult();
try {
permissionService.deletePermission(permission);
result.setSuccess(true);
} catch ( Exception e ) {
e.printStackTrace();
result.setSuccess(false);
}
return result;
}
@ResponseBody
@RequestMapping("/update")
public Object update( Permission permission ) {
AJAXResult result = new AJAXResult();
try {
permissionService.updatePermission(permission);
result.setSuccess(true);
} catch ( Exception e ) {
e.printStackTrace();
result.setSuccess(false);
}
return result;
}
@ResponseBody
@RequestMapping("/insert")
public Object insert( Permission permission ) {
AJAXResult result = new AJAXResult();
try {
permissionService.insertPermission(permission);
result.setSuccess(true);
} catch ( Exception e ) {
e.printStackTrace();
result.setSuccess(false);
}
return result;
}
@RequestMapping("/add")
public String add() {
return "permission/add";
}
@RequestMapping("/edit")
public String edit( Integer id, Model model ) {
Permission permission = permissionService.queryById(id);
model.addAttribute("permission", permission);
return "permission/edit";
}
@RequestMapping("/index")
public String index() {
return "permission/index";
}
@ResponseBody
@RequestMapping("/loadAssignData")
public Object loadAssignData( Integer roleid ) {
List<Permission> permissions = new ArrayList<Permission>();
List<Permission> ps = permissionService.queryAll();
// 获取当前角色已经分配的许可信息
List<Integer> permissionids = permissionService.queryPermissionidsByRoleid(roleid);
Map<Integer, Permission> permissionMap = new HashMap<Integer, Permission>();
for (Permission p : ps) {
if ( permissionids.contains(p.getId()) ) {
p.setChecked(true);
} else {
p.setChecked(false);
}
permissionMap.put(p.getId(), p);
}
for ( Permission p : ps ) {
Permission child = p;
if ( child.getPid() == 0 ) {
permissions.add(p);
} else {
Permission parent = permissionMap.get(child.getPid());
parent.getChildren().add(child);
}
}
return permissions;
}
@ResponseBody
@RequestMapping("/loadData")
public Object loadData() {
List<Permission> permissions = new ArrayList<Permission>();
// Permission root = new Permission();
// root.setName("顶级节点");
//
// Permission child = new Permission();
// child.setName("子节点");
//
// root.getChildren().add(child);
// permissions.add(root);
// 读取树形结构数据
/*
Permission root = permissionService.queryRootPermission();
List<Permission> childPermissions = permissionService.queryChildPermissions(root.getId());
for ( Permission childPermission : childPermissions ) {
List<Permission> childChildPermissions = permissionService.queryChildPermissions(childPermission.getId());
childPermission.setChildren(childChildPermissions);
}
root.setChildren(childPermissions);
permissions.add(root);
*/
// 递归查询数据
/*
Permission parent = new Permission();
parent.setId(0);
queryChildPermissions(parent);
//permissions.
return parent.getChildren();
*/
// 查询所有的许可数据
List<Permission> ps = permissionService.queryAll();
/*
for ( Permission p : ps ) {
// 子节点
Permission child = p;
if ( p.getPid() == 0 ) {
permissions.add(p);
} else {
for ( Permission innerPermission : ps ) {
if ( child.getPid().equals(innerPermission.getId()) ) {
// 父节点
Permission parent = innerPermission;
// 组合父子节点的关系
parent.getChildren().add(child);
break;
}
}
}
}
*/
Map<Integer, Permission> permissionMap = new HashMap<Integer, Permission>();
for (Permission p : ps) {
permissionMap.put(p.getId(), p);
}
for ( Permission p : ps ) {
Permission child = p;
if ( child.getPid() == 0 ) {
permissions.add(p);
} else {
Permission parent = permissionMap.get(child.getPid());
parent.getChildren().add(child);
}
}
return permissions;
}
/**
* 递归查询许可信息
* 1） 方法自己调用自己
* 2）方法一定要存在跳出逻辑
* 3）方法调用时，参数之间应该有规律
* 4） 递归算法，效率比较低
* @param parent
*/
private void queryChildPermissions( Permission parent ) {
List<Permission> childPermissions = permissionService.queryChildPermissions(parent.getId());
for ( Permission permission : childPermissions ) {
queryChildPermissions(permission);
}
parent.setChildren(childPermissions);
}
}
业务层
UserService.java
package com.atguigu.atcrowdfunding.service;
import java.util.List;
import java.util.Map;
import com.atguigu.atcrowdfunding.bean.User;
public interface UserService {
List<User> queryAll();
User query4Login(User user);
List<User> pageQueryData(Map<String, Object> map);
int pageQueryCount(Map<String, Object> map);
void insertUser(User user);
User queryById(Integer id);
void updateUser(User user);
void deleteUserById(Integer id);
void deleteUsers(Map<String, Object> map);
void deleteUserRoles(Map<String, Object> map);
void insertUserRoles(Map<String, Object> map);
List<Integer> queryRoleidsByUserid(Integer id);
}
UserServiceImpl.java
package com.atguigu.atcrowdfunding.service.impl;
import java.util.List;
import java.util.Map;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;
import com.atguigu.atcrowdfunding.bean.User;
import com.atguigu.atcrowdfunding.dao.UserDao;
import com.atguigu.atcrowdfunding.service.UserService;
@Service
public class UserServiceImpl implements UserService {
@Autowired
private UserDao userDao;//关联用户DAO层
public List<User> queryAll() {
return userDao.queryAll();
}
public User query4Login(User user) {
return userDao.query4Login(user);
}
public List<User> pageQueryData(Map<String, Object> map) {
return userDao.pageQueryData(map);
}
public int pageQueryCount(Map<String, Object> map) {
return userDao.pageQueryCount(map);
}
public void insertUser(User user) {
userDao.insertUser(user);
}
public User queryById(Integer id) {
return userDao.queryById(id);
}
public void updateUser(User user) {
userDao.updateUser(user);
}
public void deleteUserById(Integer id) {
userDao.deleteUserById(id);
}
public void deleteUsers(Map<String, Object> map) {
userDao.deleteUsers(map);
}
public void deleteUserRoles(Map<String, Object> map) {
userDao.deleteUserRoles(map);
}
public void insertUserRoles(Map<String, Object> map) {
userDao.insertUserRoles(map);
}
public List<Integer> queryRoleidsByUserid(Integer id) {
return userDao.queryRoleidsByUserid(id);
}
}
RoleServiceImpl.java
package com.atguigu.atcrowdfunding.service.impl;
import java.util.List;
import java.util.Map;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;
import com.atguigu.atcrowdfunding.bean.Role;
import com.atguigu.atcrowdfunding.dao.RoleDao;
import com.atguigu.atcrowdfunding.service.RoleService;
@Service
public class RoleServiceImpl implements RoleService {
@Autowired
private RoleDao roleDao;
public List<Role> pageQueryData(Map<String, Object> map) {
return roleDao.pageQueryData(map);
}
public int pageQueryCount(Map<String, Object> map) {
return roleDao.pageQueryCount(map);
}
public List<Role> queryAll() {
return roleDao.queryAll();
}
public void insertRolePermission(Map<String, Object> paramMap) {
roleDao.deleteRolePermissions(paramMap);
roleDao.insertRolePermission(paramMap);
}
}
PermissionServiceImpl.java
package com.atguigu.atcrowdfunding.service.impl;
import java.util.List;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;
import com.atguigu.atcrowdfunding.bean.Permission;
import com.atguigu.atcrowdfunding.bean.User;
import com.atguigu.atcrowdfunding.dao.PermissionDao;
import com.atguigu.atcrowdfunding.service.PermissionService;
@Service
public class PermissionServiceImpl implements PermissionService {
@Autowired
private PermissionDao permissionDao;
public Permission queryRootPermission() {
return permissionDao.queryRootPermission();
}
public List<Permission> queryChildPermissions(Integer pid) {
return permissionDao.queryChildPermissions(pid);
}
public List<Permission> queryAll() {
return permissionDao.queryAll();
}
public void insertPermission(Permission permission) {
permissionDao.insertPermission(permission);
}
public Permission queryById(Integer id) {
return permissionDao.queryById(id);
}
public void updatePermission(Permission permission) {
permissionDao.updatePermission(permission);
}
public void deletePermission(Permission permission) {
permissionDao.deletePermission(permission);
}
public List<Integer> queryPermissionidsByRoleid(Integer roleid) {
return permissionDao.queryPermissionidsByRoleid(roleid);
}
public List<Permission> queryPermissionsByUser(User dbUser) {
return permissionDao.queryPermissionsByUser(dbUser);
}
}
dao层
UserDao.java
package com.atguigu.atcrowdfunding.dao;
import java.util.List;
import java.util.Map;
import org.apache.ibatis.annotations.Select;
import com.atguigu.atcrowdfunding.bean.User;
public interface UserDao {
@Select("select * from t_user")
List<User> queryAll();
@Select("select * from t_user where loginacct = #{loginacct} and userpswd = #{userpswd}")
User query4Login(User user);
//sql文这里写在了映射文件中
List<User> pageQueryData(Map<String, Object> map);
int pageQueryCount(Map<String, Object> map);
void insertUser(User user);
@Select("select * from t_user where id = #{id}")
User queryById(Integer id);
void updateUser(User user);
void deleteUserById(Integer id);
void deleteUsers(Map<String, Object> map);
void insertUserRoles(Map<String, Object> map);
void deleteUserRoles(Map<String, Object> map);
@Select("select roleid from t_user_role where userid = #{userid}")
List<Integer> queryRoleidsByUserid(Integer id);
}
PermissionDao.java
package com.atguigu.atcrowdfunding.dao;
import java.util.List;
import org.apache.ibatis.annotations.Select;
import com.atguigu.atcrowdfunding.bean.Permission;
import com.atguigu.atcrowdfunding.bean.User;
public interface PermissionDao {
@Select("select * from t_permission where pid is null")
Permission queryRootPermission();
@Select("select * from t_permission where pid = #{pid}")
List<Permission> queryChildPermissions(Integer pid);
@Select("select * from t_permission")
List<Permission> queryAll();
void insertPermission(Permission permission);
@Select("select * from t_permission where id = #{id}")
Permission queryById(Integer id);
void updatePermission(Permission permission);
void deletePermission(Permission permission);
@Select("select permissionid from t_role_permission where roleid = #{roleid}")
List<Integer> queryPermissionidsByRoleid(Integer roleid);
List<Permission> queryPermissionsByUser(User dbUser);
}
RoleDao.java
package com.atguigu.atcrowdfunding.dao;
import java.util.List;
import java.util.Map;
import org.apache.ibatis.annotations.Select;
import com.atguigu.atcrowdfunding.bean.Role;
public interface RoleDao {
List<Role> pageQueryData(Map<String, Object> map);
int pageQueryCount(Map<String, Object> map);
@Select("select * from t_role")
List<Role> queryAll();
void insertRolePermission(Map<String, Object> paramMap);
void deleteRolePermissions(Map<String, Object> paramMap);
}
xml
mapper-user.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">
<!-- 命名空间和package匹配 -->
<mapper namespace="com.atguigu.atcrowdfunding.dao.UserDao" >
<!-- id和接口方法名称保持一致 -->
<select id="pageQueryData" resultType="com.atguigu.atcrowdfunding.bean.User">
select
*
from t_user
<where>
<!-- 模糊查询 -->
<if test="queryText != null"><!--也可能没有模糊查询，所以用if标签；而要要传入queryText的话，就需要拼接字符串了。有模糊查询的话查询的是所有页的 -->
and loginacct like concat('%', #{queryText}, '%')
</if>
</where>
order by createtime desc
limit #{start}, #{size}
</select>
<select id="pageQueryCount" resultType="int">
select
count(*)
from t_user
<where>
<if test="queryText != null">
and loginacct like concat('%', #{queryText}, '%')
</if>
</where>
</select>
<insert id="insertUser">
insert into t_user (
loginacct, username, userpswd, email, createtime
) values (
#{loginacct}, #{username}, #{userpswd}, #{email}, #{createtime}
)
</insert>
<insert id="insertUserRoles">
insert into t_user_role ( userid, roleid ) values
<foreach collection="roleids" item="roleid" separator=",">
( #{userid}, #{roleid} )
</foreach>
</insert>
<update id="updateUser">
update t_user
set loginacct = #{loginacct}, username = #{username}, email = #{email}
where id = #{id}
</update>
<delete id="deleteUserById">
delete from t_user where id = #{id}
</delete>
<delete id="deleteUsers">
delete from t_user where id in
<foreach collection="userids" item="userid" open="(" close=")" separator=",">
#{userid}
</foreach>
</delete>
<delete id="deleteUserRoles">
delete from t_user_role where userid = #{userid} and roleid in
<foreach collection="roleids" item="roleid" open="(" close=")" separator=",">
#{roleid}
</foreach>
</delete>
</mapper>
mapper-role.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.atguigu.atcrowdfunding.dao.RoleDao" >
<select id="pageQueryData" resultType="com.atguigu.atcrowdfunding.bean.Role">
select
*
from t_role
<where>
<if test="queryText != null">
and name like concat('%', #{queryText}, '%')
</if>
</where>
limit #{start}, #{size}
</select>
<select id="pageQueryCount" resultType="int">
select
count(*)
from t_role
<where>
<if test="queryText != null">
and name like concat('%', #{queryText}, '%')
</if>
</where>
</select>
<insert id="insertRolePermission">
insert into t_role_permission (roleid, permissionid) values
<foreach collection="permissionids" item="permissionid" separator=",">
( #{roleid}, #{permissionid} )
</foreach>
</insert>
<delete id="deleteRolePermissions">
delete from t_role_permission where roleid = #{roleid}
</delete>
</mapper>
mapper-permission.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.atguigu.atcrowdfunding.dao.PermissionDao" >
<select id="queryPermissionsByUser" resultType="com.atguigu.atcrowdfunding.bean.Permission">
select
*
from t_permission
where id in (
select
permissionid
from t_role_permission
where roleid in (
select
roleid
from t_user_role
where userid = #{id}
)
)
</select>
<insert id="insertPermission">
insert into t_permission (
name, url, pid
) values (
#{name}, #{url}, #{pid}
)
</insert>
<update id="updatePermission">
update t_permission
set name = #{name}, url = #{url}
where id = #{id}
</update>
<delete id="deletePermission">
delete from t_permission where id = #{id}
</delete>
</mapper>
POM.XML
<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>com.atguigu</groupId>
<artifactId>atcrowdfunding-manager</artifactId>
<version>0.0.1-SNAPSHOT</version>
<dependencies>
<dependency>
<groupId>com.atguigu</groupId>
<artifactId>atcrowdfunding-common</artifactId>
<version>0.0.1-SNAPSHOT</version>
</dependency>
</dependencies>
</project>
5 crowdfunding-web
src/controller/
DispatcherController.java
package com.atguigu.atcrowdfunding.controller;
import java.util.HashMap;
import java.util.HashSet;
import java.util.List;
import java.util.Map;
import java.util.Set;
import javax.servlet.http.HttpSession;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;
import com.atguigu.atcrowdfunding.bean.AJAXResult;
import com.atguigu.atcrowdfunding.bean.Permission;
import com.atguigu.atcrowdfunding.bean.User;
import com.atguigu.atcrowdfunding.service.PermissionService;
import com.atguigu.atcrowdfunding.service.UserService;
@Controller
public class DispatcherController {
@Autowired
private UserService userService;
@Autowired
private PermissionService permissionService;
@RequestMapping("/login")
public String login() {
return "login";
}
@RequestMapping("/error")
public String error() {
return "error";
}
@RequestMapping("/logout")
public String logout(HttpSession session) {
//session.removeAttribute("loginUser");//一个一个删
session.invalidate();//让session中所有数据都失效
return "redirect:login";
}
@RequestMapping("/main")
public String main() {
return "main";
}
@ResponseBody
@RequestMapping("/doAJAXLogin")
public Object doAJAXLogin(User user, HttpSession session) {
AJAXResult result = new AJAXResult();
User dbUser = userService.query4Login(user);
if ( dbUser != null ) {
session.setAttribute("loginUser", dbUser);
// 获取用户权限信息
List<Permission> permissions = permissionService.queryPermissionsByUser(dbUser);
Map<Integer, Permission> permissionMap = new HashMap<Integer, Permission>();
Permission root = null;
Set<String> uriSet = new HashSet<String>();
for ( Permission permission : permissions ) {
permissionMap.put(permission.getId(), permission);
if ( permission.getUrl() != null && !"".equals(permission.getUrl()) ) {
uriSet.add(session.getServletContext().getContextPath() + permission.getUrl());
}
}
session.setAttribute("authUriSet", uriSet);
for ( Permission permission : permissions ) {
Permission child = permission;
if ( child.getPid() == 0 ) {
root = permission;
} else {
Permission parent = permissionMap.get(child.getPid());
parent.getChildren().add(child);
}
}
session.setAttribute("rootPermission", root);
result.setSuccess(true);
} else {
result.setSuccess(false);
}
return result;
}
/**
* 执行登陆
* @return
*/
@RequestMapping("/doLogin")
public String doLogin( User user, Model model ) throws Exception {
String loginacct = user.getLoginacct();
// 将乱码字符串按照错误的编码方式转换为原始的字节码序列
//byte[] bs = loginacct.getBytes("ISO8859-1");
// 将原始的字节码序列按照正确的编码转换为正确的文字即可。
//loginacct = new String(bs, "UTF-8");
// 1) 获取表单数据
// 1-1) HttpServletRequest
// 1-2) 在方法参数列表中增加表单对应的参数，名称相同
// 1-3) 就是将表单数据封装为实体类对象
// 2) 查询用户信息
User dbUser = userService.query4Login(user);
// 3) 判断用户信息是否存在
if ( dbUser != null ) {
// 登陆成功，跳转到主页面
return "main";
} else {
// 登陆失败，跳转回到登陆页面，提示错误信息
String errorMsg = "登陆账号或密码不正确，请重新输入";
model.addAttribute("errorMsg", errorMsg);
return "redirect:login";
}
}
}
src/web/
ServerStartupListener.java
package com.atguigu.atcrowdfunding.web;
import javax.servlet.ServletContext;
import javax.servlet.ServletContextEvent;
import javax.servlet.ServletContextListener;
public class ServerStartupListener implements ServletContextListener {
public void contextInitialized(ServletContextEvent sce) {
// 将web应用名称（路径）保存到application范围中
ServletContext application = sce.getServletContext();
String path = application.getContextPath();
application.setAttribute("APP_PATH", path);
}
public void contextDestroyed(ServletContextEvent sce) {
// TODO Auto-generated method stub
}
}
login.jsp
注意点：空提醒，空终止执行，登录不成功就不要重新刷新网页（闪烁现象），错误的话账号要回显
UI线程只要发送内容，就要清空页面，重新加载页面。所以可以用ajax实现局部刷新。还应该有登录中的等待提示，登录成功后关闭等待提示。
<%@page pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="keys" content="">
<meta name="author" content="">
<link rel="stylesheet" href="bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" href="css/font-awesome.min.css">
<link rel="stylesheet" href="css/login.css">
<style>
</style>
</head>
<body>
<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
<div class="container">
<div class="navbar-header">
<div><a class="navbar-brand" href="index.html" style="font-size:32px;">尚筹网-创意产品众筹平台</a></div>
</div>
</div>
</nav>
<div class="container">
<h1 style="color:red">${param.errorMsg}</h1>
<form id="loginForm" action="doLogin" method="post" class="form-signin" role="form">
<h2 class="form-signin-heading"><i class="glyphicon glyphicon-user"></i> 用户登录</h2>
<div class="form-group has-success has-feedback">
<input type="text" class="form-control" id="loginacct" name="loginacct" placeholder="请输入登录账号" autofocus>
<span class="glyphicon glyphicon-user form-control-feedback"></span>
</div>
<div class="form-group has-success has-feedback">
<input type="text" class="form-control" id="userpswd" name="userpswd" placeholder="请输入登录密码" style="margin-top:10px;">
<span class="glyphicon glyphicon-lock form-control-feedback"></span>
</div>
<div class="form-group has-success has-feedback">
<select class="form-control" >
<option value="member">会员</option>
<option value="user">管理</option>
</select>
</div>
<div class="checkbox">
<label>
<input type="checkbox" value="remember-me"> 记住我
</label>
<br>
<label>
忘记密码
</label>
<label style="float:right">
<a href="reg.html">我要注册</a>
</label>
</div>
<a class="btn btn-lg btn-success btn-block" οnclick="dologin()" > 登录</a>
</form>
</div>
<script src="jquery/jquery-2.1.1.min.js"></script>
<script src="bootstrap/js/bootstrap.min.js"></script>
<script src="layer/layer.js"></script>
<script>
function dologin() {
// 非空校验
var loginacct = $("#loginacct").val();
// 表单元素的value取值不会为null, 取值是空字符串
if ( loginacct == "" ) {
//alert("用户登录账号不能为空，请输入");
layer.msg("用户登录账号不能为空，请输入", {time:2000, icon:5, shift:6}, function(){
});
return;
}
var userpswd = $("#userpswd").val();
if ( userpswd == "" ) {
//alert("用户登录密码不能为空，请输入");
layer.msg("用户登录密码不能为空，请输入", {time:2000, icon:5, shift:6}, function(){
});
return;
}
// 提交表单
//alert("提交表单");
//$("#loginForm").submit();
// 使用AJAX提交数据
var loadingIndex = null;
$.ajax({
type : "POST",
url : "doAJAXLogin",
data : {
"loginacct" : loginacct,
"userpswd" : userpswd
},
beforeSend : function(){
loadingIndex = layer.msg('处理中', {icon: 16});
},
success : function(result) {
layer.close(loadingIndex);
if (result.success) {
window.location.href = "main";
} else {
layer.msg("用户登录账号或密码不正确，请重新输入", {time:2000, icon:5, shift:6}, function(){
});
}
}
});
}
</script>
</body>
</html>
jsp不推荐使用java代码了。
main.jsp
<%@page pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">
<link rel="stylesheet" href="bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" href="css/font-awesome.min.css">
<link rel="stylesheet" href="css/main.css">
<style>
.tree li {
list-style-type: none;
cursor:pointer;
}
.tree-closed {
height : 40px;
}
.tree-expanded {
height : auto;
}
</style>
</head>
<body>
<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
<div class="container-fluid">
<div class="navbar-header">
<div><a class="navbar-brand" style="font-size:32px;" href="#">众筹平台 - 控制面板</a></div>
</div>
<div id="navbar" class="navbar-collapse collapse">
<ul class="nav navbar-nav navbar-right">
<li style="padding-top:8px;">
<div class="btn-group">
<button type="button" class="btn btn-default btn-success dropdown-toggle" data-toggle="dropdown">
<i class="glyphicon glyphicon-user"></i> ${loginUser.username} <span class="caret"></span>
</button>
<ul class="dropdown-menu" role="menu">
<li><a href="#"><i class="glyphicon glyphicon-cog"></i> 个人设置</a></li>
<li><a href="#"><i class="glyphicon glyphicon-comment"></i> 消息</a></li>
<li class="divider"></li>
<li><a href="logout"><i class="glyphicon glyphicon-off"></i> 退出系统</a></li>
</ul>
</div>
</li>
<li style="margin-left:10px;padding-top:8px;">
<button type="button" class="btn btn-default btn-danger">
<span class="glyphicon glyphicon-question-sign"></span> 帮助
</button>
</li>
</ul>
<form class="navbar-form navbar-right">
<input type="text" class="form-control" placeholder="查询">
</form>
</div>
</div>
</nav>
<div class="container-fluid">
<div class="row">
<div class="col-sm-3 col-md-2 sidebar">
<div class="tree">
<%@include file="/WEB-INF/jsp/common/menu.jsp"%>
</div>
</div>
<div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 main">
<h1 class="page-header">控制面板</h1>
<div class="row placeholders">
<div class="col-xs-6 col-sm-3 placeholder">
<img data-src="holder.js/200x200/auto/sky" class="img-responsive" alt="Generic placeholder thumbnail">
<h4>Label</h4>
<span class="text-muted">Something else</span>
</div>
<div class="col-xs-6 col-sm-3 placeholder">
<img data-src="holder.js/200x200/auto/vine" class="img-responsive" alt="Generic placeholder thumbnail">
<h4>Label</h4>
<span class="text-muted">Something else</span>
</div>
<div class="col-xs-6 col-sm-3 placeholder">
<img data-src="holder.js/200x200/auto/sky" class="img-responsive" alt="Generic placeholder thumbnail">
<h4>Label</h4>
<span class="text-muted">Something else</span>
</div>
<div class="col-xs-6 col-sm-3 placeholder">
<img data-src="holder.js/200x200/auto/vine" class="img-responsive" alt="Generic placeholder thumbnail">
<h4>Label</h4>
<span class="text-muted">Something else</span>
</div>
</div>
</div>
</div>
</div>
<script src="jquery/jquery-2.1.1.min.js"></script>
<script src="bootstrap/js/bootstrap.min.js"></script>
<script src="script/docs.min.js"></script>
<script type="text/javascript">
$(function () {
$(".list-group-item").click(function(){
// jquery对象的回调方法中的this关键字为DOM对象
// $(DOM) ==> JQuery
if ( $(this).find("ul") ) { // 3 li
$(this).toggleClass("tree-closed");
if ( $(this).hasClass("tree-closed") ) {
$("ul", this).hide("fast");
} else {
$("ul", this).show("fast");
}
}
});
});
</script>
</body>
</html>
/jsp/user/
index.jsp
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
返回的list数据用<c:forEach items="${user}" var="user"
<%@page pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">
<link rel="stylesheet" href="${APP_PATH}/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" href="${APP_PATH}/css/font-awesome.min.css">
<link rel="stylesheet" href="${APP_PATH}/css/main.css">
<style>
.tree li {
list-style-type: none;
cursor:pointer;
}
table tbody tr:nth-child(odd){background:#F4F4F4;}
table tbody td:nth-child(even){color:#C00;}
</style>
</head>
<body>
<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
<div class="container-fluid">
<div class="navbar-header">
<div><a class="navbar-brand" style="font-size:32px;" href="#">众筹平台 - 用户维护</a></div>
</div>
<div id="navbar" class="navbar-collapse collapse">
<ul class="nav navbar-nav navbar-right">
<li style="padding-top:8px;">
<div class="btn-group">
<button type="button" class="btn btn-default btn-success dropdown-toggle" data-toggle="dropdown">
<i class="glyphicon glyphicon-user"></i> 张三 <span class="caret"></span>
</button>
<ul class="dropdown-menu" role="menu">
<li><a href="#"><i class="glyphicon glyphicon-cog"></i> 个人设置</a></li>
<li><a href="#"><i class="glyphicon glyphicon-comment"></i> 消息</a></li>
<li class="divider"></li>
<li><a href="index.html"><i class="glyphicon glyphicon-off"></i> 退出系统</a></li>
</ul>
</div>
</li>
<li style="margin-left:10px;padding-top:8px;">
<button type="button" class="btn btn-default btn-danger">
<span class="glyphicon glyphicon-question-sign"></span> 帮助
</button>
</li>
</ul>
<form class="navbar-form navbar-right">
<input type="text" class="form-control" placeholder="Search...">
</form>
</div>
</div>
</nav>
<div class="container-fluid">
<div class="row">
<div class="col-sm-3 col-md-2 sidebar">
<div class="tree">
<ul style="padding-left:0px;" class="list-group">
<li class="list-group-item tree-closed" >
<a href="main.html"><i class="glyphicon glyphicon-dashboard"></i> 控制面板</a>
</li>
<li class="list-group-item">
<span><i class="glyphicon glyphicon glyphicon-tasks"></i> 权限管理 <span class="badge" style="float:right">3</span></span>
<ul style="margin-top:10px;">
<li style="height:30px;">
<a href="user.html" style="color:red;"><i class="glyphicon glyphicon-user"></i> 用户维护</a>
</li>
<li style="height:30px;">
<a href="role.html"><i class="glyphicon glyphicon-king"></i> 角色维护</a>
</li>
<li style="height:30px;">
<a href="permission.html"><i class="glyphicon glyphicon-lock"></i> 许可维护</a>
</li>
</ul>
</li>
<li class="list-group-item tree-closed">
<span><i class="glyphicon glyphicon-ok"></i> 业务审核 <span class="badge" style="float:right">3</span></span>
<ul style="margin-top:10px;display:none;">
<li style="height:30px;">
<a href="auth_cert.html"><i class="glyphicon glyphicon-check"></i> 实名认证审核</a>
</li>
<li style="height:30px;">
<a href="auth_adv.html"><i class="glyphicon glyphicon-check"></i> 广告审核</a>
</li>
<li style="height:30px;">
<a href="auth_project.html"><i class="glyphicon glyphicon-check"></i> 项目审核</a>
</li>
</ul>
</li>
<li class="list-group-item tree-closed">
<span><i class="glyphicon glyphicon-th-large"></i> 业务管理 <span class="badge" style="float:right">7</span></span>
<ul style="margin-top:10px;display:none;">
<li style="height:30px;">
<a href="cert.html"><i class="glyphicon glyphicon-picture"></i> 资质维护</a>
</li>
<li style="height:30px;">
<a href="type.html"><i class="glyphicon glyphicon-equalizer"></i> 分类管理</a>
</li>
<li style="height:30px;">
<a href="process.html"><i class="glyphicon glyphicon-random"></i> 流程管理</a>
</li>
<li style="height:30px;">
<a href="advertisement.html"><i class="glyphicon glyphicon-hdd"></i> 广告管理</a>
</li>
<li style="height:30px;">
<a href="message.html"><i class="glyphicon glyphicon-comment"></i> 消息模板</a>
</li>
<li style="height:30px;">
<a href="project_type.html"><i class="glyphicon glyphicon-list"></i> 项目分类</a>
</li>
<li style="height:30px;">
<a href="tag.html"><i class="glyphicon glyphicon-tags"></i> 项目标签</a>
</li>
</ul>
</li>
<li class="list-group-item tree-closed" >
<a href="param.html"><i class="glyphicon glyphicon-list-alt"></i> 参数管理</a>
</li>
</ul>
</div>
</div>
<div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 main">
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title"><i class="glyphicon glyphicon-th"></i> 数据列表</h3>
</div>
<div class="panel-body">
<form class="form-inline" role="form" style="float:left;">
<div class="form-group has-feedback">
<div class="input-group">
<div class="input-group-addon">查询条件</div>
<input id="queryText" class="form-control has-success" type="text" placeholder="请输入查询条件">
</div>
</div>
<button id="queryBtn" type="button" class="btn btn-warning">
<i class="glyphicon glyphicon-search"></i> 查询
</button>
</form>
<button type="button" class="btn btn-danger" οnclick="deleteUsers()" style="float:right;margin-left:10px;"><i class=" glyphicon glyphicon-remove"></i> 删除</button>
<button type="button" class="btn btn-primary" style="float:right;" οnclick="window.location.href='${APP_PATH}/user/add'"><i class="glyphicon glyphicon-plus"></i> 新增</button>
<br>
<hr style="clear:both;">
<div class="table-responsive">
<form id="userForm"><!-- 用户form，如果写到了table里，会出错 -->
<table class="table table-bordered">
<thead>
<tr >
<th width="30">#</th>
<th width="30"><input type="checkbox" id="allSelBox"></th>
<th>账号</th>
<th>名称</th>
<th>邮箱地址</th>
<th width="100">操作</th>
</tr>
</thead>
<tbody id="userData">
<!--填入数据的地方-->
</tbody>
<tfoot>
<tr >
<td colspan="6" align="center">
<ul class="pagination">
</ul>
</td>
</tr>
</tfoot>
</table>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
<script src="${APP_PATH}/jquery/jquery-2.1.1.min.js"></script>
<script src="${APP_PATH}/bootstrap/js/bootstrap.min.js"></script>
<script src="${APP_PATH}/script/docs.min.js"></script>
<script src="${APP_PATH}/layer/layer.js"></script>
<script type="text/javascript">
var likeflg = false;
$(function () {
$(".list-group-item").click(function(){
if ( $(this).find("ul") ) {
$(this).toggleClass("tree-closed");
if ( $(this).hasClass("tree-closed") ) {
$("ul", this).hide("fast");
} else {
$("ul", this).show("fast");
}
}
});
pageQuery(1);//默认加载的是第一页数据
$("#queryBtn").click(function(){//模糊查询
var queryText = $("#queryText").val();
if ( queryText == "" ) {
likeflg = false;
} else {
likeflg = true;
}
pageQuery(1);
});
$("#allSelBox").click(function(){//全选按钮
var flg = this.checked;
$("#userData :checkbox").each(function(){
this.checked = flg;//把每行设置为与全选按钮相同
});
});
});
$("tbody .btn-success").click(function(){
window.location.href = "assignRole.html";
});
$("tbody .btn-primary").click(function(){
window.location.href = "edit.html";
});
// 分页查询
function pageQuery( pageno ) {//参数为查询第几页，在$function中
var loadingIndex = null;
var jsonData = {"pageno" : pageno, "pagesize" : 10};
if ( likeflg == true ) {//是否需要模糊查询//模糊查询所有页面的
jsonData.queryText = $("#queryText").val();
}
$.ajax({
type : "POST",
url : "${APP_PATH}/user/pageQuery",
data : jsonData,
beforeSend : function(){
loadingIndex = layer.msg('处理中', {icon: 16});
},
success : function(result) {
layer.close(loadingIndex);
if ( result.success ) {
// 局部刷新页面数据
var tableContent = "";
var pageContent = "";
var userPage = result.data;
var users = userPage.datas;
// 对某一个集合进行循环，当前索引和当前对象
$.each(users, function(i, user){
// ALT+Shift+A
tableContent += '<tr>';
tableContent += ' <td>'+(i+1)+'</td>';
tableContent += ' <td><input type="checkbox" name="userid" value="'+user.id+'"></td>';//checkbox按钮，有value=id数据
tableContent += ' <td>'+user.loginacct+'</td>';
tableContent += ' <td>'+user.username+'</td>';
tableContent += ' <td>'+user.email+'</td>';
tableContent += ' <td>';
tableContent += ' <button type="button" οnclick="goAssignPage('+user.id+')" class="btn btn-success btn-xs"><i class=" glyphicon glyphicon-check"></i></button>';//分配角色按钮
tableContent += ' <button type="button" οnclick="goUpdatePage('+user.id+')" class="btn btn-primary btn-xs"><i class=" glyphicon glyphicon-pencil"></i></button>';//修改按钮
tableContent += ' <button type="button" οnclick="deleteUser('+user.id+', \''+user.loginacct+'\')" class="btn btn-danger btn-xs"><i class=" glyphicon glyphicon-remove"></i></button>';//删除按钮
tableContent += ' </td>';
tableContent += '</tr>';
});
// 上一页按钮
if ( pageno > 1 ) {
pageContent += '<li><a href="#" οnclick="pageQuery('+(pageno-1)+')">上一页</a></li>';//非首页显示上一页按钮
}
// 页码按钮
for ( var i = 1; i <= userPage.totalno; i++ ) {
if ( i == pageno ) {//当前页的话href="#" class="active"
pageContent += '<li class="active"><a href="#">'+i+'</a></li>';//页码点击按钮，给点击按钮设置href
} else {
pageContent += '<li ><a href="#" οnclick="pageQuery('+i+')">'+i+'</a></li>';//当前页面的href设置为#
}
}
// 下一页按钮
if ( pageno < userPage.totalno ) {
pageContent += '<li><a href="#" οnclick="pageQuery('+(pageno+1)+')">下一页</a></li>';//非尾页显示下一页按钮
}
$("#userData").html(tableContent);
$(".pagination").html(pageContent);
} else {
layer.msg("用户信息分页查询失败", {time:2000, icon:5, shift:6}, function(){
});
}
}
});
}
function goUpdatePage(id) {
window.location.href = "${APP_PATH}/user/edit?id="+id;
}
function goAssignPage(id) {//附带id信息
window.location.href = "${APP_PATH}/user/assign?id="+id;
}
function deleteUsers() {//选中的全部删除
var boxes = $("#userData :checkbox");//选中的用户，用来删除
if ( boxes.length == 0 ) {
layer.msg("请选择需要删除的用户信息", {time:2000, icon:5, shift:6}, function(){
});
} else {
layer.confirm(
"删除选择的用户信息, 是否继续",
{icon: 3, title:'提示'},
function(cindex){
// 删除选择的用户信息
$.ajax({
type : "POST",
url : "${APP_PATH}/user/deletes",//加了个s
data : $("#userForm").serialize(),//传的是多个//序列化表格内容为字符串
success : function(result) {
if ( result.success ) {
pageQuery(1);
} else {
layer.msg("用户信息删除失败", {time:2000, icon:5, shift:6}, function(){
});
}
}
});
layer.close(cindex);
}, function(cindex){
layer.close(cindex);
});
}
}
function deleteUser( id, loginacct ) {//删除用户//应该要询问防止误删
layer.confirm("删除用户信息【"+loginacct+"】, 是否继续", {icon: 3, title:'提示'}, function(cindex){
// 删除用户信息
$.ajax({
type : "POST",
url : "${APP_PATH}/user/delete",
data : { id : id },
success : function(result) {
if ( result.success ) {
pageQuery(1);
} else {
layer.msg("用户信息删除失败", {time:2000, icon:5, shift:6}, function(){
});
}
}
});
layer.close( cindex);
}, function(cindex){
layer.close(cindex);
});
}
</script>
</body>
</html>
edit.jsp
<%@page pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">
<link rel="stylesheet" href="${APP_PATH}/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" href="${APP_PATH}/css/font-awesome.min.css">
<link rel="stylesheet" href="${APP_PATH}/css/main.css">
<link rel="stylesheet" href="${APP_PATH}/css/doc.min.css">
<style>
.tree li {
list-style-type: none;
cursor:pointer;
}
</style>
</head>
<body>
<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
<div class="container-fluid">
<div class="navbar-header">
<div><a class="navbar-brand" style="font-size:32px;" href="user.html">众筹平台 - 用户维护</a></div>
</div>
<div id="navbar" class="navbar-collapse collapse">
<ul class="nav navbar-nav navbar-right">
<li style="padding-top:8px;">
<div class="btn-group">
<button type="button" class="btn btn-default btn-success dropdown-toggle" data-toggle="dropdown">
<i class="glyphicon glyphicon-user"></i> 张三 <span class="caret"></span>
</button>
<ul class="dropdown-menu" role="menu">
<li><a href="#"><i class="glyphicon glyphicon-cog"></i> 个人设置</a></li>
<li><a href="#"><i class="glyphicon glyphicon-comment"></i> 消息</a></li>
<li class="divider"></li>
<li><a href="login.html"><i class="glyphicon glyphicon-off"></i> 退出系统</a></li>
</ul>
</div>
</li>
<li style="margin-left:10px;padding-top:8px;">
<button type="button" class="btn btn-default btn-danger">
<span class="glyphicon glyphicon-question-sign"></span> 帮助
</button>
</li>
</ul>
<form class="navbar-form navbar-right">
<input type="text" class="form-control" placeholder="Search...">
</form>
</div>
</div>
</nav>
<div class="container-fluid">
<div class="row">
<div class="col-sm-3 col-md-2 sidebar">
<div class="tree">
<ul style="padding-left:0px;" class="list-group">
<li class="list-group-item tree-closed" >
<a href="main.html"><i class="glyphicon glyphicon-dashboard"></i> 控制面板</a>
</li>
<li class="list-group-item">
<span><i class="glyphicon glyphicon glyphicon-tasks"></i> 权限管理 <span class="badge" style="float:right">3</span></span>
<ul style="margin-top:10px;">
<li style="height:30px;">
<a href="user.html" style="color:red;"><i class="glyphicon glyphicon-user"></i> 用户维护</a>
</li>
<li style="height:30px;">
<a href="role.html"><i class="glyphicon glyphicon-certificate"></i> 角色维护</a>
</li>
<li style="height:30px;">
<a href="permission.html"><i class="glyphicon glyphicon-lock"></i> 许可维护</a>
</li>
</ul>
</li>
<li class="list-group-item tree-closed">
<span><i class="glyphicon glyphicon-ok"></i> 业务审核 <span class="badge" style="float:right">3</span></span>
<ul style="margin-top:10px;display:none;">
<li style="height:30px;">
<a href="auth_cert.html"><i class="glyphicon glyphicon-check"></i> 实名认证审核</a>
</li>
<li style="height:30px;">
<a href="auth_adv.html"><i class="glyphicon glyphicon-check"></i> 广告审核</a>
</li>
<li style="height:30px;">
<a href="auth_project.html"><i class="glyphicon glyphicon-check"></i> 项目审核</a>
</li>
</ul>
</li>
<li class="list-group-item tree-closed">
<span><i class="glyphicon glyphicon-th-large"></i> 业务管理 <span class="badge" style="float:right">7</span></span>
<ul style="margin-top:10px;display:none;">
<li style="height:30px;">
<a href="cert.html"><i class="glyphicon glyphicon-picture"></i> 资质维护</a>
</li>
<li style="height:30px;">
<a href="type.html"><i class="glyphicon glyphicon-equalizer"></i> 分类管理</a>
</li>
<li style="height:30px;">
<a href="process.html"><i class="glyphicon glyphicon-random"></i> 流程管理</a>
</li>
<li style="height:30px;">
<a href="advertisement.html"><i class="glyphicon glyphicon-hdd"></i> 广告管理</a>
</li>
<li style="height:30px;">
<a href="message.html"><i class="glyphicon glyphicon-comment"></i> 消息模板</a>
</li>
<li style="height:30px;">
<a href="project_type.html"><i class="glyphicon glyphicon-list"></i> 项目分类</a>
</li>
<li style="height:30px;">
<a href="tag.html"><i class="glyphicon glyphicon-tags"></i> 项目标签</a>
</li>
</ul>
</li>
<li class="list-group-item tree-closed" >
<a href="param.html"><i class="glyphicon glyphicon-list-alt"></i> 参数管理</a>
</li>
</ul>
</div>
</div>
<div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 main">
<ol class="breadcrumb">
<li><a href="#">首页</a></li>
<li><a href="#">数据列表</a></li>
<li class="active">修改</li>
</ol>
<div class="panel panel-default">
<div class="panel-heading">表单数据<div style="float:right;cursor:pointer;" data-toggle="modal" data-target="#myModal"><i class="glyphicon glyphicon-question-sign"></i></div></div>
<div class="panel-body">
<form id="userForm" role="form">
<div class="form-group">
<label for="exampleInputPassword1">登陆账号</label>
<input type="text" class="form-control" id="loginacct" value="${user.loginacct}" placeholder="请输入登陆账号">
</div>
<div class="form-group">
<label for="exampleInputPassword1">用户名称</label>
<input type="text" class="form-control" id="username" value="${user.username}" placeholder="请输入用户名称">
</div>
<div class="form-group">
<label for="exampleInputEmail1">邮箱地址</label>
<input type="email" class="form-control" id="email" value="${user.email}" placeholder="请输入邮箱地址">
<p class="help-block label label-warning">请输入合法的邮箱地址, 格式为： xxxx@xxxx.com</p>
</div>
<button id="updateBtn" type="button" class="btn btn-success"><i class="glyphicon glyphicon-pencil"></i> 修改</button>
<button id="resetBtn" type="button" class="btn btn-danger"><i class="glyphicon glyphicon-refresh"></i> 重置</button>
</form>
</div>
</div>
</div>
</div>
</div>
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>
<h4 class="modal-title" id="myModalLabel">帮助</h4>
</div>
<div class="modal-body">
<div class="bs-callout bs-callout-info">
<h4>测试标题1</h4>
<p>测试内容1，测试内容1，测试内容1，测试内容1，测试内容1，测试内容1</p>
</div>
<div class="bs-callout bs-callout-info">
<h4>测试标题2</h4>
<p>测试内容2，测试内容2，测试内容2，测试内容2，测试内容2，测试内容2</p>
</div>
</div>
<!--
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary">Save changes</button>
</div>
-->
</div>
</div>
</div>
<script src="${APP_PATH}/jquery/jquery-2.1.1.min.js"></script>
<script src="${APP_PATH}/bootstrap/js/bootstrap.min.js"></script>
<script src="${APP_PATH}/script/docs.min.js"></script>
<script src="${APP_PATH}/layer/layer.js"></script>
<script type="text/javascript">
$(function () {
$(".list-group-item").click(function(){
if ( $(this).find("ul") ) {
$(this).toggleClass("tree-closed");
if ( $(this).hasClass("tree-closed") ) {
$("ul", this).hide("fast");
} else {
$("ul", this).show("fast");
}
}
});
$("#resetBtn").click(function(){// 重置按钮。jQuery里没有reset，当dom里有
// Jquery[0] ==> DOM
// $(DOM) ==> Jquery
$("#userForm")[0].reset();
});
$("#updateBtn").click(function(){
var loginacct = $("#loginacct").val();
if ( loginacct == "" ) {
layer.msg("登录账号不能为空，请输入", {time:2000, icon:5, shift:6}, function(){
});
return;
}
var loadingIndex = null;
$.ajax({
type : "POST",
url : "${APP_PATH}/user/update",
data : {
"loginacct" : loginacct,
"username" : $("#username").val(),
"email" : $("#email").val(),
"id" : "${user.id}"
},
beforeSend : function() {
loadingIndex = layer.msg('处理中', {icon: 16});
},
success : function(result) {
layer.close(loadingIndex);
if ( result.success ) {
layer.msg("用户信息修改成功", {time:1000, icon:6}, function(){
window.location.href = "${APP_PATH}/user/index";
});
} else {
layer.msg("用户信息修改失败，请重新操作", {time:2000, icon:5, shift:6}, function(){
});
}
}
});
});
});
</script>
</body>
</html>
index2.jsp(原始、同步)
<%@page pageEncoding="UTF-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">
<link rel="stylesheet" href="${APP_PATH}/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" href="${APP_PATH}/css/font-awesome.min.css">
<link rel="stylesheet" href="${APP_PATH}/css/main.css">
<style>
.tree li {
list-style-type: none;
cursor:pointer;
}
table tbody tr:nth-child(odd){background:#F4F4F4;}
table tbody td:nth-child(even){color:#C00;}
</style>
</head>
<body>
<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
<div class="container-fluid">
<div class="navbar-header">
<div><a class="navbar-brand" style="font-size:32px;" href="#">众筹平台 - 用户维护</a></div>
</div>
<div id="navbar" class="navbar-collapse collapse">
<ul class="nav navbar-nav navbar-right">
<li style="padding-top:8px;">
<div class="btn-group">
<button type="button" class="btn btn-default btn-success dropdown-toggle" data-toggle="dropdown">
<i class="glyphicon glyphicon-user"></i> 张三 <span class="caret"></span>
</button>
<ul class="dropdown-menu" role="menu">
<li><a href="#"><i class="glyphicon glyphicon-cog"></i> 个人设置</a></li>
<li><a href="#"><i class="glyphicon glyphicon-comment"></i> 消息</a></li>
<li class="divider"></li>
<li><a href="index.html"><i class="glyphicon glyphicon-off"></i> 退出系统</a></li>
</ul>
</div>
</li>
<li style="margin-left:10px;padding-top:8px;">
<button type="button" class="btn btn-default btn-danger">
<span class="glyphicon glyphicon-question-sign"></span> 帮助
</button>
</li>
</ul>
<form class="navbar-form navbar-right">
<input type="text" class="form-control" placeholder="Search...">
</form>
</div>
</div>
</nav>
<div class="container-fluid">
<div class="row">
<div class="col-sm-3 col-md-2 sidebar">
<div class="tree">
<ul style="padding-left:0px;" class="list-group">
<li class="list-group-item tree-closed" >
<a href="main.html"><i class="glyphicon glyphicon-dashboard"></i> 控制面板</a>
</li>
<li class="list-group-item">
<span><i class="glyphicon glyphicon glyphicon-tasks"></i> 权限管理 <span class="badge" style="float:right">3</span></span>
<ul style="margin-top:10px;">
<li style="height:30px;">
<a href="user.html" style="color:red;"><i class="glyphicon glyphicon-user"></i> 用户维护</a>
</li>
<li style="height:30px;">
<a href="role.html"><i class="glyphicon glyphicon-king"></i> 角色维护</a>
</li>
<li style="height:30px;">
<a href="permission.html"><i class="glyphicon glyphicon-lock"></i> 许可维护</a>
</li>
</ul>
</li>
<li class="list-group-item tree-closed">
<span><i class="glyphicon glyphicon-ok"></i> 业务审核 <span class="badge" style="float:right">3</span></span>
<ul style="margin-top:10px;display:none;">
<li style="height:30px;">
<a href="auth_cert.html"><i class="glyphicon glyphicon-check"></i> 实名认证审核</a>
</li>
<li style="height:30px;">
<a href="auth_adv.html"><i class="glyphicon glyphicon-check"></i> 广告审核</a>
</li>
<li style="height:30px;">
<a href="auth_project.html"><i class="glyphicon glyphicon-check"></i> 项目审核</a>
</li>
</ul>
</li>
<li class="list-group-item tree-closed">
<span><i class="glyphicon glyphicon-th-large"></i> 业务管理 <span class="badge" style="float:right">7</span></span>
<ul style="margin-top:10px;display:none;">
<li style="height:30px;">
<a href="cert.html"><i class="glyphicon glyphicon-picture"></i> 资质维护</a>
</li>
<li style="height:30px;">
<a href="type.html"><i class="glyphicon glyphicon-equalizer"></i> 分类管理</a>
</li>
<li style="height:30px;">
<a href="process.html"><i class="glyphicon glyphicon-random"></i> 流程管理</a>
</li>
<li style="height:30px;">
<a href="advertisement.html"><i class="glyphicon glyphicon-hdd"></i> 广告管理</a>
</li>
<li style="height:30px;">
<a href="message.html"><i class="glyphicon glyphicon-comment"></i> 消息模板</a>
</li>
<li style="height:30px;">
<a href="project_type.html"><i class="glyphicon glyphicon-list"></i> 项目分类</a>
</li>
<li style="height:30px;">
<a href="tag.html"><i class="glyphicon glyphicon-tags"></i> 项目标签</a>
</li>
</ul>
</li>
<li class="list-group-item tree-closed" >
<a href="param.html"><i class="glyphicon glyphicon-list-alt"></i> 参数管理</a>
</li>
</ul>
</div>
</div>
<div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 main">
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title"><i class="glyphicon glyphicon-th"></i> 数据列表</h3>
</div>
<div class="panel-body">
<form class="form-inline" role="form" style="float:left;">
<div class="form-group has-feedback">
<div class="input-group">
<div class="input-group-addon">查询条件</div>
<input class="form-control has-success" type="text" placeholder="请输入查询条件">
</div>
</div>
<button type="button" class="btn btn-warning"><i class="glyphicon glyphicon-search"></i> 查询</button>
</form>
<button type="button" class="btn btn-danger" style="float:right;margin-left:10px;"><i class=" glyphicon glyphicon-remove"></i> 删除</button>
<button type="button" class="btn btn-primary" style="float:right;" οnclick="window.location.href='add.html'"><i class="glyphicon glyphicon-plus"></i> 新增</button>
<br>
<hr style="clear:both;">
<div class="table-responsive">
<table class="table table-bordered">
<thead>
<tr >
<th width="30">#</th>
<th width="30"><input type="checkbox"></th>
<th>账号</th>
<th>名称</th>
<th>邮箱地址</th>
<th width="100">操作</th>
</tr>
</thead>
<tbody>
<c:forEach items="${users}" var="user" varStatus="status">
<tr>
<td>${status.count}</td>
<td><input type="checkbox"></td>
<td>${user.loginacct}</td>
<td>${user.username}</td>
<td>${user.email}</td>
<td>
<button type="button" class="btn btn-success btn-xs"><i class=" glyphicon glyphicon-check"></i></button>
<button type="button" class="btn btn-primary btn-xs"><i class=" glyphicon glyphicon-pencil"></i></button>
<button type="button" class="btn btn-danger btn-xs"><i class=" glyphicon glyphicon-remove"></i></button>
</td>
</tr>
</c:forEach>
</tbody>
<tfoot>
<tr >
<td colspan="6" align="center">
<ul class="pagination">
<c:if test="${pageno > 1}">
<li><a href="#" οnclick="changePageno(${pageno-1})">上一页</a></li>
</c:if>
<c:forEach begin="1" end="${totalno}" varStatus="status">
<c:if test="${pageno == status.count}">
<li class="active"><a href="#">${status.count}</a></li>
</c:if>
<c:if test="${pageno != status.count}">
<li ><a href="#" οnclick="changePageno(${status.count})">${status.count}</a></li>
</c:if>
</c:forEach>
<c:if test="${pageno < totalno}">
<li><a href="#" οnclick="changePageno(${pageno+1})">下一页</a></li>
</c:if>
</ul>
</td>
</tr>
</tfoot>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
<script src="${APP_PATH}/jquery/jquery-2.1.1.min.js"></script>
<script src="${APP_PATH}/bootstrap/js/bootstrap.min.js"></script>
<script src="${APP_PATH}/script/docs.min.js"></script>
<script type="text/javascript">
$(function () {
$(".list-group-item").click(function(){
if ( $(this).find("ul") ) {
$(this).toggleClass("tree-closed");
if ( $(this).hasClass("tree-closed") ) {
$("ul", this).hide("fast");
} else {
$("ul", this).show("fast");
}
}
});
});
$("tbody .btn-success").click(function(){
window.location.href = "assignRole.html";
});
$("tbody .btn-primary").click(function(){
window.location.href = "edit.html";
});
// 翻页
function changePageno( pageno ) {
window.location.href = "${APP_PATH}/user/index?pageno="+pageno;
}
</script>
</body>
</html>
assign.jsp
<%@page pageEncoding="UTF-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">
<link rel="stylesheet" href="${APP_PATH}/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" href="${APP_PATH}/css/font-awesome.min.css">
<link rel="stylesheet" href="${APP_PATH}/css/main.css">
<link rel="stylesheet" href="${APP_PATH}/css/doc.min.css">
<style>
.tree li {
list-style-type: none;
cursor:pointer;
}
</style>
</head>
<body>
<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
<div class="container-fluid">
<div class="navbar-header">
<div><a class="navbar-brand" style="font-size:32px;" href="user.html">众筹平台 - 用户维护</a></div>
</div>
<div id="navbar" class="navbar-collapse collapse">
<ul class="nav navbar-nav navbar-right">
<li style="padding-top:8px;">
<div class="btn-group">
<button type="button" class="btn btn-default btn-success dropdown-toggle" data-toggle="dropdown">
<i class="glyphicon glyphicon-user"></i> 张三 <span class="caret"></span>
</button>
<ul class="dropdown-menu" role="menu">
<li><a href="#"><i class="glyphicon glyphicon-cog"></i> 个人设置</a></li>
<li><a href="#"><i class="glyphicon glyphicon-comment"></i> 消息</a></li>
<li class="divider"></li>
<li><a href="login.html"><i class="glyphicon glyphicon-off"></i> 退出系统</a></li>
</ul>
</div>
</li>
<li style="margin-left:10px;padding-top:8px;">
<button type="button" class="btn btn-default btn-danger">
<span class="glyphicon glyphicon-question-sign"></span> 帮助
</button>
</li>
</ul>
<form class="navbar-form navbar-right">
<input type="text" class="form-control" placeholder="Search...">
</form>
</div>
</div>
</nav>
<div class="container-fluid">
<div class="row">
<div class="col-sm-3 col-md-2 sidebar">
<div class="tree">
<ul style="padding-left:0px;" class="list-group">
<li class="list-group-item tree-closed" >
<a href="main.html"><i class="glyphicon glyphicon-dashboard"></i> 控制面板</a>
</li>
<li class="list-group-item">
<span><i class="glyphicon glyphicon glyphicon-tasks"></i> 权限管理 <span class="badge" style="float:right">3</span></span>
<ul style="margin-top:10px;">
<li style="height:30px;">
<a href="user.html" style="color:red;"><i class="glyphicon glyphicon-user"></i> 用户维护</a>
</li>
<li style="height:30px;">
<a href="role.html"><i class="glyphicon glyphicon-certificate"></i> 角色维护</a>
</li>
<li style="height:30px;">
<a href="permission.html"><i class="glyphicon glyphicon-lock"></i> 许可维护</a>
</li>
</ul>
</li>
<li class="list-group-item tree-closed">
<span><i class="glyphicon glyphicon-ok"></i> 业务审核 <span class="badge" style="float:right">3</span></span>
<ul style="margin-top:10px;display:none;">
<li style="height:30px;">
<a href="auth_cert.html"><i class="glyphicon glyphicon-check"></i> 实名认证审核</a>
</li>
<li style="height:30px;">
<a href="auth_adv.html"><i class="glyphicon glyphicon-check"></i> 广告审核</a>
</li>
<li style="height:30px;">
<a href="auth_project.html"><i class="glyphicon glyphicon-check"></i> 项目审核</a>
</li>
</ul>
</li>
<li class="list-group-item tree-closed">
<span><i class="glyphicon glyphicon-th-large"></i> 业务管理 <span class="badge" style="float:right">7</span></span>
<ul style="margin-top:10px;display:none;">
<li style="height:30px;">
<a href="cert.html"><i class="glyphicon glyphicon-picture"></i> 资质维护</a>
</li>
<li style="height:30px;">
<a href="type.html"><i class="glyphicon glyphicon-equalizer"></i> 分类管理</a>
</li>
<li style="height:30px;">
<a href="process.html"><i class="glyphicon glyphicon-random"></i> 流程管理</a>
</li>
<li style="height:30px;">
<a href="advertisement.html"><i class="glyphicon glyphicon-hdd"></i> 广告管理</a>
</li>
<li style="height:30px;">
<a href="message.html"><i class="glyphicon glyphicon-comment"></i> 消息模板</a>
</li>
<li style="height:30px;">
<a href="project_type.html"><i class="glyphicon glyphicon-list"></i> 项目分类</a>
</li>
<li style="height:30px;">
<a href="tag.html"><i class="glyphicon glyphicon-tags"></i> 项目标签</a>
</li>
</ul>
</li>
<li class="list-group-item tree-closed" >
<a href="param.html"><i class="glyphicon glyphicon-list-alt"></i> 参数管理</a>
</li>
</ul>
</div>
</div>
<div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 main">
<ol class="breadcrumb">
<li><a href="#">首页</a></li>
<li><a href="#">数据列表</a></li>
<li class="active">分配角色</li>
</ol>
<div class="panel panel-default">
<div class="panel-body">
<!-- 一个form里2个select -->
<form id="roleForm" role="form" class="form-inline">
<!-- 用一个隐藏域说明哪个用户，get方式传过来的 -->
<input type="hidden" name="userid" value="${user.id}">
<div class="form-group">
<label for="exampleInputPassword1">未分配角色列表</label><br>
<select id="leftList" name="unassignroleids" class="form-control" multiple size="10" style="width:200px;overflow-y:auto;">
<c:forEach items="${unassignRoles}" var="role">
<option value="${role.id}">${role.name}</option>
</c:forEach>
</select>
</div>
<div class="form-group">
<ul>
<li id="left2RightBtn" class="btn btn-default glyphicon glyphicon-chevron-right"></li>
<br>
<li id="right2LeftBtn" class="btn btn-default glyphicon glyphicon-chevron-left" style="margin-top:20px;"></li>
</ul>
</div>
<div class="form-group" style="margin-left:40px;">
<label for="exampleInputPassword1">已分配角色列表</label><br>
<select id="rightList" name="assignroleids" class="form-control" multiple size="10" style="width:200px;overflow-y:auto;">
<c:forEach items="${assingedRoles}" var="role">
<option value="${role.id}">${role.name}</option>
</c:forEach>
</select>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>
<h4 class="modal-title" id="myModalLabel">帮助</h4>
</div>
<div class="modal-body">
<div class="bs-callout bs-callout-info">
<h4>测试标题1</h4>
<p>测试内容1，测试内容1，测试内容1，测试内容1，测试内容1，测试内容1</p>
</div>
<div class="bs-callout bs-callout-info">
<h4>测试标题2</h4>
<p>测试内容2，测试内容2，测试内容2，测试内容2，测试内容2，测试内容2</p>
</div>
</div>
<!--
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary">Save changes</button>
</div>
-->
</div>
</div>
</div>
<script src="${APP_PATH}/jquery/jquery-2.1.1.min.js"></script>
<script src="${APP_PATH}/bootstrap/js/bootstrap.min.js"></script>
<script src="${APP_PATH}/script/docs.min.js"></script>
<script src="${APP_PATH}/layer/layer.js"></script>
<script type="text/javascript">
$(function () {
$(".list-group-item").click(function(){
if ( $(this).find("ul") ) {
$(this).toggleClass("tree-closed");
if ( $(this).hasClass("tree-closed") ) {
$("ul", this).hide("fast");
} else {
$("ul", this).show("fast");
}
}
});
$("#left2RightBtn").click(function(){
var opts = $("#leftList :selected");
if ( opts.length == 0 ) {
layer.msg("请选择需要分配的角色数据", {time:2000, icon:5, shift:6}, function(){
});
} else {
$.ajax({
type : "POST",
url : "${APP_PATH}/user/doAssign",
data : $("#roleForm").serialize(),//只传递了选择的信息
success : function(result) {
if ( result.success ) {
$("#rightList").append(opts);//分配成功后移动数据
layer.msg("分配角色数据成功", {time:2000, icon:6}, function(){
});
} else {
layer.msg("分配角色数据失败", {time:2000, icon:5, shift:6}, function(){
});
}
}
});
}
});
$("#right2LeftBtn").click(function(){
var opts = $("#rightList :selected");
if ( opts.length == 0 ) {
layer.msg("请选择需要取消分配的角色数据", {time:2000, icon:5, shift:6}, function(){
});
} else {
$.ajax({
type : "POST",
url : "${APP_PATH}/user/dounAssign",
data : $("#roleForm").serialize(),
success : function(result) {
if ( result.success ) {
$("#leftList").append(opts);
layer.msg("取消分配角色数据成功", {time:2000, icon:6}, function(){
});
} else {
layer.msg("取消分配角色数据失败", {time:2000, icon:5, shift:6}, function(){
});
}
}
});
}
});
});
</script>
</body>
</html>
jsp/role
assign.jsp
<%@page pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">
<link rel="stylesheet" href="${APP_PATH}/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" href="${APP_PATH}/css/font-awesome.min.css">
<link rel="stylesheet" href="${APP_PATH}/css/main.css">
<link rel="stylesheet" href="${APP_PATH}/ztree/zTreeStyle.css">
<style>
.tree li {
list-style-type: none;
cursor:pointer;
}
table tbody tr:nth-child(odd){background:#F4F4F4;}
table tbody td:nth-child(even){color:#C00;}
</style>
</head>
<body>
<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
<div class="container-fluid">
<div class="navbar-header">
<div><a class="navbar-brand" style="font-size:32px;" href="#">众筹平台 - 角色维护</a></div>
</div>
<div id="navbar" class="navbar-collapse collapse">
<ul class="nav navbar-nav navbar-right">
<li style="padding-top:8px;">
<div class="btn-group">
<button type="button" class="btn btn-default btn-success dropdown-toggle" data-toggle="dropdown">
<i class="glyphicon glyphicon-role"></i> 张三 <span class="caret"></span>
</button>
<ul class="dropdown-menu" role="menu">
<li><a href="#"><i class="glyphicon glyphicon-cog"></i> 个人设置</a></li>
<li><a href="#"><i class="glyphicon glyphicon-comment"></i> 消息</a></li>
<li class="divider"></li>
<li><a href="index.html"><i class="glyphicon glyphicon-off"></i> 退出系统</a></li>
</ul>
</div>
</li>
<li style="margin-left:10px;padding-top:8px;">
<button type="button" class="btn btn-default btn-danger">
<span class="glyphicon glyphicon-question-sign"></span> 帮助
</button>
</li>
</ul>
<form class="navbar-form navbar-right">
<input type="text" class="form-control" placeholder="Search...">
</form>
</div>
</div>
</nav>
<div class="container-fluid">
<div class="row">
<div class="col-sm-3 col-md-2 sidebar">
<div class="tree">
<ul style="padding-left:0px;" class="list-group">
<li class="list-group-item tree-closed" >
<a href="main.html"><i class="glyphicon glyphicon-dashboard"></i> 控制面板</a>
</li>
<li class="list-group-item">
<span><i class="glyphicon glyphicon glyphicon-tasks"></i> 权限管理 <span class="badge" style="float:right">3</span></span>
<ul style="margin-top:10px;">
<li style="height:30px;">
<a href="role.html" ><i class="glyphicon glyphicon-user"></i> 用户维护</a>
</li>
<li style="height:30px;">
<a href="role.html" style="color:red;"><i class="glyphicon glyphicon-king"></i> 角色维护</a>
</li>
<li style="height:30px;">
<a href="permission.html"><i class="glyphicon glyphicon-lock"></i> 许可维护</a>
</li>
</ul>
</li>
<li class="list-group-item tree-closed">
<span><i class="glyphicon glyphicon-ok"></i> 业务审核 <span class="badge" style="float:right">3</span></span>
<ul style="margin-top:10px;display:none;">
<li style="height:30px;">
<a href="auth_cert.html"><i class="glyphicon glyphicon-check"></i> 实名认证审核</a>
</li>
<li style="height:30px;">
<a href="auth_adv.html"><i class="glyphicon glyphicon-check"></i> 广告审核</a>
</li>
<li style="height:30px;">
<a href="auth_project.html"><i class="glyphicon glyphicon-check"></i> 项目审核</a>
</li>
</ul>
</li>
<li class="list-group-item tree-closed">
<span><i class="glyphicon glyphicon-th-large"></i> 业务管理 <span class="badge" style="float:right">7</span></span>
<ul style="margin-top:10px;display:none;">
<li style="height:30px;">
<a href="cert.html"><i class="glyphicon glyphicon-picture"></i> 资质维护</a>
</li>
<li style="height:30px;">
<a href="type.html"><i class="glyphicon glyphicon-equalizer"></i> 分类管理</a>
</li>
<li style="height:30px;">
<a href="process.html"><i class="glyphicon glyphicon-random"></i> 流程管理</a>
</li>
<li style="height:30px;">
<a href="advertisement.html"><i class="glyphicon glyphicon-hdd"></i> 广告管理</a>
</li>
<li style="height:30px;">
<a href="message.html"><i class="glyphicon glyphicon-comment"></i> 消息模板</a>
</li>
<li style="height:30px;">
<a href="project_type.html"><i class="glyphicon glyphicon-list"></i> 项目分类</a>
</li>
<li style="height:30px;">
<a href="tag.html"><i class="glyphicon glyphicon-tags"></i> 项目标签</a>
</li>
</ul>
</li>
<li class="list-group-item tree-closed" >
<a href="param.html"><i class="glyphicon glyphicon-list-alt"></i> 参数管理</a>
</li>
</ul>
</div>
</div>
<div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 main">
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title"><i class="glyphicon glyphicon-th"></i> 数据列表</h3>
</div>
<div class="panel-body">
<button class="btn btn-success" οnclick="doAssign()">分配许可</button>
<ul id="permissionTree" class="ztree"></ul>
</div>
</div>
</div>
</div>
</div>
<script src="${APP_PATH}/jquery/jquery-2.1.1.min.js"></script>
<script src="${APP_PATH}/bootstrap/js/bootstrap.min.js"></script>
<script src="${APP_PATH}/script/docs.min.js"></script>
<script src="${APP_PATH}/layer/layer.js"></script>
<script src="${APP_PATH}/ztree/jquery.ztree.all-3.5.min.js"></script>
<script type="text/javascript">
$(function () {
$(".list-group-item").click(function(){
if ( $(this).find("ul") ) {
$(this).toggleClass("tree-closed");
if ( $(this).hasClass("tree-closed") ) {
$("ul", this).hide("fast");
} else {
$("ul", this).show("fast");
}
}
});
var setting = {
check : {
enable : true
},
async: {
enable: true,
url:"${APP_PATH}/permission/loadAssignData?roleid=${param.id}",
autoParam:["id", "name=n", "level=lv"]
},
view: {
selectedMulti: false,
addDiyDom: function(treeId, treeNode){
var icoObj = $("#" + treeNode.tId + "_ico"); // tId = permissionTree_1, $("#permissionTree_1_ico")
if ( treeNode.icon ) {
icoObj.removeClass("button ico_docu ico_open").addClass(treeNode.icon).css("background","");
}
}
}
};
$.fn.zTree.init($("#permissionTree"), setting);
});
function doAssign() {
var treeObj = $.fn.zTree.getZTreeObj("permissionTree");
var nodes = treeObj.getCheckedNodes(true);
if ( nodes.length == 0 ) {
layer.msg("请选择需要分配的许可信息", {time:2000, icon:5, shift:6}, function(){
});
} else {
var d = "roleid=${param.id}";
$.each(nodes, function(i, node){
d += "&permissionids="+node.id
});
$.ajax({
type : "POST",
url : "${APP_PATH}/role/doAssign",
data : d,
success : function (result) {
if ( result ) {
layer.msg("分配许可信息成功", {time:2000, icon:6}, function(){
});
} else {
layer.msg("分配许可信息失败", {time:2000, icon:5, shift:6}, function(){
});
}
}
});
}
}
</script>
</body>
</html>
index.jsp
<%@page pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">
<link rel="stylesheet" href="${APP_PATH}/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" href="${APP_PATH}/css/font-awesome.min.css">
<link rel="stylesheet" href="${APP_PATH}/css/main.css">
<style>
.tree li {
list-style-type: none;
cursor:pointer;
}
table tbody tr:nth-child(odd){background:#F4F4F4;}
table tbody td:nth-child(even){color:#C00;}
</style>
</head>
<body>
<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
<div class="container-fluid">
<div class="navbar-header">
<div><a class="navbar-brand" style="font-size:32px;" href="#">众筹平台 - 角色维护</a></div>
</div>
<div id="navbar" class="navbar-collapse collapse">
<ul class="nav navbar-nav navbar-right">
<li style="padding-top:8px;">
<div class="btn-group">
<button type="button" class="btn btn-default btn-success dropdown-toggle" data-toggle="dropdown">
<i class="glyphicon glyphicon-role"></i> 张三 <span class="caret"></span>
</button>
<ul class="dropdown-menu" role="menu">
<li><a href="#"><i class="glyphicon glyphicon-cog"></i> 个人设置</a></li>
<li><a href="#"><i class="glyphicon glyphicon-comment"></i> 消息</a></li>
<li class="divider"></li>
<li><a href="index.html"><i class="glyphicon glyphicon-off"></i> 退出系统</a></li>
</ul>
</div>
</li>
<li style="margin-left:10px;padding-top:8px;">
<button type="button" class="btn btn-default btn-danger">
<span class="glyphicon glyphicon-question-sign"></span> 帮助
</button>
</li>
</ul>
<form class="navbar-form navbar-right">
<input type="text" class="form-control" placeholder="Search...">
</form>
</div>
</div>
</nav>
<div class="container-fluid">
<div class="row">
<div class="col-sm-3 col-md-2 sidebar">
<div class="tree">
<ul style="padding-left:0px;" class="list-group">
<li class="list-group-item tree-closed" >
<a href="main.html"><i class="glyphicon glyphicon-dashboard"></i> 控制面板</a>
</li>
<li class="list-group-item">
<span><i class="glyphicon glyphicon glyphicon-tasks"></i> 权限管理 <span class="badge" style="float:right">3</span></span>
<ul style="margin-top:10px;">
<li style="height:30px;">
<a href="role.html" ><i class="glyphicon glyphicon-user"></i> 用户维护</a>
</li>
<li style="height:30px;">
<a href="role.html" style="color:red;"><i class="glyphicon glyphicon-king"></i> 角色维护</a>
</li>
<li style="height:30px;">
<a href="permission.html"><i class="glyphicon glyphicon-lock"></i> 许可维护</a>
</li>
</ul>
</li>
<li class="list-group-item tree-closed">
<span><i class="glyphicon glyphicon-ok"></i> 业务审核 <span class="badge" style="float:right">3</span></span>
<ul style="margin-top:10px;display:none;">
<li style="height:30px;">
<a href="auth_cert.html"><i class="glyphicon glyphicon-check"></i> 实名认证审核</a>
</li>
<li style="height:30px;">
<a href="auth_adv.html"><i class="glyphicon glyphicon-check"></i> 广告审核</a>
</li>
<li style="height:30px;">
<a href="auth_project.html"><i class="glyphicon glyphicon-check"></i> 项目审核</a>
</li>
</ul>
</li>
<li class="list-group-item tree-closed">
<span><i class="glyphicon glyphicon-th-large"></i> 业务管理 <span class="badge" style="float:right">7</span></span>
<ul style="margin-top:10px;display:none;">
<li style="height:30px;">
<a href="cert.html"><i class="glyphicon glyphicon-picture"></i> 资质维护</a>
</li>
<li style="height:30px;">
<a href="type.html"><i class="glyphicon glyphicon-equalizer"></i> 分类管理</a>
</li>
<li style="height:30px;">
<a href="process.html"><i class="glyphicon glyphicon-random"></i> 流程管理</a>
</li>
<li style="height:30px;">
<a href="advertisement.html"><i class="glyphicon glyphicon-hdd"></i> 广告管理</a>
</li>
<li style="height:30px;">
<a href="message.html"><i class="glyphicon glyphicon-comment"></i> 消息模板</a>
</li>
<li style="height:30px;">
<a href="project_type.html"><i class="glyphicon glyphicon-list"></i> 项目分类</a>
</li>
<li style="height:30px;">
<a href="tag.html"><i class="glyphicon glyphicon-tags"></i> 项目标签</a>
</li>
</ul>
</li>
<li class="list-group-item tree-closed" >
<a href="param.html"><i class="glyphicon glyphicon-list-alt"></i> 参数管理</a>
</li>
</ul>
</div>
</div>
<div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 main">
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title"><i class="glyphicon glyphicon-th"></i> 数据列表</h3>
</div>
<div class="panel-body">
<form class="form-inline" role="form" style="float:left;">
<div class="form-group has-feedback">
<div class="input-group">
<div class="input-group-addon">查询条件</div>
<input id="queryText" class="form-control has-success" type="text" placeholder="请输入查询条件">
</div>
</div>
<button id="queryBtn" type="button" class="btn btn-warning"><i class="glyphicon glyphicon-search"></i> 查询</button>
</form>
<button type="button" class="btn btn-danger" οnclick="deleteUsers()" style="float:right;margin-left:10px;"><i class=" glyphicon glyphicon-remove"></i> 删除</button>
<button type="button" class="btn btn-primary" style="float:right;" οnclick="window.location.href='${APP_PATH}/role/add'"><i class="glyphicon glyphicon-plus"></i> 新增</button>
<br>
<hr style="clear:both;">
<div class="table-responsive">
<form id="roleForm">
<table class="table table-bordered">
<thead>
<tr >
<th width="30">#</th>
<th width="30"><input type="checkbox" id="allSelBox"></th>
<th>名称</th>
<th width="100">操作</th>
</tr>
</thead>
<tbody id="roleData">
</tbody>
<tfoot>
<tr >
<td colspan="6" align="center">
<ul class="pagination">
</ul>
</td>
</tr>
</tfoot>
</table>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
<script src="${APP_PATH}/jquery/jquery-2.1.1.min.js"></script>
<script src="${APP_PATH}/bootstrap/js/bootstrap.min.js"></script>
<script src="${APP_PATH}/script/docs.min.js"></script>
<script src="${APP_PATH}/layer/layer.js"></script>
<script type="text/javascript">
var likeflg = false;
$(function () {
$(".list-group-item").click(function(){
if ( $(this).find("ul") ) {
$(this).toggleClass("tree-closed");
if ( $(this).hasClass("tree-closed") ) {
$("ul", this).hide("fast");
} else {
$("ul", this).show("fast");
}
}
});
pageQuery(1);
$("#queryBtn").click(function(){
var queryText = $("#queryText").val();
if ( queryText == "" ) {
likeflg = false;
} else {
likeflg = true;
}
pageQuery(1);
});
$("#allSelBox").click(function(){
var flg = this.checked;
$("#roleData :checkbox").each(function(){
this.checked = flg;
});
});
});
// 分页查询
function pageQuery( pageno ) {
var loadingIndex = null;
var jsonData = {"pageno" : pageno, "pagesize" : 10};
if ( likeflg == true ) {
jsonData.queryText = $("#queryText").val();
}
$.ajax({
type : "POST",
url : "${APP_PATH}/role/pageQuery",
data : jsonData,
beforeSend : function(){
loadingIndex = layer.msg('处理中', {icon: 16});
},
success : function(result) {
layer.close(loadingIndex);
if ( result.success ) {
// 局部刷新页面数据
var tableContent = "";
var pageContent = "";
var rolePage = result.data;
var roles = rolePage.datas;
$.each(roles, function(i, role){
tableContent += '<tr>';
tableContent += ' <td>'+(i+1)+'</td>';
tableContent += ' <td><input type="checkbox" name="roleid" value="'+role.id+'"></td>';
tableContent += ' <td>'+role.name+'</td>';
tableContent += ' <td>';
tableContent += ' <button type="button" οnclick="goAssignPage('+role.id+')" class="btn btn-success btn-xs"><i class=" glyphicon glyphicon-check"></i></button>';
tableContent += ' <button type="button" οnclick="goUpdatePage('+role.id+')" class="btn btn-primary btn-xs"><i class=" glyphicon glyphicon-pencil"></i></button>';
tableContent += ' <button type="button" οnclick="" class="btn btn-danger btn-xs"><i class=" glyphicon glyphicon-remove"></i></button>';
tableContent += ' </td>';
tableContent += '</tr>';
});
if ( pageno > 1 ) {
pageContent += '<li><a href="#" οnclick="pageQuery('+(pageno-1)+')">上一页</a></li>';
}
for ( var i = 1; i <= rolePage.totalno; i++ ) {
if ( i == pageno ) {
pageContent += '<li class="active"><a href="#">'+i+'</a></li>';
} else {
pageContent += '<li ><a href="#" οnclick="pageQuery('+i+')">'+i+'</a></li>';
}
}
if ( pageno < rolePage.totalno ) {
pageContent += '<li><a href="#" οnclick="pageQuery('+(pageno+1)+')">下一页</a></li>';
}
$("#roleData").html(tableContent);
$(".pagination").html(pageContent);
} else {
layer.msg("角色信息分页查询失败", {time:2000, icon:5, shift:6}, function(){
});
}
}
});
}
function goAssignPage(id) {
window.location.href = "${APP_PATH}/role/assign?id="+id;
}
</script>
</body>
</html>
/jsp/permission/
add.jsp
<%@page pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">
<link rel="stylesheet" href="${APP_PATH}/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" href="${APP_PATH}/css/font-awesome.min.css">
<link rel="stylesheet" href="${APP_PATH}/css/main.css">
<link rel="stylesheet" href="${APP_PATH}/css/doc.min.css">
<style>
.tree li {
list-style-type: none;
cursor:pointer;
}
</style>
</head>
<body>
<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
<div class="container-fluid">
<div class="navbar-header">
<div><a class="navbar-brand" style="font-size:32px;" href="user.html">众筹平台 - 用户维护</a></div>
</div>
<div id="navbar" class="navbar-collapse collapse">
<ul class="nav navbar-nav navbar-right">
<li style="padding-top:8px;">
<div class="btn-group">
<button type="button" class="btn btn-default btn-success dropdown-toggle" data-toggle="dropdown">
<i class="glyphicon glyphicon-user"></i> 张三 <span class="caret"></span>
</button>
<ul class="dropdown-menu" role="menu">
<li><a href="#"><i class="glyphicon glyphicon-cog"></i> 个人设置</a></li>
<li><a href="#"><i class="glyphicon glyphicon-comment"></i> 消息</a></li>
<li class="divider"></li>
<li><a href="login.html"><i class="glyphicon glyphicon-off"></i> 退出系统</a></li>
</ul>
</div>
</li>
<li style="margin-left:10px;padding-top:8px;">
<button type="button" class="btn btn-default btn-danger">
<span class="glyphicon glyphicon-question-sign"></span> 帮助
</button>
</li>
</ul>
<form class="navbar-form navbar-right">
<input type="text" class="form-control" placeholder="Search...">
</form>
</div>
</div>
</nav>
<div class="container-fluid">
<div class="row">
<div class="col-sm-3 col-md-2 sidebar">
<div class="tree">
<ul style="padding-left:0px;" class="list-group">
<li class="list-group-item tree-closed" >
<a href="main.html"><i class="glyphicon glyphicon-dashboard"></i> 控制面板</a>
</li>
<li class="list-group-item">
<span><i class="glyphicon glyphicon glyphicon-tasks"></i> 权限管理 <span class="badge" style="float:right">3</span></span>
<ul style="margin-top:10px;">
<li style="height:30px;">
<a href="user.html" style="color:red;"><i class="glyphicon glyphicon-user"></i> 用户维护</a>
</li>
<li style="height:30px;">
<a href="role.html"><i class="glyphicon glyphicon-certificate"></i> 角色维护</a>
</li>
<li style="height:30px;">
<a href="permission.html"><i class="glyphicon glyphicon-lock"></i> 许可维护</a>
</li>
</ul>
</li>
<li class="list-group-item tree-closed">
<span><i class="glyphicon glyphicon-ok"></i> 业务审核 <span class="badge" style="float:right">3</span></span>
<ul style="margin-top:10px;display:none;">
<li style="height:30px;">
<a href="auth_cert.html"><i class="glyphicon glyphicon-check"></i> 实名认证审核</a>
</li>
<li style="height:30px;">
<a href="auth_adv.html"><i class="glyphicon glyphicon-check"></i> 广告审核</a>
</li>
<li style="height:30px;">
<a href="auth_project.html"><i class="glyphicon glyphicon-check"></i> 项目审核</a>
</li>
</ul>
</li>
<li class="list-group-item tree-closed">
<span><i class="glyphicon glyphicon-th-large"></i> 业务管理 <span class="badge" style="float:right">7</span></span>
<ul style="margin-top:10px;display:none;">
<li style="height:30px;">
<a href="cert.html"><i class="glyphicon glyphicon-picture"></i> 资质维护</a>
</li>
<li style="height:30px;">
<a href="type.html"><i class="glyphicon glyphicon-equalizer"></i> 分类管理</a>
</li>
<li style="height:30px;">
<a href="process.html"><i class="glyphicon glyphicon-random"></i> 流程管理</a>
</li>
<li style="height:30px;">
<a href="advertisement.html"><i class="glyphicon glyphicon-hdd"></i> 广告管理</a>
</li>
<li style="height:30px;">
<a href="message.html"><i class="glyphicon glyphicon-comment"></i> 消息模板</a>
</li>
<li style="height:30px;">
<a href="project_type.html"><i class="glyphicon glyphicon-list"></i> 项目分类</a>
</li>
<li style="height:30px;">
<a href="tag.html"><i class="glyphicon glyphicon-tags"></i> 项目标签</a>
</li>
</ul>
</li>
<li class="list-group-item tree-closed" >
<a href="param.html"><i class="glyphicon glyphicon-list-alt"></i> 参数管理</a>
</li>
</ul>
</div>
</div>
<div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 main">
<ol class="breadcrumb">
<li><a href="#">首页</a></li>
<li><a href="#">数据列表</a></li>
<li class="active">新增</li>
</ol>
<div class="panel panel-default">
<div class="panel-heading">表单数据<div style="float:right;cursor:pointer;" data-toggle="modal" data-target="#myModal"><i class="glyphicon glyphicon-question-sign"></i></div></div>
<div class="panel-body">
<form role="form">
<div class="form-group">
<label for="exampleInputPassword1">许可名称</label>
<input type="text" class="form-control" id="permissionname" placeholder="请输入许可名称">
</div>
<div class="form-group">
<label for="exampleInputPassword1">链接地址</label>
<input type="text" class="form-control" id="url" placeholder="请输入链接地址">
</div>
<button id="insertBtn" type="button" class="btn btn-success"><i class="glyphicon glyphicon-plus"></i> 新增</button>
<button type="button" class="btn btn-danger"><i class="glyphicon glyphicon-refresh"></i> 重置</button>
</form>
</div>
</div>
</div>
</div>
</div>
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>
<h4 class="modal-title" id="myModalLabel">帮助</h4>
</div>
<div class="modal-body">
<div class="bs-callout bs-callout-info">
<h4>测试标题1</h4>
<p>测试内容1，测试内容1，测试内容1，测试内容1，测试内容1，测试内容1</p>
</div>
<div class="bs-callout bs-callout-info">
<h4>测试标题2</h4>
<p>测试内容2，测试内容2，测试内容2，测试内容2，测试内容2，测试内容2</p>
</div>
</div>
<!--
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary">Save changes</button>
</div>
-->
</div>
</div>
</div>
<script src="${APP_PATH}/jquery/jquery-2.1.1.min.js"></script>
<script src="${APP_PATH}/bootstrap/js/bootstrap.min.js"></script>
<script src="${APP_PATH}/script/docs.min.js"></script>
<script src="${APP_PATH}/layer/layer.js"></script>
<script type="text/javascript">
$(function () {
$(".list-group-item").click(function(){
if ( $(this).find("ul") ) {
$(this).toggleClass("tree-closed");
if ( $(this).hasClass("tree-closed") ) {
$("ul", this).hide("fast");
} else {
$("ul", this).show("fast");
}
}
});
$("#insertBtn").click(function(){
var permissionname = $("#permissionname").val();
if ( permissionname == "" ) {
layer.msg("许可名称不能为空，请输入", {time:2000, icon:5, shift:6}, function(){
});
return;
}
var loadingIndex = null;
$.ajax({
type : "POST",
url : "${APP_PATH}/permission/insert",
data : {
"name" : permissionname,
"url" : $("#url").val(),
"pid" : "${param.id}"
},
beforeSend : function() {
loadingIndex = layer.msg('处理中', {icon: 16});
},
success : function(result) {
layer.close(loadingIndex);
if ( result.success ) {
layer.msg("许可信息保存成功", {time:1000, icon:6}, function(){
window.location.href = "${APP_PATH}/permission/index";
});
} else {
layer.msg("许可信息保存失败，请重新操作", {time:2000, icon:5, shift:6}, function(){
});
}
}
});
});
});
</script>
</body>
</html>
edit.jsp
<%@page pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">
<link rel="stylesheet" href="${APP_PATH}/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" href="${APP_PATH}/css/font-awesome.min.css">
<link rel="stylesheet" href="${APP_PATH}/css/main.css">
<link rel="stylesheet" href="${APP_PATH}/css/doc.min.css">
<style>
.tree li {
list-style-type: none;
cursor:pointer;
}
</style>
</head>
<body>
<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
<div class="container-fluid">
<div class="navbar-header">
<div><a class="navbar-brand" style="font-size:32px;" href="user.html">众筹平台 - 用户维护</a></div>
</div>
<div id="navbar" class="navbar-collapse collapse">
<ul class="nav navbar-nav navbar-right">
<li style="padding-top:8px;">
<div class="btn-group">
<button type="button" class="btn btn-default btn-success dropdown-toggle" data-toggle="dropdown">
<i class="glyphicon glyphicon-user"></i> 张三 <span class="caret"></span>
</button>
<ul class="dropdown-menu" role="menu">
<li><a href="#"><i class="glyphicon glyphicon-cog"></i> 个人设置</a></li>
<li><a href="#"><i class="glyphicon glyphicon-comment"></i> 消息</a></li>
<li class="divider"></li>
<li><a href="login.html"><i class="glyphicon glyphicon-off"></i> 退出系统</a></li>
</ul>
</div>
</li>
<li style="margin-left:10px;padding-top:8px;">
<button type="button" class="btn btn-default btn-danger">
<span class="glyphicon glyphicon-question-sign"></span> 帮助
</button>
</li>
</ul>
<form class="navbar-form navbar-right">
<input type="text" class="form-control" placeholder="Search...">
</form>
</div>
</div>
</nav>
<div class="container-fluid">
<div class="row">
<div class="col-sm-3 col-md-2 sidebar">
<div class="tree">
<ul style="padding-left:0px;" class="list-group">
<li class="list-group-item tree-closed" >
<a href="main.html"><i class="glyphicon glyphicon-dashboard"></i> 控制面板</a>
</li>
<li class="list-group-item">
<span><i class="glyphicon glyphicon glyphicon-tasks"></i> 权限管理 <span class="badge" style="float:right">3</span></span>
<ul style="margin-top:10px;">
<li style="height:30px;">
<a href="user.html" style="color:red;"><i class="glyphicon glyphicon-user"></i> 用户维护</a>
</li>
<li style="height:30px;">
<a href="role.html"><i class="glyphicon glyphicon-certificate"></i> 角色维护</a>
</li>
<li style="height:30px;">
<a href="permission.html"><i class="glyphicon glyphicon-lock"></i> 许可维护</a>
</li>
</ul>
</li>
<li class="list-group-item tree-closed">
<span><i class="glyphicon glyphicon-ok"></i> 业务审核 <span class="badge" style="float:right">3</span></span>
<ul style="margin-top:10px;display:none;">
<li style="height:30px;">
<a href="auth_cert.html"><i class="glyphicon glyphicon-check"></i> 实名认证审核</a>
</li>
<li style="height:30px;">
<a href="auth_adv.html"><i class="glyphicon glyphicon-check"></i> 广告审核</a>
</li>
<li style="height:30px;">
<a href="auth_project.html"><i class="glyphicon glyphicon-check"></i> 项目审核</a>
</li>
</ul>
</li>
<li class="list-group-item tree-closed">
<span><i class="glyphicon glyphicon-th-large"></i> 业务管理 <span class="badge" style="float:right">7</span></span>
<ul style="margin-top:10px;display:none;">
<li style="height:30px;">
<a href="cert.html"><i class="glyphicon glyphicon-picture"></i> 资质维护</a>
</li>
<li style="height:30px;">
<a href="type.html"><i class="glyphicon glyphicon-equalizer"></i> 分类管理</a>
</li>
<li style="height:30px;">
<a href="process.html"><i class="glyphicon glyphicon-random"></i> 流程管理</a>
</li>
<li style="height:30px;">
<a href="advertisement.html"><i class="glyphicon glyphicon-hdd"></i> 广告管理</a>
</li>
<li style="height:30px;">
<a href="message.html"><i class="glyphicon glyphicon-comment"></i> 消息模板</a>
</li>
<li style="height:30px;">
<a href="project_type.html"><i class="glyphicon glyphicon-list"></i> 项目分类</a>
</li>
<li style="height:30px;">
<a href="tag.html"><i class="glyphicon glyphicon-tags"></i> 项目标签</a>
</li>
</ul>
</li>
<li class="list-group-item tree-closed" >
<a href="param.html"><i class="glyphicon glyphicon-list-alt"></i> 参数管理</a>
</li>
</ul>
</div>
</div>
<div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 main">
<ol class="breadcrumb">
<li><a href="#">首页</a></li>
<li><a href="#">数据列表</a></li>
<li class="active">修改</li>
</ol>
<div class="panel panel-default">
<div class="panel-heading">表单数据<div style="float:right;cursor:pointer;" data-toggle="modal" data-target="#myModal"><i class="glyphicon glyphicon-question-sign"></i></div></div>
<div class="panel-body">
<form role="form">
<div class="form-group">
<label for="exampleInputPassword1">许可名称</label>
<input type="text" class="form-control" value="${permission.name}" id="permissionname" placeholder="请输入许可名称">
</div>
<div class="form-group">
<label for="exampleInputPassword1">链接地址</label>
<input type="text" class="form-control" value="${permission.url}" id="url" placeholder="请输入链接地址">
</div>
<button id="updateBtn" type="button" class="btn btn-success"><i class="glyphicon glyphicon-pencil"></i> 修改</button>
<button type="button" class="btn btn-danger"><i class="glyphicon glyphicon-refresh"></i> 重置</button>
</form>
</div>
</div>
</div>
</div>
</div>
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>
<h4 class="modal-title" id="myModalLabel">帮助</h4>
</div>
<div class="modal-body">
<div class="bs-callout bs-callout-info">
<h4>测试标题1</h4>
<p>测试内容1，测试内容1，测试内容1，测试内容1，测试内容1，测试内容1</p>
</div>
<div class="bs-callout bs-callout-info">
<h4>测试标题2</h4>
<p>测试内容2，测试内容2，测试内容2，测试内容2，测试内容2，测试内容2</p>
</div>
</div>
<!--
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary">Save changes</button>
</div>
-->
</div>
</div>
</div>
<script src="${APP_PATH}/jquery/jquery-2.1.1.min.js"></script>
<script src="${APP_PATH}/bootstrap/js/bootstrap.min.js"></script>
<script src="${APP_PATH}/script/docs.min.js"></script>
<script src="${APP_PATH}/layer/layer.js"></script>
<script type="text/javascript">
$(function () {
$(".list-group-item").click(function(){
if ( $(this).find("ul") ) {
$(this).toggleClass("tree-closed");
if ( $(this).hasClass("tree-closed") ) {
$("ul", this).hide("fast");
} else {
$("ul", this).show("fast");
}
}
});
$("#updateBtn").click(function(){
var permissionname = $("#permissionname").val();
if ( permissionname == "" ) {
layer.msg("许可名称不能为空，请输入", {time:2000, icon:5, shift:6}, function(){
});
return;
}
var loadingIndex = null;
$.ajax({
type : "POST",
url : "${APP_PATH}/permission/update",
data : {
"name" : permissionname,
"url" : $("#url").val(),
"id" : "${param.id}"
},
beforeSend : function() {
loadingIndex = layer.msg('处理中', {icon: 16});
},
success : function(result) {
layer.close(loadingIndex);
if ( result.success ) {
layer.msg("许可信息修改成功", {time:1000, icon:6}, function(){
window.location.href = "${APP_PATH}/permission/index";
});
} else {
layer.msg("许可信息修改失败，请重新操作", {time:2000, icon:5, shift:6}, function(){
});
}
}
});
});
});
</script>
</body>
</html>
index.jsp
<%@page pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">
<link rel="stylesheet" href="${APP_PATH}/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" href="${APP_PATH}/css/font-awesome.min.css">
<link rel="stylesheet" href="${APP_PATH}/css/main.css">
<link rel="stylesheet" href="${APP_PATH}/ztree/zTreeStyle.css">
<style>
.tree li {
list-style-type: none;
cursor:pointer;
}
table tbody tr:nth-child(odd){background:#F4F4F4;}
table tbody td:nth-child(even){color:#C00;}
</style>
</head>
<body>
<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
<div class="container-fluid">
<div class="navbar-header">
<div><a class="navbar-brand" style="font-size:32px;" href="#">众筹平台 - 角色维护</a></div>
</div>
<div id="navbar" class="navbar-collapse collapse">
<ul class="nav navbar-nav navbar-right">
<li style="padding-top:8px;">
<div class="btn-group">
<button type="button" class="btn btn-default btn-success dropdown-toggle" data-toggle="dropdown">
<i class="glyphicon glyphicon-role"></i> 张三 <span class="caret"></span>
</button>
<ul class="dropdown-menu" role="menu">
<li><a href="#"><i class="glyphicon glyphicon-cog"></i> 个人设置</a></li>
<li><a href="#"><i class="glyphicon glyphicon-comment"></i> 消息</a></li>
<li class="divider"></li>
<li><a href="index.html"><i class="glyphicon glyphicon-off"></i> 退出系统</a></li>
</ul>
</div>
</li>
<li style="margin-left:10px;padding-top:8px;">
<button type="button" class="btn btn-default btn-danger">
<span class="glyphicon glyphicon-question-sign"></span> 帮助
</button>
</li>
</ul>
<form class="navbar-form navbar-right">
<input type="text" class="form-control" placeholder="Search...">
</form>
</div>
</div>
</nav>
<div class="container-fluid">
<div class="row">
<div class="col-sm-3 col-md-2 sidebar">
<div class="tree">
<ul style="padding-left:0px;" class="list-group">
<li class="list-group-item tree-closed" >
<a href="main.html"><i class="glyphicon glyphicon-dashboard"></i> 控制面板</a>
</li>
<li class="list-group-item">
<span><i class="glyphicon glyphicon glyphicon-tasks"></i> 权限管理 <span class="badge" style="float:right">3</span></span>
<ul style="margin-top:10px;">
<li style="height:30px;">
<a href="role.html" ><i class="glyphicon glyphicon-user"></i> 用户维护</a>
</li>
<li style="height:30px;">
<a href="role.html" style="color:red;"><i class="glyphicon glyphicon-king"></i> 角色维护</a>
</li>
<li style="height:30px;">
<a href="permission.html"><i class="glyphicon glyphicon-lock"></i> 许可维护</a>
</li>
</ul>
</li>
<li class="list-group-item tree-closed">
<span><i class="glyphicon glyphicon-ok"></i> 业务审核 <span class="badge" style="float:right">3</span></span>
<ul style="margin-top:10px;display:none;">
<li style="height:30px;">
<a href="auth_cert.html"><i class="glyphicon glyphicon-check"></i> 实名认证审核</a>
</li>
<li style="height:30px;">
<a href="auth_adv.html"><i class="glyphicon glyphicon-check"></i> 广告审核</a>
</li>
<li style="height:30px;">
<a href="auth_project.html"><i class="glyphicon glyphicon-check"></i> 项目审核</a>
</li>
</ul>
</li>
<li class="list-group-item tree-closed">
<span><i class="glyphicon glyphicon-th-large"></i> 业务管理 <span class="badge" style="float:right">7</span></span>
<ul style="margin-top:10px;display:none;">
<li style="height:30px;">
<a href="cert.html"><i class="glyphicon glyphicon-picture"></i> 资质维护</a>
</li>
<li style="height:30px;">
<a href="type.html"><i class="glyphicon glyphicon-equalizer"></i> 分类管理</a>
</li>
<li style="height:30px;">
<a href="process.html"><i class="glyphicon glyphicon-random"></i> 流程管理</a>
</li>
<li style="height:30px;">
<a href="advertisement.html"><i class="glyphicon glyphicon-hdd"></i> 广告管理</a>
</li>
<li style="height:30px;">
<a href="message.html"><i class="glyphicon glyphicon-comment"></i> 消息模板</a>
</li>
<li style="height:30px;">
<a href="project_type.html"><i class="glyphicon glyphicon-list"></i> 项目分类</a>
</li>
<li style="height:30px;">
<a href="tag.html"><i class="glyphicon glyphicon-tags"></i> 项目标签</a>
</li>
</ul>
</li>
<li class="list-group-item tree-closed" >
<a href="param.html"><i class="glyphicon glyphicon-list-alt"></i> 参数管理</a>
</li>
</ul>
</div>
</div>
<div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 main">
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title"><i class="glyphicon glyphicon-th"></i> 数据列表</h3>
</div>
<div class="panel-body">
<ul id="permissionTree" class="ztree"></ul>
</div>
</div>
</div>
</div>
</div>
<script src="${APP_PATH}/jquery/jquery-2.1.1.min.js"></script>
<script src="${APP_PATH}/bootstrap/js/bootstrap.min.js"></script>
<script src="${APP_PATH}/script/docs.min.js"></script>
<script src="${APP_PATH}/layer/layer.js"></script>
<script src="${APP_PATH}/ztree/jquery.ztree.all-3.5.min.js"></script>
<script type="text/javascript">
$(function () {
$(".list-group-item").click(function(){
if ( $(this).find("ul") ) {
$(this).toggleClass("tree-closed");
if ( $(this).hasClass("tree-closed") ) {
$("ul", this).hide("fast");
} else {
$("ul", this).show("fast");
}
}
});
var setting = {
async: {//异步加载
enable: true,
url:"${APP_PATH}/permission/loadData",
autoParam:["id", "name=n", "level=lv"]
},
view: {
selectedMulti: false,
addDiyDom: function(treeId, treeNode){
var icoObj = $("#" + treeNode.tId + "_ico"); // tId = permissionTree_1, $("#permissionTree_1_ico")
if ( treeNode.icon ) {
icoObj.removeClass("button ico_docu ico_open").addClass(treeNode.icon).css("background","");
}
},
addHoverDom: function(treeId, treeNode){
// <a><span></span></a>
var aObj = $("#" + treeNode.tId + "_a"); // tId = permissionTree_1, ==> $("#permissionTree_1_a")
aObj.attr("href", "javascript:;");
if (treeNode.editNameFlag || $("#btnGroup"+treeNode.tId).length>0) return;
var s = '<span id="btnGroup'+treeNode.tId+'">';
if ( treeNode.level == 0 ) {
s += '<a class="btn btn-info dropdown-toggle btn-xs" style="margin-left:10px;padding-top:0px;" οnclick="addNode('+treeNode.id+')" href="#" > <i class="fa fa-fw fa-plus rbg "></i></a>';
} else if ( treeNode.level == 1 ) {
s += '<a class="btn btn-info dropdown-toggle btn-xs" style="margin-left:10px;padding-top:0px;" οnclick="editNode('+treeNode.id+')" href="#" title="修改权限信息"> <i class="fa fa-fw fa-edit rbg "></i></a>';
if (treeNode.children.length == 0) {
s += '<a class="btn btn-info dropdown-toggle btn-xs" style="margin-left:10px;padding-top:0px;" οnclick="deleteNode('+treeNode.id+')" href="#" > <i class="fa fa-fw fa-times rbg "></i></a>';
}
s += '<a class="btn btn-info dropdown-toggle btn-xs" style="margin-left:10px;padding-top:0px;" οnclick="addNode('+treeNode.id+')" href="#" > <i class="fa fa-fw fa-plus rbg "></i></a>';
} else if ( treeNode.level == 2 ) {
s += '<a class="btn btn-info dropdown-toggle btn-xs" style="margin-left:10px;padding-top:0px;" οnclick="editNode('+treeNode.id+')" href="#" title="修改权限信息"> <i class="fa fa-fw fa-edit rbg "></i></a>';
s += '<a class="btn btn-info dropdown-toggle btn-xs" style="margin-left:10px;padding-top:0px;" οnclick="deleteNode('+treeNode.id+')" href="#"> <i class="fa fa-fw fa-times rbg "></i></a>';
}
s += '</span>';
aObj.after(s);
},
removeHoverDom: function(treeId, treeNode){
$("#btnGroup"+treeNode.tId).remove();
}
}
};
/*
var zNodes =[
{ name:"父节点1 - 展开11111", open:true,
children: [
{ name:"父节点11 - 折叠",
children: [
{ name:"叶子节点111"},
{ name:"叶子节点112"},
{ name:"叶子节点113"},
{ name:"叶子节点114"}
]},
{ name:"父节点12 - 折叠",
children: [
{ name:"叶子节点121"},
{ name:"叶子节点122"},
{ name:"叶子节点123"},
{ name:"叶子节点124"}
]},
{ name:"父节点13 - 没有子节点", isParent:true}
]},
{ name:"父节点2 - 折叠",
children: [
{ name:"父节点21 - 展开", open:true,
children: [
{ name:"叶子节点211"},
{ name:"叶子节点212"},
{ name:"叶子节点213"},
{ name:"叶子节点214"}
]},
{ name:"父节点22 - 折叠",
children: [
{ name:"叶子节点221"},
{ name:"叶子节点222"},
{ name:"叶子节点223"},
{ name:"叶子节点224"}
]},
{ name:"父节点23 - 折叠",
children: [
{ name:"叶子节点231"},
{ name:"叶子节点232"},
{ name:"叶子节点233"},
{ name:"叶子节点234"}
]}
]},
{ name:"父节点3 - 没有子节点", isParent:true}
];
*/
// 异步获取树形结构数据
$.fn.zTree.init($("#permissionTree"), setting);
});
function addNode(id) {
window.location.href = "${APP_PATH}/permission/add?id="+id;
}
function editNode(id) {
window.location.href = "${APP_PATH}/permission/edit?id="+id;
}
function deleteNode(id) {
layer.confirm("删除许可信息, 是否继续", {icon: 3, title:'提示'}, function(cindex){
// 删除选择的用户信息
$.ajax({
type : "POST",
url : "${APP_PATH}/permission/delete",
data : {
id : id
},
success : function(result) {
if ( result.success ) {
// 刷新数据
var treeObj = $.fn.zTree.getZTreeObj("permissionTree");
treeObj.reAsyncChildNodes(null, "refresh");
} else {
layer.msg("许可信息删除失败", {time:2000, icon:5, shift:6}, function(){
});
}
}
});
layer.close(cindex);
}, function(cindex){
layer.close(cindex);
});
}
</script>
</body>
</html>
用户维护：每个用户有什么角色
许可维护：每个角色有什么许可
使用了jQuery zTree
---------------------黑马----------------
sys_user
id usecode username password salt locked是否被锁定。
sys_role
id name available
sys_permission
sys_role_permission
id sys_role_id sys_permission_id
基于url拦截
基于url拦截是企业中常用的权限管理方法，实现思路是：将系统操作的每个url配置在权限表中，将权限对应到角色，将角色分配给用户，用户访问系统功能通过Filter进行过滤，过滤器获取到用户访问的url，只要访问的url是用户分配角色中的url则放行继续访问。
-
是否有session，没有去登录
-
是否为公开地址
-
是否为公共访问地址（只要身份认证通过即可）
-
是否在权限url中
系统登录：相当于身份认证，认证成功，要在session中记录用户的身份信息
创建一个专门的类记录session
在service中进行用户和密码校验，在controller中记录session
扫一扫
4505
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
