From fc0f1e73937f26438f3953a646f15bc788d7aedf Mon Sep 17 00:00:00 2001
From: Stefan Giehl <stefan@piwik.org>
Date: Wed, 4 Oct 2017 21:48:12 +0200
Subject: [PATCH] Make it possible to show a header message for datatables
(#12146)
* Make it possible to show a header message for datatables
* update changelog
* add comment that messages will be printed raw
---
CHANGELOG.md | 1 +
core/Plugin/Visualization.php | 1 +
core/ViewDataTable/Config.php | 9 +++++++++
plugins/CoreHome/stylesheets/dataTable/_dataTable.less | 2 +-
plugins/CoreHome/templates/_dataTable.twig | 4 ++++
plugins/Dashboard/stylesheets/widget.less | 6 ++++--
plugins/Morpheus/stylesheets/main.less | 2 +-
7 files changed, 21 insertions(+), 4 deletions(-)
diff --git a/CHANGELOG.md b/CHANGELOG.md
index 9973af9365..c11a4e1334 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -13,6 +13,7 @@ The Product Changelog at **[piwik.org/changelog](https://piwik.org/changelog)**
### New APIs
* Reports and visualizations can now hide the export icons with a new property `$view->config->show_export`.
+* Reports and visualizations can now show a message above the report with a new property `$view->config->show_header_message`.
* The following events have been added:
* `Metric.addMetrics` Triggered to add new metrics that cannot be picked up automatically by the platform.
* `Metric.addComputedMetrics` Triggered to add computed metrics that are not generated automatically
diff --git a/core/Plugin/Visualization.php b/core/Plugin/Visualization.php
index 6bb2c3a4f8..bd46547e64 100644
--- a/core/Plugin/Visualization.php
+++ b/core/Plugin/Visualization.php
@@ -38,6 +38,7 @@ use Piwik\API\Request as ApiRequest;
* itself:
*
* - report documentation,
+ * - a header message (if {@link Piwik\ViewDataTable\Config::$show_header_message} is set),
* - a footer message (if {@link Piwik\ViewDataTable\Config::$show_footer_message} is set),
* - a list of links to related reports (if {@link Piwik\ViewDataTable\Config::$related_reports} is set),
* - a button that allows users to switch visualizations,
diff --git a/core/ViewDataTable/Config.php b/core/ViewDataTable/Config.php
index 2c7a59beff..2a2a927da4 100644
--- a/core/ViewDataTable/Config.php
+++ b/core/ViewDataTable/Config.php
@@ -371,8 +371,17 @@ class Config
*/
public $show_ecommerce = false;
+ /**
+ * Stores an HTML message (if any) to display above the datatable view.
+ *
+ * Attention: Message will be printed raw. Don't forget to escape where needed!
+ */
+ public $show_header_message = false;
+
/**
* Stores an HTML message (if any) to display under the datatable view.
+ *
+ * Attention: Message will be printed raw. Don't forget to escape where needed!
*/
public $show_footer_message = false;
diff --git a/plugins/CoreHome/stylesheets/dataTable/_dataTable.less b/plugins/CoreHome/stylesheets/dataTable/_dataTable.less
index 2015f6ea2e..fe11180aa8 100644
--- a/plugins/CoreHome/stylesheets/dataTable/_dataTable.less
+++ b/plugins/CoreHome/stylesheets/dataTable/_dataTable.less
@@ -183,7 +183,7 @@ table.dataTable img {
position: absolute;
}
-.datatableFooterMessage {
+.datatableHeaderMessage, .datatableFooterMessage {
color: #888;
text-align: left;
margin: 10px;
diff --git a/plugins/CoreHome/templates/_dataTable.twig b/plugins/CoreHome/templates/_dataTable.twig
index b5635d9921..cdd5905933 100644
--- a/plugins/CoreHome/templates/_dataTable.twig
+++ b/plugins/CoreHome/templates/_dataTable.twig
@@ -49,6 +49,10 @@
{% if error is defined %}
{{ error.message }}
{% else %}
+ {% if properties.show_header_message is defined and properties.show_header_message is not empty %}
+ <div class='datatableHeaderMessage'>{{ properties.show_header_message | raw }}</div>
+ {% endif %}
+
{% if isDataTableEmpty %}
<div class="pk-emptyDataTable">
{% if showReportDataWasPurgedMessage is defined and showReportDataWasPurgedMessage %}
diff --git a/plugins/Dashboard/stylesheets/widget.less b/plugins/Dashboard/stylesheets/widget.less
index 8127de0547..c441b9c663 100644
--- a/plugins/Dashboard/stylesheets/widget.less
+++ b/plugins/Dashboard/stylesheets/widget.less
@@ -140,8 +140,10 @@
background-color: @theme-color-widget-background;
}
-.widget .datatableFooterMessage {
- padding-left: 12px;
+.widget {
+ .datatableHeaderMessage, .datatableFooterMessage {
+ padding-left: 12px;
+ }
}
.bar-graph-colors[data-name=grid-background] {
diff --git a/plugins/Morpheus/stylesheets/main.less b/plugins/Morpheus/stylesheets/main.less
index cbf86d85cd..c79bde51a8 100644
--- a/plugins/Morpheus/stylesheets/main.less
+++ b/plugins/Morpheus/stylesheets/main.less
@@ -510,7 +510,7 @@ div.sparkline {
color: @theme-color-text;
}
-.datatableFooterMessage {
+.datatableHeaderMessage, .datatableFooterMessage {
.font-default(13px, 18px);
color: @color-silver;
font-weight: normal;
--
GitLab