树形组织结构图
第一、组织结构预览如下图:
第二、功能说明:
当鼠标点击左边某组织时,会把该组织下的所有成员添加到右边(排重);
当鼠标点击左边某成员时,会把该成员添加到右边(排重);
当鼠标点击"全选"时,会把所有组织的成员添加到右边(排重);
当鼠标点击"移除"时,会把右侧被选中的成员移除;
第三、java script代码实现如下:
//添加成员
function addUser(id, name) {
var oOption = document.createElement("OPTION");
oOption.text = name;
oOption.value = id;
var oSelect = window.parent.document.getElementById("groupdest");
if (!checkById(id, name)) {
oSelect.add(oOption);
}
}
//添加组织
function addGroup(id, ids, names) {
if (ids == "") {
return;
}
var idArr = ids.split(",");
var nameArr = names.split(",");
var len = idArr.length;
for (var i = 0; i < len - 1; i ++) {
addUser(idArr[i], nameArr[i]);
}
}
//检查是否已经添加过
function checkById(id, name) {
var oSelect = window.parent.document.getElementById("groupdest");
var bContains = false;
for (var i = 0; i < oSelect.length; i++) {
if (oSelect.options[i].value == id || oSelect.options[i].text == name) {
bContains = true;
}
}
return bContains;
}
//移除用户
function removeUser() {
var oSelect = document.getElementById("groupdest");
for (var i = 0; i < oSelect.length; i++) {
var option = oSelect.options[i];
if (option.selected == true) {
oSelect.remove(i);
return;
}
}
}
第四:树状组织结构图的MzTreeView-1.0动态实现的Table
/**
*
*/
package com.daniel.lr.crbt.share.db;
import javax.persistence.Column;
import javax.persistence.Entity;
import javax.persistence.Table;
import org.hibernate.validator.Pattern;
/**
* @author Daniel Cao
* @date 2007-4-27
* @time 下午10:47:59
*
* 树状菜单(Menu)数据库定义.
* 利用MzTreeView1.0生成.
* 每个字段值中不可有冒号,不可以换行,
* 引号酌情考虑应不与节点字符串的引号相冲突
*
*/
@Entity
@Table(name="sys_menu")
public class Menu extends HibernateObject {
private static final long serialVersionUID = 9135605811004668162L;
//父节点ID,若已经是根节点则为0
private Long parentId;
//节点显示文本,根节点可空,表示不显示
private String text;
//节点提示说明
private String hint;
//节点的图标,对应的名字在类里的icons和iconsExpand定义,这里表示图片的名称pic.gif;picopen.gif格式
private String icon;
//节点挂的数据,如param=value¶m=value,url里?后的那串字符串格式
private String data;
//节点的链接,它为空或者为#时,这个节点的链接,点击将无反应
private String url;
//每个节点的链接允许在不同的target里打开,为空时取类里的默认值
private String target;
//点击该链接时所想触发的脚本语句
private String method;
@Column(name="menu_data")
@Pattern(regex="[^:\n\r]+")
public String getData() {
return data;
}
public void setData(String data) {
this.data = data;
}
@Column(name="menu_hint")
@Pattern(regex="[^:\n\r]+")
public String getHint() {
return hint;
}
public void setHint(String hint) {
this.hint = hint;
}
@Column(name="menu_icon")
@Pattern(regex="[^:\n\r]+")
public String getIcon() {
return icon;
}
public void setIcon(String icon) {
this.icon = icon;
}
@Column(name="menu_method")
@Pattern(regex="[^:\n\r]+")
public String getMethod() {
return method;
}
public void setMethod(String method) {
this.method = method;
}
@Column(name="menu_parent_id")
@Pattern(regex="[^:\n\r]+")
public Long getParentId() {
return parentId;
}
public void setParentId(Long parentId) {
this.parentId = parentId;
}
@Column(name="menu_target")
@Pattern(regex="[^:\n\r]+")
public String getTarget() {
return target;
}
public void setTarget(String target) {
this.target = target;
}
@Column(name="menu_text",nullable=false)
@Pattern(regex="[^:\n\r]+")
public String getText() {
return text;
}
public void setText(String text) {
this.text = text;
}
@Column(name="menu_url")
@Pattern(regex="[^:\n\r]+")
public String getUrl() {
return url;
}
public void setUrl(String url) {
this.url = url;
}
}
/**
*
*/
package com.daniel.lr.crbt.share.db;
import java.io.Serializable;
import java.util.Date;
import javax.persistence.Column;
import javax.persistence.GeneratedValue;
import javax.persistence.GenerationType;
import javax.persistence.Id;
import javax.persistence.MappedSuperclass;
/**
* @author Dianel Cao
* @date 2007-4-18
* @time 下午02:43:34
*
*/
@MappedSuperclass
public abstract class HibernateObject implements Serializable {
private Long id; //id主键值
private String name; //名称,备用字段
private String status; //status,备用字段
private String memo; //memo,备用字段
private String createUser; //创建者,备用字段
private Date createTime; //创建日期,备用字段
private Date lastUpdateTime; //更新日期,备用字段
@Id@GeneratedValue(strategy=GenerationType.IDENTITY)
public Long getId() {
return id;
}
public void setId(Long id) {
this.id = id;
}
@Column(name="name",length=60)
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
@Column(name="status",length=10)
public String getStatus() {
return status;
}
public void setStatus(String status) {
this.status = status;
}
@Column(name="memo")
public String getMemo() {
return memo;
}
public void setMemo(String memo) {
this.memo = memo;
}
@Column(updatable=true,name="createUser",nullable=true,length=60)
public String getCreateUser() {
return createUser;
}
public void setCreateUser(String createUser) {
this.createUser = createUser;
}
@Column(updatable=false,name="createTime",nullable=false)
public Date getCreateTime() {
return createTime;
}
public void setCreateTime(Date createTime) {
this.createTime = createTime;
}
@Column(name="lastUpdateTime")
public Date getLastUpdateTime() {
return lastUpdateTime;
}
public void setLastUpdateTime(Date lastUpdateTime) {
this.lastUpdateTime = lastUpdateTime;
}
}
第五、动态树状组织结构的Taglib实现:
/**
*
*/
package com.daniel.lr.crbt.service.web.taglib;
import java.io.IOException;
import java.net.URLEncoder;
import java.util.ArrayList;
import java.util.Collection;
import java.util.List;
import javax.servlet.jsp.JspException;
import javax.servlet.jsp.JspWriter;
import javax.servlet.jsp.tagext.Tag;
import javax.servlet.jsp.tagext.TagSupport;
import org.apache.commons.logging.Log;
import org.apache.commons.logging.LogFactory;
import com.daniel.lr.crbt.share.db.Menu;
/**
* @author Daniel Cao
* @date 2007-4-27
* @time 下午11:51:09
*
*/
public class TreeMenuTag extends TagSupport {
private static final long serialVersionUID = -4747559965295669957L;
protected Log logger = LogFactory.getLog(TreeMenuTag.class);
// 菜单数据
private Collection<Menu> menuCollection;
// 树节点的图标存放位置路径,可以是相对路径或绝对路径
private String imagePath = "images/";
// 点击节点时,默认跳转的Url
private String defaultUrl = "#";
// 点击节点时,打开的默认位置,可以是_top,_self,_parent,某一页面Name等
private String defaultTegart = "_self";
@Override
public int doEndTag() throws JspException {
try {
JspWriter out = this.pageContext.getOut();
out.write(buildTreeMenu(menuCollection));
} catch (IOException ioe) {
logger.error("输出自定义标签时错误.", ioe);
throw new JspException("输出自定义标签时错误.");
} catch (Exception e) {
logger.error("创建自定义标签时错误.", e);
throw new JspException("创建自定义标签时错误.");
}
return Tag.EVAL_PAGE;
}
@Override
public int doStartTag() throws JspException {
return Tag.SKIP_BODY;
}
@Override
public void release() {
menuCollection = null;
super.release();
}
private String buildIcons(Collection<Menu> menuCollection) throws Exception{
StringBuilder sb = new StringBuilder("");
List<String> iconList = new ArrayList<String>();
for (Menu menu : menuCollection) {
String icon = menu.getIcon();
if (icon == null || icon.trim().equals("") || icon.trim().equals(";")){
continue;
}
if (icon.indexOf(";") == 0) {//只有打开图标不符合,用默认图标
continue;
}else if (icon.indexOf(";") == icon.length() - 1) {
String iconname = icon.substring(0, icon.length() - 1);
String iconname1 = iconname.split("file://.")[0/];
if (!iconList.contains(iconname)) {
sb.append("tree.icons[\"");
sb.append(iconname1);
sb.append("\"] = \"");
sb.append(iconname);
sb.append("\";\n");
iconList.add(iconname1);
}
}else{
String[] icons = icon.trim().split(";");
String name0 = icons[0].split("file://.")[0/];
if (!iconList.contains(name0)) {
sb.append("tree.icons[\"");
sb.append(name0);
sb.append("\"] = \"");
sb.append(icons[0]);
sb.append("\";\n");
sb.append("tree.iconsExpand[\"");
sb.append(name0);
sb.append("\"] = \"");
sb.append(icons[1]);
sb.append("\";\n");
iconList.add(name0);
}
}
}
return sb.toString();
}
private String buildTreeMenu(Collection<Menu> menuCollection) throws Exception {
StringBuilder sb = new StringBuilder("");
sb.append("<script language=\"JavaScript\">\n");
sb.append("var tree = new MzTreeView(\"tree\");\n");
//以下三步不能换位置
//1,创建自定义图标库
sb.append(buildIcons(menuCollection));
//2,设定图标库路径
sb.append("tree.setIconPath(\"");
sb.append(imagePath);
sb.append("\"); \n");
//3,设定节点属性
for (Menu menu : menuCollection) {
String nodeInfo = "";
String text = menu.getText();
if (text != null && !text.equals("")) {
nodeInfo += "text:" + text + ";";
}
Long id = menu.getId();
Long pId = menu.getParentId();
String hint = menu.getHint();
if (hint != null && !hint.equals("")) {
nodeInfo += "hint:" + hint + ";";
}
String icon = menu.getIcon();
if (icon != null && !icon.trim().equals("") && icon.trim().length() > 1) {
if (icon.indexOf(";") == 0) {//只有打开图标不符合,用默认图标
continue;
} else if (icon.indexOf(";") == icon.length() - 1) {
String iconname = icon.substring(0, icon.length() - 1);
String iconname1 = iconname.split("file://.")[0/];
nodeInfo += "icon:" + iconname1 + ";";
} else {
String[] icons = icon.trim().split(";");
String name0 = icons[0].split("file://.")[0/];
nodeInfo += "icon:" + name0 + ";";
}
}
String data = menu.getData();
if (data != null && !data.trim().equals("")){
nodeInfo += "data:" + data + ";\n";
}else{
nodeInfo += "data:id=" + id + "&name=" + URLEncoder.encode(text,"utf-8") + ";";
}
String url = menu.getUrl();
if (url != null && !url.trim().equals("")){
nodeInfo += "url:" + url + ";";
}
String target = menu.getTarget();
if (target != null && !target.trim().equals("")){
nodeInfo += "target:" + target + ";";
}
String method = menu.getMethod();
if (method !=null && !method.trim().equals("")){
String methodName = method.split("file://(")[0/];
if (methodName.indexOf("javascript:") == -1){
methodName = "javascript:" + methodName;
}
if (method != null && !method.trim().equals("")){
nodeInfo += "method:" + methodName + "(" + id + ",'" + text + "');";
}
}
nodeInfo += "\";";
sb.append("tree.nodes[\"");
sb.append(pId);
sb.append("_");
sb.append(id);
sb.append("\"] = \"");
sb.append(nodeInfo);
sb.append("\n");
}
sb.append("tree.setURL(\"");
sb.append(defaultUrl);
sb.append("\");\n");
sb.append("tree.setTarget(\"");
sb.append(defaultTegart);
sb.append("\");\n");
sb.append("document.write(tree.toString());\n");
sb.append("</script>\n");
return sb.toString();
}
public String getDefaultTegart() {
return defaultTegart;
}
public void setDefaultTegart(String defaultTegart) {
this.defaultTegart = defaultTegart;
}
public String getDefaultUrl() {
return defaultUrl;
}
public void setDefaultUrl(String defaultUrl) {
this.defaultUrl = defaultUrl;
}
public String getImagePath() {
return imagePath;
}
public void setImagePath(String imagePath) {
this.imagePath = imagePath;
}
public Collection<Menu> getMenuCollection() {
return menuCollection;
}
public void setMenuCollection(Collection<Menu> menuCollection) {
this.menuCollection = menuCollection;
}
}
Trackback: http://tb.blog.csdn.net/TrackBack.aspx?PostId=1611914