IDEMPIERE-179 Zk6: Implement collapsible group for grid

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/component/Group.java

@@ -0,0 +1,139 @@
+package org.adempiere.webui.component;
+
+import java.util.List;
+
+import org.zkoss.zk.ui.Component;
+import org.zkoss.zk.ui.UiException;
+import org.zkoss.zk.ui.event.Event;
+import org.zkoss.zk.ui.event.EventListener;
+import org.zkoss.zk.ui.event.Events;
+import org.zkoss.zul.Div;
+import org.zkoss.zul.Image;
+import org.zkoss.zul.Label;
+import org.zkoss.zul.Row;
+
+public class Group extends org.zkoss.zul.Group {
+
+	/**
+	 * 
+	 */
+	private static final long serialVersionUID = -357795690637457751L;
+	
+	public static final String GROUP_ROW_VISIBLE_KEY = "groupRowVisible";
+
+	public Group() {
+		super();
+		setSclass("z-group");
+	}
+	
+	public Group(String label) {
+		super(label);
+		setSclass("z-group");
+	}
+	
+	public <T> Group(String label, T value) {
+		super(label, value);
+		setSclass("z-group");
+	}
+
+	public String getLabel() {
+		final Component cell = getFirstChild();
+		return cell != null && cell instanceof GroupHeader ? ((GroupHeader)cell).getTitle() : null;
+	}
+
+	public void setLabel(String label) {
+		autoFirstCell().setTitle(label);
+	}	
+	
+	private GroupHeader autoFirstCell() {
+		Component cell = getFirstChild();
+		if (cell == null || cell instanceof GroupHeader) {
+			if (cell == null) cell = new GroupHeader();
+			cell.applyProperties();
+			cell.setParent(this);
+			return (GroupHeader)cell;
+		}
+		throw new UiException("Unsupported child for setLabel: "+cell);
+	}
+	
+	public void setOpen(boolean open) {
+		super.setOpen(open);
+		autoFirstCell().setOpen(open);
+		
+		if(getParent() != null)
+		{
+			List<Row> rows = getItems();
+			for (Row row : rows)
+			{
+				boolean visible = true;
+				String value = (String) row.getAttribute(GROUP_ROW_VISIBLE_KEY);
+				if (value != null)
+					visible = value.equals("true");				
+				row.setVisible(open && visible);
+			}
+		}
+	}
+	
+	public class GroupHeader extends Div implements EventListener<Event>
+	{
+		/**
+		 * 
+		 */
+		private static final long serialVersionUID = -4070011056533999557L;
+		private Image img;
+		private Label lbl;
+		
+		private String title;
+		private boolean isOpen;
+		
+		public GroupHeader()
+		{
+			super();
+			init();
+			setTitle(null);
+			setOpen(true);
+		}
+		
+		private void init()
+		{
+			setSclass("z-group-cnt");
+			
+			img = new Image();
+			appendChild(img);
+			img.addEventListener(Events.ON_CLICK, this);
+			
+			lbl = new Label();
+			appendChild(lbl);
+		}
+		
+		public String getTitle() {
+			return title;
+		}
+
+		public void setTitle(String title) {
+			this.title = title;
+			lbl.setValue(this.title);
+		}
+
+		public boolean isOpen() {
+			return isOpen;
+		}
+
+		public void setOpen(boolean isOpen) {
+			this.isOpen = isOpen;
+			img.setSclass(this.isOpen ? "z-group-img-open" : "z-group-img-close");
+		}
+
+		@Override
+		public void onEvent(Event e) throws Exception 
+		{
+			if (e.getName().equals(Events.ON_CLICK))
+			{
+				if (e.getTarget() == img)
+				{
+					((Group) getParent()).setOpen(!isOpen());
+				}
+			}
+		}
+	}
+}

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/panel/ADTabpanel.java

@@ -25,8 +25,8 @@ import java.util.HashMap;
 import java.util.Iterator;
 import java.util.List;
 import java.util.Map;
-import java.util.Properties;
 import java.util.Map.Entry;
+import java.util.Properties;
 import java.util.logging.Level;
 
 import org.adempiere.webui.LayoutUtils;
@@ -35,6 +35,7 @@ import org.adempiere.webui.component.Columns;
 import org.adempiere.webui.component.EditorBox;
 import org.adempiere.webui.component.Grid;
 import org.adempiere.webui.component.GridPanel;
+import org.adempiere.webui.component.Group;
 import org.adempiere.webui.component.Label;
 import org.adempiere.webui.component.NumberBox;
 import org.adempiere.webui.component.Row;
@@ -71,15 +72,13 @@ import org.zkoss.zk.ui.event.Events;
 import org.zkoss.zk.ui.util.Clients;
 import org.zkoss.zul.Borderlayout;
 import org.zkoss.zul.Center;
-import org.zkoss.zul.West;
+import org.zkoss.zul.DefaultTreeNode;
 import org.zkoss.zul.Div;
-import org.zkoss.zul.Group;
 import org.zkoss.zul.Groupfoot;
 import org.zkoss.zul.Separator;
-import org.zkoss.zul.DefaultTreeNode;
 import org.zkoss.zul.Space;
 import org.zkoss.zul.Treeitem;
-import org.zkoss.zul.impl.InputElement;
+import org.zkoss.zul.West;
 import org.zkoss.zul.impl.XulElement;
 
 /**
@@ -122,8 +121,8 @@ DataStatusListener, IADTabpanel, VetoableChangeListener
     private Grid              grid;
 
     private ArrayList<WEditor> editors = new ArrayList<WEditor>();
-
+    
-    private ArrayList<String> editorIds = new ArrayList<String>();
+    private ArrayList<Component> editorComps = new ArrayList<Component>();
 
     private boolean			  uiCreated = false;
 
@@ -388,6 +387,7 @@ DataStatusListener, IADTabpanel, VetoableChangeListener
             			else
             			{
             				row = new Group(fieldGroup);
+            				row.setSpans("5");
             				if (X_AD_FieldGroup.FIELDGROUPTYPE_Tab.equals(field.getFieldGroupType()) || field.getIsCollapsedByDefault())
             				{
             					((Group)row).setOpen(false);
@@ -438,7 +438,7 @@ DataStatusListener, IADTabpanel, VetoableChangeListener
                     editor.setGridTab(this.getGridTab());
                 	field.addPropertyChangeListener(editor);
                     editors.add(editor);
-                    editorIds.add(editor.getComponent().getUuid());
+                    editorComps.add(editor.getComponent());
                     if (field.isFieldOnly())
                     {
                     	row.appendChild(createSpacer());
@@ -613,7 +613,7 @@ DataStatusListener, IADTabpanel, VetoableChangeListener
         	for (int j = 0; j < components.size(); j++)
         	{
         		Component component = (Component) components.get(j);
-        		if (editorIds.contains(component.getUuid()))
+        		if (editorComps.contains(component))
         		{
         			editorRow = true;
         			if (component.isVisible())
@@ -624,7 +624,10 @@ DataStatusListener, IADTabpanel, VetoableChangeListener
         		}
         	}
         	if (editorRow && (row.isVisible() != visible))
+        	{
+        		row.setAttribute(Group.GROUP_ROW_VISIBLE_KEY, visible ? "true" : "false");
         		row.setVisible(visible);
+        	}
         }
 
         //hide fieldgroup if all editor row within the fieldgroup is invisible

org.adempiere.ui.zk/theme/default/css/theme.css.dsp

@@ -466,7 +466,7 @@ div.z-vfiletree-body td.menu-tree-cell {
 	background: #FFFFCC;
 }
 
-%-- Editor --%>
+<%-- Editor --%>
 .editor-box {
 	display: inline-block;
 	border: none; padding: 0px; margin: 0px; background-color: transparent;
@@ -475,3 +475,48 @@ div.z-vfiletree-body td.menu-tree-cell {
 .number-box {
 	display: inline-block; white-space:nowrap;
 }
+
+<%-- Group --%>
+tr.z-group {
+	background: #E9F2FB repeat-x 0 0;
+	background-image: url(../images/group_bg.gif);
+}
+
+tr.z-group td.z-row-inner {
+	overflow: hidden;
+	border-top: 2px solid #81BAF5;
+	border-bottom: 1px solid #BCD2EF;
+	color: #2C559C;
+	font-weight: bold;
+}
+
+div.z-group-cnt span.z-label {
+	color: #2C559C;
+	padding: 5px;
+	width: auto;
+	height: 100%;
+	font-weight: bold;
+}
+
+img.z-group-img-open, img.z-group-img-close {
+	width: 18px;
+	min-height: 18px;
+	height: 100%;
+	vertical-align: top;
+	cursor: pointer;
+	border: 0;
+}
+
+img.z-group-img-open {
+	background-image: url(../images/group-open.png);
+	background-position: center center;
+	background-color: transparent;
+	background-repeat: no-repeat;
+}
+
+img.z-group-img-close {
+	background-image: url(../images/group-close.png);
+	background-position: center center;
+	background-color: transparent;
+	background-repeat: no-repeat;
+}