CRM-19723 - CaseType Config UI improvements: icons, popups, labels

When adding a new role or activity type, use a popup to allow more robust configuration. Show activty type icons. Show activity type labels instead of machine names.
civicrm · Jan 23, 2017 · 37cc3ce · 37cc3ce
1 parent 766b126
commit 37cc3ce
Show file tree

Hide file tree

Showing 10 changed files with 145 additions and 62 deletions.
diff --git a/CRM/Admin/Form.php b/CRM/Admin/Form.php
@@ -90,6 +90,7 @@ public function preProcess() {
    * @return array
    */
   public function setDefaultValues() {
+    // Fetch defaults from the db
     if (isset($this->_id) && empty($this->_values)) {
       $this->_values = array();
       $params = array('id' => $this->_id);
@@ -98,6 +99,15 @@ public function setDefaultValues() {
     }
     $defaults = $this->_values;
 
+    // Allow defaults to be set from the url
+    if (empty($this->_id) && $this->_action & CRM_Core_Action::ADD) {
+      foreach ($_GET as $key => $val) {
+        if ($this->elementExists($key)) {
+          $defaults[$key] = $val;
+        }
+      }
+    }
+
     if ($this->_action == CRM_Core_Action::DELETE &&
       isset($defaults['name'])
     ) {

diff --git a/CRM/Admin/Form/RelationshipType.php b/CRM/Admin/Form/RelationshipType.php
@@ -137,7 +137,6 @@ public function postProcess() {
       CRM_Core_Session::setStatus(ts('Selected Relationship type has been deleted.'), ts('Record Deleted'), 'success');
     }
     else {
-      $params = array();
       $ids = array();
 
       // store the submitted values in an array
@@ -163,7 +162,9 @@ public function postProcess() {
       $params['contact_sub_type_a'] = $cTypeA[1] ? $cTypeA[1] : 'NULL';
       $params['contact_sub_type_b'] = $cTypeB[1] ? $cTypeB[1] : 'NULL';
 
-      CRM_Contact_BAO_RelationshipType::add($params, $ids);
+      $result = CRM_Contact_BAO_RelationshipType::add($params, $ids);
+
+      $this->ajaxResponse['relationshipType'] = $result->toArray();
 
       CRM_Core_Session::setStatus(ts('The Relationship Type has been saved.'), ts('Saved'), 'success');
     }

diff --git a/ang/crmCaseType.css b/ang/crmCaseType.css
@@ -2,7 +2,7 @@
     vertical-align: middle;
     cursor: move;
 }
-.crmCaseType .crm-i {
+.crmCaseType .fa-trash {
     margin: 0.4em 0.2em 0 0;
     cursor: pointer;
 }

diff --git a/ang/crmCaseType.js b/ang/crmCaseType.js
@@ -61,12 +61,14 @@
             }];
             reqs.actTypes = ['OptionValue', 'get', {
               option_group_id: 'activity_type',
+              sequential: 1,
               options: {
                 sort: 'name',
                 limit: 0
               }
             }];
             reqs.relTypes = ['RelationshipType', 'get', {
+              sequential: 1,
               options: {
                 sort: CRM.crmCaseType.REL_TYPE_CNAME,
                 limit: 0
@@ -91,14 +93,6 @@
       restrict: 'AE',
       template: '<input class="add-activity crm-action-menu fa-plus" type="hidden" />',
       link: function(scope, element, attrs) {
-        /// Format list of options for select2's "data"
-        var getFormattedOptions = function() {
-          return {
-            results: _.map(scope[attrs.crmOptions], function(option){
-              return {id: option, text: option};
-            })
-          };
-        };
 
         var input = $('input', element);
 
@@ -108,11 +102,12 @@
           scope[attrs.crmVar] = '';
         };
 
-        $(input).select2({
-          data: getFormattedOptions,
+        $(input).crmSelect2({
+          data: scope[attrs.crmOptions],
           createSearchChoice: function(term) {
-            return {id: term, text: term};
+            return {id: term, text: term + ' (' + ts('new') + ')'};
           },
+          createSearchChoicePosition: 'bottom',
           placeholder: attrs.placeholder
         });
         $(input).on('select2-selecting', function(e) {
@@ -123,22 +118,26 @@
         });
 
         scope.$watch(attrs.crmOptions, function(value) {
-          $(input).select2('data', getFormattedOptions);
+          $(input).select2('data', scope[attrs.crmOptions]);
           $(input).select2('val', '');
         });
       }
     };
   });
 
   crmCaseType.controller('CaseTypeCtrl', function($scope, crmApi, apiCalls) {
-    var ts = $scope.ts = CRM.ts(null);
+    // CRM_Case_XMLProcessor::REL_TYPE_CNAME
+    var REL_TYPE_CNAME = CRM.crmCaseType.REL_TYPE_CNAME,
+
+    ts = $scope.ts = CRM.ts(null);
 
     $scope.activityStatuses = apiCalls.actStatuses.values;
     $scope.caseStatuses = _.indexBy(apiCalls.caseStatuses.values, 'name');
-    $scope.activityTypes = apiCalls.actTypes.values;
-    $scope.activityTypeNames = _.pluck(apiCalls.actTypes.values, 'name');
-    $scope.activityTypes = apiCalls.actTypes.values;
-    $scope.relationshipTypeNames = _.pluck(apiCalls.relTypes.values, CRM.crmCaseType.REL_TYPE_CNAME); // CRM_Case_XMLProcessor::REL_TYPE_CNAME
+    $scope.activityTypes = _.indexBy(apiCalls.actTypes.values, 'name');
+    $scope.activityTypeOptions = _.map(apiCalls.actTypes.values, formatActivityTypeOption);
+    $scope.relationshipTypeOptions = _.map(apiCalls.relTypes.values, function(type) {
+      return {id: type[REL_TYPE_CNAME], text: type.label_b_a};
+    });
     $scope.locks = {caseTypeName: true, activitySetName: true};
 
     $scope.workflows = {
@@ -175,44 +174,70 @@
       });
     };
 
-    /// Add a new activity entry to an activity-set
-    $scope.addActivity = function(activitySet, activityType) {
+    function formatActivityTypeOption(type) {
+      return {id: type.name, text: type.label, icon: type.icon};
+    }
+
+    function addActivityToSet(activitySet, activityTypeName) {
       activitySet.activityTypes.push({
-        name: activityType,
+        name: activityTypeName,
         status: 'Scheduled',
         reference_activity: 'Open Case',
         reference_offset: '1',
         reference_select: 'newest'
       });
-      if (!_.contains($scope.activityTypeNames, activityType)) {
-        $scope.activityTypeNames.push(activityType);
+    }
+
+    function createActivity(name, callback) {
+      CRM.loadForm(CRM.url('civicrm/admin/options/activity_type', {action: 'add', reset: 1, label: name, component_id: 7}))
+        .on('crmFormSuccess', function(e, data) {
+          $scope.activityTypes[data.optionValue.name] = data.optionValue;
+          $scope.activityTypeOptions.push(formatActivityTypeOption(data.optionValue));
+          callback(data.optionValue);
+          $scope.$digest();
+        });
+    }
+
+    // Add a new activity entry to an activity-set
+    $scope.addActivity = function(activitySet, activityType) {
+      if ($scope.activityTypes[activityType]) {
+        addActivityToSet(activitySet, activityType);
+      } else {
+        createActivity(activityType, function(newActivity) {
+          addActivityToSet(activitySet, newActivity.name);
+        });
       }
     };
 
     /// Add a new top-level activity-type entry
     $scope.addActivityType = function(activityType) {
       var names = _.pluck($scope.caseType.definition.activityTypes, 'name');
       if (!_.contains(names, activityType)) {
-        $scope.caseType.definition.activityTypes.push({
-          name: activityType
-        });
-
-      }
-      if (!_.contains($scope.activityTypeNames, activityType)) {
-        $scope.activityTypeNames.push(activityType);
+        // Add an activity type that exists
+        if ($scope.activityTypes[activityType]) {
+          $scope.caseType.definition.activityTypes.push({name: activityType});
+        } else {
+          createActivity(activityType, function(newActivity) {
+            $scope.caseType.definition.activityTypes.push({name: newActivity.name});
+          });
+        }
       }
     };
 
     /// Add a new role
     $scope.addRole = function(roles, roleName) {
       var names = _.pluck($scope.caseType.definition.caseRoles, 'name');
       if (!_.contains(names, roleName)) {
-        roles.push({
-          name: roleName
-        });
-      }
-      if (!_.contains($scope.relationshipTypeNames, roleName)) {
-        $scope.relationshipTypeNames.push(roleName);
+        if (_.where($scope.relationshipTypeOptions, {id: roleName}).length) {
+          roles.push({name: roleName});
+        } else {
+          CRM.loadForm(CRM.url('civicrm/admin/reltype', {action: 'add', reset: 1, label_a_b: roleName, label_b_a: roleName}))
+            .on('crmFormSuccess', function(e, data) {
+              roles.push({name: data.relationshipType[REL_TYPE_CNAME]});
+              $scope.relationshipTypeOptions.push({id: data.relationshipType[REL_TYPE_CNAME], text: data.relationshipType.label_b_a});
+              $scope.$digest();
+            });
+        }
       }
     };
 

diff --git a/ang/crmCaseType/activityTypesTable.html b/ang/crmCaseType/activityTypesTable.html
@@ -5,6 +5,7 @@
 <table class="row-highlight">
   <thead>
   <tr>
+    <th></th>
     <th>{{ts('Activity Type')}}</th>
     <th>{{ts('Max Instances')}}</th>
     <th></th>
@@ -15,10 +16,13 @@
   <tr ng-repeat="activityType in caseType.definition.activityTypes">
     <td>
       <i class="crm-i fa-arrows grip-n-drag"></i>
+    </td>
+    <td>
+      <i class="crm-i {{ activityTypes[activityType.name].icon }}"></i>
       {{ activityType.name }}
     </td>
     <td>
-      <input class="number" type="text" ng-pattern="/^[0-9]*$/" ng-model="activityType.max_instances" />
+      <input class="crm-form-text number" type="text" ng-pattern="/^[1-9][0-9]*$/" ng-model="activityType.max_instances" />
     </td>
     <td>
       <a crm-icon="fa-trash" class="crm-hover-button" ng-click="removeItem(caseType.definition.activityTypes, activityType)" title="{{ts('Remove')}}"></a>
@@ -28,9 +32,10 @@
 
   <tfoot>
   <tr class="addRow">
+    <td></td>
     <td colspan="3">
       <span crm-add-name
-           crm-options="activityTypeNames"
+           crm-options="activityTypeOptions"
            crm-var="newActivity"
            crm-on-add="addActivityType(newActivity)"
            placeholder="{{ts('Add activity type')}}"

diff --git a/ang/crmCaseType/rolesTable.html b/ang/crmCaseType/rolesTable.html
@@ -26,7 +26,7 @@
 	  <tr class="addRow">
 	    <td colspan="4">
 	      <span crm-add-name
-	           crm-options="relationshipTypeNames"
+	           crm-options="relationshipTypeOptions"
 	           crm-var="newRole"
 	           crm-on-add="addRole(caseType.definition.caseRoles, newRole)"
              placeholder="{{ts('Add role')}}"

diff --git a/ang/crmCaseType/sequenceTable.html b/ang/crmCaseType/sequenceTable.html
@@ -5,6 +5,7 @@
 <table>
   <thead>
   <tr>
+    <th></th>
     <th>{{ts('Activity')}}</th>
     <th></th>
   </tr>
@@ -14,6 +15,9 @@
   <tr ng-repeat="activity in activitySet.activityTypes">
     <td>
       <i class="crm-i fa-arrows grip-n-drag"></i>
+    </td>
+    <td>
+      <i class="crm-i {{ activityTypes[activity.name].icon }}"></i>
       {{ activity.name }}
     </td>
     <td>
@@ -26,7 +30,7 @@
   <tr class="addRow">
     <td colspan="3">
       <span crm-add-name
-           crm-options="activityTypeNames"
+           crm-options="activityTypeOptions"
            crm-var="newActivity"
            crm-on-add="addActivity(activitySet, newActivity)"
            placeholder="{{ts('Add activity')}}"

diff --git a/ang/crmCaseType/timelineTable.html b/ang/crmCaseType/timelineTable.html
@@ -5,6 +5,7 @@
 <table>
   <thead>
   <tr>
+    <th></th>
     <th>{{ts('Activity')}}</th>
     <th>{{ts('Status')}}</th>
     <th>{{ts('Reference')}}</th>
@@ -18,6 +19,9 @@
   <tr ng-repeat="activity in activitySet.activityTypes">
     <td>
       <i class="crm-i fa-arrows grip-n-drag"></i>
+    </td>
+    <td>
+      <i class="crm-i {{ activityTypes[activity.name].icon }}"></i>
       {{ activity.name }}
     </td>
     <td>
@@ -43,7 +47,7 @@
     </td>
     <td>
       <input
-        class="number"
+        class="number crm-form-text"
         type="text"
         ng-pattern="/^-?[0-9]*$/"
         ng-model="activity.reference_offset"
@@ -77,7 +81,7 @@
   <tr class="addRow">
     <td colspan="6">
       <span crm-add-name
-           crm-options="activityTypeNames"
+           crm-options="activityTypeOptions"
            crm-var="newActivity"
            crm-on-add="addActivity(activitySet, newActivity)"
            placeholder="{{ts('Add activity')}}"

diff --git a/templates/CRM/Admin/Form/Options.tpl b/templates/CRM/Admin/Form/Options.tpl
@@ -73,7 +73,9 @@
         <tr class="crm-admin-options-form-block-value">
           <td class="label">{$form.value.label}</td>
           <td>{$form.value.html}<br />
+            {if $action == 2}
               <span class="description"><i class="crm-i fa-exclamation-triangle"></i> {ts}Changing the Value field will unlink records which have been marked with this option. This change can not be undone except by restoring the previous value.{/ts}</span>
+            {/if}
           </td>
         </tr>
       {/if}