From 50e099a050f462be983f2dab9ac18813ccaf0803 Mon Sep 17 00:00:00 2001
From: Coleman Watts <coleman@civicrm.org>
Date: Fri, 28 Apr 2023 15:20:41 -0400
Subject: [PATCH] Afform - Handle decimal number fields

---
 Civi/Api4/Service/Spec/SpecFormatter.php        |  6 ++++--
 .../afGuiEditor/elements/afGuiField-menu.html   | 17 +++++++++++++++++
 ext/afform/core/ang/af/fields/Number.html       |  6 +++---
 3 files changed, 24 insertions(+), 5 deletions(-)

diff --git a/Civi/Api4/Service/Spec/SpecFormatter.php b/Civi/Api4/Service/Spec/SpecFormatter.php
index 49455b459aee..a415fb403dd8 100644
--- a/Civi/Api4/Service/Spec/SpecFormatter.php
+++ b/Civi/Api4/Service/Spec/SpecFormatter.php
@@ -287,9 +287,11 @@ public static function setInputTypeAndAttrs(FieldSpec &$fieldSpec, $data, $dataT
     if ($inputType == 'Date' && !empty($inputAttrs['formatType'])) {
       self::setLegacyDateFormat($inputAttrs);
     }
-    // Number input for integer fields
-    if ($inputType === 'Text' && $dataTypeName === 'Int') {
+    // Number input for numeric fields
+    if ($inputType === 'Text' && in_array($dataTypeName, ['Int', 'Float'], TRUE)) {
       $inputType = 'Number';
+      // Todo: make 'step' configurable for the custom field
+      $inputAttrs['step'] = $dataTypeName === 'Int' ? 1 : .01;
     }
     // Date/time settings from custom fields
     if ($inputType == 'Date' && !empty($data['custom_group_id'])) {
diff --git a/ext/afform/admin/ang/afGuiEditor/elements/afGuiField-menu.html b/ext/afform/admin/ang/afGuiEditor/elements/afGuiField-menu.html
index 2ab4c16dfdcf..61a5a76c1476 100644
--- a/ext/afform/admin/ang/afGuiEditor/elements/afGuiField-menu.html
+++ b/ext/afform/admin/ang/afGuiEditor/elements/afGuiField-menu.html
@@ -6,6 +6,23 @@
     </select>
   </div>
 </li>
+<li ng-if="$ctrl.fieldDefn.input_type === 'Number' && $ctrl.fieldDefn.data_type === 'Float'">
+  <div href ng-click="$event.stopPropagation()" class="af-gui-field-select-in-dropdown">
+    <label>{{:: ts('Decimal places:') }}</label>
+    <select class="form-control" ng-model="getSet('input_attrs.step')" ng-model-options="{getterSetter: true}" title="{{:: ts('Decimal places') }}">
+      <option ng-value="1">0</option>
+      <option ng-value=".1">1</option>
+      <option ng-value=".01">2</option>
+      <option ng-value=".001">3</option>
+      <option ng-value=".0001">4</option>
+      <option ng-value=".00001">5</option>
+      <option ng-value=".000001">6</option>
+      <option ng-value=".0000001">7</option>
+      <option ng-value=".00000001">8</option>
+      <option ng-value=".000000001">9</option>
+    </select>
+  </div>
+</li>
 <li ng-if="$ctrl.fieldDefn.input_type === 'EntityRef'" title="{{:: ts('Use a saved search to filter the autocomplete results') }}">
   <div href ng-click="$event.stopPropagation()" class="af-gui-field-select-in-dropdown">
     <input placeholder="{{:: ts('Saved Search') }}" class="form-control" crm-autocomplete="'SavedSearch'" crm-autocomplete-params="{key: 'name', filters: {api_entity: $ctrl.fieldDefn.fk_entity}, formName: 'afformAdmin', fieldName: 'autocompleteSavedSearch'}" auto-open="true" ng-model="getSet('saved_search')" ng-model-options="{getterSetter: true}" ng-change="getSet('search_display')(null)">
diff --git a/ext/afform/core/ang/af/fields/Number.html b/ext/afform/core/ang/af/fields/Number.html
index 754b4abedea8..2ce142c9957d 100644
--- a/ext/afform/core/ang/af/fields/Number.html
+++ b/ext/afform/core/ang/af/fields/Number.html
@@ -1,6 +1,6 @@
-<input ng-if=":: !$ctrl.defn.search_range" class="form-control" ng-required="$ctrl.defn.required" type="number" id="{{:: fieldId }}" ng-model="getSetValue" ng-model-options="{getterSetter: true}" placeholder="{{:: $ctrl.defn.input_attrs.placeholder }}" >
+<input ng-if=":: !$ctrl.defn.search_range" class="form-control" ng-required="$ctrl.defn.required" type="number" step="{{:: $ctrl.defn.input_attrs.step || 1 }}" id="{{:: fieldId }}" ng-model="getSetValue" ng-model-options="{getterSetter: true}" placeholder="{{:: $ctrl.defn.input_attrs.placeholder }}" >
 <div ng-if=":: $ctrl.defn.search_range" class="form-inline">
-  <input class="form-control" type="number" id="{{:: fieldId }}" ng-model="dataProvider.getFieldData()[$ctrl.fieldName]['>=']" placeholder="{{:: $ctrl.defn.input_attrs.placeholder }}" >
+  <input class="form-control" type="number" step="{{:: $ctrl.defn.input_attrs.step || 1 }}" id="{{:: fieldId }}" ng-model="dataProvider.getFieldData()[$ctrl.fieldName]['>=']" placeholder="{{:: $ctrl.defn.input_attrs.placeholder }}" >
   <span class="af-field-range-sep">-</span>
-  <input class="form-control" type="number" id="{{:: fieldId }}2" ng-model="dataProvider.getFieldData()[$ctrl.fieldName]['<=']" placeholder="{{:: $ctrl.defn.input_attrs.placeholder2 }}" >
+  <input class="form-control" type="number" step="{{:: $ctrl.defn.input_attrs.step || 1 }}" id="{{:: fieldId }}2" ng-model="dataProvider.getFieldData()[$ctrl.fieldName]['<=']" placeholder="{{:: $ctrl.defn.input_attrs.placeholder2 }}" >
 </div>