add, edit, remove filters functionality implemented

public/app/plugins/datasource/opentsdb/config_ctrl.ts

@@ -15,7 +15,7 @@ export class OpenTsConfigCtrl {
 
   tsdbVersions = [
     {name: '<=2.1', value: 1},
-    {name: '>=2.2', value: 2},
+    {name: '2.2', value: 2},
   ];
 
 }

public/app/plugins/datasource/opentsdb/partials/query.editor.html

@@ -87,12 +87,12 @@
     <li class="tight-form-item tight-form-align query-keyword" style="width: 100px">
       Filters
     </li>
-    <li ng-repeat="filter in ctrl.target.filters track by $index" class="tight-form-item">
-      {{filter.type}}:{{filter.key}}&nbsp;=&nbsp;{{filter.value}}:{{filter.groupByFlag}}
-      <a ng-click="ctrl.editFilter(filter.type, filter.key, filter.value, filter.groupByFlag)">
+    <li ng-repeat="fil in ctrl.target.filters track by $index" class="tight-form-item">
+      {{fil.tagk}}&nbsp;=&nbsp;{{fil.type}}&#40;{{fil.filter}}&#41;&nbsp;&#44&nbsp;groupBy&nbsp;=&nbsp;{{fil.groupBy}}
+      <a ng-click="ctrl.editFilter(fil, $index)">
         <i class="fa fa-pencil"></i>
       </a>
-      <a ng-click="ctrl.removeFilter(filter.type, filter.key)">
+      <a ng-click="ctrl.removeFilter($index)">
         <i class="fa fa-remove"></i>
       </a>
     </li>
@@ -102,15 +102,23 @@
       </a>
     </li>
 
-    <li ng-show="ctrl.addFilterMode">
+    <li class="query-keyword" ng-show="ctrl.addFilterMode">
       <input type="text" class="input-small tight-form-input" spellcheck='false'
-      bs-typeahead="ctrl.suggestFilterKeys" data-min-length=0 data-items=100
+      bs-typeahead="ctrl.suggestTagKeys" data-min-length=0 data-items=100
       ng-model="ctrl.target.currentFilterKey" placeholder="key"></input>
 
+      Type <select ng-model="ctrl.target.currentFilterType"
+      class="tight-form-input input-small"
+      ng-options="filType for filType in ctrl.filterTypes">
+      </select>
+ 
       <input type="text" class="input-small tight-form-input"
-      spellcheck='false' bs-typeahead="ctrl.suggestFilterValues"
-      data-min-length=0 data-items=100 ng-model="ctrl.target.currentFilterValue" placeholder="value">
+      spellcheck='false' bs-typeahead="ctrl.suggestTagValues"
+      data-min-length=0 data-items=100 ng-model="ctrl.target.currentFilterValue" placeholder="filter">
       </input>
+
+      groupBy <editor-checkbox text="" model="ctrl.target.currentFilterGroupBy"></editor-checkbox>
+ 
       <a ng-click="ctrl.addFilter()">
         add filter
       </a>

public/app/plugins/datasource/opentsdb/query_ctrl.ts

@@ -19,6 +19,7 @@ export class OpenTsQueryCtrl extends QueryCtrl {
   suggestTagKeys: any;
   suggestTagValues: any;
   addTagMode: boolean;
+  addFilterMode: boolean;
 
   /** @ngInject **/
   constructor($scope, $injector) {
@@ -108,6 +109,58 @@ export class OpenTsQueryCtrl extends QueryCtrl {
     this.addTag();
   }
 
+  addFilter() {
+    if (!this.addFilterMode) {
+      this.addFilterMode = true;
+      return;
+    }
+
+    if (!this.target.filters) {
+      this.target.filters = [];
+    }
+
+    if (!this.target.currentFilterType) {
+      this.target.currentFilterType = 'literal_or';
+    }
+
+    if (!this.target.currentFilterGroupBy) {
+      this.target.currentFilterGroupBy = false;
+    }
+
+    this.errors = this.validateTarget();
+
+    if (!this.errors.filters) {
+      var currentFilter = {
+        type:    this.target.currentFilterType,
+        tagk:     this.target.currentFilterKey,
+        filter:   this.target.currentFilterValue,
+        groupBy: this.target.currentFilterGroupBy
+      };
+      this.target.filters.push(currentFilter);
+      this.target.currentFilterType = 'literal_or';
+      this.target.currentFilterKey = '';
+      this.target.currentFilterValue = '';
+      this.target.currentFilterGroupBy = false;
+      this.targetBlur();
+    }
+
+    this.addFilterMode = false;
+  }
+
+  removeFilter(index) {
+    this.target.filters.splice(index, 1);
+    this.targetBlur();
+  }
+
+  editFilter(fil, index) {
+    this.removeFilter(index);
+    this.target.currentFilterKey = fil.tagk;
+    this.target.currentFilterValue = fil.filter;
+    this.target.currentFilterType = fil.type;
+    this.target.currentFilterGroupBy = fil.groupBy;
+    this.addFilter();
+  }
+
   validateTarget() {
     var errs: any = {};