diff --git a/application/displayblock.class.inc.php b/application/displayblock.class.inc.php index 45ad0f830..8784f209c 100644 --- a/application/displayblock.class.inc.php +++ b/application/displayblock.class.inc.php @@ -1016,13 +1016,13 @@ JS $oBlock = new UIContentBlockWithJSRefreshCallback(null, ["ibo-dashlet-header-dynamic--container"]); foreach ($aStateLabels as $sStateValue => $sStateLabel) { $aCount = $aCounts[$sStateValue]; - $oBadge = PillFactory::MakeForState($sClass, $sStateValue); $sHyperlink = $aCount['link']; $sCountLabel = $aCount['label']; - $sColor = $oBadge->GetColor(); - $oBadge->AddHtml("$sCountLabel"); - $oBadge->AddHtml("$sStateLabel"); - $oBlock->AddSubBlock($oBadge); + $oPill = PillFactory::MakeForState($sClass, $sStateValue) + ->SetUrl($sHyperlink) + ->AddHtml("$sCountLabel") + ->AddHtml("$sStateLabel"); + $oBlock->AddSubBlock($oPill); } $aExtraParams['query_params'] = $this->m_oFilter->GetInternalParams(); $aRefreshParams = ['filter' => $this->m_oFilter->ToOQL(), "extra_params" => json_encode($aExtraParams)]; diff --git a/css/backoffice/components/_pill.scss b/css/backoffice/components/_pill.scss index af2305feb..ce137e1ea 100644 --- a/css/backoffice/components/_pill.scss +++ b/css/backoffice/components/_pill.scss @@ -82,7 +82,7 @@ $ibo-pill-states-colors: ( ); @each $sType, $aColors in $ibo-pill-states-colors { - .ibo-pill-is-#{$sType} { + .ibo-pill.ibo-is-#{$sType} { color: map-get($aColors, 'secondary-color'); background-color: map-get($aColors, 'primary-color'); } diff --git a/sources/application/UI/Base/Component/Pill/Pill.php b/sources/application/UI/Base/Component/Pill/Pill.php index 714d031a1..27ef947e8 100644 --- a/sources/application/UI/Base/Component/Pill/Pill.php +++ b/sources/application/UI/Base/Component/Pill/Pill.php @@ -20,13 +20,25 @@ use Combodo\iTop\Application\UI\Base\Layout\UIContentBlock; */ class Pill extends UIContentBlock { + // Overloaded constants + public const BLOCK_CODE = 'ibo-pill'; + public const DEFAULT_HTML_TEMPLATE_REL_PATH = 'base/components/pill/layout'; + /** @var string */ protected $sColor; + /** @var string URL to go to if the pill is clicked */ + protected $sUrl; + /** + * Pill constructor. + * + * @param string $sColor + */ public function __construct(string $sColor) { - parent::__construct(null, ["ibo-pill ibo-pill-is-{$sColor}"]); + parent::__construct(); $this->SetColor($sColor); + $this->SetUrl(''); } /** @@ -48,4 +60,32 @@ class Pill extends UIContentBlock return $this; } + + /** + * @return string + */ + public function GetUrl(): string + { + return $this->sUrl; + } + + /** + * @param string $sUrl + * + * @return $this + */ + public function SetUrl(string $sUrl) + { + $this->sUrl = $sUrl; + + return $this; + } + + /** + * @return bool + */ + public function HasUrl(): bool + { + return !empty($this->sUrl); + } } \ No newline at end of file diff --git a/sources/application/UI/Base/Component/Pill/PillFactory.php b/sources/application/UI/Base/Component/Pill/PillFactory.php index 5208c606b..492535a4d 100644 --- a/sources/application/UI/Base/Component/Pill/PillFactory.php +++ b/sources/application/UI/Base/Component/Pill/PillFactory.php @@ -20,7 +20,12 @@ use Combodo\iTop\Application\UI\Helper\UIHelper; */ class PillFactory { - + /** + * @param string $sClass + * @param string $sStateCode + * + * @return \Combodo\iTop\Application\UI\Base\Component\Pill\Pill + */ public static function MakeForState(string $sClass, string $sStateCode) { $sColor = UIHelper::GetColorFromStatus($sClass, $sStateCode); diff --git a/templates/base/components/badge/layout.html.twig b/templates/base/components/badge/layout.html.twig deleted file mode 100644 index 9c25fc669..000000000 --- a/templates/base/components/badge/layout.html.twig +++ /dev/null @@ -1,3 +0,0 @@ -{# @copyright Copyright (C) 2010-2021 Combodo SARL #} -{# @license http://opensource.org/licenses/AGPL-3.0 #} -{% extends "base/layouts/content-block/layout.html.twig" %} \ No newline at end of file diff --git a/templates/base/components/pill/layout.html.twig b/templates/base/components/pill/layout.html.twig new file mode 100644 index 000000000..79dccc3f2 --- /dev/null +++ b/templates/base/components/pill/layout.html.twig @@ -0,0 +1,11 @@ +{# @copyright Copyright (C) 2010-2021 Combodo SARL #} +{# @license http://opensource.org/licenses/AGPL-3.0 #} +{% set sTagName = oUIBlock.HasUrl() ? 'a' : 'span' %} +<{{ sTagName }} id="{{ oUIBlock.GetId() }}" + {% if oUIBlock.HasUrl() %}href="{{ oUIBlock.GetUrl()|raw }}"{% endif %} + class="ibo-pill ibo-is-{{ oUIBlock.GetColor() }}" + data-role="ibo-pill"> + {% for oSubBlock in oUIBlock.GetSubBlocks() %} + {{ render_block(oSubBlock, {aPage: aPage}) }} + {% endfor %} + \ No newline at end of file