From 0cb29cfc48e9fc090d1658beae693dc1b72247fb Mon Sep 17 00:00:00 2001
From: Loc Nguyen <loc.nguyenthanh@axonactive.com>
Date: Tue, 12 Nov 2024 15:07:13 +0700
Subject: [PATCH] feature/IVYPORTAL-17679-UI-Facelift-for-LTS-12.0.0-Part-2 -
 Handle feedback UI

---
 .../PortalDashboardConfiguration.xhtml        |  2 +-
 .../DashboardModification.xhtml               | 90 ++++++++++---------
 2 files changed, 50 insertions(+), 42 deletions(-)

diff --git a/AxonIvyPortal/portal/src_hd/ch/ivy/addon/portal/generic/dashboard/PortalDashboardConfiguration/PortalDashboardConfiguration.xhtml b/AxonIvyPortal/portal/src_hd/ch/ivy/addon/portal/generic/dashboard/PortalDashboardConfiguration/PortalDashboardConfiguration.xhtml
index acc6688a5d0..e529958c1ba 100644
--- a/AxonIvyPortal/portal/src_hd/ch/ivy/addon/portal/generic/dashboard/PortalDashboardConfiguration/PortalDashboardConfiguration.xhtml
+++ b/AxonIvyPortal/portal/src_hd/ch/ivy/addon/portal/generic/dashboard/PortalDashboardConfiguration/PortalDashboardConfiguration.xhtml
@@ -52,7 +52,7 @@
                 <div class="u-text-align-right ui-g-12">
                   <p:commandButton id="create-dashboard-action" actionListener="#{dashboardConfigurationBean.addNewDashboard(isPublicDashboard)}"
                     value="#{ivy.cms.co('/Dialogs/ch/ivy/addon/portal/generic/dashboard/PortalDashboardConfiguration/NewDashboard')}" 
-                    styleClass="dashboard-action-container-icon #{selectedDashboardTypeStyleClass} w-full primary-color-light-button h-3rem"
+                    styleClass="dashboard-action-container-icon #{selectedDashboardTypeStyleClass} w-full primary-color-light-button"
                     partialSubmit="true"
                     oncomplete="PF('create-new-dashboard-dialog').show();"
                     title="#{ivy.cms.co('/Dialogs/ch/ivy/addon/portal/generic/dashboard/PortalDashboardConfiguration/NewDashboard')}" />
diff --git a/AxonIvyPortal/portal/src_hd/ch/ivy/addon/portal/generic/dashboard/component/DashboardModification/DashboardModification.xhtml b/AxonIvyPortal/portal/src_hd/ch/ivy/addon/portal/generic/dashboard/component/DashboardModification/DashboardModification.xhtml
index fa95681f9fa..95113abfc8f 100644
--- a/AxonIvyPortal/portal/src_hd/ch/ivy/addon/portal/generic/dashboard/component/DashboardModification/DashboardModification.xhtml
+++ b/AxonIvyPortal/portal/src_hd/ch/ivy/addon/portal/generic/dashboard/component/DashboardModification/DashboardModification.xhtml
@@ -39,49 +39,57 @@
           <p:tooltip for="dashboard-description-group" value="#{dashboard.description}" trackMouse="true" hideEvent="mouseleave click" styleClass="dashboard-configuration-tooltip"/>
         </h:panelGroup>
       </p:column>
-      
-      <p:column headerText="#{ivy.cms.co('/ch.ivy.addon.portalkit.ui.jsf/common/action')}" width="#{dashboardModificationBean.hasExportDashboardPermission() ? '120' : '210'}">
+
+      <p:column headerText="#{ivy.cms.co('/ch.ivy.addon.portalkit.ui.jsf/common/action')}"
+        width="#{dashboardModificationBean.hasExportDashboardPermission() ? '120' : '210'}">
         <div id="dashboard-configuration-action-group" class="dashboard-configuration-action-group">
-            <h:panelGroup layout="block">
-                <p:commandButton id="dashboard-configuration-action-button" icon="fa fa-ellipsis-h" styleClass="rounded-button icon-more-menu-button #{buttonStyle} ui-no-rounded-button-process-page mr-3"
-                     type="button"/>
-                <p:menu id="dashboard-configuration-action-menu" styleClass="w-13rem" overlay="true" trigger="dashboard-configuration-action-button" my="right top" at="right bottom">
-                    <p:menuitem id="edit" process="@this" actionListener="#{dashboardModificationBean.openDashboardDetailDialog(dashboard)}"
-                        icon="si si-graphic-tablet-drawing-pen" styleClass="dashboard-configuration-action-menu-icon" update="#{cc.clientId}:configuration-dashboard-detail-component:dashboard-detail-form"
-                        value="#{ivy.cms.co('/ch.ivy.addon.portalkit.ui.jsf/common/edit')}" oncomplete="PF('configuration-dashboard-detail-dialog').show()"
-                        target="_blank" resetValues="true" title="#{ivy.cms.co('/ch.ivy.addon.portalkit.ui.jsf/common/edit')}"
-                        rendered="true"/>
-                    <p:menuitem id="configure-dashboard" process="@this" actionListener="#{dashboardModificationBean.navigateToDashboardDetailsPage(dashboard.id)}"
-                        icon="si si-cog" update="@this" styleClass="dashboard-configuration-action-menu-icon"
-                        value="#{ivy.cms.co('/ch.ivy.addon.portalkit.ui.jsf/dashboard/configuration/configuration')}"
-                        rendered="true" title="#{ivy.cms.co('/ch.ivy.addon.portalkit.ui.jsf/dashboard/configuration/configuration')}"/>
-                     <p:menuitem id="export-dashboard" styleClass="pr-0 pt-0 pb-0" title="#{ivy.cms.co('/ch.ivy.addon.portalkit.ui.jsf/dashboard/DashboardConfiguration/ExportDashboard')}">
-                       <h:form styleClass="dashboard-configuration__export-button-form w-full" rendered="#{dashboardModificationBean.hasExportDashboardPermission()}">
-                         <p:commandButton id="export-dashboard" styleClass=" action-column-icon-button export-dashboard ui-no-rounded-button-process-page flex w-full" icon="si si-download-bottom"
-                           title="#{ivy.cms.co('/ch.ivy.addon.portalkit.ui.jsf/dashboard/DashboardConfiguration/ExportDashboard')}"
-                           process="@this" update="@this" immediate="true" ajax="false" value="#{ivy.cms.co('/ch.ivy.addon.portalkit.ui.jsf/dashboard/DashboardConfiguration/ExportDashboard')}">
-                           <p:fileDownload value="#{dashboardModificationBean.exportToJsonFile(dashboard)}" />
-                         </p:commandButton>
-                        </h:form>
-                    </p:menuitem>
-                    <p:menuitem id="share-dashboard" rendered="#{dashboardModificationBean.isShowShareButtonOnConfig(isPublicDashboard)}"
-                          styleClass="rounded-button ui-button-outlined"
-                          actionListener="#{dashboardModificationBean.initShareDashboardLink(dashboard)}"
-                          oncomplete="PF('share-dashboard-dialog').show()" title="#{ivy.cms.co('/Dialogs/ch/ivy/addon/portal/generic/dashboard/component/DashboardModification/Share')}"
-                          icon="si si-share" update="#{cc.clientId}:share-dashboard-component:share-dashboard-dialog"
-                          value="#{ivy.cms.co('/Dialogs/ch/ivy/addon/portal/generic/dashboard/component/DashboardModification/Share')}" global="false" />
-                    <p:menuitem id="delete-dashboard" process="@this"
-                          styleClass="rounded-button ui-button-outlined ui-button-danger color-destroy" icon="si si-bin-1"
-                          actionListener="#{dashboardModificationBean.onSelectedDeleteDashboard(dashboard)}"
-                          update="dashboard-modification-component:remove-dashboard-dialog"
-                          oncomplete="PF('remove-dashboard-dialog').show()" title="#{ivy.cms.co('/ch.ivy.addon.portalkit.ui.jsf/common/delete')}"
-                          value="#{ivy.cms.co('/ch.ivy.addon.portalkit.ui.jsf/common/delete')}" />
-                </p:menu>
-              </h:panelGroup>
-              <h:panelGroup styleClass=" ui-button-outlined action-column-icon-button u-mar-right-5">
-                <i id="reorder-button-#{dashboard.id}" class="si si-navigation-menu dashboard-icon-drag-drop" />
-               </h:panelGroup>
+          <h:panelGroup layout="block">
+            <p:commandButton id="dashboard-configuration-action-button" icon="fa fa-ellipsis-h"
+              styleClass="rounded-button icon-more-menu-button #{buttonStyle} ui-no-rounded-button-process-page mr-3" type="button" />
+            <p:menu id="dashboard-configuration-action-menu" styleClass="w-13rem" overlay="true" trigger="dashboard-configuration-action-button"
+              my="right top" at="right bottom">
+              <p:menuitem id="edit" process="@this" actionListener="#{dashboardModificationBean.openDashboardDetailDialog(dashboard)}"
+                icon="si si-graphic-tablet-drawing-pen" styleClass="dashboard-configuration-action-menu-icon"
+                update="#{cc.clientId}:configuration-dashboard-detail-component:dashboard-detail-form"
+                value="#{ivy.cms.co('/ch.ivy.addon.portalkit.ui.jsf/common/edit')}" oncomplete="PF('configuration-dashboard-detail-dialog').show()"
+                target="_blank" resetValues="true" title="#{ivy.cms.co('/ch.ivy.addon.portalkit.ui.jsf/common/edit')}" rendered="true" />
+              <p:menuitem id="configure-dashboard" process="@this"
+                actionListener="#{dashboardModificationBean.navigateToDashboardDetailsPage(dashboard.id)}" icon="si si-cog" update="@this"
+                styleClass="dashboard-configuration-action-menu-icon"
+                value="#{ivy.cms.co('/ch.ivy.addon.portalkit.ui.jsf/dashboard/configuration/configuration')}" rendered="true"
+                title="#{ivy.cms.co('/ch.ivy.addon.portalkit.ui.jsf/dashboard/configuration/configuration')}" />
+              <p:menuitem id="export-dashboard" styleClass="dashboard-configuration-action-menu-icon"
+                title="#{ivy.cms.co('/ch.ivy.addon.portalkit.ui.jsf/dashboard/DashboardConfiguration/ExportDashboard')}"
+                icon="si si-download-bottom"
+                value="#{ivy.cms.co('/ch.ivy.addon.portalkit.ui.jsf/dashboard/DashboardConfiguration/ExportDashboard')}"
+                rendered="#{dashboardModificationBean.hasExportDashboardPermission()}"
+                onclick="PF('exportDashboardBtn').jq.click()"/>
+              <p:menuitem id="share-dashboard" rendered="#{dashboardModificationBean.isShowShareButtonOnConfig(isPublicDashboard)}"
+                styleClass="rounded-button ui-button-outlined" actionListener="#{dashboardModificationBean.initShareDashboardLink(dashboard)}"
+                oncomplete="PF('share-dashboard-dialog').show()"
+                title="#{ivy.cms.co('/Dialogs/ch/ivy/addon/portal/generic/dashboard/component/DashboardModification/Share')}" icon="si si-share"
+                update="#{cc.clientId}:share-dashboard-component:share-dashboard-dialog"
+                value="#{ivy.cms.co('/Dialogs/ch/ivy/addon/portal/generic/dashboard/component/DashboardModification/Share')}" global="false" />
+              <p:menuitem id="delete-dashboard" process="@this" styleClass="rounded-button ui-button-outlined ui-button-danger color-destroy"
+                icon="si si-bin-1" actionListener="#{dashboardModificationBean.onSelectedDeleteDashboard(dashboard)}"
+                update="dashboard-modification-component:remove-dashboard-dialog" oncomplete="PF('remove-dashboard-dialog').show()"
+                title="#{ivy.cms.co('/ch.ivy.addon.portalkit.ui.jsf/common/delete')}"
+                value="#{ivy.cms.co('/ch.ivy.addon.portalkit.ui.jsf/common/delete')}" />
+            </p:menu>
+          </h:panelGroup>
+          <h:panelGroup styleClass=" ui-button-outlined action-column-icon-button u-mar-right-5">
+            <i id="reorder-button-#{dashboard.id}" class="si si-navigation-menu dashboard-icon-drag-drop" />
+          </h:panelGroup>
         </div>
+          <h:form style="display:none"
+            rendered="#{dashboardModificationBean.hasExportDashboardPermission()}">
+            <p:commandButton id="export-dashboard"
+              widgetVar="exportDashboardBtn"
+              style="display:none"
+              update="@this" immediate="true" ajax="false">
+              <p:fileDownload value="#{dashboardModificationBean.exportToJsonFile(dashboard)}" />
+            </p:commandButton>
+          </h:form>
       </p:column>
     </p:dataTable>
   </h:panelGroup>