From fae8f05602c6499d14c863a93fac724cb0ac1d57 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Timoth=C3=A9e=20Poussard?= <tpoussard@neogeo.fr>
Date: Thu, 21 Oct 2021 11:06:54 +0200
Subject: [PATCH] add sort on click, replace '!=' with '!==' & empty dropdown
at member added
---
.../feature/FeatureAttachmentForm.vue | 8 +-
src/components/feature/FeatureListTable.vue | 8 +-
src/views/feature/Feature_edit.vue | 8 +-
src/views/project/Project_members.vue | 87 +++++++++++++++----
4 files changed, 83 insertions(+), 28 deletions(-)
diff --git a/src/components/feature/FeatureAttachmentForm.vue b/src/components/feature/FeatureAttachmentForm.vue
index eb7f1aa2..2851f111 100644
--- a/src/components/feature/FeatureAttachmentForm.vue
+++ b/src/components/feature/FeatureAttachmentForm.vue
@@ -120,15 +120,15 @@ export default {
},
//* utilisation de watcher, car @change aurait un délai
"form.title.value": function (newValue, oldValue) {
- if (oldValue != "") {
- if (newValue != oldValue) {
+ if (oldValue !== "") {
+ if (newValue !== oldValue) {
this.updateStore();
}
}
},
"form.info.value": function (newValue, oldValue) {
- if (oldValue != "") {
- if (newValue != oldValue) {
+ if (oldValue !== "") {
+ if (newValue !== oldValue) {
this.updateStore();
}
}
diff --git a/src/components/feature/FeatureListTable.vue b/src/components/feature/FeatureListTable.vue
index c55b807a..b877a832 100644
--- a/src/components/feature/FeatureListTable.vue
+++ b/src/components/feature/FeatureListTable.vue
@@ -227,7 +227,7 @@ export default {
paginatedFeatures() {
let filterdFeatures = [...this.filteredFeatures];
// Ajout du tri
- if (this.sort.column != "") {
+ if (this.sort.column !== "") {
filterdFeatures = filterdFeatures.sort((a, b) => {
let aProp = this.getFeatureDisplayName(a);
let bProp = this.getFeatureDisplayName(b);
@@ -296,11 +296,11 @@ export default {
},
methods: {
- getUserName(feature){
- if(!feature.properties.creator) {
+ getUserName(feature) {
+ if (!feature.properties.creator) {
return " ---- ";
}
- return feature.properties.creator.username || " ---- "
+ return feature.properties.creator.username || " ---- ";
},
getFeatureDisplayName(feature) {
return feature.properties.title || feature.id;
diff --git a/src/views/feature/Feature_edit.vue b/src/views/feature/Feature_edit.vue
index 0f8a8590..c00a15ce 100644
--- a/src/views/feature/Feature_edit.vue
+++ b/src/views/feature/Feature_edit.vue
@@ -72,7 +72,7 @@
<!-- Import GeoImage -->
<div v-frag v-if="feature_type && feature_type.geom_type === 'point'">
- <p v-if="isOffline() != true">
+ <p v-if="isOffline() !== true">
<button
@click="toggleGeoRefModal"
id="add-geo-image"
@@ -209,9 +209,9 @@
</div>
<!-- Pièces jointes -->
- <div v-if="isOffline() != true">
+ <div v-if="isOffline() !== true">
<div class="ui horizontal divider">PIÈCES JOINTES</div>
- <div v-if="isOffline() != true" id="formsets-attachment">
+ <div v-if="isOffline() !== true" id="formsets-attachment">
<FeatureAttachmentForm
v-for="form in attachmentFormset"
:key="form.dataKey"
@@ -231,7 +231,7 @@
</div>
<!-- Signalements liés -->
- <div v-if="isOffline() != true">
+ <div v-if="isOffline() !== true">
<div class="ui horizontal divider">SIGNALEMENTS LIÉS</div>
<div id="formsets-link">
<FeatureLinkedForm
diff --git a/src/views/project/Project_members.vue b/src/views/project/Project_members.vue
index b303ab1b..53d72d47 100644
--- a/src/views/project/Project_members.vue
+++ b/src/views/project/Project_members.vue
@@ -26,8 +26,8 @@
<!-- <label for="add-member"></label> -->
<Dropdown
:options="levelOptions"
- :selected="newMember.status.name"
- :selection.sync="newMember.status"
+ :selected="newMember.role.name"
+ :selection.sync="newMember.role"
/>
</div>
</div>
@@ -50,8 +50,28 @@
<table class="ui red table">
<thead>
<tr>
- <th>Membre</th>
- <th>Niveau d'autorisation</th>
+ <th>
+ Membre
+ <i
+ :class="{
+ down: isSortedAsc('member'),
+ up: isSortedDesc('member'),
+ }"
+ class="icon sort"
+ @click="changeSort('member')"
+ />
+ </th>
+ <th>
+ Niveau d'autorisation
+ <i
+ :class="{
+ down: isSortedAsc('role'),
+ up: isSortedDesc('role'),
+ }"
+ class="icon sort"
+ @click="changeSort('role')"
+ />
+ </th>
</tr>
</thead>
<tbody>
@@ -118,13 +138,15 @@ export default {
name: "",
value: "",
},
- status: {
+ role: {
name: "Contributeur",
value: "contributor",
},
},
- isSortedByName: false,
- isSortedByStatus: false,
+ sort: {
+ column: "",
+ ascending: true,
+ },
};
},
@@ -152,14 +174,24 @@ export default {
return this.projectUsers
.filter((el) => el.userLevel.value !== "logged_user")
.sort((a, b) => {
- if (this.isSortedByName) {
- const textA = a.user.username.toUpperCase();
- const textB = b.user.username.toUpperCase();
- return textA < textB ? -1 : textA > textB ? 1 : 0;
- } else if (this.isSortedByStatus) {
- const textA = a.userLevel.name.toUpperCase();
- const textB = b.userLevel.name.toUpperCase();
- return textA < textB ? -1 : textA > textB ? 1 : 0;
+ if (this.sort.column !== "") {
+ if (this.sort.column === "member") {
+ const textA = a.user.username.toUpperCase();
+ const textB = b.user.username.toUpperCase();
+ if (this.sort.ascending) {
+ return textA < textB ? -1 : textA > textB ? 1 : 0;
+ } else {
+ return textA > textB ? -1 : textA < textB ? 1 : 0;
+ }
+ } else if (this.sort.column === "role") {
+ const textA = a.userLevel.name.toUpperCase();
+ const textB = b.userLevel.name.toUpperCase();
+ if (this.sort.ascending) {
+ return textA < textB ? -1 : textA > textB ? 1 : 0;
+ } else {
+ return textA > textB ? -1 : textA < textB ? 1 : 0;
+ }
+ }
} else {
return 0;
}
@@ -174,7 +206,26 @@ export default {
(el) => el.user.id === this.newMember.user.value
);
//* modify its userLever
- this.projectUsers[indexOfUser].userLevel = this.newMember.status;
+ this.projectUsers[indexOfUser].userLevel = this.newMember.role;
+ //* empty add form
+ this.newMember.user = { value: "", name: "" };
+ },
+
+ isSortedAsc(column) {
+ return this.sort.column === column && this.sort.ascending;
+ },
+ isSortedDesc(column) {
+ return this.sort.column === column && !this.sort.ascending;
+ },
+
+ changeSort(column) {
+ if (this.sort.column === column) {
+ //changer order
+ this.sort.ascending = !this.sort.ascending;
+ } else {
+ this.sort.column = column;
+ this.sort.ascending = true;
+ }
},
validateMembers() {
@@ -256,4 +307,8 @@ export default {
.padding-1 {
padding: 0 1em;
}
+
+i.icon.sort:not(.down):not(.up) {
+ color: rgb(220, 220, 220);
+}
</style>
\ No newline at end of file
--
GitLab