From: Coleman Watts Date: Mon, 28 Oct 2019 01:52:14 +0000 (-0400) Subject: Config forms - values section X-Git-Url: https://vcs.fsf.org/?a=commitdiff_plain;h=a064e90d194dd3babf634b3e5a47fc5fad5d3b0a;p=civicrm-core.git Config forms - values section --- diff --git a/ext/afform/gui/afform_gui.php b/ext/afform/gui/afform_gui.php index 72caa9cf64..f72cb7f014 100644 --- a/ext/afform/gui/afform_gui.php +++ b/ext/afform/gui/afform_gui.php @@ -182,16 +182,21 @@ function afform_gui_civicrm_buildAsset($asset, $params, &$mimeType, &$content) { $entityApi->addWhere('name', 'NOT LIKE', $nono); } - $contacts = Civi\Api4\Contact::getFields() + $contactFields = Civi\Api4\Contact::getFields() ->setCheckPermissions(FALSE) ->setIncludeCustom(TRUE) ->setLoadOptions(TRUE) ->setAction('Create') ->execute(); + $contactSettings = [ + 'data' => [], + ]; + $mimeType = 'text/javascript'; $content = "CRM.afformAdminData={"; $content .= 'entities:' . json_encode((array) $entityApi->execute(), JSON_UNESCAPED_SLASHES) . ','; - $content .= 'fields:' . json_encode(['Contact' => (array) $contacts], JSON_UNESCAPED_SLASHES); + $content .= 'fields:' . json_encode(['Contact' => (array) $contactFields], JSON_UNESCAPED_SLASHES) . ','; + $content .= 'settings:' . json_encode(['Contact' => $contactSettings], JSON_UNESCAPED_SLASHES); $content .= '}'; } diff --git a/ext/afform/gui/ang/afGuiEditor.css b/ext/afform/gui/ang/afGuiEditor.css index 6231149144..93afb919b5 100644 --- a/ext/afform/gui/ang/afGuiEditor.css +++ b/ext/afform/gui/ang/afGuiEditor.css @@ -1,30 +1,54 @@ -#afGuiEditor-main { +#afGuiEditor { display: flex; } -#afGuiEditor-main .panel.panel-default { - margin-bottom: 0; +#afGuiEditor .panel.panel-default { + /*margin-bottom: 0;*/ } -#afGuiEditor-main #afGuiEditor-palette { +#afGuiEditor #afGuiEditor-palette { flex: 1; margin-right: 5px; } -#afGuiEditor-main #afGuiEditor-canvas { +#afGuiEditor #afGuiEditor-canvas { flex: 1; margin-left: 5px; } -#afGuiEditor-main #afGuiEditor-palette-tabs li > a { +#afGuiEditor #afGuiEditor-palette-tabs li { + top: 1px; +} + +#afGuiEditor #afGuiEditor-palette-tabs li > a { padding: 10px 15px; font-size: 12px; } -#afGuiEditor-main #afGuiEditor-palette-tabs .dropdown-menu { +#afGuiEditor #afGuiEditor-palette-tabs .dropdown-menu { max-height: 500px; overflow-y: auto; } -#afGuiEditor-main #afGuiEditor-palette-config { +#afGuiEditor .crm-editable-enabled, +#afGuiEditor-palette-tabs > li > a > span { + display: inline-block; + padding: 0 4px !important; + border: 2px solid transparent !important; +} +#afGuiEditor .crm-editable-enabled:hover:not(:focus) { + border: 2px dashed grey !important; +} +#afGuiEditor .crm-editable-enabled:before, +#afGuiEditor .crm-editable-enabled:after { + content: ''; + display: none; +} + +#afGuiEditor-palette-config .form-inline { + margin-bottom: 10px; +} + +#afGuiEditor-palette-config .form-inline label { + min-width: 110px; } diff --git a/ext/afform/gui/ang/afGuiEditor.js b/ext/afform/gui/ang/afGuiEditor.js index 6c58bd8214..6741032c0b 100644 --- a/ext/afform/gui/ang/afGuiEditor.js +++ b/ext/afform/gui/ang/afGuiEditor.js @@ -14,6 +14,7 @@ $scope.afform = null; $scope.selectedEntity = null; $scope.meta = CRM.afformAdminData; + $scope.controls = {}; var newForm = { title: ts('Untitled Form'), layout: { @@ -75,6 +76,28 @@ $scope.selectedEntity = entityName; }; + $scope.getField = function(entityName, fieldName) { + return _.filter($scope.meta.fields[entityName], {name: fieldName})[0]; + }; + + $scope.valuesFields = function() { + var fields = _.transform($scope.meta.fields[$scope.entities[$scope.selectedEntity].type], function(fields, field) { + fields.push({id: field.name, text: field.title, disabled: field.name in $scope.entities[$scope.selectedEntity].data}); + }, []); + return {results: fields}; + }; + + $scope.removeValue = function(entity, fieldName) { + delete entity.data[fieldName]; + }; + + $scope.$watch('controls.addValue', function(fieldName) { + if (fieldName) { + $scope.entities[$scope.selectedEntity].data[fieldName] = ''; + $scope.controls.addValue = ''; + } + }); + } }; }); @@ -96,6 +119,7 @@ } // Editable titles using ngModel & html5 contenteditable + // Cribbed from ContactLayoutEditor angular.module('afGuiEditor').directive("afGuiEditable", function() { return { restrict: "A", @@ -139,4 +163,94 @@ }; }); + // Cribbed from the Api4 Explorer + angular.module('afGuiEditor').directive('afGuiFieldValue', function() { + return { + scope: { + field: '=afGuiFieldValue' + }, + require: 'ngModel', + link: function (scope, element, attrs, ctrl) { + var ts = scope.ts = CRM.ts(), + multi; + + function destroyWidget() { + var $el = $(element); + if ($el.is('.crm-form-date-wrapper .crm-hidden-date')) { + $el.crmDatepicker('destroy'); + } + if ($el.is('.select2-container + input')) { + $el.crmEntityRef('destroy'); + } + $(element).removeData().removeAttr('type').removeAttr('placeholder').show(); + } + + function makeWidget(field) { + var $el = $(element), + inputType = field.input_type, + dataType = field.data_type; + multi = field.serialize || dataType === 'Array'; + if (inputType === 'Date') { + $el.crmDatepicker({time: (field.input_attrs && field.input_attrs.time) || false}); + } + else if (field.fk_entity || field.options || dataType === 'Boolean') { + if (field.fk_entity) { + $el.crmEntityRef({entity: field.fk_entity, select:{multiple: multi}}); + } else if (field.options) { + var options = _.transform(field.options, function(options, val, key) { + options.push({id: key, text: val}); + }, []); + $el.select2({data: options, multiple: multi}); + } else if (dataType === 'Boolean') { + $el.attr('placeholder', ts('- select -')).crmSelect2({allowClear: false, multiple: multi, placeholder: ts('- select -'), data: [ + {id: '1', text: ts('Yes')}, + {id: '0', text: ts('No')} + ]}); + } + } else if (dataType === 'Integer' && !multi) { + $el.attr('type', 'number'); + } + } + + // Copied from ng-list but applied conditionally if field is multi-valued + var parseList = function(viewValue) { + // If the viewValue is invalid (say required but empty) it will be `undefined` + if (_.isUndefined(viewValue)) return; + + if (!multi) { + return viewValue; + } + + var list = []; + + if (viewValue) { + _.each(viewValue.split(','), function(value) { + if (value) list.push(_.trim(value)); + }); + } + + return list; + }; + + // Copied from ng-list + ctrl.$parsers.push(parseList); + ctrl.$formatters.push(function(value) { + return _.isArray(value) ? value.join(', ') : value; + }); + + // Copied from ng-list + ctrl.$isEmpty = function(value) { + return !value || !value.length; + }; + + scope.$watchCollection('field', function(field) { + destroyWidget(); + if (field) { + makeWidget(field); + } + }); + } + }; + }); + })(angular, CRM.$, CRM._); diff --git a/ext/afform/gui/ang/afGuiEditor/config-entity.html b/ext/afform/gui/ang/afGuiEditor/config-entity.html index bc9dd7f351..76c71e8a17 100644 --- a/ext/afform/gui/ang/afGuiEditor/config-entity.html +++ b/ext/afform/gui/ang/afGuiEditor/config-entity.html @@ -1,5 +1,19 @@
- + + +
+ {{ ts('Values') }} +
+ + + + + +
+
+ +
+
diff --git a/ext/afform/gui/ang/afGuiEditor/config-form.html b/ext/afform/gui/ang/afGuiEditor/config-form.html index b80e6e0678..2af098cdb7 100644 --- a/ext/afform/gui/ang/afGuiEditor/config-form.html +++ b/ext/afform/gui/ang/afGuiEditor/config-form.html @@ -1,3 +1,8 @@ -
- -
+ + + + diff --git a/ext/afform/gui/ang/afGuiEditor/main.html b/ext/afform/gui/ang/afGuiEditor/main.html index bf70aa7145..499b9465f4 100644 --- a/ext/afform/gui/ang/afGuiEditor/main.html +++ b/ext/afform/gui/ang/afGuiEditor/main.html @@ -1,7 +1,8 @@
+
-
+
diff --git a/ext/afform/gui/ang/afGuiEditor/palette.html b/ext/afform/gui/ang/afGuiEditor/palette.html index fd7418b359..78ca043334 100644 --- a/ext/afform/gui/ang/afGuiEditor/palette.html +++ b/ext/afform/gui/ang/afGuiEditor/palette.html @@ -1,7 +1,9 @@