diff --git a/src/components/feature_type/FeatureTypeCustomForm.vue b/src/components/feature_type/FeatureTypeCustomForm.vue
index dd99767dbaee49d86be84d1555d299e6ef6a35ef..4185148a74417164a95c972efd899ef14c68b746 100644
--- a/src/components/feature_type/FeatureTypeCustomForm.vue
+++ b/src/components/feature_type/FeatureTypeCustomForm.vue
@@ -118,6 +118,7 @@ export default {
{ name: "Texte multiligne", value: "text" },
],
form: {
+ dataKey: 0,
label: {
errors: null,
id_for_label: "label",
@@ -201,7 +202,7 @@ export default {
},
},
arrayOption: {
- // * because backend expects an array
+ // * create an array, because backend expects an array
get() {
return [this.form.options.value];
},
@@ -212,14 +213,9 @@ export default {
},
},
- /* watch: { // ? not called usefull to stay ?
- customForm(newValue) {
- if (newValue) this.fillCustomFormData(newValue);
- },
- }, */
-
methods: {
fillCustomFormData(customFormData) {
+ this.f
for (let el in customFormData) {
if (el && this.form[el] && customFormData[el]) {
this.form[el].value = customFormData[el];
@@ -234,14 +230,15 @@ export default {
);
},
updateStore() {
- this.$store.commit("feature_type/UPDATE_CUSTOM_FORM", {
+ const data = {
dataKey: this.customForm.dataKey,
label: this.form.label.value,
name: this.form.name.value,
position: this.form.position.value,
field_type: this.form.field_type.value,
options: this.form.options.value,
- });
+ }
+ this.$store.commit("feature_type/UPDATE_CUSTOM_FORM", data);
},
updateOptions() {
this.form.options.value[0] = this.form.options.value[0].replace(
@@ -249,7 +246,6 @@ export default {
","
);
this.updateStore();
- this.$store.commit("feature_type/UPDATE_COLOR_STYLE");
},
},
beforeDestroy() {
@@ -257,12 +253,6 @@ export default {
},
mounted() {
this.fillCustomFormData(this.customForm);
- /* for (let el in this.customForm) {
- if (el && this.form[el] && this.customForm[el]) {
- this.form[el].value = this.customForm[el].value;
- }
- } */
- //this.updateStore();
},
};
</script>
diff --git a/src/store/modules/feature_type.js b/src/store/modules/feature_type.js
index 1475e29751bf7893b545de7881f7c968e53f5019..69f464231c1bcba32349cdb15fa818fcc07604ca 100644
--- a/src/store/modules/feature_type.js
+++ b/src/store/modules/feature_type.js
@@ -4,7 +4,6 @@ const feature_type = {
namespaced: true,
state: {
form: null,
- colorsStyleList: [],
customForms: [],
current_feature_type_slug: null,
feature_types: [],
@@ -41,13 +40,6 @@ const feature_type = {
EMPTY_CUSTOM_FORMS(state) {
state.customForms = [];
},
- UPDATE_COLOR_STYLE(state) { // * un peu dirty (mais pas quick) car getter pas réactif avec nested et compliqué de faire dans composants enfants multiples
- let res = [];
- for (let form of state.customForms) {
- if (form.label) res.push(form);
- }
- state.colorsStyleList = res;
- },
SET_IMPORT_FEATURE_TYPES_DATA(state, payload) {
state.importFeatureTypeData = payload;
},
@@ -58,18 +50,18 @@ const feature_type = {
getters: {
feature_type: state => state.feature_types.find(
(el) => el.slug === state.current_feature_type_slug
- )
+ ),
+ //* filter options of special field that is of type list to select a color
+ colorsStyleList: (state, getters) => getters.feature_type ? getters.feature_type.customfield_set.filter(cust => cust.options.length) : [],
},
actions: {
- async POST_FEATURE_TYPE({ state, rootGetters }) {
+ async SEND_FEATURE_TYPE({ state, getters, rootGetters }, requestType) {
const data = {
'title': state.form.title.value,
- 'slug': rootGetters.project.slug,
'geom_type': state.form.geom_type.value,
'color': state.form.color.value,
'colors_style': state.form.colors_style.value,
'project': rootGetters.project.slug,
- //'project': state.form.project.value,
'customfield_set': state.customForms.map(el => {
return {
'position': el.position,
@@ -81,18 +73,30 @@ const feature_type = {
}),
//'is_editable': true,
}
- //console.log("data", data)
- return axios
- .post(`${process.env.VUE_APP_DJANGO_API_BASE}feature-types/`, data)
- .then((response) => {
- const feature_type_slug = response.data.slug;
- const status = response.status;
- return { feature_type_slug, status };
- })
- .catch((/* error */) => {
- //console.error(error);
- });
+ if (requestType === "post") {
+ return axios
+ .post(`${process.env.VUE_APP_DJANGO_API_BASE}feature-types/`, data)
+ .then((response) => {
+ const feature_type_slug = response.data.slug;
+ const status = response.status;
+ return { feature_type_slug, status };
+ })
+ .catch((/* error */) => {
+ //console.error(error);
+ });
+ } else {
+ return axios
+ .put(`${process.env.VUE_APP_DJANGO_API_BASE}feature-types/${getters.feature_type.slug}/`, data)
+ .then((response) => {
+ const feature_type_slug = response.data.slug;
+ const status = response.status;
+ return { feature_type_slug, status };
+ })
+ .catch((/* error */) => {
+ //console.error(error);
+ });
+ }
},
POST_FEATURES_FROM_GEOJSON({ state, dispatch }, payload) {
diff --git a/src/views/feature_type/Feature_type_edit.vue b/src/views/feature_type/Feature_type_edit.vue
index 367e5a9373ea585903b9bd37357f8ae61137b067..df2167a7fa5ac2c03044306af6ca8217d6da9bdf 100644
--- a/src/views/feature_type/Feature_type_edit.vue
+++ b/src/views/feature_type/Feature_type_edit.vue
@@ -119,7 +119,7 @@
<button
class="ui teal icon button"
type="button"
- @click="postFeatureType"
+ @click="sendFeatureType"
>
<i class="white save icon"></i>
{{ action === "create" ? "Créer" : "Sauvegarder" }} le type de
@@ -223,8 +223,8 @@ export default {
computed: {
...mapGetters(["project"]),
- ...mapState("feature_type", ["customForms", "colorsStyleList"]),
- ...mapGetters("feature_type", ["feature_type"]),
+ ...mapState("feature_type", ["customForms"]),
+ ...mapGetters("feature_type", ["feature_type", "colorsStyleList"]),
selectedGeomType: {
get() {
const currentGeomType = this.geomTypeChoices.find(
@@ -252,22 +252,26 @@ export default {
},
},
colorsStyleOptions: function () {
+ this.iniateColorsStyleFields();
return this.colorsStyleList.map((el) => el.label);
},
},
watch: {
// TODO: improve to update color selector at customForms change (doesn't work)
- colorsStyleList: {
+ /* colorsStyleList: {
handler() {
this.iniateColorsStyleFields();
},
deep: true,
- },
+ }, */
feature_type(newValue) {
if (newValue) {
this.fillFormData(newValue);
- this.$store.commit("feature_type/SET_CUSTOM_FORMS", newValue.customfield_set)
+ /* this.$store.commit( // ? could be erased ?
+ "feature_type/SET_CUSTOM_FORMS",
+ newValue.customfield_set
+ ); */
}
},
},
@@ -320,8 +324,7 @@ export default {
// * find feature_type and fill form values
if (this.form[el]) this.form[el].value = formData[el];
}
- console.log(formData)
- formData.customfield_set.forEach(el => this.addCustomForm(el))
+ formData.customfield_set.forEach((el) => this.addCustomForm(el));
this.updateStore();
},
@@ -349,23 +352,27 @@ export default {
return false;
},
- goBackToProject() {
+ goBackToProject(message) {
this.$router.push({
name: "project_detail",
params: {
slug: this.project.slug,
- message: "Le nouveau type de signalement a bien été créé",
+ message,
},
});
},
- postFeatureType() {
+ sendFeatureType() {
+ // * si édition d'une feature_type déja existante, faire un put
+ const requestType = this.action === "edit" ? "put" : "post";
if (this.checkForm()) {
this.$store
- .dispatch("feature_type/POST_FEATURE_TYPE")
+ .dispatch("feature_type/SEND_FEATURE_TYPE", requestType)
.then(({ status }) => {
- if (status === 201) {
- this.goBackToProject();
+ if (status === 200) {
+ this.goBackToProject("Le type de signalement a été mis à jour");
+ } else if (status === 201) {
+ this.goBackToProject("Le nouveau type de signalement a été créé");
} else {
this.displayMessage(
"Une erreur est survenue lors de l'import du type de signalement"
@@ -487,20 +494,20 @@ export default {
},
mounted() {
- if (this.action === "edit" || this.action === "duplicate") {
- /* console.log(this.feature_type); // ? Ã priori le watch devrait suffire
+ //if (this.action === "edit" || this.action === "duplicate") {
+ /* console.log(this.feature_type); // ? Ã priori le watch devrait suffire
if (this.feature_type) {
this.fillFormData(this.feature_type);
} */
- if (this.action === "duplicate") {
- //* replace original name with new default title
- this.form.title.value += ` (Copie ${new Date()
- .toLocaleString()
- .slice(0, -3)
- .replace(",", "")} )`;
- this.updateStore(); // * initialize form in store in case this.form would not be modified
- }
+ if (this.action === "duplicate") {
+ //* replace original name with new default title
+ this.form.title.value += ` (Copie ${new Date()
+ .toLocaleString()
+ .slice(0, -3)
+ .replace(",", "")} )`;
+ this.updateStore(); // * initialize form in store in case this.form would not be modified
+ // }
} else if (this.geojson) {
this.importGeoJson();
if (this.$store.state.feature_type.filenameToImport.name) {