From bfc19cab7e2fd100559209a45b78400130420e4f Mon Sep 17 00:00:00 2001 From: Ioannis Igoumenos Date: Thu, 30 Jan 2025 21:08:18 +0200 Subject: [PATCH] Fix person roles people picker --- app/src/View/Helper/FieldHelper.php | 11 ++++-- app/templates/PersonRoles/fields.inc | 31 ++++++----------- .../element/form/infoDiv/autocomplete.php | 34 +++++++------------ app/templates/element/peopleAutocomplete.php | 2 +- .../autocomplete/cm-autocomplete-people.js | 4 +-- 5 files changed, 34 insertions(+), 48 deletions(-) diff --git a/app/src/View/Helper/FieldHelper.php b/app/src/View/Helper/FieldHelper.php index 09db6fa1c..a4793c573 100644 --- a/app/src/View/Helper/FieldHelper.php +++ b/app/src/View/Helper/FieldHelper.php @@ -227,11 +227,12 @@ public function calculateLiClasses(): string * * @param string $element HTML element created with the CAKEPHP HTML Helper * @param string $vueElementName The name of the JavaScript module + * @param array $formParams List of element parameters * * @return string * @since COmanage Registry v5.0.0 */ - public function constructSPAField(string $element, string $vueElementName): string { + public function constructSPAField(string $element, string $vueElementName, array $formParams = []): string { // Parse the ID attribute $regexId = '/id="(.*?)"/m'; preg_match_all($regexId, $element, $matchesId, PREG_SET_ORDER, 0); @@ -244,14 +245,18 @@ public function constructSPAField(string $element, string $vueElementName): stri $regexClass = '/class="(.*?)"/m'; preg_match_all($regexClass, $element, $matchesClass, PREG_SET_ORDER, 0); if(!empty($matchesId[0][1]) && !empty($matchesName[0][1])) { - return $this->getView()->element($vueElementName, [ + $arguments = [ 'htmlId' => $matchesId[0][1], 'fieldName' => $matchesName[0][1], 'containerClasses' => $matchesClass[0][1], 'type' => 'field', // we want the label to be an empty string to hide the default label introduced by the module. 'label' => '' - ]); + ]; + if (!empty($formParams)) { + $arguments['formParams'] = $formParams; + } + return $this->getView()->element($vueElementName, $arguments); } // Fallback to an error element diff --git a/app/templates/PersonRoles/fields.inc b/app/templates/PersonRoles/fields.inc index 69dc1b75d..e8eb51f1e 100644 --- a/app/templates/PersonRoles/fields.inc +++ b/app/templates/PersonRoles/fields.inc @@ -59,29 +59,11 @@ if($vv_action == 'add' || $vv_action == 'edit' || $vv_action == 'view') { // For now, we render sponsor and manager as read only. // XXX Need People Picker (CFM-150) foreach(['sponsor', 'manager'] as $f) { - $fp = $f."_person"; - - $fname = ""; - $flink = []; - - if(!empty($vv_obj->$fp->names[0])) { - $fname = $vv_obj->$fp->names[0]->full_name; - $fid = $vv_obj->$fp->id; - $flink = ['url' => ['controller' => 'people', 'action' => 'edit', $vv_obj->$fp->id]]; - $formParams = [ - 'value' => $fid, - 'fullName' => $fname, - 'link' => $flink, - ]; - $this->set('formParams', $formParams); - } - + $fp = $f . '_person'; + $vv_autocomplete_arguments = [ 'fieldName' => $f.'_person_id', - 'status' => $fname, - 'link' => $flink, 'fieldLabel' => __d('field', $f), - 'fieldOptions' => [], 'autocomplete' => [ 'configuration' => [ 'action' => 'GET', @@ -90,6 +72,15 @@ if($vv_action == 'add' || $vv_action == 'edit' || $vv_action == 'view') { ] ]; + if(!empty($vv_obj->$fp->names[0])) { + $flink = ['url' => ['controller' => 'people', 'action' => 'edit', $vv_obj->$fp->id]]; + $vv_autocomplete_arguments['formParams'] = [ + 'value' => $vv_obj->$fp->id, + 'fullName' => $vv_obj->$fp->names[0]->full_name, + 'link' => $flink, + ]; + } + print $this->element('form/listItem', ['arguments' => $vv_autocomplete_arguments]); } diff --git a/app/templates/element/form/infoDiv/autocomplete.php b/app/templates/element/form/infoDiv/autocomplete.php index 4a816b20b..31b74143a 100644 --- a/app/templates/element/form/infoDiv/autocomplete.php +++ b/app/templates/element/form/infoDiv/autocomplete.php @@ -27,29 +27,19 @@ declare(strict_types = 1); -// Create a field name for the autocomplete input -$autoCompleteFieldName = 'cm_autocomplete_' . $fieldName; +unset($vv_field_arguments['autocomplete']); +if (isset($vv_field_arguments['formParams'])) { + $formParams = $vv_field_arguments['formParams']; + unset($vv_field_arguments['formParams']); +} -// Because we use JavaScript to set the value of the hidden field, -// disable form-tamper checking for the autocomplete fields. -// XXX We ought not have to do this for the hidden field ($fieldName) at least -$this->Form->unlockField($fieldName); -$this->Form->unlockField($autoCompleteFieldName); - -$autocompleteArgs = [ - 'type' => 'field', - 'fieldName' => $fieldName, - 'personType' => 'person', - 'htmlId' => $autoCompleteFieldName, - 'viewConfigParameters' => $vv_field_arguments['autocomplete']['configuration'] -]; - -?> - - -Form->hidden($fieldName, $vv_field_arguments['fieldOptions']) . $this->element('peopleAutocomplete', $autocompleteArgs); +print $this->Field->constructSPAField( + // The Default field will be used to harvest the attributes + element: $this->Field->formField(...$vv_field_arguments), + // Vue/JS element + vueElementName: 'peopleAutocomplete', + formParams: $formParams ?? [] +); ?>
info diff --git a/app/templates/element/peopleAutocomplete.php b/app/templates/element/peopleAutocomplete.php index e52035a98..af361178d 100644 --- a/app/templates/element/peopleAutocomplete.php +++ b/app/templates/element/peopleAutocomplete.php @@ -84,7 +84,7 @@ actionUrl: '', inputValue: '', inputProps: { - name: '', + name: '', // This is not translated to data-personid but to datapersonid. dataPersonid: '' }, diff --git a/app/webroot/js/comanage/components/autocomplete/cm-autocomplete-people.js b/app/webroot/js/comanage/components/autocomplete/cm-autocomplete-people.js index c52fcb508..c91d2023f 100644 --- a/app/webroot/js/comanage/components/autocomplete/cm-autocomplete-people.js +++ b/app/webroot/js/comanage/components/autocomplete/cm-autocomplete-people.js @@ -247,8 +247,8 @@ export default { mounted() { if(this.options.inputValue != undefined && this.options.inputValue != '' - && this.options.htmlId.endsWith('person_id')) { - this.options.inputProps.value = `${this.options.formParams?.fullName} (ID: ${this.options.inputValue})` + && this.options.inputProps.name.endsWith('person_id')) { + this.person = `${this.options.formParams?.fullName} (ID: ${this.options.inputValue})` } }, computed: {