diff --git a/src/assets/styles/base.css b/src/assets/styles/base.css index 13b03980fb8d9cca344aea013b329a2ef75719aa..7aa4d2c9f059cd18a16baea523fc0c0b9200e508 100644 --- a/src/assets/styles/base.css +++ b/src/assets/styles/base.css @@ -77,6 +77,9 @@ body { /* ---------------------------------- */ /* UTILS */ /* ---------------------------------- */ +.inline { + display: inline; +} .no-margin { margin: 0 !important; } diff --git a/src/components/Feature/Detail/FeatureTable.vue b/src/components/Feature/Detail/FeatureTable.vue index d5ba20657e209dfcd30a38fd5fbff9eb534d2488..3949387ec09bd337c533b5bebb731b0535a4b84b 100644 --- a/src/components/Feature/Detail/FeatureTable.vue +++ b/src/components/Feature/Detail/FeatureTable.vue @@ -56,7 +56,14 @@ :class="['icon', statusIcon]" aria-hidden="true" /> - {{ statusLabel }} + <FeatureEditStatusField + v-if="fastEditionMode && form" + :status="form.status.value" + class="inline" + /> + <span v-else> + {{ statusLabel }} + </span> </td> </tr> <tr> @@ -114,6 +121,7 @@ import { mapState } from 'vuex'; import FeatureTypeLink from '@/components/FeatureType/FeatureTypeLink'; +import FeatureEditStatusField from '@/components/Feature/FeatureEditStatusField'; import FeatureExtraForm from '@/components/Feature/Edit/FeatureExtraForm'; import { statusChoices } from '@/utils'; @@ -123,6 +131,7 @@ export default { components: { FeatureTypeLink, + FeatureEditStatusField, FeatureExtraForm, }, @@ -149,6 +158,7 @@ export default { ...mapState('feature', [ 'currentFeature', 'linked_features', + 'form', 'extra_forms', ]), diff --git a/src/components/Feature/FeatureEditStatusField.vue b/src/components/Feature/FeatureEditStatusField.vue new file mode 100644 index 0000000000000000000000000000000000000000..27b4f30c9ddcda2ed7c97c48bb7ff8c600c8fe83 --- /dev/null +++ b/src/components/Feature/FeatureEditStatusField.vue @@ -0,0 +1,77 @@ +<template> + <div class="field"> + <Dropdown + v-if="selectedStatus" + :options="allowedStatusChoices" + :selected="selectedStatus.name" + :selection.sync="selectedStatus" + /> + </div> +</template> + +<script> +import Dropdown from '@/components/Dropdown.vue'; +import { statusChoices, allowedStatus2change } from '@/utils'; +import { mapState } from 'vuex'; + + +export default { + name: 'FeatureEditStatusField', + + components: { + Dropdown, + }, + + props: { + status: { + type: String, + default: '', + }, + }, + + computed: { + ...mapState([ + 'user', + 'USER_LEVEL_PROJECTS', + ]), + ...mapState('projects', [ + 'project' + ]), + ...mapState('feature', [ + 'currentFeature' + ]), + statusObject() { + return statusChoices.find((key) => key.value === this.status); + }, + + selectedStatus: { + get() { + return this.statusObject; + + }, + set(newValue) { + this.$store.commit('feature/UPDATE_FORM_FIELD', { name: 'status', value: newValue.value }); + }, + }, + + allowedStatusChoices() { + if (this.project && this.currentFeature && this.user) { + const isModerate = this.project.moderation; + const userStatus = this.USER_LEVEL_PROJECTS[this.project.slug]; + const isOwnFeature = this.currentFeature.creator === this.user.id; //* si le contributeur est l'auteur du signalement + return allowedStatus2change(this.user, isModerate, userStatus, isOwnFeature, /* this.currentRouteName */); + } + return []; + }, + }, + + mounted() { + console.log('selectedStatus', this.selectedStatus); + + }, + + methods: { + } + +}; +</script> \ No newline at end of file diff --git a/src/store/modules/feature.store.js b/src/store/modules/feature.store.js index 450290f9b50cc71b648cba05b1e1f73d6d9dcb0a..ef76b951201ccacfb31fef6ab3075018625a2750 100644 --- a/src/store/modules/feature.store.js +++ b/src/store/modules/feature.store.js @@ -32,6 +32,16 @@ const feature = { UPDATE_FORM(state, payload) { state.form = payload; }, + INIT_FORM(state) { + state.form = { + title: state.currentFeature.title, + description: { value: state.currentFeature.description }, + status: { value: state.currentFeature.status }, + }; + }, + UPDATE_FORM_FIELD(state, field) { + state.form[field.name].value = field.value; + }, UPDATE_EXTRA_FORM(state, extra_form) { const index = state.extra_forms.findIndex(el => el.label === extra_form.label); if (index !== -1) { @@ -188,15 +198,14 @@ const feature = { }, { root: true }, ); - if (routeName.includes('details-signalement')) return; dispatch( 'GET_PROJECT_FEATURE', { project_slug: rootState.projects.project.slug, feature_id: featureId - } - ) + }) .then(() => { + if (routeName.includes('details-signalement')) return; router.push({ name: 'details-signalement', params: { @@ -219,15 +228,16 @@ const feature = { for (const field of state.extra_forms) { extraFormObject[field.name] = field.value; } - const feature = state.form || state.currentFeature; + //const feature = state.form || state.currentFeature; return { - id: feature.feature_id, + id: state.form.feature_id || state.currentFeature.feature_id, type: 'Feature', - geometry: feature.geometry || feature.geom, + geometry: state.form.geometry || state.form.geom || + state.currentFeature.geometry || state.currentFeature.geom, properties: { - title: feature.title, - description: feature.description.value, - status: feature.status.value, + title: state.form.title, + description: state.form.description.value, + status: state.form.status.value, project: rootState.projects.project.slug, feature_type: rootState['feature-type'].current_feature_type_slug, ...extraFormObject diff --git a/src/views/Feature/FeatureDetail.vue b/src/views/Feature/FeatureDetail.vue index 1b88ecf9671c0aec13c1e60471ee710469483a88..3ede1cb7b2fee1d8fade44488ffd9ad477017db3 100644 --- a/src/views/Feature/FeatureDetail.vue +++ b/src/views/Feature/FeatureDetail.vue @@ -259,7 +259,10 @@ export default { this.getFeatureAttachments(); this.getLinkedFeatures(); this.DISCARD_LOADER(); - if (this.project.fast_edition_mode) this.$store.dispatch('feature/INIT_EXTRA_FORMS'); + if (this.project.fast_edition_mode) { + this.$store.commit('feature/INIT_FORM'); + this.$store.dispatch('feature/INIT_EXTRA_FORMS'); + } }, confirmLeave() {