@ -3,14 +3,13 @@
- SPDX - License - Identifier : AGPL - 3.0 - or - later
-- >
< template >
< NcSettingsSection
class = "declarative-settings-section"
< NcSettingsSection class = "declarative-settings-section"
: name = "t(formApp, form.title)"
: description = "t(formApp, form.description)"
: doc - url = "form.doc_url || ''" >
< div v -for = " formField in formFields "
: key = "formField.id"
class = "declarative-form-field"
: key = "formField.id"
class = "declarative-form-field"
: aria - label = "t('settings', '{app}\'s declarative setting field: {name}', { app: formApp, name: t(formApp, formField.title) })"
: class = " {
'declarative-form-field-text' : isTextFormField ( formField ) ,
@ -20,16 +19,14 @@
'declarative-form-field-multi_checkbox' : formField . type === 'multi-checkbox' ,
'declarative-form-field-radio' : formField . type === 'radio'
} " >
< template v-if ="isTextFormField(formField)" >
< div class = "input-wrapper" >
< NcInputField
: type = "formField.type"
< NcInputField :type ="formField.type"
: label = "t(formApp, formField.title)"
: value . sync = "formFieldsData[formField.id].value"
: placeholder = "t(formApp, formField.placeholder)"
@ update : value = "onChangeDebounced(formField)"
@ submit = "updateDeclarativeSettingsValue(formField)" / >
@ submit = "updateDeclarativeSettingsValue(formField)" / >
< / div >
< span class = "hint" > { { t ( formApp , formField . description ) } } < / span >
< / template >
@ -37,13 +34,12 @@
< template v-if ="formField.type === 'select'" >
< label : for = "formField.id + '_field'" > { { t ( formApp , formField . title ) } } < / label >
< div class = "input-wrapper" >
< NcSelect
: id = "formField.id + '_field'"
< NcSelect : id = "formField.id + '_field'"
: options = "formField.options"
: placeholder = "t(formApp, formField.placeholder)"
: label - outside = "true"
: value = "formFieldsData[formField.id].value"
@ input = "(value) => updateFormFieldDataValue(value, formField, true)" / >
@ input = "(value) => updateFormFieldDataValue(value, formField, true)" / >
< / div >
< span class = "hint" > { { t ( formApp , formField . description ) } } < / span >
< / template >
@ -51,8 +47,7 @@
< template v-if ="formField.type === 'multi-select'" >
< label : for = "formField.id + '_field'" > { { t ( formApp , formField . title ) } } < / label >
< div class = "input-wrapper" >
< NcSelect
: id = "formField.id + '_field'"
< NcSelect : id = "formField.id + '_field'"
: options = "formField.options"
: placeholder = "t(formApp, formField.placeholder)"
: multiple = "true"
@ -62,21 +57,20 @@
formFieldsData [ formField . id ] . value = value
updateDeclarativeSettingsValue ( formField , JSON . stringify ( formFieldsData [ formField . id ] . value ) )
}
" / >
" / >
< / div >
< span class = "hint" > { { t ( formApp , formField . description ) } } < / span >
< / template >
< template v-if ="formField.type === 'checkbox'" >
< label : for = "formField.id + '_field'" > { { t ( formApp , formField . title ) } } < / label >
< NcCheckboxRadioSwitch
: id = "formField.id + '_field'"
< NcCheckboxRadioSwitch : id = "formField.id + '_field'"
: checked = "Boolean(formFieldsData[formField.id].value)"
@ update : checked = " ( value ) => {
formField . value = value
updateFormFieldDataValue ( + value , formField , true )
}
" >
" >
{ { t ( formApp , formField . label ) } }
< / NcCheckboxRadioSwitch >
< span class = "hint" > { { t ( formApp , formField . description ) } } < / span >
@ -84,8 +78,7 @@
< template v-if ="formField.type === 'multi-checkbox'" >
< label : for = "formField.id + '_field'" > { { t ( formApp , formField . title ) } } < / label >
< NcCheckboxRadioSwitch
v - for = "option in formField.options"
< NcCheckboxRadioSwitch v -for = " option in formField.options "
: id = "formField.id + '_field_' + option.value"
: key = "option.value"
: checked = "formFieldsData[formField.id].value[option.value]"
@ -94,7 +87,7 @@
/ / U p d a t e w i t h o u t r e - g e n e r a t i n g i n i t i a l f o r m F i e l d s D a t a . v a l u e o b j e c t a s t h e l i n k t o c o m p o n e n t s a r e l o s t
updateDeclarativeSettingsValue ( formField , JSON . stringify ( formFieldsData [ formField . id ] . value ) )
}
" >
" >
{ { t ( formApp , option . name ) } }
< / NcCheckboxRadioSwitch >
< span class = "hint" > { { t ( formApp , formField . description ) } } < / span >
@ -102,8 +95,7 @@
< template v-if ="formField.type === 'radio'" >
< label : for = "formField.id + '_field'" > { { t ( formApp , formField . title ) } } < / label >
< NcCheckboxRadioSwitch
v - for = "option in formField.options"
< NcCheckboxRadioSwitch v -for = " option in formField.options "
: key = "option.value"
: value = "option.value"
type = "radio"
@ -146,9 +138,6 @@ export default {
formFieldsData : { } ,
}
} ,
beforeMount ( ) {
this . initFormFieldsData ( )
} ,
computed : {
formApp ( ) {
return this . form . app || ''
@ -157,6 +146,9 @@ export default {
return this . form . fields || [ ]
} ,
} ,
beforeMount ( ) {
this . initFormFieldsData ( )
} ,
methods : {
initFormFieldsData ( ) {
this . form . fields . forEach ( ( formField ) => {
@ -175,7 +167,7 @@ export default {
this . $set ( formField , 'value' , JSON . parse ( formField . value ) )
/ / M e r g e p o s s i b l e n e w o p t i o n s
formField . options . forEach ( option => {
if ( ! formField . valu e. hasOwnProperty ( option . value ) ) {
if ( ! Object . prototyp e. hasOwnProperty . call ( formField . value , option . value ) ) {
this . $set ( formField . value , option . value , false )
}
} )
@ -216,7 +208,7 @@ export default {
formId : this . form . id . replace ( this . formApp + '_' , '' ) , / / R e m o v e a p p p r e f i x t o s e n d c l e a n f o r m i d
fieldId : formField . id ,
value : value === null ? this . formFieldsData [ formField . id ] . value : value ,
} ) ;
} )
} catch ( err ) {
console . debug ( err )
showError ( t ( 'settings' , 'Failed to save setting' ) )