diff --git a/src/components/FeatureType/FeatureTypeCustomForm.vue b/src/components/FeatureType/FeatureTypeCustomForm.vue index 5c1e113c109ae7f5356b8c2db3c22f7e4b88d5dc..a410b18981247b5ff81819a1c224ab4075fde3cb 100644 --- a/src/components/FeatureType/FeatureTypeCustomForm.vue +++ b/src/components/FeatureType/FeatureTypeCustomForm.vue @@ -171,25 +171,39 @@ <label :for="form.options.id_for_label">{{ form.options.label }}</label> - <div :id="`list-options-${customForm.dataKey}`"> - <div - v-for="(option, index) in form.options.value" - :key="option" - :id="option" - class="draggable-row" - > - <i - class="th icon" - aria-hidden="true" - /> - <input - :value="option" - type="text" - :maxlength="form.options.field.max_length" - :name="form.options.html_name" - class="options-field" - @change="updateOptionValue(index, $event)" + <div> + <div :id="`list-options-${customForm.dataKey}`"> + <div + v-for="(option, index) in form.options.value" + :id="option" + :key="`${option}-${index}`" + class="draggable-row" + > + <i + class="th icon" + aria-hidden="true" + /> + <input + :value="option" + type="text" + :maxlength="form.options.field.max_length" + :name="form.options.html_name" + class="options-field" + @change="updateOptionValue(index, $event)" + > + </div> + </div> + <div class="ui buttons"> + <a + class="ui compact small icon left floated button teal basic" + @click="addOption" > + <i + class="ui plus icon" + aria-hidden="true" + /> + <span> Ajouter une option</span> + </a> </div> </div> <ul @@ -204,7 +218,6 @@ </li> </ul> </div> - </div> </div> </template> @@ -413,7 +426,9 @@ export default { }, updateOptionOrder(e) { - console.log(e, e.target.childNodes); + const currentOptionsList = Array.from(e.target.childNodes).map((el) => el.id); + this.form.options.value = currentOptionsList; + this.updateStore(); }, initSortable() { @@ -426,6 +441,10 @@ export default { }); }, + addOption() { + console.log('addOption'); + }, + updateStore() { const data = { dataKey: this.customForm.dataKey,