From 719c1786f13f72f0712d43f75c8307b226cea938 Mon Sep 17 00:00:00 2001 From: Pete Matsyburka Date: Sat, 23 Aug 2025 20:11:10 +0300 Subject: [PATCH] set default value --- app/controllers/api/templates_controller.rb | 1 + app/controllers/templates_controller.rb | 1 + app/javascript/submission_form/area.vue | 12 +- app/javascript/template_builder/area.vue | 136 +++++++++++++++----- app/javascript/template_builder/page.vue | 2 +- lib/submitters/submit_values.rb | 2 +- 6 files changed, 117 insertions(+), 37 deletions(-) diff --git a/app/controllers/api/templates_controller.rb b/app/controllers/api/templates_controller.rb index cc4f16c9..a098573d 100644 --- a/app/controllers/api/templates_controller.rb +++ b/app/controllers/api/templates_controller.rb @@ -111,6 +111,7 @@ module Api :required, :readonly, :default_value, :title, :description, :prefillable, { preferences: {}, + default_value: [], conditions: [%i[field_uuid value action operation]], options: [%i[value uuid]], validation: %i[message pattern min max step], diff --git a/app/controllers/templates_controller.rb b/app/controllers/templates_controller.rb index 62573e5d..6b8f3b7a 100644 --- a/app/controllers/templates_controller.rb +++ b/app/controllers/templates_controller.rb @@ -122,6 +122,7 @@ class TemplatesController < ApplicationController :required, :readonly, :default_value, :title, :description, :prefillable, { preferences: {}, + default_value: [], conditions: [%i[field_uuid value action operation]], options: [%i[value uuid]], validation: %i[message pattern min max step], diff --git a/app/javascript/submission_form/area.vue b/app/javascript/submission_form/area.vue index e5560800..b3fb3e28 100644 --- a/app/javascript/submission_form/area.vue +++ b/app/javascript/submission_form/area.vue @@ -422,10 +422,14 @@ export default { }, formattedDate () { if (this.field.type === 'date' && this.modelValue) { - return this.formatDate( - this.modelValue === '{{date}}' ? new Date() : new Date(this.modelValue), - this.field.preferences?.format || (this.locale.endsWith('-US') ? 'MM/DD/YYYY' : 'DD/MM/YYYY') - ) + try { + return this.formatDate( + this.modelValue === '{{date}}' ? new Date() : new Date(this.modelValue), + this.field.preferences?.format || (this.locale.endsWith('-US') ? 'MM/DD/YYYY' : 'DD/MM/YYYY') + ) + } catch { + return this.modelValue + } } else { return '' } diff --git a/app/javascript/template_builder/area.vue b/app/javascript/template_builder/area.vue index ad8ab7d5..8d003e95 100644 --- a/app/javascript/template_builder/area.vue +++ b/app/javascript/template_builder/area.vue @@ -72,11 +72,11 @@ @blur="onNameBlur" >{{ optionIndexText }} {{ (defaultField ? (defaultField.title || field.title || field.name) : field.name) || defaultName }}
{ + acc[option.uuid] = option + + return acc + }, {}) + }, fontSizePx () { return parseInt(this.field?.preferences?.font_size || 11) * this.fontScale }, @@ -427,14 +471,17 @@ export default { return 1040 / 612.0 }, isDefaultValuePresent () { - if (this.field?.type === 'radio' && this.field?.areas?.length > 1) { - return false - } else { - return this.field?.default_value || this.field?.default_value === 0 - } + return this.field?.default_value || this.field?.default_value === 0 + }, + isSelectInput () { + return this.inputMode && (this.field.type === 'select' || (this.field.type === 'radio' && this.field.areas?.length < 2)) + }, + isCheckboxInput () { + return this.inputMode && (this.field.type === 'checkbox' || (['radio', 'multiple'].includes(this.field.type) && this.area.option_uuid)) }, isValueInput () { - return (this.field.type === 'heading' && this.isHeadingSelected) || this.isContenteditable || (this.inputMode && ['text', 'number', 'date'].includes(this.field.type)) + return (this.field.type === 'heading' && this.isHeadingSelected) || this.isContenteditable || + (this.inputMode && (['text', 'number'].includes(this.field.type) || (this.field.type === 'date' && this.field.default_value !== '{{date}}'))) }, modalContainerEl () { return this.$el.getRootNode().querySelector('#docuseal_modal_container') @@ -558,22 +605,45 @@ export default { this.isContenteditable = true this.focusValueInput() - } else if (this.field.type === 'checkbox') { - this.field.readonly = !this.field.readonly - this.field.default_value === true ? delete this.field.default_value : this.field.default_value = true - - this.save() } else if (this.field.type === 'date') { this.field.readonly = !this.field.readonly this.field.default_value === '{{date}}' ? delete this.field.default_value : this.field.default_value = '{{date}}' this.save() + } else { + this.maybeToggleCheckboxValue() } }, maybeToggleCheckboxValue () { - if (this.inputMode && this.field.type === 'checkbox') { - this.field.readonly = !this.field.readonly + if (this.field.type === 'checkbox') { this.field.default_value === true ? delete this.field.default_value : this.field.default_value = true + this.field.readonly = this.field.default_value === true + + this.save() + } else if (this.field.type === 'radio' && this.area.option_uuid) { + const option = this.optionsUuidIndex[this.area.option_uuid] + + const value = option.value || `${this.t('option')} ${this.field.options.indexOf(option) + 1}` + + this.field.default_value === value ? delete this.field.default_value : this.field.default_value = value + + this.field.readonly = !!this.field.default_value?.length + + this.save() + } else if (this.field.type === 'multiple' && this.area.option_uuid) { + const option = this.optionsUuidIndex[this.area.option_uuid] + + const value = option.value || `${this.t('option')} ${this.field.options.indexOf(option) + 1}` + + if (this.field.default_value?.includes(value)) { + this.field.default_value.splice(this.field.default_value.indexOf(value), 1) + + if (!this.field.default_value?.length) delete this.field.default_value + } else { + Array.isArray(this.field.default_value) ? this.field.default_value.push(value) : this.field.default_value = [value] + } + + this.field.readonly = !!this.field.default_value?.length this.save() } @@ -749,7 +819,7 @@ export default { } }, drag (e) { - if (e.target.id === 'mask') { + if (e.target.id === 'mask' && this.editable) { this.isDragged = true this.area.x = (e.offsetX - this.dragFrom.x) / e.target.clientWidth @@ -765,7 +835,9 @@ export default { e.preventDefault() - this.isDragged = true + if (this.editable) { + this.isDragged = true + } const rect = e.target.getBoundingClientRect() @@ -818,7 +890,9 @@ export default { e.preventDefault() - this.isDragged = true + if (this.editable) { + this.isDragged = true + } const rect = e.target.getBoundingClientRect() diff --git a/app/javascript/template_builder/page.vue b/app/javascript/template_builder/page.vue index 576b5c51..7a7de96c 100644 --- a/app/javascript/template_builder/page.vue +++ b/app/javascript/template_builder/page.vue @@ -1,7 +1,7 @@