Merge pull request #22552 from colemanw/searchKitConditionalCss

SearchKit - Support operators in conditional css rules
civicrm · Jan 22, 2022 · 1f43c7f · 1f43c7f
2 parents 53eaf61 + bef7cd6
commit 1f43c7f
Show file tree

Hide file tree

Showing 4 changed files with 11 additions and 11 deletions.
diff --git a/ext/search_kit/Civi/Api4/Action/SearchDisplay/AbstractRunAction.php b/ext/search_kit/Civi/Api4/Action/SearchDisplay/AbstractRunAction.php
@@ -295,10 +295,8 @@ protected function getCssStyles(array $styleRules, array $data) {
    */
   protected function getCssRuleCondition($clause) {
     $fieldKey = $clause[1] ?? NULL;
-    // For fields used in group by, add aggregation and change operator from = to CONTAINS
-    // FIXME: This assumes the operator is always set to '=', which so far is all the admin UI supports.
-    // That's only a safe assumption as long as the admin UI doesn't have an operator selector.
-    // @see ang/crmSearchAdmin/displays/common/searchAdminCssRules.html
+    // For fields used in group by, add aggregation and change operator to CONTAINS
+    // NOTE: This doesn't support any other operators for aggregated fields.
     if ($fieldKey && $this->canAggregate($fieldKey)) {
       $clause[2] = 'CONTAINS';
       $fieldKey = 'GROUP_CONCAT_' . str_replace(['.', ':'], '_', $clause[1]);

diff --git a/ext/search_kit/ang/crmSearchAdmin.module.js b/ext/search_kit/ang/crmSearchAdmin.module.js
@@ -168,7 +168,7 @@
         }
         // Might be a pseudoField
         if (!field) {
-          field = _.cloneDeep(_.find(CRM.crmSearchAdmin.pseudoFields, {name: name}));
+          field = _.find(CRM.crmSearchAdmin.pseudoFields, {name: name});
         }
         if (field) {
           field.baseEntity = entityName;

diff --git a/ext/search_kit/ang/crmSearchAdmin/displays/common/searchAdminCssRules.component.js b/ext/search_kit/ang/crmSearchAdmin/displays/common/searchAdminCssRules.component.js
@@ -28,7 +28,10 @@
       this.styles.strikethrough = ts('Strikethrough');
 
       this.fields = function() {
-        return {results: ctrl.crmSearchAdmin.getAllFields(':name', ['Field', 'Custom', 'Extra'])};
+        var allFields = ctrl.crmSearchAdmin.getAllFields(':name', ['Field', 'Custom', 'Extra', 'Pseudo']);
+        return {
+          results: ctrl.crmSearchAdmin.getSelectFields().concat(allFields)
+        };
       };
 
       this.$onInit = function() {
@@ -61,8 +64,7 @@
         return !this.item.cssRules || !this.item.cssRules.length || _.last(this.item.cssRules)[1];
       };
 
-
-
+      this.operators = CRM.crmSearchAdmin.operators;
     }
   });
 

diff --git a/ext/search_kit/ang/crmSearchAdmin/displays/common/searchAdminCssRules.html b/ext/search_kit/ang/crmSearchAdmin/displays/common/searchAdminCssRules.html
@@ -22,9 +22,9 @@
   </div>
   <label>{{:: ts('If') }}</label>
   <input class="form-control collapsible-optgroups" ng-model="clause[1]" crm-ui-select="::{data: $ctrl.fields, allowClear: true, placeholder: ts('Always')}" ng-change="$ctrl.onSelectField(clause)" />
-  <!-- TODO: Support operators other than '=' as clause[2] -->
-  <label ng-if="clause[1]">{{:: ts('Is') }}</label>
-  <crm-search-input ng-if="clause[1]" ng-model="clause[3]" field="$ctrl.getField(clause[1])" option-key="'name'" op="clause[1]" format="$ctrl.format" class="form-group"></crm-search-input>
+  <select class="form-control api4-operator" ng-if="clause[1]" ng-model="clause[2]" ng-options="o.key as o.value for o in $ctrl.operators">
+  </select>
+  <crm-search-input ng-if="clause[1] && clause[2].indexOf('IS ') !== 0" ng-model="clause[3]" field="$ctrl.getField(clause[1])" option-key="'name'" op="clause[2]" format="$ctrl.format" class="form-group"></crm-search-input>
   <button type="button" class="btn-xs btn-danger-outline" ng-click="$ctrl.item.cssRules.splice($index);" title="{{:: ts('Remove style') }}">
     <i class="crm-i fa-ban"></i>
   </button>