ext/search/ang/crmSearchDisplayTable/crmSearchDisplayTable.component.js

   1 (function(angular, $, _) {
   2   "use strict";
   3
   4   angular.module('crmSearchDisplayTable').component('crmSearchDisplayTable', {
   5     bindings: {
   6       apiEntity: '@',
   7       search: '<',
   8       display: '<',
   9       settings: '<',
  10       filters: '<'
  11     },
  12     require: {
  13       afFieldset: '?^^afFieldset'
  14     },
  15     templateUrl: '~/crmSearchDisplayTable/crmSearchDisplayTable.html',
  16     controller: function($scope, crmApi4, searchDisplayUtils) {
  17       var ts = $scope.ts = CRM.ts('org.civicrm.search'),
  18         ctrl = this;
  19
  20       this.page = 1;
  21       this.rowCount = null;
  22       this.selectedRows = [];
  23       this.allRowsSelected = false;
  24
  25       this.$onInit = function() {
  26         this.sort = this.settings.sort ? _.cloneDeep(this.settings.sort) : [];
  27         $scope.displayUtils = searchDisplayUtils;
  28
  29         if (this.afFieldset) {
  30           $scope.$watch(this.afFieldset.getFieldData, refresh, true);
  31         }
  32         $scope.$watch('$ctrl.filters', refresh, true);
  33       };
  34
  35       this.getResults = _.debounce(function() {
  36         searchDisplayUtils.getResults(ctrl);
  37       }, 100);
  38
  39       function refresh() {
  40         ctrl.page = 1;
  41         ctrl.rowCount = null;
  42         ctrl.getResults();
  43       }
  44
  45       /**
  46        * Returns crm-i icon class for a sortable column
  47        * @param col
  48        * @returns {string}
  49        */
  50       $scope.getSort = function(col) {
  51         var dir = _.reduce(ctrl.sort, function(dir, item) {
  52           return item[0] === col.key ? item[1] : dir;
  53         }, null);
  54         if (dir) {
  55           return 'fa-sort-' + dir.toLowerCase();
  56         }
  57         return 'fa-sort disabled';
  58       };
  59
  60       /**
  61        * Called when clicking on a column header
  62        * @param col
  63        * @param $event
  64        */
  65       $scope.setSort = function(col, $event) {
  66         if (col.type !== 'field') {
  67           return;
  68         }
  69         var dir = $scope.getSort(col) === 'fa-sort-asc' ? 'DESC' : 'ASC';
  70         if (!$event.shiftKey || !ctrl.sort) {
  71           ctrl.sort = [];
  72         }
  73         var index = _.findIndex(ctrl.sort, [col.key]);
  74         if (index > -1) {
  75           ctrl.sort[index][1] = dir;
  76         } else {
  77           ctrl.sort.push([col.key, dir]);
  78         }
  79         ctrl.getResults();
  80       };
  81
  82       this.formatFieldValue = function(rowData, col) {
  83         return searchDisplayUtils.formatDisplayValue(rowData, col.key, ctrl.settings.columns);
  84       };
  85
  86       $scope.selectAllRows = function() {
  87         // Deselect all
  88         if (ctrl.allRowsSelected) {
  89           ctrl.allRowsSelected = false;
  90           ctrl.selectedRows.length = 0;
  91           return;
  92         }
  93         // Select all
  94         ctrl.allRowsSelected = true;
  95         if (ctrl.page === 1 && ctrl.results.length < ctrl.settings.limit) {
  96           ctrl.selectedRows = _.pluck(ctrl.results, 'id');
  97           return;
  98         }
  99         // If more than one page of results, use ajax to fetch all ids
 100         $scope.loadingAllRows = true;
 101         var params = searchDisplayUtils.getApiParams(ctrl, 'id');
 102         crmApi4('SearchDisplay', 'run', params, ['id']).then(function(ids) {
 103           $scope.loadingAllRows = false;
 104           ctrl.selectedRows = _.toArray(ids);
 105         });
 106       };
 107
 108       $scope.selectRow = function(row) {
 109         var index = ctrl.selectedRows.indexOf(row.id);
 110         if (index < 0) {
 111           ctrl.selectedRows.push(row.id);
 112           ctrl.allRowsSelected = (ctrl.rowCount === ctrl.selectedRows.length);
 113         } else {
 114           ctrl.allRowsSelected = false;
 115           ctrl.selectedRows.splice(index, 1);
 116         }
 117       };
 118
 119       $scope.isRowSelected = function(row) {
 120         return ctrl.allRowsSelected || _.includes(ctrl.selectedRows, row.id);
 121       };
 122
 123     }
 124   });
 125
 126 })(angular, CRM.$, CRM._);