Ehrenamt/ff-admin
2
0
Fork 0
Code Issues 12 Pull requests Projects Releases 18 Packages Wiki Activity Actions

Merge pull request 'feature/#65-protocol-content-sort' (#74) from feature/#65-protocol-content-sort into develop

Browse source 
Reviewed-on: #74
This commit is contained in:
Julian Krauser 2025-03-21 09:35:23 +00:00
commit 96a9fe4431
9 changed files with 120 additions and 16 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
src/stores/admin/club/protocol/protocolAgenda.ts
View file

@ -54,6 +54,7 @@ export const useProtocolAgendaStore = defineStore("protocolAgenda", {
id: Number(res.data),
topic: "",
context: "",
sort: this.agenda.length,
protocolId: Number(protocolId),
});
})

1
src/stores/admin/club/protocol/protocolDecision.ts
View file

@ -55,6 +55,7 @@ export const useProtocolDecisionStore = defineStore("protocolDecision", {
id: Number(res.data),
topic: "",
context: "",
sort: this.decision.length,
protocolId: Number(protocolId),
});
})

1
src/stores/admin/club/protocol/protocolVoting.ts
View file

@ -58,6 +58,7 @@ export const useProtocolVotingStore = defineStore("protocolVoting", {
favour: 0,
abstain: 0,
against: 0,
sort: this.voting.length,
protocolId: Number(protocolId),
});
})

2
src/viewmodels/admin/club/protocol/protocolAgenda.models.ts
View file

@ -2,6 +2,7 @@ export interface ProtocolAgendaViewModel {
id: number;
topic: string;
context: string;
sort: number;
protocolId: number;
}
@ -9,4 +10,5 @@ export interface SyncProtocolAgendaViewModel {
id?: number;
topic: string;
context: string;
sort?: number;
}

2
src/viewmodels/admin/club/protocol/protocolDecision.models.ts
View file

@ -2,6 +2,7 @@ export interface ProtocolDecisionViewModel {
id: number;
topic: string;
context: string;
sort: number;
protocolId: number;
}
@ -9,4 +10,5 @@ export interface SyncProtocolDecisionViewModel {
id?: number;
topic: string;
context: string;
sort?: number;
}

3
src/viewmodels/admin/club/protocol/protocolVoting.models.ts
View file

@ -5,6 +5,7 @@ export interface ProtocolVotingViewModel {
favour: number;
abstain: number;
against: number;
sort: number;
protocolId: number;
}
@ -15,5 +16,5 @@ export interface SyncProtocolVotingViewModel {
favour: number;
abstain: number;
against: number;
protocolId: number;
sort?: number;
}

42
src/views/admin/club/protocol/ProtocolAgenda.vue
View file

@ -5,10 +5,10 @@
↺ laden fehlgeschlagen
</p>
<div class="flex flex-col gap-2 h-full overflow-y-auto">
<div class="flex flex-col gap-2 h-full overflow-y-scroll">
<details
v-for="item in agenda"
class="flex flex-col gap-2 rounded-lg w-full justify-between border border-primary overflow-hidden min-h-fit"
v-for="(item, index) in sortedAgenda"
class="flex flex-col rounded-lg w-full justify-between border border-primary overflow-hidden min-h-fit"
>
<summary class="flex flex-row gap-2 bg-primary p-2 w-full justify-between items-center cursor-pointer">
<svg
@ -30,6 +30,19 @@
@keyup.prevent
:disabled="!can('create', 'club', 'protocol')"
/>
<div class="flex flex-col">
<ChevronUpIcon
v-if="index != 0"
class="text-white w-4 h-4 stroke-2"
@click.prevent="changeSort('up', item.id, index)"
/>
<ChevronDownIcon
v-if="index != agenda.length - 1"
class="text-white w-4 h-4 stroke-2"
@click.prevent="changeSort('down', item.id, index)"
/>
</div>
</summary>
<QuillEditor
id="top"
@ -59,8 +72,8 @@ import { QuillEditor } from "@vueup/vue-quill";
import "@vueup/vue-quill/dist/vue-quill.snow.css";
import { toolbarOptions } from "@/helpers/quillConfig";
import { useProtocolAgendaStore } from "@/stores/admin/club/protocol/protocolAgenda";
import type { ProtocolAgendaViewModel } from "@/viewmodels/admin/club/protocol/protocolAgenda.models";
import { useAbilityStore } from "@/stores/ability";
import { ChevronDownIcon, ChevronUpIcon } from "@heroicons/vue/24/outline";
</script>
<script lang="ts">
@ -71,12 +84,31 @@ export default defineComponent({
computed: {
...mapWritableState(useProtocolAgendaStore, ["agenda", "loading"]),
...mapState(useAbilityStore, ["can"]),
sortedAgenda() {
return this.agenda.slice().sort((a, b) => a.sort - b.sort);
},
},
mounted() {
// this.fetchProtocolAgenda();
this.normalizeSort();
},
methods: {
...mapActions(useProtocolAgendaStore, ["fetchProtocolAgenda", "createProtocolAgenda"]),
changeSort(dir: "up" | "down", thisId: number, index: number) {
let affected = this.sortedAgenda[dir == "up" ? index - 1 : index + 1]?.id;
if (affected) {
this.agenda.find((a) => a.id == thisId)!.sort = dir == "up" ? index - 1 : index + 1;
this.agenda.find((a) => a.id == affected)!.sort = dir == "up" ? index + 1 : index - 1;
}
this.normalizeSort();
},
normalizeSort() {
let rightSort = this.agenda.every((val, index) => val.sort == index);
if (!rightSort) {
this.sortedAgenda.forEach((e, index) => {
e.sort = index;
});
}
},
},
});
</script>

42
src/views/admin/club/protocol/ProtocolDecisions.vue
View file

@ -5,10 +5,10 @@
&#8634; laden fehlgeschlagen
</p>
<div class="flex flex-col gap-2 h-full overflow-y-auto">
<div class="flex flex-col gap-2 h-full overflow-y-scroll">
<details
v-for="item in decision"
class="flex flex-col gap-2 rounded-lg w-full justify-between border border-primary overflow-hidden min-h-fit"
v-for="(item, index) in sortedDecision"
class="flex flex-col rounded-lg w-full justify-between border border-primary overflow-hidden min-h-fit"
>
<summary class="flex flex-row gap-2 bg-primary p-2 w-full justify-between items-center cursor-pointer">
<svg
@ -30,6 +30,19 @@
@keyup.prevent
:disabled="!can('create', 'club', 'protocol')"
/>
<div class="flex flex-col">
<ChevronUpIcon
v-if="index != 0"
class="text-white w-4 h-4 stroke-2"
@click.prevent="changeSort('up', item.id, index)"
/>
<ChevronDownIcon
v-if="index != decision.length - 1"
class="text-white w-4 h-4 stroke-2"
@click.prevent="changeSort('down', item.id, index)"
/>
</div>
</summary>
<QuillEditor
id="top"
@ -55,12 +68,12 @@
import { defineComponent } from "vue";
import { mapActions, mapState, mapWritableState } from "pinia";
import Spinner from "@/components/Spinner.vue";
import { useProtocolStore } from "@/stores/admin/club/protocol/protocol";
import { QuillEditor } from "@vueup/vue-quill";
import "@vueup/vue-quill/dist/vue-quill.snow.css";
import { toolbarOptions } from "@/helpers/quillConfig";
import { useProtocolDecisionStore } from "@/stores/admin/club/protocol/protocolDecision";
import { useAbilityStore } from "@/stores/ability";
import { ChevronDownIcon, ChevronUpIcon } from "@heroicons/vue/24/outline";
</script>
<script lang="ts">
@ -71,12 +84,31 @@ export default defineComponent({
computed: {
...mapWritableState(useProtocolDecisionStore, ["decision", "loading"]),
...mapState(useAbilityStore, ["can"]),
sortedDecision() {
return this.decision.slice().sort((a, b) => a.sort - b.sort);
},
},
mounted() {
// this.fetchProtocolDecision();
this.normalizeSort();
},
methods: {
...mapActions(useProtocolDecisionStore, ["fetchProtocolDecision", "createProtocolDecision"]),
changeSort(dir: "up" | "down", thisId: number, index: number) {
let affected = this.sortedDecision[dir == "up" ? index - 1 : index + 1]?.id;
if (affected) {
this.decision.find((a) => a.id == thisId)!.sort = dir == "up" ? index - 1 : index + 1;
this.decision.find((a) => a.id == affected)!.sort = dir == "up" ? index + 1 : index - 1;
}
this.normalizeSort();
},
normalizeSort() {
let rightSort = this.decision.every((val, index) => val.sort == index);
if (!rightSort) {
this.sortedDecision.forEach((e, index) => {
e.sort = index;
});
}
},
},
});
</script>

42
src/views/admin/club/protocol/ProtocolVoting.vue
View file

@ -5,10 +5,10 @@
&#8634; laden fehlgeschlagen
</p>
<div class="flex flex-col gap-2 h-full overflow-y-auto">
<div class="flex flex-col gap-2 h-full overflow-y-scroll">
<details
v-for="item in voting"
class="flex flex-col gap-2 rounded-lg w-full justify-between border border-primary overflow-hidden min-h-fit"
v-for="(item, index) in sortedVoting"
class="flex flex-col rounded-lg w-full justify-between border border-primary overflow-hidden min-h-fit"
>
<summary class="flex flex-row gap-2 bg-primary p-2 w-full justify-between items-center cursor-pointer">
<svg
@ -30,6 +30,19 @@
@keyup.prevent
:disabled="!can('create', 'club', 'protocol')"
/>
<div class="flex flex-col">
<ChevronUpIcon
v-if="index != 0"
class="text-white w-4 h-4 stroke-2"
@click.prevent="changeSort('up', item.id, index)"
/>
<ChevronDownIcon
v-if="index != voting.length - 1"
class="text-white w-4 h-4 stroke-2"
@click.prevent="changeSort('down', item.id, index)"
/>
</div>
</summary>
<QuillEditor
id="top"
@ -72,12 +85,12 @@
import { defineComponent } from "vue";
import { mapActions, mapState } from "pinia";
import Spinner from "@/components/Spinner.vue";
import { useProtocolStore } from "@/stores/admin/club/protocol/protocol";
import { QuillEditor } from "@vueup/vue-quill";
import "@vueup/vue-quill/dist/vue-quill.snow.css";
import { toolbarOptions } from "@/helpers/quillConfig";
import { useProtocolVotingStore } from "@/stores/admin/club/protocol/protocolVoting";
import { useAbilityStore } from "@/stores/ability";
import { ChevronDownIcon, ChevronUpIcon } from "@heroicons/vue/24/outline";
</script>
<script lang="ts">
@ -88,12 +101,31 @@ export default defineComponent({
computed: {
...mapState(useProtocolVotingStore, ["voting", "loading"]),
...mapState(useAbilityStore, ["can"]),
sortedVoting() {
return this.voting.slice().sort((a, b) => a.sort - b.sort);
},
},
mounted() {
// this.fetchProtocolVoting();
this.normalizeSort();
},
methods: {
...mapActions(useProtocolVotingStore, ["fetchProtocolVoting", "createProtocolVoting"]),
changeSort(dir: "up" | "down", thisId: number, index: number) {
let affected = this.sortedVoting[dir == "up" ? index - 1 : index + 1]?.id;
if (affected) {
this.voting.find((a) => a.id == thisId)!.sort = dir == "up" ? index - 1 : index + 1;
this.voting.find((a) => a.id == affected)!.sort = dir == "up" ? index + 1 : index - 1;
}
this.normalizeSort();
},
normalizeSort() {
let rightSort = this.voting.every((val, index) => val.sort == index);
if (!rightSort) {
this.sortedVoting.forEach((e, index) => {
e.sort = index;
});
}
},
},
});
</script>