From 049bf8fea9607df7d005291c56e32e37a535f038 Mon Sep 17 00:00:00 2001
From: Ralph Soika <ralph.soika@imixs.com>
Date: Mon, 8 Jun 2026 12:19:48 +0200
Subject: [PATCH] new dataview version

---
 .../forms/DataViewSectionController.java      |   4 +-
 .../office/forms/DataViewSectionDataSet.java  |  21 ++-
 .../pages/workitems/forms/dataview.xhtml      | 170 +++++++++---------
 .../pages/workitems/forms/dataview_old.xhtml  | 118 ++++++++++++
 4 files changed, 225 insertions(+), 88 deletions(-)
 create mode 100644 office-alexander-logistics-app/src/main/webapp/pages/workitems/forms/dataview_old.xhtml

diff --git a/office-alexander-logistics-app/src/main/java/org/imixs/workflow/office/forms/DataViewSectionController.java b/office-alexander-logistics-app/src/main/java/org/imixs/workflow/office/forms/DataViewSectionController.java
index e1ccbb6..5e1e306 100644
--- a/office-alexander-logistics-app/src/main/java/org/imixs/workflow/office/forms/DataViewSectionController.java
+++ b/office-alexander-logistics-app/src/main/java/org/imixs/workflow/office/forms/DataViewSectionController.java
@@ -43,8 +43,7 @@ import jakarta.servlet.http.HttpServletRequest;
 
 /**
  * The DataViewFormSectionController provides methods to display a data view in
- * as a
- * custom form section
+ * a custom form section
  * 
  * @see pages/workitems/sections/dataview.xhtml
  * @author rsoika
@@ -147,6 +146,7 @@ public class DataViewSectionController implements Serializable {
             if (_dataViewName != null) {
                 logger.info("...build new dataSet by options: " + options);
                 dataSet = new DataViewSectionDataSet(_dataViewName, workflowController.getWorkitem(), dataViewService);
+
                 dataSets.put(options, dataSet);
             }
         }
diff --git a/office-alexander-logistics-app/src/main/java/org/imixs/workflow/office/forms/DataViewSectionDataSet.java b/office-alexander-logistics-app/src/main/java/org/imixs/workflow/office/forms/DataViewSectionDataSet.java
index 91defb9..5f7a00e 100644
--- a/office-alexander-logistics-app/src/main/java/org/imixs/workflow/office/forms/DataViewSectionDataSet.java
+++ b/office-alexander-logistics-app/src/main/java/org/imixs/workflow/office/forms/DataViewSectionDataSet.java
@@ -3,6 +3,7 @@ package org.imixs.workflow.office.forms;
 import java.io.IOException;
 import java.io.Serializable;
 import java.util.List;
+import java.util.UUID;
 import java.util.logging.Logger;
 
 import org.imixs.workflow.FileData;
@@ -34,6 +35,8 @@ public class DataViewSectionDataSet implements Serializable {
     private int pageSize = 10;
     private int pageIndex = 0;
 
+    private String viewId;
+
     private DataViewService dataViewService;
 
     private ItemCollection workitem;
@@ -43,8 +46,13 @@ public class DataViewSectionDataSet implements Serializable {
         this.workitem = workitem;
         this.dataViewService = dataViewService;
 
-        dataViewDefinition = dataViewService.loadDataViewDefinition(dataViewName);
+        // Generate a unique view ID for JSF component identification
+        this.viewId = "dv_" + UUID.randomUUID().toString().replace("-", "");
 
+        dataViewDefinition = dataViewService.loadDataViewDefinition(dataViewName);
+        if (dataViewDefinition == null) {
+            return;
+        }
         boolean debug = dataViewDefinition.getItemValueBoolean("debug");
         if (debug) {
             logger.info("resolve query by dataView '" + dataViewName + "'");
@@ -55,10 +63,21 @@ public class DataViewSectionDataSet implements Serializable {
 
         // resove query by dataView
         query = this.dataViewService.parseQuery(dataViewDefinition, this.workitem);
+        sortBy = dataViewDefinition.getItemValueString("sort.by");
+        sortReverse = dataViewDefinition.getItemValueBoolean("sort.reverse");
 
         loadData();
     }
 
+    /**
+     * return unique data view id for jsf pages
+     * 
+     * @return
+     */
+    public String getViewId() {
+        return viewId;
+    }
+
     public void forward() {
         if (!isEndOfList()) {
             pageIndex++;
diff --git a/office-alexander-logistics-app/src/main/webapp/pages/workitems/forms/dataview.xhtml b/office-alexander-logistics-app/src/main/webapp/pages/workitems/forms/dataview.xhtml
index 346958d..6f51c55 100644
--- a/office-alexander-logistics-app/src/main/webapp/pages/workitems/forms/dataview.xhtml
+++ b/office-alexander-logistics-app/src/main/webapp/pages/workitems/forms/dataview.xhtml
@@ -4,97 +4,97 @@
 	xmlns:marty="http://java.sun.com/jsf/composite/marty">
 
 	<!-- preload view options -->
-
-
-
-
-	<h:panelGroup styleClass="imixs-view imixs-search" layout="block" id="dataview_result_id"
-		rendered="#{dataViewSectionController.hasDataSet(options)}">
+	<f:view>
 		<ui:param name="dataViewDataSet" value="#{dataViewSectionController.loadDataSet(options)}" />
-		<ui:param name="searchPage"
-			value="#{(dataViewDataSet.getPageIndex()+1)}/#{(dataViewDataSet.getTotalPages())}" />
-		<table class="imixsdatatable imixs-orderitems">
-			<tr>
-				<ui:repeat value="#{dataViewDataSet.getViewItemDefinitions()}" var="columnDef">
-					<th>#{columnDef.item['item.label']}</th>
-				</ui:repeat>
-			</tr>
-			<ui:repeat value="#{dataViewDataSet.data}" var="record">
+		<h:panelGroup styleClass="imixs-view imixs-search" layout="block" id="#{dataViewDataSet.viewId}"
+			rendered="#{dataViewSectionController.hasDataSet(options)}">
+
+			<ui:param name="searchPage"
+				value="#{(dataViewDataSet.getPageIndex()+1)}/#{(dataViewDataSet.getTotalPages())}" />
+			<table class="imixsdatatable imixs-orderitems">
 				<tr>
 					<ui:repeat value="#{dataViewDataSet.getViewItemDefinitions()}" var="columnDef">
-						<td>
-							<ui:fragment rendered="#{columnDef.item['item.type'] eq 'xs:anyURI'}">
-								<h:link outcome="/pages/workitems/workitem.xhtml?faces-redirect=true"
-									styleClass="imixs-viewentry-main-link">
-									<h:outputText value="#{record.item[columnDef.item['item.name']]}" />
-									<f:param name="id" value="#{record.item['$uniqueid']}" />
-								</h:link>
-							</ui:fragment>
-
-							<ui:fragment rendered="#{columnDef.item['item.type'] eq 'xs:string'}">
-								<h:outputText value="#{record.item[columnDef.item['item.name']]}" />
-							</ui:fragment>
-
-							<ui:fragment rendered="#{columnDef.item['item.type'] eq 'xs:date'}"
-								styleClass="align-center">
-								<h:outputText value="#{record.item[columnDef.item['item.name']]}">
-									<f:convertDateTime timeZone="#{message.timeZone}" type="both"
-										pattern="#{message.datePatternShort}" />
-								</h:outputText>
-							</ui:fragment>
-
-							<ui:fragment rendered="#{columnDef.item['item.type'] eq 'xs:double'}"
-								styleClass="align-right">
-								<h:outputText value="#{record.item[columnDef.item['item.name']]}">
-									<f:convertNumber minFractionDigits="2" locale="de" />
-								</h:outputText>
-							</ui:fragment>
-							<ui:fragment rendered="#{columnDef.item['item.type'] eq 'xs:float'}"
-								styleClass="align-right">
-								<h:outputText value="#{record.item[columnDef.item['item.name']]}">
-									<f:convertNumber minFractionDigits="2" locale="de" />
-								</h:outputText>
-							</ui:fragment>
-
-							<ui:fragment rendered="#{columnDef.item['item.type'] eq 'xs:dateTime'}">
-								<f:facet name="header">#{columnDef.item['item.label']}</f:facet>
-								<h:outputText value="#{record.item[columnDef.item['item.name']]}">
-									<f:convertDateTime timeZone="#{message.timeZone}" type="both"
-										pattern="#{message.dateTimePatternShort}" />
-								</h:outputText>
-							</ui:fragment>
-						</td>
+						<th>#{columnDef.item['item.label']}</th>
 					</ui:repeat>
 				</tr>
-			</ui:repeat>
-		</table>
-		<!-- navigation -->
-		<div
-			style="background-color: #f9f9f9; font-size:0.85rem; border-bottom: 1px solid var(--input-border);border-left: 1px solid var(--input-border);border-right: 1px solid var(--input-border); height: 30px; display: flex; justify-content: space-between; align-items: center;padding: 5px 10px;">
-			<span style="display: flex; align-items: center;gap: 10px;">
-				<h:commandLink title="Excel Export" rendered="false" actionListener="#{dataGroupController.export()}"
-					onclick="handleSubmit(this)">
-					<i class="fa-solid fa-file-csv"></i>
-				</h:commandLink>
-				<h:commandLink title="Excel Export" rendered="#{dataViewDataSet.hasPoiExport()}"
-					actionListener="#{dataViewDataSet.export()}" onclick="handleSubmit(this)">
-					<span class="typcn typcn-vendor-microsoft"></span>
-				</h:commandLink>
-			</span>
-			<span style="display: flex; align-items: center; gap: 10px;">
-				<h:outputText value=" #{(dataViewDataSet.pageIndex+1)} / #{dataViewDataSet.totalPages}" />
-				<h:commandLink value="" action="#{dataViewDataSet.back()}">
-					<f:ajax render="dataview_result_id" />
-					<i class="fa-solid fa-backward" style=" #{(dataViewDataSet.pageIndex == 0)?'opacity:0.5':''}"></i>
-				</h:commandLink>
-				<h:commandLink value="" action="#{dataViewDataSet.forward()}">
-					<f:ajax render="dataview_result_id" />
-					<i class="fa-solid fa-forward" style=" #{(dataViewDataSet.endOfList)?'opacity:0.5':''}"></i>
-				</h:commandLink>
-			</span>
-		</div>
-	</h:panelGroup>
+				<ui:repeat value="#{dataViewDataSet.data}" var="record">
+					<tr>
+						<ui:repeat value="#{dataViewDataSet.getViewItemDefinitions()}" var="columnDef">
+							<td>
+								<ui:fragment rendered="#{columnDef.item['item.type'] eq 'xs:anyURI'}">
+									<h:link outcome="/pages/workitems/workitem.xhtml?faces-redirect=true"
+										styleClass="imixs-viewentry-main-link">
+										<h:outputText value="#{record.item[columnDef.item['item.name']]}" />
+										<f:param name="id" value="#{record.item['$uniqueid']}" />
+									</h:link>
+								</ui:fragment>
 
+								<ui:fragment rendered="#{columnDef.item['item.type'] eq 'xs:string'}">
+									<h:outputText value="#{record.item[columnDef.item['item.name']]}" />
+								</ui:fragment>
+
+								<ui:fragment rendered="#{columnDef.item['item.type'] eq 'xs:date'}"
+									styleClass="align-center">
+									<h:outputText value="#{record.item[columnDef.item['item.name']]}">
+										<f:convertDateTime timeZone="#{message.timeZone}" type="both"
+											pattern="#{message.datePatternShort}" />
+									</h:outputText>
+								</ui:fragment>
+
+								<ui:fragment rendered="#{columnDef.item['item.type'] eq 'xs:double'}"
+									styleClass="align-right">
+									<h:outputText value="#{record.item[columnDef.item['item.name']]}">
+										<f:convertNumber minFractionDigits="2" locale="de" />
+									</h:outputText>
+								</ui:fragment>
+								<ui:fragment rendered="#{columnDef.item['item.type'] eq 'xs:float'}"
+									styleClass="align-right">
+									<h:outputText value="#{record.item[columnDef.item['item.name']]}">
+										<f:convertNumber minFractionDigits="2" locale="de" />
+									</h:outputText>
+								</ui:fragment>
+
+								<ui:fragment rendered="#{columnDef.item['item.type'] eq 'xs:dateTime'}">
+									<f:facet name="header">#{columnDef.item['item.label']}</f:facet>
+									<h:outputText value="#{record.item[columnDef.item['item.name']]}">
+										<f:convertDateTime timeZone="#{message.timeZone}" type="both"
+											pattern="#{message.dateTimePatternShort}" />
+									</h:outputText>
+								</ui:fragment>
+							</td>
+						</ui:repeat>
+					</tr>
+				</ui:repeat>
+			</table>
+			<!-- navigation -->
+			<div
+				style="background-color: #f9f9f9; font-size:0.85rem; border-bottom: 1px solid var(--input-border);border-left: 1px solid var(--input-border);border-right: 1px solid var(--input-border); height: 30px; display: flex; justify-content: space-between; align-items: center;padding: 5px 10px;">
+				<span style="display: flex; align-items: center;gap: 10px;">
+					<h:commandLink title="Excel Export" rendered="false"
+						actionListener="#{dataGroupController.export()}" onclick="handleSubmit(this)">
+						<i class="fa-solid fa-file-csv"></i>
+					</h:commandLink>
+					<h:commandLink title="Excel Export" rendered="#{dataViewDataSet.hasPoiExport()}"
+						actionListener="#{dataViewDataSet.export()}" onclick="handleSubmit(this)">
+						<i class="fa-solid fa-file-excel">Excel</i>
+					</h:commandLink>
+				</span>
+				<span style="display: flex; align-items: center; gap: 10px;">
+					<h:outputText value=" #{(dataViewDataSet.pageIndex+1)} / #{dataViewDataSet.totalPages}" />
+					<h:commandLink value="" action="#{dataViewDataSet.back()}">
+						<f:ajax render="#{dataViewDataSet.viewId}" />
+						<i class="fa-solid fa-backward"
+							style="font-size:1.2rem; #{(dataViewDataSet.pageIndex == 0)?'opacity:0.5':''}">«</i>
+					</h:commandLink>
+					<h:commandLink value="" action="#{dataViewDataSet.forward()}">
+						<f:ajax render="#{dataViewDataSet.viewId}" />
+						<i class="fa-solid fa-forward"
+							style="font-size:1.2rem; #{(dataViewDataSet.endOfList)?'opacity:0.5':''}">»</i>
+					</h:commandLink>
+				</span>
+			</div>
+		</h:panelGroup>
+	</f:view>
 	<!-- Missing Data View -->
 	<h:panelGroup styleClass="ui-widget" rendered="#{!dataViewSectionController.hasDataSet(options)}">
 		<div class="" style="padding: .7em; margin-bottom: .7em; border: solid 1px #ccc;">
diff --git a/office-alexander-logistics-app/src/main/webapp/pages/workitems/forms/dataview_old.xhtml b/office-alexander-logistics-app/src/main/webapp/pages/workitems/forms/dataview_old.xhtml
new file mode 100644
index 0000000..346958d
--- /dev/null
+++ b/office-alexander-logistics-app/src/main/webapp/pages/workitems/forms/dataview_old.xhtml
@@ -0,0 +1,118 @@
+<ui:composition xmlns="http://www.w3.org/1999/xhtml" xmlns:ui="http://java.sun.com/jsf/facelets"
+	xmlns:f="http://java.sun.com/jsf/core" xmlns:c="http://java.sun.com/jsp/jstl/core"
+	xmlns:h="http://java.sun.com/jsf/html" xmlns:i="http://java.sun.com/jsf/composite/imixs"
+	xmlns:marty="http://java.sun.com/jsf/composite/marty">
+
+	<!-- preload view options -->
+
+
+
+
+	<h:panelGroup styleClass="imixs-view imixs-search" layout="block" id="dataview_result_id"
+		rendered="#{dataViewSectionController.hasDataSet(options)}">
+		<ui:param name="dataViewDataSet" value="#{dataViewSectionController.loadDataSet(options)}" />
+		<ui:param name="searchPage"
+			value="#{(dataViewDataSet.getPageIndex()+1)}/#{(dataViewDataSet.getTotalPages())}" />
+		<table class="imixsdatatable imixs-orderitems">
+			<tr>
+				<ui:repeat value="#{dataViewDataSet.getViewItemDefinitions()}" var="columnDef">
+					<th>#{columnDef.item['item.label']}</th>
+				</ui:repeat>
+			</tr>
+			<ui:repeat value="#{dataViewDataSet.data}" var="record">
+				<tr>
+					<ui:repeat value="#{dataViewDataSet.getViewItemDefinitions()}" var="columnDef">
+						<td>
+							<ui:fragment rendered="#{columnDef.item['item.type'] eq 'xs:anyURI'}">
+								<h:link outcome="/pages/workitems/workitem.xhtml?faces-redirect=true"
+									styleClass="imixs-viewentry-main-link">
+									<h:outputText value="#{record.item[columnDef.item['item.name']]}" />
+									<f:param name="id" value="#{record.item['$uniqueid']}" />
+								</h:link>
+							</ui:fragment>
+
+							<ui:fragment rendered="#{columnDef.item['item.type'] eq 'xs:string'}">
+								<h:outputText value="#{record.item[columnDef.item['item.name']]}" />
+							</ui:fragment>
+
+							<ui:fragment rendered="#{columnDef.item['item.type'] eq 'xs:date'}"
+								styleClass="align-center">
+								<h:outputText value="#{record.item[columnDef.item['item.name']]}">
+									<f:convertDateTime timeZone="#{message.timeZone}" type="both"
+										pattern="#{message.datePatternShort}" />
+								</h:outputText>
+							</ui:fragment>
+
+							<ui:fragment rendered="#{columnDef.item['item.type'] eq 'xs:double'}"
+								styleClass="align-right">
+								<h:outputText value="#{record.item[columnDef.item['item.name']]}">
+									<f:convertNumber minFractionDigits="2" locale="de" />
+								</h:outputText>
+							</ui:fragment>
+							<ui:fragment rendered="#{columnDef.item['item.type'] eq 'xs:float'}"
+								styleClass="align-right">
+								<h:outputText value="#{record.item[columnDef.item['item.name']]}">
+									<f:convertNumber minFractionDigits="2" locale="de" />
+								</h:outputText>
+							</ui:fragment>
+
+							<ui:fragment rendered="#{columnDef.item['item.type'] eq 'xs:dateTime'}">
+								<f:facet name="header">#{columnDef.item['item.label']}</f:facet>
+								<h:outputText value="#{record.item[columnDef.item['item.name']]}">
+									<f:convertDateTime timeZone="#{message.timeZone}" type="both"
+										pattern="#{message.dateTimePatternShort}" />
+								</h:outputText>
+							</ui:fragment>
+						</td>
+					</ui:repeat>
+				</tr>
+			</ui:repeat>
+		</table>
+		<!-- navigation -->
+		<div
+			style="background-color: #f9f9f9; font-size:0.85rem; border-bottom: 1px solid var(--input-border);border-left: 1px solid var(--input-border);border-right: 1px solid var(--input-border); height: 30px; display: flex; justify-content: space-between; align-items: center;padding: 5px 10px;">
+			<span style="display: flex; align-items: center;gap: 10px;">
+				<h:commandLink title="Excel Export" rendered="false" actionListener="#{dataGroupController.export()}"
+					onclick="handleSubmit(this)">
+					<i class="fa-solid fa-file-csv"></i>
+				</h:commandLink>
+				<h:commandLink title="Excel Export" rendered="#{dataViewDataSet.hasPoiExport()}"
+					actionListener="#{dataViewDataSet.export()}" onclick="handleSubmit(this)">
+					<span class="typcn typcn-vendor-microsoft"></span>
+				</h:commandLink>
+			</span>
+			<span style="display: flex; align-items: center; gap: 10px;">
+				<h:outputText value=" #{(dataViewDataSet.pageIndex+1)} / #{dataViewDataSet.totalPages}" />
+				<h:commandLink value="" action="#{dataViewDataSet.back()}">
+					<f:ajax render="dataview_result_id" />
+					<i class="fa-solid fa-backward" style=" #{(dataViewDataSet.pageIndex == 0)?'opacity:0.5':''}"></i>
+				</h:commandLink>
+				<h:commandLink value="" action="#{dataViewDataSet.forward()}">
+					<f:ajax render="dataview_result_id" />
+					<i class="fa-solid fa-forward" style=" #{(dataViewDataSet.endOfList)?'opacity:0.5':''}"></i>
+				</h:commandLink>
+			</span>
+		</div>
+	</h:panelGroup>
+
+	<!-- Missing Data View -->
+	<h:panelGroup styleClass="ui-widget" rendered="#{!dataViewSectionController.hasDataSet(options)}">
+		<div class="" style="padding: .7em; margin-bottom: .7em; border: solid 1px #ccc;">
+			<p style="font-size: 1.1em; font-weight: bold"> <span class="typcn typcn-cog-outline"
+					style="margin-right:5px;"></span>Model
+				error in #{workitem.modelVersion}:</p>
+			Data View not defined: #{options}
+		</div>
+	</h:panelGroup>
+	<script type="text/javascript">
+		/*<![CDATA[*/
+		function handleSubmit(event) {
+			// remove ajax loader 1sec after trigger excel export
+			setTimeout(function () {
+				document.body.classList.remove('loading');
+			}, 2000);
+		}
+		/*]]>*/
+	</script>
+
+</ui:composition>
\ No newline at end of file