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

N°4565 Add a message indicator to caselog tabs toggler

Browse Source
This commit is contained in:
Stephen Abello
2022-02-15 10:20:41 +01:00
parent bbd50ba73b
commit e971d628dd
3 changed files with 47 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
css/backoffice/layout/activity-panel/_activity-panel.scss
View File

@@ -41,6 +41,12 @@ $ibo-activity-panel--tab-title-decoration--border-radius: $ibo-border-radius-300
$ibo-activity-panel--tab-title-draft-indicator--margin-x: $ibo-activity-panel--tab-title-decoration--margin-right !default;
$ibo-activity-panel--tab-title-messages-count--margin-left: $ibo-activity-panel--tab-title-draft-indicator--margin-x !default;
$ibo-activity-panel--tab-title-messages-count--background-color: $ibo-color-grey-200 !default;
$ibo-activity-panel--tab-title-messages-count--padding-x: $ibo-spacing-200 !default;
$ibo-activity-panel--tab-title-messages-count--padding-y: $ibo-spacing-0 !default;
$ibo-activity-panel--tab-title-messages-count--border-radius: $ibo-border-radius-300 !default;
$ibo-activity-panel--tab-title-text--max-width: 100px !default;
/* - Tab toolbar */
@@ -180,6 +186,9 @@ $ibo-activity-panel--open-icon--margin-left: 0.75rem !default;
.ibo-activity-panel--tab-title{
background-color: $ibo-activity-panel--tab-title--is-active--background-color;
}
.ibo-activity-panel--tab-title-messages-count{
display: none;
}
}
&.ibo-is-draft{
.ibo-activity-panel--tab-title-draft-indicator{
@@ -213,6 +222,17 @@ $ibo-activity-panel--open-icon--margin-left: 0.75rem !default;
border-radius: $ibo-activity-panel--tab-title-decoration--border-radius;
@extend %ibo-depression-100;
}
.ibo-activity-panel--tab-title-messages-count{
display: inline-block;
margin-left: $ibo-activity-panel--tab-title-messages-count--margin-left;
background-color: $ibo-activity-panel--tab-title-messages-count--background-color;
padding: $ibo-activity-panel--tab-title-messages-count--padding-y $ibo-activity-panel--tab-title-messages-count--padding-x;
border-radius: $ibo-activity-panel--tab-title-messages-count--border-radius;
&[data-messages-count="0"]{
display: none;
}
}
.ibo-activity-panel--tab-title-draft-indicator{
display: none;
margin-left: $ibo-activity-panel--tab-title-draft-indicator--margin-x;

28
js/layouts/activity-panel/activity-panel.js
View File

@@ -922,9 +922,10 @@ $(function()
return false;
}
// Update the feed
// Update the feed and tab toggler message counter
for (let sCaseLogAttCode in oData.data.entries) {
me._AddEntry(oData.data.entries[sCaseLogAttCode], 'start');
me._IncreaseTabTogglerMessagesCounter(sCaseLogAttCode);
}
me._ApplyEntriesFilters();
@@ -946,7 +947,30 @@ $(function()
me._UnfreezeCaseLogsEntryForms();
});
},
/**
* Increase a tab toggler number of messages indicator given a caselog attribute code
*
* @param sCaseLogAttCode {string} A caselog attribute code
* @return {void}
* @private
*/
_IncreaseTabTogglerMessagesCounter: function(sCaseLogAttCode){
let oTabTogglerCounter = this._GetTabTogglerFromCaseLogAttCode(sCaseLogAttCode).find('[data-role="ibo-activity-panel--tab-title-messages-count"]');
let iNewCounterValue = parseInt(oTabTogglerCounter.attr('data-messages-count')) + 1;
oTabTogglerCounter.attr('data-messages-count', iNewCounterValue).text(iNewCounterValue);
},
/**
* Return tab toggler given a caselog attribute code
*
* @param sCaseLogAttCode {string} A caselog attribute code
* @return {Object}
* @private
*/
_GetTabTogglerFromCaseLogAttCode: function(sCaseLogAttCode)
{
return this.element.find(this.js_selectors.tab_toggler+'[data-tab-type="caselog"][data-caselog-attribute-code="'+sCaseLogAttCode+'"]')
},
// - Helpers on object lock
/**
* Initialize the lock watcher on a regular basis

1
templates/base/layouts/activity-panel/layout.html.twig
View File

@@ -17,6 +17,7 @@
<a href="#" class="ibo-activity-panel--tab-title" data-role="ibo-activity-panel--tab-title">
<span class="ibo-activity-panel--tab-title-decoration" data-role="ibo-activity-panel--tab-title-decoration"></span>
<span class="ibo-activity-panel--tab-title-text" data-role="ibo-activity-panel--tab-title-text" title="{{ aCaseLogData.title }}">{{ aCaseLogData.title }}</span>
<span class="ibo-activity-panel--tab-title-messages-count" data-role="ibo-activity-panel--tab-title-messages-count" data-messages-count="{{ aCaseLogData.total_messages_count }}">{{ aCaseLogData.total_messages_count }}</span>
<span class="ibo-activity-panel--tab-title-draft-indicator"
data-role="ibo-activity-panel--tab-title-draft-indicator"
data-tooltip-content="{{ 'UI:Layout:ActivityPanel:Tab:Log:DraftIndicator:Tooltip'|dict_s }}">