From 5f217d75bba9d1fb8246d11ae2d5a22bf45d0588 Mon Sep 17 00:00:00 2001
From: acognet <anne-catherine.cognet@combodo.com>
Date: Fri, 5 Mar 2021 14:57:25 +0100
Subject: [PATCH] =?UTF-8?q?N=C2=B03746=20-=20Migrate=20modal=20to=20new=20?=
 =?UTF-8?q?UIBlock=20system?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 application/dashboard.class.inc.php           | 64 ++++++++-----------
 css/backoffice/vendors/_datatables.scss       | 50 +++++++++++++++
 .../DataTable/DataTableUIBlockFactory.php     | 24 ++++---
 .../datatable/config/layout.html.twig         |  4 +-
 webservices/export-v2.php                     |  4 +-
 5 files changed, 98 insertions(+), 48 deletions(-)

diff --git a/application/dashboard.class.inc.php b/application/dashboard.class.inc.php
index b7b76ba71..1d9fa9f0b 100644
--- a/application/dashboard.class.inc.php
+++ b/application/dashboard.class.inc.php
@@ -1,20 +1,7 @@
 <?php
-/**
- * Copyright (C) 2013-2019 Combodo SARL
- *
- * This file is part of iTop.
- *
- * iTop is free software; you can redistribute it and/or modify
- * it under the terms of the GNU Affero General Public License as published by
- * the Free Software Foundation, either version 3 of the License, or
- * (at your option) any later version.
- *
- * iTop is distributed in the hope that it will be useful,
- * but WITHOUT ANY WARRANTY; without even the implied warranty of
- * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
- * GNU Affero General Public License for more details.
- *
- * You should have received a copy of the GNU Affero General Public License
+/*
+ * @copyright   Copyright (C) 2010-2021 Combodo SARL
+ * @license     http://opensource.org/licenses/AGPL-3.0
  */
 
 use Combodo\iTop\Application\UI\Base\Component\Button\ButtonUIBlockFactory;
@@ -1514,32 +1501,37 @@ JS
 		$sCancelButtonLabel = Dict::S('UI:Button:Cancel');
 		
 		$oPage->add_ready_script(
-<<<JS
+			<<<JS
 $('#dashlet_creation_dlg').dialog({
 	width: 600,
 	modal: true,
 	title: '$sDialogTitle',
 	buttons: [
-	{ text: "$sOkButtonLabel", click: function() {
-		var oForm = $(this).find('form');
-		var sFormId = oForm.attr('id');
-		var oParams = null;
-		var aErrors = ValidateForm(sFormId, false);
-		if (aErrors.length == 0)
-		{
-			oParams = ReadFormParams(sFormId);
-		}
-		oParams.operation = 'add_dashlet';
-		var me = $(this);
-		$.post(GetAbsoluteUrlAppRoot()+'pages/ajax.render.php', oParams, function(data) {
-			me.dialog( "close" );
-			me.remove();
-			$('body').append(data);
-		});
-	} },
-	{ text: "$sCancelButtonLabel", click: function() {
+	{ text: "$sCancelButtonLabel", 
+	  click: function() {
 		$(this).dialog( "close" ); $(this).remove();
-	} },
+		} ,
+		'class': 'ibo-button ibo-is-alternative ibo-is-neutral action cancel'
+	},
+	{ text: "$sOkButtonLabel", 
+	  click: function() {
+			var oForm = $(this).find('form');
+			var sFormId = oForm.attr('id');
+			var oParams = null;
+			var aErrors = ValidateForm(sFormId, false);
+			if (aErrors.length == 0)
+			{
+				oParams = ReadFormParams(sFormId);
+			}
+			oParams.operation = 'add_dashlet';
+			var me = $(this);
+			$.post(GetAbsoluteUrlAppRoot()+'pages/ajax.render.php', oParams, function(data) {
+				me.dialog( "close" );
+				me.remove();
+				$('body').append(data);
+			});
+		},
+		'class': 'ibo-button ibo-is-regular ibo-is-primary action' }
 	],
 	close: function() { $(this).remove(); }
 });
diff --git a/css/backoffice/vendors/_datatables.scss b/css/backoffice/vendors/_datatables.scss
index ba6955f69..c64cc7470 100644
--- a/css/backoffice/vendors/_datatables.scss
+++ b/css/backoffice/vendors/_datatables.scss
@@ -167,3 +167,53 @@ $ibo-vendors-datatables--focus--border-color: $ibo-color-primary-600 !default;
     @extend %ibo-font-ral-med-100;
   }
 }
+
+
+.sort_order {
+  display: inline-flex;
+  width: 16px;
+  height: 12px;
+}
+
+.sort_none {
+  padding-right: 5px;
+
+  &:after {
+    font-family: "Font Awesome 5 Free";
+    font-weight: 600;
+    text-align: right;
+    content: '\f0dc';
+    color: $ibo-color-blue-grey-500;
+    float: right;
+  }
+}
+
+.sort_asc {
+  padding-right: 5px;
+
+  &:after {
+    font-family: "Font Awesome 5 Free";
+    font-weight: 600;
+    text-align: right;
+    content: '\f0d8';
+    color: $ibo-color-blue-grey-500;
+    float: right;
+  }
+}
+
+.sort_desc {
+  padding-right: 5px;
+
+  &:after {
+    font-family: "Font Awesome 5 Free";
+    font-weight: 600;
+    text-align: right;
+    content: '\f0d7';
+    color: $ibo-color-blue-grey-500;
+    float: right;
+  }
+}
+
+.sort_hidden {
+  display: none;
+}
\ No newline at end of file
diff --git a/sources/application/UI/Base/Component/DataTable/DataTableUIBlockFactory.php b/sources/application/UI/Base/Component/DataTable/DataTableUIBlockFactory.php
index d7594c938..154b85de5 100644
--- a/sources/application/UI/Base/Component/DataTable/DataTableUIBlockFactory.php
+++ b/sources/application/UI/Base/Component/DataTable/DataTableUIBlockFactory.php
@@ -659,13 +659,19 @@ class DataTableUIBlockFactory extends AbstractUIBlockFactory
 		$aColumnsDefinitions = [];
 		$aColumnDefinition = [];
 
-		if ($sSelectMode != ""){
+		$sSortCol = utils::ReadParam('sort_col', '', false, 'raw_data');
+		$sSortOrder = utils::ReadParam('sort_order', '', false, 'raw_data');
+		$sOrder = [];
+		if ($sSortCol != "") {
+			$sOrder[] = [$sSortCol, $sSortOrder];
+		}
+		if ($sSelectMode != "") {
 			$aColumnDefinition["width"] = "auto";
 			$aColumnDefinition["searchable"] = false;
 			$aColumnDefinition["sortable"] = false;
 			if ($sSelectMode != "single") {
-				$aColumnDefinition["title"] = "<span class=\"row_input\"><input type=\"checkbox\" onclick=\"checkAllDataTable('".$sTableId."',this.checked,'".$sListId."');\" class=\"checkAll\" id=\"field_".$sTableId."_check_all\" name=\"field_".$sTableId."_check_all\" title=\"".Dict::S('UI:SearchValue:CheckAll' )." / ".Dict::S('UI:SearchValue:UncheckAll')."\" /></span>";
-			} else{
+				$aColumnDefinition["title"] = "<span class=\"row_input\"><input type=\"checkbox\" onclick=\"checkAllDataTable('".$sTableId."',this.checked,'".$sListId."');\" class=\"checkAll\" id=\"field_".$sTableId."_check_all\" name=\"field_".$sTableId."_check_all\" title=\"".Dict::S('UI:SearchValue:CheckAll')." / ".Dict::S('UI:SearchValue:UncheckAll')."\" /></span>";
+			} else {
 				$aColumnDefinition["title"] = "";
 			}
 			$aColumnDefinition["type"] = "html";
@@ -749,7 +755,7 @@ class DataTableUIBlockFactory extends AbstractUIBlockFactory
 		]);
 
 
-		$aOptions =array_merge ($aOptions, [
+		$aOptions = array_merge($aOptions, [
 			"language" =>
 				[
 					"processing" => Dict::Format('UI:Datatables:Language:Processing'),
@@ -764,17 +770,19 @@ class DataTableUIBlockFactory extends AbstractUIBlockFactory
 						"first" => "<<",
 						"previous" => "<",
 						"next" => ">",
-						"last" => ">>"
+						"last" => ">>",
 					],
 					"aria" => [
 						"sortAscending" => Dict::Format('UI:Datatables:Language:Sort:Ascending'),
-						"sortDescending" => Dict::Format('UI:Datatables:Language:Sort:Descending')
+						"sortDescending" => Dict::Format('UI:Datatables:Language:Sort:Descending'),
 					],
 				],
 			"lengthMenu" => Dict::Format('Portal:Datatables:Language:DisplayLength:All'),
 			"dom" => "<'ibo-datatable-toolbar'pil>t<'ibo-datatable-toolbar'pil>",
-			"ordering"=>true,
-			"order" => [],
+			"scrollX" => true,
+			"scrollCollapse" => true,
+			"ordering" => true,
+			"order" => $sOrder,
 			"filter" => false,
 			"processing" => true,
 			"serverSide" => true,
diff --git a/templates/base/components/datatable/config/layout.html.twig b/templates/base/components/datatable/config/layout.html.twig
index 3aafabc1d..4833c43f4 100644
--- a/templates/base/components/datatable/config/layout.html.twig
+++ b/templates/base/components/datatable/config/layout.html.twig
@@ -41,8 +41,8 @@
         </div>
         <div class="ui-dialog-buttonpane ui-widget-content ui-helper-clearfix">
             <div class=" ui-dialog-buttonset">
-                <button type="button" class="ibo-button ibo-is-regular ibo-is-secondary " onclick="$('#datatable_dlg_{{ oUIBlock.GetTableId() }}').dialog('close')">&nbsp;{{ 'UI:Button:Cancel'|dict_s }}</button>
-                <button type="submit" class="ibo-button ibo-is-regular ibo-is-primary" onclick="$('#datatable_dlg_{{ oUIBlock.GetTableId() }}').DataTableSettings('onDlgOk'); ">&nbsp;{{ 'UI:Button:Ok'|dict_s }}</button>
+                <button type="button" class="ibo-button ibo-is-alternative ibo-is-neutral action cancel" onclick="$('#datatable_dlg_{{ oUIBlock.GetTableId() }}').dialog('close')">&nbsp;{{ 'UI:Button:Cancel'|dict_s }}</button>
+                <button type="submit" class="ibo-button ibo-is-regular ibo-is-primary action" onclick="$('#datatable_dlg_{{ oUIBlock.GetTableId() }}').DataTableSettings('onDlgOk'); ">&nbsp;{{ 'UI:Button:Ok'|dict_s }}</button>
             </div>
         </div>
     </form>
diff --git a/webservices/export-v2.php b/webservices/export-v2.php
index e22a72517..f00826e71 100644
--- a/webservices/export-v2.php
+++ b/webservices/export-v2.php
@@ -371,10 +371,10 @@ EOF
 function InteractiveShell($sExpression, $sQueryId, $sFormat, $sFileName, $sMode)
 {
 	if ($sMode == 'dialog') {
-		$oP = new AjaxPage();
-		$oP->add('<div id="interactive_export_dlg">');
 		$sExportBtnLabel = json_encode(Dict::S('UI:Button:Export'));
 		$sJSTitle = json_encode(htmlentities(utils::ReadParam('dialog_title', '', false, 'raw_data'), ENT_QUOTES, 'UTF-8'));
+		$oP = new AjaxPage($sJSTitle);
+		$oP->add('<div id="interactive_export_dlg">');
 		$oP->add_ready_script(
 			<<<EOF
 		$('#interactive_export_dlg').dialog({