diff --git a/src/App.vue b/src/App.vue
index 349930d3af73b77c5b6e5aea03345776cb02a346..026d0174c8217b044e22c2aa1f5ff57457976664 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -152,13 +152,14 @@
<main>
<div id="content" class="ui stackable grid centered container">
<transition name="fadeDownUp">
- <div v-if="messages && messages.length > 0" class="row">
+ <div v-if="messages && messages.length > 0" class="row over-content">
<div class="fourteen wide column">
<div
v-for="(message, index) in messages"
:key="'message-' + index"
- class="ui info message"
+ :class="['ui', message.level ? message.level : 'info', 'message']"
>
+ <i class="close icon" @click="DISCARD_MESSAGE(message)"></i>
<div class="header">
<i class="info circle icon"></i> Informations
</div>
@@ -193,8 +194,7 @@
<script>
import frag from "vue-frag";
-import { mapState } from "vuex";
-import { mapGetters } from "vuex";
+import { mapMutations, mapState, mapGetters } from "vuex";
export default {
name: "App",
@@ -249,6 +249,7 @@ export default {
},
methods: {
+ ...mapMutations(['DISCARD_MESSAGE']),
logout() {
this.$store.dispatch("LOGOUT");
},
@@ -376,23 +377,10 @@ footer {
transition: none !important;
}
-
-.bounce-enter-active {
- animation: bounce-in .5s;
-}
-.bounce-leave-active {
- animation: bounce-in .5s reverse;
-}
-@keyframes bounce-in {
- 0% {
- transform: scale(0);
- }
- 50% {
- transform: scale(1.5);
- }
- 100% {
- transform: scale(1);
- }
+.ui.grid > .row.over-content {
+ position: absolute;
+ z-index: 99;
+ opacity: 0.95;
}
.fadeDownUp-enter-active {
@@ -424,5 +412,16 @@ footer {
}
}
+.ui.message > .close.icon {
+ cursor: pointer;
+ position: absolute;
+ margin: 0em;
+ top: 0.78575em;
+ right: 0.5em;
+ opacity: 0.7;
+ -webkit-transition: opacity 0.1s ease;
+ transition: opacity 0.1s ease;
+}
+
</style>
\ No newline at end of file
diff --git a/src/components/feature/FeatureListTable.vue b/src/components/feature/FeatureListTable.vue
index 5817a4fa2ab3f7acb9aadf77cef804e68c27e0be..5aa26043cf82cb948b39470a50b4cae4fc274e64 100644
--- a/src/components/feature/FeatureListTable.vue
+++ b/src/components/feature/FeatureListTable.vue
@@ -1,12 +1,20 @@
<template>
<div data-tab="list" class="dataTables_wrapper no-footer">
- <table id="table-features" class="ui compact table">
+ <table id="table-features" class="ui compact table dataTable">
<thead>
<tr>
- <th class="center"></th>
+ <th class="dt-center">
+ <div @click="switchMode" class="switch-buttons pointer" :data-tooltip="`Passer en mode ${mode === 'modify' ? 'suppression':'édition'}`">
+ <div><i :class="['icon pencil', {disabled: mode !== 'modify'}]"></i></div>
+ <span class="grey">| </span>
+ <div><i :class="['icon trash', {disabled: mode !== 'delete'}]"></i></div>
+ </div>
+ </th>
+
+ <th class="dt-center">
+ <div class="pointer" @click="changeSort('status')">
- <th class="center">
Statut
<i
:class="{
@@ -14,21 +22,23 @@
up: isSortedDesc('status'),
}"
class="icon sort"
- @click="changeSort('status')"
/>
+ </div>
</th>
- <th class="center">
- Type
- <i
- :class="{
- down: isSortedAsc('feature_type'),
- up: isSortedDesc('feature_type'),
- }"
- class="icon sort"
- @click="changeSort('feature_type')"
- />
+ <th class="dt-center">
+ <div class="pointer" @click="changeSort('feature_type')">
+ Type
+ <i
+ :class="{
+ down: isSortedAsc('feature_type'),
+ up: isSortedDesc('feature_type'),
+ }"
+ class="icon sort"
+ />
+ </div>
</th>
- <th class="center">
+ <th class="dt-center">
+ <div class="pointer" @click="changeSort('title')">
Nom
<i
:class="{
@@ -36,10 +46,11 @@
up: isSortedDesc('title'),
}"
class="icon sort"
- @click="changeSort('title')"
/>
+ </div>
</th>
- <th class="center">
+ <th class="dt-center">
+ <div class="pointer" @click="changeSort('updated_on')">
Dernière modification
<i
:class="{
@@ -47,62 +58,57 @@
up: isSortedDesc('updated_on'),
}"
class="icon sort"
- @click="changeSort('updated_on')"
/>
+ </div>
</th>
- <th class="center" v-if="user">
- Auteur
- <i
- :class="{
- down: isSortedAsc('display_creator'),
- up: isSortedDesc('display_creator'),
- }"
- class="icon sort"
- @click="changeSort('display_creator')"
- />
+ <th class="dt-center" v-if="user">
+ <div class="pointer" @click="changeSort('display_creator')">
+ Auteur
+ <i
+ :class="{
+ down: isSortedAsc('display_creator'),
+ up: isSortedDesc('display_creator'),
+ }"
+ class="icon sort"
+ />
+ </div>
</th>
- <th class="center" v-if="user">
- Dernier éditeur
- <i
- :class="{
- down: isSortedAsc('display_last_editor'),
- up: isSortedDesc('display_last_editor'),
- }"
- class="icon sort"
- @click="changeSort('display_last_editor')"
- />
+ <th class="dt-center" v-if="user">
+ <div class="pointer" @click="changeSort('display_last_editor')">
+ Dernier éditeur
+ <i
+ :class="{
+ down: isSortedAsc('display_last_editor'),
+ up: isSortedDesc('display_last_editor'),
+ }"
+ class="icon sort"
+ />
+ </div>
</th>
</tr>
</thead>
<tbody>
<tr v-for="(feature, index) in paginatedFeatures" :key="index">
- <td class="center">
+ <td class="dt-center">
<div
- class="ui checkbox"
- :class="
- feature.properties.creator.username !== user.username &&
- !user.is_superuser &&
- !isUserProjectAdministrator
- ? 'disabled'
- : ''
- "
+ :class="['ui checkbox', {disabled: !checkRights(feature)}]"
>
<input
type="checkbox"
+ v-model="checked"
+ @input="storeClickedFeature(feature)"
:id="feature.id"
:value="feature.id"
- v-model="checked"
- :disabled="
- feature.properties.creator.username !== user.username &&
- !user.is_superuser &&
- !isUserProjectAdministrator
- "
+ :disabled="!checkRights(feature)"
+ name="select"
/>
- <label></label>
+ <label for="select"></label>
</div>
+ <!-- {{canDeleteFeature(feature)}}
+ {{canEditFeature(feature)}} -->
</td>
- <td class="center">
+ <td class="dt-center">
<div
v-if="feature.properties.status.value === 'archived'"
data-tooltip="Archivé"
@@ -128,7 +134,7 @@
<i class="orange pencil alternate icon"></i>
</div>
</td>
- <td class="center">
+ <td class="dt-center">
<router-link
:to="{
name: 'details-type-signalement',
@@ -140,7 +146,7 @@
{{ feature.properties.feature_type.title }}
</router-link>
</td>
- <td class="center">
+ <td class="dt-center">
<router-link
:to="{
name: 'details-signalement',
@@ -152,13 +158,13 @@
>{{ getFeatureDisplayName(feature) }}</router-link
>
</td>
- <td class="center">
+ <td class="dt-center">
{{ feature.properties.updated_on }}
</td>
- <td class="center" v-if="user">
+ <td class="dt-center" v-if="user">
{{ getUserName(feature) }}
</td>
- <td class="center" v-if="user">
+ <td class="dt-center" v-if="user">
{{ feature.properties.display_last_editor }}
</td>
</tr>
@@ -261,18 +267,17 @@ export default {
props: [
"paginatedFeatures",
"checkedFeatures",
+ "clickedFeatures",
"featuresCount",
"pagination",
"sort",
+ "mode"
],
computed: {
...mapState(["user"]),
...mapGetters(["project", "permissions"]),
-
- isUserProjectAdministrator() {
- return this.permissions.is_project_administrator;
- },
+ ...mapState(["user", "USER_LEVEL_PROJECTS"]),
checked: {
get() {
@@ -304,16 +309,18 @@ export default {
},
displayedPageNumbers() {
+ //* s'il y a moins de 5 pages, renvoyer toutes les pages
+ if (this.lastPageNumber < 5) return this.pageNumbers
//* si la page courante est inférieur à 5, la liste commence à l'index 0 et on retourne 5 pages
let firstPageInList = 0;
let pagesQuantity = 5;
- //* à partir de la 5ième page et jusqu'à la 4ième page avant la fin : n'afficher que 3 page entre les ellipses et la page courante doit être au milieu
- if (this.pagination.currentPage >= 5 && !(this.lastPageNumber - this.pagination.currentPage < 4)) {
+ //* à partir de la 5ième page et jusqu'à la 4ième page avant la fin : n'afficher que 3 page entre les ellipses et la page courante doit être au milieu
+ if (this.pagination.currentPage >= 5 && !((this.lastPageNumber - this.pagination.currentPage) < 4)) {
firstPageInList = this.pagination.currentPage - 2;
pagesQuantity = 3
}
- //* a partir de 4 résultat avant la fin afficher seulement les 5 derniers résultats
- if (this.lastPageNumber - this.pagination.currentPage < 4) {
+ //* à partir de 4 résultat avant la fin afficher seulement les 5 derniers résultats
+ if ((this.lastPageNumber - this.pagination.currentPage) < 4) {
firstPageInList = this.lastPageNumber - 5;
}
return this.pageNumbers.slice(firstPageInList, firstPageInList + pagesQuantity);
@@ -321,6 +328,50 @@ export default {
},
methods: {
+ storeClickedFeature(feature) {
+ this.clickedFeatures.push({feature_id: feature.id, feature_type: feature.properties.feature_type.slug})
+ },
+
+ canDeleteFeature(feature) {
+ return feature.properties.creator.username !== this.user.username &&
+ !this.user.is_superuser &&
+ !this.permissions.is_project_administrator
+ },
+
+ canEditFeature(feature) {
+ const userStatus = this.USER_LEVEL_PROJECTS[this.project.slug];
+ const access = {
+ "Administrateur projet" : ["draft", "published", "archived"],
+ "Modérateur" : ["pending"],
+ "Super Contributeur" : ["draft", this.project.moderation ? "pending" : "published"],
+ "Contributeur" : ["draft", this.project.moderation ? "pending" : "published"],
+ };
+
+ //if (userStatus === "Super Contributeur" || userStatus === "Contributeur") { //? should super contributeur behave the same, I don't think so
+ if (userStatus === "Contributeur" && feature.properties.creator.username !== this.user.username) {
+ return false;
+ } else if (access[userStatus]) {
+ return access[userStatus].includes(feature.properties.status.value);
+ } else {
+ return false
+ }
+ },
+
+ checkRights(feature) {
+ switch (this.mode) {
+ case 'modify':
+ return this.canEditFeature(feature)
+ case 'delete':
+ return this.canDeleteFeature(feature)
+ }
+ },
+
+ switchMode() {
+ this.$emit('update:mode', this.mode === 'modify' ? 'delete' : 'modify');
+ this.$emit('update:clickedFeatures', []);
+ this.$store.commit("feature/UPDATE_CHECKED_FEATURES", []);
+ },
+
getUserName(feature) {
if (!feature.properties.creator) {
return " ---- ";
@@ -352,6 +403,9 @@ export default {
}
},
},
+ destroyed() {
+ this.$store.commit("feature/UPDATE_CHECKED_FEATURES", []);
+ },
};
</script>
@@ -361,6 +415,9 @@ export default {
position: relative;
clear: both;
}
+table.dataTable th.dt-center, table.dataTable td.dt-center, table.dataTable td.dataTables_empty {
+ text-align: center;
+}
.dataTables_wrapper .dataTables_length,
.dataTables_wrapper .dataTables_filter,
.dataTables_wrapper .dataTables_info,
@@ -443,7 +500,23 @@ export default {
i.icon.sort:not(.down):not(.up) {
color: rgb(220, 220, 220);
}
+.pointer:hover {
+ cursor: pointer;
+}
+
+.switch-buttons {
+ display: flex;
+ justify-content: center;
+ align-items: baseline;
+}
+.grey {
+ color: #bbbbbb;
+}
+
+.ui.dropdown .menu .left.menu, .ui.dropdown > .left.menu .menu {
+ margin-right: 0 !important;
+}
/*
Max width before this PARTICULAR table gets nasty
This query will take effect for any screen smaller than 760px
@@ -513,8 +586,8 @@ and also iPads specifically.
content: "Auteur";
}
- .center {
- text-align: right !important;
+ table.dataTable th.dt-center, table.dataTable td.dt-center, table.dataTable td.dataTables_empty {
+ text-align: right;
}
#table-features {
diff --git a/src/services/feature-api.js b/src/services/feature-api.js
index 30b3fb8e55ab30d617b6abf4e2564aa186f86a12..3b21882327d377f1ea9013f83801ad40519f7c49 100644
--- a/src/services/feature-api.js
+++ b/src/services/feature-api.js
@@ -62,6 +62,21 @@ const featureAPI = {
}
},
+ async updateFeature({ feature_id, feature_type__slug, project__slug, newStatus }) {
+ let url = `${baseUrl}features/${feature_id}/?feature_type__slug=${feature_type__slug}&project__slug=${project__slug}`
+
+ const response = await axios({
+ url,
+ method: "PATCH",
+ data: { id: feature_id, status: newStatus, feature_type: feature_type__slug }
+ })
+ if (response.status === 200 && response.data) {
+ return response;
+ } else {
+ return null;
+ }
+ },
+
async postComment({ featureId, comment }) {
const response = await axios.post(
`${baseUrl}features/${featureId}/comments/`, { comment }
diff --git a/src/store/index.js b/src/store/index.js
index f3ff33c6acfdc5c150fb01ef3efc8fd1ab35d31e..101367d988c51875c904b37e99ad13701c204bb6 100644
--- a/src/store/index.js
+++ b/src/store/index.js
@@ -93,13 +93,16 @@ export default new Vuex.Store({
SET_EVENTS(state, events) {
state.events = events;
},
- DISPLAY_MESSAGE(state, comment) {
- state.messages = [{ comment }, ...state.messages];
+ DISPLAY_MESSAGE(state, message) {
+ state.messages = [message, ...state.messages];
if (document.getElementById("content")) document.getElementById("content").scrollIntoView({ block: "start", inline: "nearest" });
setTimeout(() => {
state.messages = [];
}, 3000);
},
+ DISCARD_MESSAGE(state, message) {
+ state.messages = state.messages.filter((el) => el.comment !== message.comment)
+ },
CLEAR_MESSAGES(state) {
state.messages = [];
},
diff --git a/src/store/modules/feature.js b/src/store/modules/feature.js
index 8a1c1a0ed02754624638eb2e3a4621fed7571ec6..436e57097da5f67c7cb72d13e3aa6f1436305790 100644
--- a/src/store/modules/feature.js
+++ b/src/store/modules/feature.js
@@ -172,7 +172,6 @@ const feature = {
SEND_FEATURE({ state, rootState, commit, dispatch }, routeName) {
commit("DISPLAY_LOADER", "Le signalement est en cours de création", { root: true })
- const message = routeName === "editer-signalement" ? "Le signalement a été mis à jour" : "Le signalement a été crée";
function redirect(featureId) {
dispatch(
'GET_PROJECT_FEATURE',
@@ -188,7 +187,7 @@ const feature = {
params: {
slug_type_signal: rootState.feature_type.current_feature_type_slug,
slug_signal: featureId,
- message,
+ message: routeName === "editer-signalement" ? "Le signalement a été mis à jour" : "Le signalement a été crée"
},
});
dispatch("GET_ALL_PROJECTS", null, {root:true}) //* & refresh project list
@@ -201,30 +200,32 @@ const feature = {
redirect(featureId);
}
- //* prepare feature data to send
- let extraFormObject = {}; //* prepare an object to be flatten in properties of geojson
- for (const field of state.extra_form) {
- extraFormObject[field.name] = field.value;
- }
- const geojson = {
- "id": state.form.feature_id,
- "type": "Feature",
- "geometry": state.form.geometry,
- "properties": {
- "title": state.form.title,
- "description": state.form.description.value,
- "status": state.form.status.value,
- "project": rootState.project_slug,
- "feature_type": rootState.feature_type.current_feature_type_slug,
- ...extraFormObject
+ function createGeojson() { //* prepare feature data to send
+ let extraFormObject = {}; //* prepare an object to be flatten in properties of geojson
+ for (const field of state.extra_form) {
+ extraFormObject[field.name] = field.value;
+ }
+ return {
+ "id": state.form.feature_id,
+ "type": "Feature",
+ "geometry": state.form.geometry,
+ "properties": {
+ "title": state.form.title,
+ "description": state.form.description.value,
+ "status": state.form.status.value,
+ "project": rootState.project_slug,
+ "feature_type": rootState.feature_type.current_feature_type_slug,
+ ...extraFormObject
+ }
}
}
+ const geojson = createGeojson();
let url = `${rootState.configuration.VUE_APP_DJANGO_API_BASE}features/`
if (routeName === "editer-signalement") {
- url += `${state.form.feature_id}/?` +
- `feature_type__slug=${rootState.feature_type.current_feature_type_slug}` +
- `&project__slug=${rootState.project_slug}`
+ url += `${state.form.feature_id}/?
+ feature_type__slug=${rootState.feature_type.current_feature_type_slug}
+ &project__slug=${rootState.project_slug}`
}
return axios({
diff --git a/src/views/feature/Feature_detail.vue b/src/views/feature/Feature_detail.vue
index 1203b2652d9c91605698d6ffcfba74894a23a46a..bf97c9702bd6405d6966a05d84b05fd3e83242dc 100644
--- a/src/views/feature/Feature_detail.vue
+++ b/src/views/feature/Feature_detail.vue
@@ -504,7 +504,7 @@ export default {
},
confirmComment() {
- this.$store.commit("DISPLAY_MESSAGE", "Ajout du commentaire confirmé");
+ this.$store.commit("DISPLAY_MESSAGE", {comment: "Ajout du commentaire confirmé", level: "positive"});
this.getFeatureEvents(); //* display new comment on the page
this.comment_form.attachment_file.file = null;
this.comment_form.attachment_file.fileName = "";
diff --git a/src/views/feature/Feature_list.vue b/src/views/feature/Feature_list.vue
index e72194a62133f38071157354004fc5d170ad3aa3..9f08055a416e30b2b9627ff828d3ee9d23b37f13 100644
--- a/src/views/feature/Feature_list.vue
+++ b/src/views/feature/Feature_list.vue
@@ -36,18 +36,19 @@
feature_types.length > 0 &&
permissions.can_create_feature
"
+ id="button-dropdown"
class="item right"
>
<div
- @click="showAddFeature = !showAddFeature"
+ @click="toggleAddFeature"
class="ui dropdown button compact button-hover-green"
data-tooltip="Ajouter un signalement"
- data-position="bottom left"
+ data-position="bottom right"
>
<i class="plus fitted icon"></i>
<div
v-if="showAddFeature"
- class="menu transition visible"
+ class="menu left transition visible"
style="z-index: 9999"
>
<div class="header">Ajouter un signalement du type</div>
@@ -67,13 +68,40 @@
</div>
</div>
+
<div
- v-if="checkedFeatures.length"
+ v-if="checkedFeatures.length > 0 && mode === 'modify'"
+ @click="toggleModifyStatus"
+ class="ui dropdown button compact button-hover-green margin-left-25"
+ data-tooltip="Modifier le statut des Signalements"
+ data-position="bottom right"
+ >
+ <i class="pencil fitted icon"></i>
+ <div
+ v-if="showModifyStatus"
+ class="menu left transition visible"
+ style="z-index: 9999"
+ >
+ <div class="header">Modifier le statut des Signalements</div>
+ <div class="scrolling menu text-wrap">
+ <span
+ v-for="status in availableStatus"
+ :key="status.value"
+ @click="modifyStatus(status.value)"
+ class="item"
+ >
+ {{ status.name }}
+ </span>
+ </div>
+ </div>
+ </div>
+
+ <div
+ v-if="checkedFeatures.length > 0 && mode === 'delete'"
@click="modalAllDelete"
class="ui button compact button-hover-red margin-left-25"
data-tooltip="Effacer tous les types de signalements sélectionnés"
- data-position="left center"
- data-variation="mini"
+ data-position="bottom right"
>
<i class="grey trash fitted icon"></i>
</div>
@@ -136,12 +164,15 @@
<SidebarLayers v-if="basemaps && map" />
</div>
<!-- | -->
+ <!-- v-on:update:clickedFeatures="handleClickedFeatures" -->
<FeatureListTable
v-show="!showMap"
v-on:update:page="handlePageChange"
v-on:update:sort="handleSortChange"
:paginatedFeatures="paginatedFeatures"
- :checkedFeatures.sync="checkedFeatures"
+ :checkedFeatures="checkedFeatures"
+ :clickedFeatures.sync="clickedFeatures"
+ :mode.sync="mode"
:featuresCount="featuresCount"
:pagination="pagination"
:sort="sort"
@@ -228,7 +259,9 @@ export default {
title: null,
},
baseUrl: this.$store.state.configuration.BASE_URL,
+ clickedFeatures: [],
modalAllDeleteOpen: false,
+ mode: "modify",
map: null,
zoom: null,
lat: null,
@@ -250,6 +283,7 @@ export default {
},
showMap: true,
showAddFeature: false,
+ showModifyStatus: false,
};
},
@@ -298,6 +332,7 @@ export default {
},
computed: {
+ ...mapState(["user", "USER_LEVEL_PROJECTS"]),
...mapGetters([
'project', 'permissions'
]),
@@ -322,6 +357,58 @@ export default {
);
},
+ availableStatus() { //* attente de réponse sur le ticket
+ //return this.statusChoices.filter((status) => status)
+
+ if (this.project) {
+ const isModerate = this.project.moderation;
+ const userStatus = this.USER_LEVEL_PROJECTS[this.project.slug];
+ const isOwnFeature = this.feature
+ ? this.feature.creator === this.user.id //* prevent undefined feature
+ : false; //* si le contributeur est l'auteur du signalement
+ if (
+ //* si admin, modérateur ou super contributeur, statuts toujours disponible: Brouillon, Publié, Archivé
+ userStatus === "Administrateur projet" ||
+ (userStatus === "Super Contributeur" && !isModerate)
+ ) {
+ return this.statusChoices.filter((el) => el.value !== "pending");
+ } else if (userStatus === "Super Contributeur" && isModerate) {
+ return this.statusChoices.filter(
+ (el) => el.value === "draft" || el.value === "pending"
+ );
+ } else if (userStatus === "Modérateur") {
+ return this.statusChoices.filter(
+ (el) => el.value === "draft" || el.value === "published"
+ );
+ } else if (userStatus === "Contributeur") {
+ //* cas particuliers du contributeur
+ if (
+ this.currentRouteName === "ajouter-signalement" ||
+ !isOwnFeature
+ ) {
+ //* même cas à l'ajout d'une feature ou si feature n'a pas été créé par le contributeur
+ return isModerate
+ ? this.statusChoices.filter(
+ (el) => el.value === "draft" || el.value === "pending"
+ )
+ : this.statusChoices.filter(
+ (el) => el.value === "draft" || el.value === "published"
+ );
+ } else {
+ //* à l'édition d'une feature et si le contributeur est l'auteur de la feature
+ return isModerate
+ ? this.statusChoices.filter(
+ (el) => el.value !== "published" //* toutes sauf "Publié"
+ )
+ : this.statusChoices.filter(
+ (el) => el.value !== "pending" //* toutes sauf "En cours de publication"
+ );
+ }
+ }
+ }
+ return [];
+ },
+
featureTypeChoices() {
return this.feature_types.map((el) => el.title);
},
@@ -329,15 +416,76 @@ export default {
methods: {
...mapActions('feature', [
- 'GET_PROJECT_FEATURES'
+ 'GET_PROJECT_FEATURES',
+ 'SEND_FEATURE'
]),
+
+ toggleAddFeature() {
+ this.showAddFeature = !this.showAddFeature;
+ this.showModifyStatus = false;
+ },
+
+ toggleModifyStatus() {
+ this.showModifyStatus = !this.showModifyStatus;
+ this.showAddFeature = false;
+ },
+
modalAllDelete() {
this.modalAllDeleteOpen = !this.modalAllDeleteOpen;
},
+ clickOutsideDropdown(e) {
+ if (!e.target.closest("#button-dropdown")) {
+ this.showModifyStatus = false;
+ setTimeout(() => { //* timout necessary to give time to click on link to add feature
+ this.showAddFeature = false;
+ }, 500);
+ }
+ },
+
+ async modifyStatus(newStatus) {
+ let errorCount = 0
+ const promises = this.checkedFeatures.map((feature_id) => {
+ let feature = this.clickedFeatures.find((el) => el.feature_id === feature_id)
+ if (feature) {
+ return featureAPI.updateFeature({
+ feature_id,
+ feature_type__slug: feature.feature_type,
+ project__slug: this.$route.params.slug, newStatus
+ })
+ } else {
+ errorCount += 1;
+ }
+ })
+ const promisesResult = await Promise.all(promises)
+ promisesResult.forEach((response) => {
+ if (response && response.data && response.status === 200) {
+ this.checkedFeatures.splice(this.checkedFeatures.indexOf(response.data.id), 2);
+ } else {
+ errorCount += 1;
+ }
+ })
+ let message = {
+ comment: "Tous les signalements ont été modifié avec succès.",
+ level: "positive"
+ }
+ if (errorCount) {
+ //* display error message
+ if(errorCount === 1) {
+ message.comment = "Un signalement n'a pas pu être modifié. (Il reste sélectionné)"
+ } else {
+ message.comment = `${errorCount} signalements n'ont pas pu être modifiés. (Ils restent sélectionnés)`
+ }
+ message.level = "negative"
+ }
+ this.fetchPagedFeatures();
+ this.$store.commit("DISPLAY_MESSAGE", message);
+ },
+
+
deleteFeature(feature_id) {
const url = `${this.API_BASE_URL}features/${feature_id}/?project__slug=${this.project.slug}`;
- axios
+ axios //TODO: REFACTO -> Delete function already exist in store
.delete(url, {})
.then(() => {
if (!this.modalAllDeleteOpen) {
@@ -346,7 +494,6 @@ export default {
})
.then(() => {
this.fetchPagedFeatures();
- this.getNloadGeojsonFeatures();
this.checkedFeatures.splice(feature_id);
});
}
@@ -359,8 +506,8 @@ export default {
deleteAllFeatureSelection() {
let feature = {};
this.checkedFeatures.forEach((feature_id) => {
- feature = { feature_id: feature_id };
- this.deleteFeature(feature.feature_id);
+ feature = { feature_id: feature_id }; // ? Is this usefull ?
+ this.deleteFeature(feature.feature_id); //? since property feature_id is directly used after...
});
this.modalAllDelete();
},
@@ -461,8 +608,8 @@ export default {
fetchPagedFeatures(newUrl) {
this.onFilterChange(); //* use paginated event to watch change in filters and modify features on map
let url = `${this.API_BASE_URL}projects/${this.$route.params.slug}/feature-paginated/?output=geojson&limit=${this.pagination.pagesize}&offset=${this.pagination.start}`;
+ //* if receiving next & previous url
if (newUrl && typeof newUrl === "string") {
- //* if receiving next & previous url
//newUrl = newUrl.replace("8000", "8010"); //* for dev uncomment to use proxy link
url = newUrl;
}
@@ -550,9 +697,11 @@ export default {
this.initMap();
}
this.fetchPagedFeatures();
+ window.addEventListener("mousedown", this.clickOutsideDropdown);
},
destroyed() {
+ window.removeEventListener("mousedown", this.clickOutsideDropdown);
//* allow user to change page if ever stuck on loader
this.$store.commit("DISCARD_LOADER");
},
@@ -570,10 +719,6 @@ export default {
z-index: 1;
}
-.center {
- text-align: center !important;
-}
-
#feature-list-container {
justify-content: flex-start;
}
@@ -600,20 +745,23 @@ export default {
padding: 0 !important;
}
+.ui.dropdown .menu .left.menu, .ui.dropdown > .left.menu .menu {
+ margin-right: 0 !important;
+}
+
@media screen and (min-width: 767px) {
.twelve-wide {
width: 75% !important;
}
}
+
@media screen and (max-width: 767px) {
#feature-list-container > .mobile-fullwidth {
width: 100% !important;
}
-
.no-margin-mobile {
margin: 0 !important;
}
-
.no-padding-mobile {
padding-top: 0 !important;
padding-bottom: 0 !important;
@@ -621,10 +769,12 @@ export default {
.mobile-column {
flex-direction: column !important;
}
+ #button-dropdown {
+ transform: translate(-50px, -60px);
+ }
#form-filters > .field.column {
width: 100% !important;
}
-
.map-container {
width: 100%;
}
diff --git a/src/views/project/Project_members.vue b/src/views/project/Project_members.vue
index aea8f4b1340c1ea3ed81f8ee426985195632eb74..dc2dff3db450ad731794a04efdeaa16d70b010fb 100644
--- a/src/views/project/Project_members.vue
+++ b/src/views/project/Project_members.vue
@@ -273,11 +273,14 @@ export default {
.then((response) => {
if (response.status === 200) {
this.$store.dispatch("GET_USER_LEVEL_PROJECTS"); //* update user status in top right menu
- this.$store.commit("DISPLAY_MESSAGE", "Permissions mises à jour");
+ this.$store.commit("DISPLAY_MESSAGE", {comment: "Permissions mises à jour", level: "positive"});
} else {
this.$store.commit(
"DISPLAY_MESSAGE",
- "Une erreur s'est produite pendant la mises à jour des permissions"
+ {
+ comment : "Une erreur s'est produite pendant la mises à jour des permissions",
+ level: "negative"
+ }
);
}
})
diff --git a/src/views/registration/Login.vue b/src/views/registration/Login.vue
index f26884b1113a2d6bb9728c6e84c49ed48826a2b5..f9614efa8e415cb53704a50200c3668d964152cb 100644
--- a/src/views/registration/Login.vue
+++ b/src/views/registration/Login.vue
@@ -102,7 +102,7 @@ export default {
if (this.$store.state.user) {
this.$store.commit(
"DISPLAY_MESSAGE",
- "Vous êtes déjà connecté, vous allez être redirigé vers la page d'accueil."
+ {comment :"Vous êtes déjà connecté, vous allez être redirigé vers la page d'accueil."}
);
setTimeout(() => this.$router.push("/"), 3100);
}