权限页面展示布局

最新推荐文章于 2023-05-29 17:58:18 发布

woini213

最新推荐文章于 2023-05-29 17:58:18 发布

阅读量1k

点赞数

分类专栏： jsp 文章标签： java 前端数据库 ViewUI

本文链接：https://blog.youkuaiyun.com/u011371255/article/details/84627616

版权

jsp 专栏收录该内容

2 篇文章

订阅专栏

目的：

需要将权限做如下图所示的展示:

1. 数据库表结构

表名： ss_permission

ID           VARCHAR2(32)  PRIMARY KEY,
DISPLAY_NAME VARCHAR2(500)，
NAME         VARCHAR2(300)，
PARENT_      VARCHAR2(32)
LEAF_        VARCHAR2(1)

2. 表数据

其中，parent_ 为空，表示是父权限。

3. 表对应的实体类 SsPermission.java

import java.io.Serializable;
import java.util.List;

public class SsPermission implements Serializable {
	/**
	 * @Fields serialVersionUID : 序列化id
	 */
	private static final long serialVersionUID = 3410077426635038417L;

	private String id;	
	private String displayName;
	private String name;
	private String parent_;
	private String leaf_;

	// 子权限集合
	private List<SsPermission> childs;

	// 省略 setter/getter
}

由于需要展示父权限及其子权限，所以实体类中需要有一个子权限集合的属性。

4. 实现思路

首先，查询出所有的父权限信息

public List<SsPermission> findAllParents() throws Exception {

		List<SsPermission> list = new ArrayList<SsPermission>(10);

		StringBuffer sql = new StringBuffer(100);

		sql.append("SELECT ID, NAME, DISPLAY_NAME, PARENT_ ");
		sql.append(" FROM SS_PERMISSION ");
		sql.append(" WHERE (PARENT_ IS NULL OR PARENT_ = '') ");
		sql.append(" AND LEAF_='0'");

		list = getJdbcTemplate().query(sql.toString(),
				new RowMapper<SsPermission>() {

					@Override
					public SsPermission mapRow(ResultSet rs, int index)
							throws SQLException {

						SsPermission p = new SsPermission();

						p.setId(rs.getString("ID"));
						p.setName(rs.getString("NAME"));
						p.setDisplayName(rs.getString("DISPLAY_NAME"));
						p.setParent_(rs.getString("PARENT_"));

						return p;
					}
				});

		return list;
	}

其次，循环父权限，根据父权限id查找其所有的子权限，将结果存入子权限集合childs中。

public List<SsPermission> findChildsById(final String permissionId)
			throws Exception {

		List<SsPermission> list = new ArrayList<SsPermission>(10);

		StringBuffer sql = new StringBuffer(100);

		sql.append("SELECT ID, NAME, DISPLAY_NAME, PARENT_ ");
		sql.append(" FROM SS_PERMISSION ");
		sql.append(" WHERE PARENT_ = ?");

		list = getJdbcTemplate().query(sql.toString(),
				new Object[] { permissionId }, new RowMapper<SsPermission>() {

					@Override
					public SsPermission mapRow(ResultSet rs, int index)
							throws SQLException {

						SsPermission p = new SsPermission();

						p.setId(rs.getString("ID"));
						p.setName(rs.getString("NAME"));
						p.setDisplayName(rs.getString("DISPLAY_NAME"));
						p.setParent_(rs.getString("PARENT_"));

						return p;
					}
				});

		return list;
	}

总的实现方法如下所示：

import java.util.ArrayList;
import java.util.List;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;

@RequestMapping("/toSelectPermission")
public String toSelectPermission(Model model) {

	// 父权限
	List<SsPermission> permissions = new ArrayList<SsPermission>(10);

	try {
		// 查找所有的父权限
		List<SsPermission> parents = permissionService.findAllParents();

		if (null != parents && !parents.isEmpty()) {

			SsPermission per = null;

			for (SsPermission p : parents) {

				per = new SsPermission();

				per.setId(p.getId());
				per.setName(p.getName());
				per.setDisplayName(p.getDisplayName());
				// 根据父权限id查找对应的子权限
				per.setChilds(permissionService.findChildsById(p.getId()));

				permissions.add(per);
			}
		}

	} catch (Exception e) {
		log.error("Go to SelectPermission page fail:" + e.getMessage(), e);
	}

	model.addAttribute("permissionList", permissions);

	return "security/selectPermissions";
}

5. jsp 页面展示

<style type="text/css">
.clearfix{zoom:1;}
.clearfix:after{content:′.′;display:block;visibility:none;height:0;clear:both;}
#bd{/*background-color:#DDD;*/min-height:50px;_height:50px;}
#bd .right{/*background-color:red;*/float:right;width:100%;margin-left:-25em;}
#bd .right .content{margin-left:100px;/*background-color:blue;color:#FFF;*/}
#bd .left{/*background-color:green;color:#FFF;*/width:260px;float:left;}
</style>

<body>
<table align="center" class="bordered" border="0">
<c:forEach items="${permissionList }" var="parentPer" varStatus="status">
		<tr>		
			<td>
		  	<div class="left">
		  		<p>${parentPer.displayName }: </p>
		  	</div>
		  	</td>
		  	<td>
		  	<div class="right">
		  		<div class="content">
		 			 <p>
		 			 	<c:forEach items="${parentPer.childs }" var="childPer" varStatus="status">
							<input type="checkbox" id="" name="child_name" 
								value="${childPer.id }"/>${childPer.displayName }
						</c:forEach>
		 			 </p>		 			 
		  		</div>
		  	</div> 
		  	</td> 	
		  
		  </tr>	
	</c:forEach>
</table>
</body>