diff --git a/app/assets/stylesheets/new_design/flex.scss b/app/assets/stylesheets/new_design/flex.scss index e61a57611..317ebf55c 100644 --- a/app/assets/stylesheets/new_design/flex.scss +++ b/app/assets/stylesheets/new_design/flex.scss @@ -28,4 +28,12 @@ &.wrap { flex-wrap: wrap; } + + &.column { + flex-direction: column; + } +} + +.flex-grow { + flex-grow: 1; } diff --git a/app/assets/stylesheets/new_design/procedure_champs_editor.scss b/app/assets/stylesheets/new_design/procedure_champs_editor.scss index 5e1241f38..daa960e59 100644 --- a/app/assets/stylesheets/new_design/procedure_champs_editor.scss +++ b/app/assets/stylesheets/new_design/procedure_champs_editor.scss @@ -9,10 +9,6 @@ } .draggable-item { - display: flex; - flex-direction: column; - justify-content: flex-start; - border: 1px solid $border-grey; border-radius: 5px; margin-bottom: 10px; @@ -55,20 +51,7 @@ } } - .column { - display: flex; - justify-content: flex-start; - flex-direction: column; - - &.shift-left { - margin-left: 35px; - } - } - - .row { - display: flex; - justify-content: flex-start; - + .flex { &.section { padding: 10px 10px 0 10px; margin-bottom: 8px; diff --git a/app/controllers/new_administrateur/procedures_controller.rb b/app/controllers/new_administrateur/procedures_controller.rb index 02566fe80..ff4734397 100644 --- a/app/controllers/new_administrateur/procedures_controller.rb +++ b/app/controllers/new_administrateur/procedures_controller.rb @@ -3,7 +3,7 @@ module NewAdministrateur before_action :retrieve_procedure, only: [:champs, :annotations, :update] before_action :procedure_locked?, only: [:champs, :annotations, :update] - TYPE_DE_CHAMP_ATTRIBUTES = [ + TYPE_DE_CHAMP_ATTRIBUTES_BASE = [ :_destroy, :libelle, :description, @@ -18,6 +18,11 @@ module NewAdministrateur drop_down_list_attributes: [:value] ] + TYPE_DE_CHAMP_ATTRIBUTES = TYPE_DE_CHAMP_ATTRIBUTES_BASE.dup + TYPE_DE_CHAMP_ATTRIBUTES << { + types_de_champ_attributes: TYPE_DE_CHAMP_ATTRIBUTES_BASE + } + def apercu @dossier = procedure_without_control.new_dossier @tab = apercu_tab @@ -26,9 +31,9 @@ module NewAdministrateur def update if @procedure.update(procedure_params) flash.now.notice = if params[:procedure][:types_de_champ_attributes].present? - 'Champs enregistrés' + 'Formulaire mis à jour.' elsif params[:procedure][:types_de_champ_private_attributes].present? - 'Annotations enregistrés' + 'Annotations privées mises à jour.' else 'Démarche enregistrée.' end diff --git a/app/helpers/procedure_helper.rb b/app/helpers/procedure_helper.rb index c6d6db847..443626b8e 100644 --- a/app/helpers/procedure_helper.rb +++ b/app/helpers/procedure_helper.rb @@ -79,9 +79,16 @@ module ProcedureHelper types_de_champ end + TYPES_DE_CHAMP_INCLUDE = { drop_down_list: { only: :value } } + TYPES_DE_CHAMP_BASE = { + except: [:created_at, :updated_at, :stable_id, :type, :parent_id, :procedure_id, :private], + methods: [:piece_justificative_template_filename, :piece_justificative_template_url], + include: TYPES_DE_CHAMP_INCLUDE + } + TYPES_DE_CHAMP = TYPES_DE_CHAMP_BASE + .merge(include: TYPES_DE_CHAMP_INCLUDE.merge(types_de_champ: TYPES_DE_CHAMP_BASE)) + def types_de_champ_as_json(types_de_champ) - types_de_champ.as_json(except: [:created_at, :updated_at], - methods: [:piece_justificative_template_filename, :piece_justificative_template_url], - include: { drop_down_list: { only: :value } }) + types_de_champ.as_json(TYPES_DE_CHAMP) end end diff --git a/app/javascript/new_design/administrateur/DraggableItem.js b/app/javascript/new_design/administrateur/DraggableItem.js index 70dee126f..e1ff2a357 100644 --- a/app/javascript/new_design/administrateur/DraggableItem.js +++ b/app/javascript/new_design/administrateur/DraggableItem.js @@ -1,5 +1,5 @@ export default { - props: ['state', 'update', 'index', 'item', 'prefix'], + props: ['state', 'update', 'index', 'item'], computed: { isDirty() { return ( @@ -56,6 +56,9 @@ export default { isHeaderSection() { return this.typeChamp === 'header_section'; }, + isRepetition() { + return this.typeChamp === 'repetition'; + }, options() { const options = this.item.options || {}; for (let key of Object.keys(options)) { @@ -69,6 +72,21 @@ export default { } else { return 'types_de_champ_attributes'; } + }, + typesDeChamp() { + return this.item.types_de_champ; + }, + typesDeChampOptions() { + return this.state.typesDeChampOptions.filter( + ([, typeChamp]) => !EXCLUDE_FROM_REPETITION.includes(typeChamp) + ); + }, + stateForRepetition() { + return Object.assign({}, this.state, { + typesDeChamp: this.typesDeChamp, + typesDeChampOptions: this.typesDeChampOptions, + prefix: `${this.state.prefix}[${this.attribute}][${this.index}]` + }); } }, data() { @@ -103,14 +121,30 @@ export default { } }, nameFor(name) { - return `${this.prefix}[${this.attribute}][${this.index}][${name}]`; + return `${this.state.prefix}[${this.attribute}][${this.index}][${name}]`; }, elementIdFor(name) { - return `${this.prefix}_${this.attribute}_${this.index}_${name}`; + const prefix = this.state.prefix.replace(/\[/g, '_').replace(/\]/g, ''); + return `${prefix}_${this.attribute}_${this.index}_${name}`; + }, + addChamp() { + this.typesDeChamp.push({ + type_champ: 'text', + drop_down_list: {}, + types_de_champ: [], + options: {} + }); } } }; +const EXCLUDE_FROM_REPETITION = [ + 'carte', + 'dossier_link', + 'repetition', + 'siret' +]; + const PATHS_TO_WATCH = [ 'typeChamp', 'libelle', diff --git a/app/javascript/new_design/administrateur/DraggableItem.vue b/app/javascript/new_design/administrateur/DraggableItem.vue index 93849ed8d..fbb70a5c8 100644 --- a/app/javascript/new_design/administrateur/DraggableItem.vue +++ b/app/javascript/new_design/administrateur/DraggableItem.vue @@ -4,19 +4,23 @@ -