composer/iTop
6
0
Fork 0
mirror of https://github.com/Combodo/iTop.git synced 2026-04-24 11:08:45 +02:00
Code Issues Packages Projects Releases Wiki Activity

N°2039 - Display actions as independent icon buttons

Browse Source
This commit is contained in:
Stephen Abello
2024-03-04 14:11:20 +01:00
parent e371db846a
commit ff7e4d3db6
2 changed files with 40 additions and 51 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
css/backoffice/pages/_notifications.scss
View File

@@ -21,6 +21,9 @@ $ibo-notifications--view-all--empty--svg--max-width: 30% !default;
grid-gap: $ibo-notifications--view-all--container--grid-gap; grid-gap: $ibo-notifications--view-all--container--grid-gap;
.ibo-object-summary .ibo-panel--title{ .ibo-object-summary .ibo-panel--title{
font-size: $ibo-font-size-250; font-size: $ibo-font-size-250;
}
.ibo-object-summary .ibo-panel--toolbar{
min-width: 102px;
} }
.ibo-object-summary > .ibo-panel--body{ .ibo-object-summary > .ibo-panel--body{
box-shadow: none; box-shadow: none;
@@ -53,7 +56,18 @@ $ibo-notifications--view-all--empty--svg--max-width: 30% !default;
.ibo-notifications--view-all--item--unread .ibo-panel--body::before{ .ibo-notifications--view-all--item--unread .ibo-panel--body::before{
background-color: $ibo-notifications--view-all--item--unread--highlight--background-color; background-color: $ibo-notifications--view-all--item--unread--highlight--background-color;
} }
.ibo-notifications--view-all--read-action, .ibo-notifications--view-all--unread-action {
margin-left: 0 !important;
}
.ibo-notifications--view-all--item--read .ibo-notifications--view-all--read-action {
display: none;
}
.ibo-notifications--view-all--item--unread .ibo-notifications--view-all--unread-action {
display: none;
}
.ibo-notifications--view-all--empty { .ibo-notifications--view-all--empty {
@extend %ibo-fully-centered-content; @extend %ibo-fully-centered-content;
flex-direction: column; flex-direction: column;

77
sources/Controller/Newsroom/iTopNewsroomController.php
View File

@@ -233,10 +233,6 @@ $.ajax({
type: 'POST', type: 'POST',
success: function(data) { success: function(data) {
if (data.status === 'success') { if (data.status === 'success') {
let MarkAsReadButton = oNotificationToMarkAsRead.find('.ibo-button-group:not(.ibo-is-hidden)');
let MarkAsUnreadButton = oNotificationToMarkAsRead.find('.ibo-button-group.ibo-is-hidden');
MarkAsReadButton.addClass('ibo-is-hidden');
MarkAsUnreadButton.removeClass('ibo-is-hidden');
oNotificationToMarkAsRead.removeClass('ibo-notifications--view-all--item--unread').addClass('ibo-notifications--view-all--item--read'); oNotificationToMarkAsRead.removeClass('ibo-notifications--view-all--item--unread').addClass('ibo-notifications--view-all--item--read');
CombodoToast.OpenSuccessToast(data.message); CombodoToast.OpenSuccessToast(data.message);
$('.ibo-notifications--view-all--container').trigger('itop.notification.read'); $('.ibo-notifications--view-all--container').trigger('itop.notification.read');
@@ -273,12 +269,6 @@ $.ajax({
type: 'POST', type: 'POST',
success: function(data) { success: function(data) {
if (data.status === 'success') { if (data.status === 'success') {
let MarkAsUnreadButton = oNotificationToMarkAsUnread.find('.ibo-button-group:not(.ibo-is-hidden)');
let MarkAsReadButton = oNotificationToMarkAsUnread.find('.ibo-button-group.ibo-is-hidden');
MarkAsReadButton.removeClass('ibo-is-hidden');
MarkAsUnreadButton.addClass('ibo-is-hidden');
oNotificationToMarkAsUnread.removeClass('ibo-notifications--view-all--item--read').addClass('ibo-notifications--view-all--item--unread'); oNotificationToMarkAsUnread.removeClass('ibo-notifications--view-all--item--read').addClass('ibo-notifications--view-all--item--unread');
CombodoToast.OpenSuccessToast(data.message); CombodoToast.OpenSuccessToast(data.message);
$('.ibo-notifications--view-all--container').trigger('itop.notification.unread'); $('.ibo-notifications--view-all--container').trigger('itop.notification.unread');
@@ -384,15 +374,15 @@ JS
$oEventBlock->SetIcon($sIconUrl, Panel::ENUM_ICON_COVER_METHOD_COVER,true); $oEventBlock->SetIcon($sIconUrl, Panel::ENUM_ICON_COVER_METHOD_COVER,true);
} }
// Prepare Event actions
$oMarkAsReadPopoverMenu = new PopoverMenu();
$oMarkAsUnreadPopoverMenu = new PopoverMenu();
// Common actions // Common actions
$sDeleteUrl = Router::GetInstance()->GenerateUrl(self::ROUTE_NAMESPACE.'.delete_event', ['notification_id' => $oEvent->GetKey(), 'token' => $sCSRFToken]); $sDeleteUrl = Router::GetInstance()->GenerateUrl(self::ROUTE_NAMESPACE.'.delete_event', ['notification_id' => $oEvent->GetKey(), 'token' => $sCSRFToken]);
$oDeleteButton = new JSPopupMenuItem( $oDeleteButton = ButtonUIBlockFactory::MakeForAlternativeDestructiveAction(
'',
'UI:Newsroom:iTopNotification:ViewAllPage:Action:Delete:Label', 'UI:Newsroom:iTopNotification:ViewAllPage:Action:Delete:Label',
Dict::S('UI:Newsroom:iTopNotification:ViewAllPage:Action:Delete:Label'), 'UI:Newsroom:iTopNotification:ViewAllPage:Action:Delete:Label'
);
$oDeleteButton->SetOnClickJsCode(
<<<JS <<<JS
let oSelf = this; let oSelf = this;
@@ -410,31 +400,26 @@ $.ajax({
} }
} }
}); });
JS, JS
'_blank' )
); ->SetIconClass('fas fa-trash-alt')
$oViewButton = new URLPopupMenuItem( ->SetTooltip(Dict::S('UI:Newsroom:iTopNotification:ViewAllPage:Action:Delete:Label'));
'UI:Newsroom:iTopNotification:ViewAllPage:Action:ViewObject:Label',
$oViewButton = ButtonUIBlockFactory::MakeIconLink('fas fa-external-link-alt',
Dict::S('UI:Newsroom:iTopNotification:ViewAllPage:Action:ViewObject:Label'), Dict::S('UI:Newsroom:iTopNotification:ViewAllPage:Action:ViewObject:Label'),
Router::GetInstance()->GenerateUrl(self::ROUTE_NAMESPACE.'.view_event', ['event_id' => $oEvent->GetKey()]), Router::GetInstance()->GenerateUrl(self::ROUTE_NAMESPACE.'.view_event', ['event_id' => $iEventId]),
'_blank' '_blank'
); );
// Mark as read action // Mark as read action
$oMarkAsReadButton = ButtonUIBlockFactory::MakeForAlternativeSecondaryAction( $oMarkAsReadButton = ButtonUIBlockFactory::MakeForAlternativeSecondaryAction(
Dict::S('UI:Newsroom:iTopNotification:ViewAllPage:Action:MarkAsRead:Label'), '',
'UI:Newsroom:iTopNotification:ViewAllPage:Action:MarkAsRead:Label',
'UI:Newsroom:iTopNotification:ViewAllPage:Action:MarkAsRead:Label', 'UI:Newsroom:iTopNotification:ViewAllPage:Action:MarkAsRead:Label',
'UI:Newsroom:iTopNotification:ViewAllPage:Action:MarkAsRead:Label'
); );
$oMarkAsReadButton->AddCSSClass('ibo-notifications--view-all--read-action')
// Mark as read action ->SetIconClass('far fa-envelope-open')
$oMarkAsReadPopoverMenu->AddItem('more-actions', PopoverMenuItemFactory::MakeFromApplicationPopupMenuItem($oViewButton))->SetContainer(PopoverMenu::ENUM_CONTAINER_PARENT); ->SetTooltip(Dict::S('UI:Newsroom:iTopNotification:ViewAllPage:Action:MarkAsRead:Label'));
$oMarkAsReadPopoverMenu->AddItem('more-actions', PopoverMenuItemFactory::MakeFromApplicationPopupMenuItem($oDeleteButton))->SetContainer(PopoverMenu::ENUM_CONTAINER_PARENT);
// Mark as unread action
$oMarkAsUnreadPopoverMenu->AddItem('more-actions', PopoverMenuItemFactory::MakeFromApplicationPopupMenuItem($oViewButton))->SetContainer(PopoverMenu::ENUM_CONTAINER_PARENT);
$oMarkAsUnreadPopoverMenu->AddItem('more-actions', PopoverMenuItemFactory::MakeFromApplicationPopupMenuItem($oDeleteButton))->SetContainer(PopoverMenu::ENUM_CONTAINER_PARENT);
// Mark as unread action // Mark as unread action
$sMarkAsReadUrl = Router::GetInstance()->GenerateUrl(self::ROUTE_NAMESPACE.'.mark_as_read', ['notification_id' => $oEvent->GetKey(), 'token' => $sCSRFToken]); $sMarkAsReadUrl = Router::GetInstance()->GenerateUrl(self::ROUTE_NAMESPACE.'.mark_as_read', ['notification_id' => $oEvent->GetKey(), 'token' => $sCSRFToken]);
@@ -446,8 +431,6 @@ JS,
type: 'POST', type: 'POST',
success: function(data) { success: function(data) {
if (data.status === 'success') { if (data.status === 'success') {
$(oSelf).parent('.ibo-button-group').addClass('ibo-is-hidden');
$(oSelf).parent('.ibo-button-group').siblings('.ibo-button-group').removeClass('ibo-is-hidden');
$(oSelf).parents('.ibo-object-summary').removeClass('ibo-notifications--view-all--item--unread').addClass('ibo-notifications--view-all--item--read'); $(oSelf).parents('.ibo-object-summary').removeClass('ibo-notifications--view-all--item--unread').addClass('ibo-notifications--view-all--item--read');
CombodoToast.OpenSuccessToast(data.message); CombodoToast.OpenSuccessToast(data.message);
$('.ibo-notifications--view-all--container').trigger('itop.notification.read'); $('.ibo-notifications--view-all--container').trigger('itop.notification.read');
@@ -460,13 +443,14 @@ JS,
JS JS
); );
$oMarkAsReadButtonGroup = ButtonGroupUIBlockFactory::MakeButtonWithOptionsMenu($oMarkAsReadButton, $oMarkAsReadPopoverMenu);
$oMarkAsUnreadButton = ButtonUIBlockFactory::MakeForAlternativeSecondaryAction( $oMarkAsUnreadButton = ButtonUIBlockFactory::MakeForAlternativeSecondaryAction(
Dict::S('UI:Newsroom:iTopNotification:ViewAllPage:Action:MarkAsUnread:Label'), '',
'UI:Newsroom:iTopNotification:ViewAllPage:Action:MarkAsUnread:Label', 'UI:Newsroom:iTopNotification:ViewAllPage:Action:MarkAsUnread:Label',
'UI:Newsroom:iTopNotification:ViewAllPage:Action:MarkAsUnread:Label' 'UI:Newsroom:iTopNotification:ViewAllPage:Action:MarkAsUnread:Label'
); );
$oMarkAsUnreadButton->AddCSSClass('ibo-notifications--view-all--unread-action')
->SetIconClass('far fa-envelope')
->SetTooltip(Dict::S('UI:Newsroom:iTopNotification:ViewAllPage:Action:MarkAsUnread:Label'));
$sMarkAsUnreadUrl = Router::GetInstance()->GenerateUrl(self::ROUTE_NAMESPACE.'.mark_as_unread', ['notification_id' => $oEvent->GetKey(), 'token' => $sCSRFToken]); $sMarkAsUnreadUrl = Router::GetInstance()->GenerateUrl(self::ROUTE_NAMESPACE.'.mark_as_unread', ['notification_id' => $oEvent->GetKey(), 'token' => $sCSRFToken]);
$oMarkAsUnreadButton->SetOnClickJsCode( $oMarkAsUnreadButton->SetOnClickJsCode(
<<<JS <<<JS
@@ -476,8 +460,6 @@ JS
type: 'POST', type: 'POST',
success: function(data) { success: function(data) {
if (data.status === 'success') { if (data.status === 'success') {
$(oSelf).parent('.ibo-button-group').addClass('ibo-is-hidden');
$(oSelf).parent('.ibo-button-group').siblings('.ibo-button-group').removeClass('ibo-is-hidden');
$(oSelf).parents('.ibo-object-summary').removeClass('ibo-notifications--view-all--item--read').addClass('ibo-notifications--view-all--item--unread'); $(oSelf).parents('.ibo-object-summary').removeClass('ibo-notifications--view-all--item--read').addClass('ibo-notifications--view-all--item--unread');
CombodoToast.OpenSuccessToast(data.message); CombodoToast.OpenSuccessToast(data.message);
$('.ibo-notifications--view-all--container').trigger('itop.notification.unread'); $('.ibo-notifications--view-all--container').trigger('itop.notification.unread');
@@ -489,25 +471,18 @@ JS
}); });
JS JS
); );
$oMarkAsUnreadButtonGroup = ButtonGroupUIBlockFactory::MakeButtonWithOptionsMenu($oMarkAsUnreadButton, $oMarkAsUnreadPopoverMenu);
// Add actions to the object summary block and remove old button // Add actions to the object summary block and remove old button
$oOldButtonId = $oEventBlock->GetActions()->GetId(); $oOldButtonId = $oEventBlock->GetActions()->GetId();
$oEventBlock->RemoveSubBlock($oOldButtonId); $oEventBlock->RemoveSubBlock($oOldButtonId);
$oEventBlock->SetToolBlocks([$oMarkAsReadButtonGroup, $oMarkAsUnreadButtonGroup]); $oEventBlock->SetToolBlocks([$oMarkAsUnreadButton, $oMarkAsReadButton, $oViewButton, $oDeleteButton]);
$oActionsBlock = new UIContentBlock(); $oActionsBlock = new UIContentBlock();
$oActionsBlock->AddSubBlock($oMarkAsReadButtonGroup); $oActionsBlock->AddSubBlock($oMarkAsUnreadButton);
$oActionsBlock->AddSubBlock($oMarkAsUnreadButtonGroup); $oActionsBlock->AddSubBlock($oMarkAsReadButton);
$oActionsBlock->AddSubBlock($oViewButton);
$oActionsBlock->AddSubBlock($oDeleteButton);
$oEventBlock->SetActions($oActionsBlock); $oEventBlock->SetActions($oActionsBlock);
// Display the right button depending on the read status
if($oEvent->Get('read') === 'no'){
$oMarkAsUnreadButtonGroup->SetCSSClasses(['ibo-is-hidden']);
}
else{
$oMarkAsReadButtonGroup->SetCSSClasses(['ibo-is-hidden']);
}
$oMainContentBlock->AddSubBlock($oEventBlock); $oMainContentBlock->AddSubBlock($oEventBlock);
} }