Add Counter label (#2900)

* Add Counter label * Update index.js * Added visualization name as placeholder * Backward-compatible for visualization name as label
getredash · Oct 14, 2018 · be377b5 · be377b5
1 parent 6b11ae4
commit be377b5
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 1 deletion.
diff --git a/client/app/visualizations/counter/counter-editor.html b/client/app/visualizations/counter/counter-editor.html
@@ -8,6 +8,12 @@
     </li>
   </ul>
   <div ng-show="currentTab == 'general'" class="m-t-10 m-b-10">
+      <div class="form-group">
+          <label class="col-lg-6">Counter Label</label>
+          <div class="col-lg-6">
+            <input type="text" ng-model="visualization.options.counterLabel" placeholder="{{visualization.name}}" class="form-control" ng-trim="false">
+          </div>
+        </div>
     <div class="form-group">
       <label class="col-lg-6">Counter Value Column Name</label>
       <div class="col-lg-6">

diff --git a/client/app/visualizations/counter/counter.html b/client/app/visualizations/counter/counter.html
@@ -12,6 +12,6 @@
     <value ng-if="isNumber">{{stringPrefix}}{{counterValue | number}}{{stringSuffix}}</value>
     <value ng-if="!isNumber">{{stringPrefix}}{{counterValue}}{{stringSuffix}}</value>
     <counter-target ng-if="targetValue" title="({{targetValue | number}})">({{targetValue | number}})</counter-target>
-    <counter-name>{{visualization.name}}</counter-name>
+    <counter-name>{{counterLabel}}</counter-name>
   </div>
 </counter>
diff --git a/client/app/visualizations/counter/index.js b/client/app/visualizations/counter/index.js
@@ -41,6 +41,13 @@ function CounterRenderer($timeout) {
           const targetRowNumber = getRowNumber($scope.visualization.options.targetRowNumber, queryData.length);
           const counterColName = $scope.visualization.options.counterColName;
           const targetColName = $scope.visualization.options.targetColName;
+          const counterLabel = $scope.visualization.options.counterLabel;
+
+          if (counterLabel) {
+            $scope.counterLabel = counterLabel;
+          } else {
+            $scope.counterLabel = $scope.visualization.name;
+          }
 
           if ($scope.visualization.options.countRow) {
             $scope.counterValue = queryData.length;