diff --git a/aleksis/apps/alsijil/frontend/components/coursebook/Coursebook.vue b/aleksis/apps/alsijil/frontend/components/coursebook/Coursebook.vue
index 0d769e9243184d36ce5089ab2879de17e3a0a8ad..c46a9fbc38ee14d94968b6ca5523751092140815 100644
--- a/aleksis/apps/alsijil/frontend/components/coursebook/Coursebook.vue
+++ b/aleksis/apps/alsijil/frontend/components/coursebook/Coursebook.vue
@@ -19,7 +19,7 @@
<v-card
outlined
class="full-width"
- v-show="pageType === 'absences' && selectedParticipations.length"
+ v-show="pageType === 'absences' && combinedSelectedParticipations.length"
>
<v-card-text>
<v-row align="center">
@@ -27,7 +27,7 @@
{{
$tc(
"alsijil.coursebook.absences.action_for_selected",
- selectedParticipations.length,
+ combinedSelectedParticipations.length,
)
}}
</v-col>
@@ -49,8 +49,8 @@
:is="itemComponent"
:documentation="item"
:affectedQuery="lastQuery"
- @select="addSelectedParticipation"
- @deselect="removeSelectedParticipation"
+ :value="selectedParticipations[item.id] ??= []"
+ @input="selectParticipation(item.id, $event)"
/>
</template>
@@ -157,7 +157,7 @@ export default {
initDate: false,
currentDate: "",
hashUpdater: false,
- selectedParticipations: [],
+ selectedParticipations: {},
};
},
computed: {
@@ -228,23 +228,18 @@ export default {
return "DocumentationAbsencesModal";
}
},
+ combinedSelectedParticipations() {
+ return Object.values(this.selectedParticipations).flat();
+ },
},
methods: {
- addSelectedParticipation(participation) {
- this.selectedParticipations = [
- ...new Set([...this.selectedParticipations, participation]),
- ];
- },
- removeSelectedParticipation(participation) {
- const index = this.selectedParticipations.indexOf(participation);
- if (index >= 0) {
- this.selectedParticipations.splice(index, 1);
- }
+ selectParticipation(id, value) {
+ this.selectedParticipations = Object.assign({}, this.selectedParticipations, { [id]: value });
},
handleMultipleAction(absenceReasonId) {
this.loadSelectedParticiptions = true;
this.sendToServer(
- this.selectedParticipations,
+ this.combinedSelectedParticipations,
"absenceReason",
absenceReasonId,
);
@@ -252,7 +247,7 @@ export default {
},
resetMultipleAction() {
this.loadSelectedParticiptions = false;
- this.$set(this.selectedParticipations, []);
+ this.selectedParticipations = {};
},
},
};
diff --git a/aleksis/apps/alsijil/frontend/components/coursebook/absences/DocumentationAbsences.vue b/aleksis/apps/alsijil/frontend/components/coursebook/absences/DocumentationAbsences.vue
index d9013806dba3bafb5a47dbbc2e39ca255a2d963d..42c7b242c63fe87aede11a9c1304e683145f9e1d 100644
--- a/aleksis/apps/alsijil/frontend/components/coursebook/absences/DocumentationAbsences.vue
+++ b/aleksis/apps/alsijil/frontend/components/coursebook/absences/DocumentationAbsences.vue
@@ -18,7 +18,8 @@
:include-present="false"
class="participation-list"
v-bind="documentationPartProps"
- v-on="selectListeners"
+ :value="value"
+ @input="$emit('input', $event)"
/>
</v-card-text>
<v-spacer />
@@ -54,7 +55,6 @@ import CancelButton from "aleksis.core/components/generic/buttons/CancelButton.v
import { createOrUpdateDocumentations } from "../coursebook.graphql";
-import selectParticipationMixin from "./selectParticipationMixin.js";
import documentationPartMixin from "../documentation/documentationPartMixin";
export default {
@@ -67,7 +67,7 @@ export default {
CancelButton,
},
emits: ["open", "close"],
- mixins: [documentationPartMixin, selectParticipationMixin],
+ mixins: [documentationPartMixin],
data() {
return {
loading: false,
@@ -75,6 +75,12 @@ export default {
selectedParticipations: [],
};
},
+ props: {
+ value: {
+ type: Array,
+ required: true,
+ },
+ },
methods: {
save() {
this.$refs.summary.save();
diff --git a/aleksis/apps/alsijil/frontend/components/coursebook/absences/DocumentationAbsencesModal.vue b/aleksis/apps/alsijil/frontend/components/coursebook/absences/DocumentationAbsencesModal.vue
index 92bd289b5479cc9e0b7a78fb106b51c692b61083..7f337725f6b55511bb047be90e57c2a1434be7b7 100644
--- a/aleksis/apps/alsijil/frontend/components/coursebook/absences/DocumentationAbsencesModal.vue
+++ b/aleksis/apps/alsijil/frontend/components/coursebook/absences/DocumentationAbsencesModal.vue
@@ -8,7 +8,8 @@
compact
v-bind="$attrs"
:dialog-activator="activator"
- v-on="selectListeners"
+ :value="value"
+ @input="$emit('input', $event)"
/>
</template>
<!-- dialog view -> deactivate dialog -->
@@ -16,7 +17,6 @@
<documentation-absences
v-bind="$attrs"
@close="popup = false"
- v-on="selectListeners"
/>
</mobile-fullscreen-dialog>
</template>
@@ -25,19 +25,22 @@
import MobileFullscreenDialog from "aleksis.core/components/generic/dialogs/MobileFullscreenDialog.vue";
import DocumentationAbsences from "./DocumentationAbsences.vue";
-import selectParticipationMixin from "./selectParticipationMixin.js";
-
export default {
name: "DocumentationAbsencesModal",
components: {
MobileFullscreenDialog,
DocumentationAbsences,
},
- mixins: [selectParticipationMixin],
data() {
return {
popup: false,
};
},
+ props: {
+ value: {
+ type: Array,
+ required: true,
+ },
+ },
};
</script>
diff --git a/aleksis/apps/alsijil/frontend/components/coursebook/absences/ParticipationList.vue b/aleksis/apps/alsijil/frontend/components/coursebook/absences/ParticipationList.vue
index 0e01423be112acf915a9bea52302a4ea70a76231..85e267a63a46e4ff579b9dade07c60aebddf2cfe 100644
--- a/aleksis/apps/alsijil/frontend/components/coursebook/absences/ParticipationList.vue
+++ b/aleksis/apps/alsijil/frontend/components/coursebook/absences/ParticipationList.vue
@@ -3,45 +3,51 @@ import MobileFullscreenDialog from "aleksis.core/components/generic/dialogs/Mobi
import AbsenceReasonGroupSelect from "aleksis.apps.kolego/components/AbsenceReasonGroupSelect.vue";
-import selectParticipationMixin from "./selectParticipationMixin.js";
import updateParticipationMixin from "./updateParticipationMixin.js";
</script>
<template>
<v-list v-if="filteredParticipations.length">
<v-divider />
- <v-list-item
- v-for="(participation, index) in filteredParticipations"
- :key="`documentation-${documentation.id}-participation-${participation.id}`"
- :value="participation"
- v-bind="$attrs"
- v-on="$listeners"
+
+ <v-list-item-group
+ :value="value"
+ multiple
+ @change="changeSelect"
>
- <template #default="{ active }">
- <v-list-item-action>
- <v-checkbox
- :input-value="active"
- @change="handleParticipationSelect($event, participation)"
- />
- </v-list-item-action>
- <v-list-item-title>
- {{ participation.person.fullName }}
- </v-list-item-title>
- <v-list-item-action v-if="participation.absenceReason" class="full-width">
- <absence-reason-group-select
- allow-empty
- empty-value="present"
- :loadSelectedChip="loading"
- :value="participation.absenceReason?.id || 'present'"
- @input="sendToServer([participation], 'absenceReason', $event)"
- />
- </v-list-item-action>
+ <template v-for="(participation, index) in filteredParticipations">
+ <v-list-item
+ :key="`documentation-${documentation.id}-participation-${participation.id}`"
+ :value="participation.id"
+ v-bind="$attrs"
+ >
+ <template #default="{ active }">
+ <v-list-item-action>
+ <v-checkbox
+ :input-value="active"
+ />
+ </v-list-item-action>
+ <v-list-item-title>
+ {{ participation.person.fullName }}
+ </v-list-item-title>
+ <v-list-item-action v-if="participation.absenceReason" class="full-width">
+ <absence-reason-group-select
+ allow-empty
+ empty-value="present"
+ :loadSelectedChip="loading"
+ :value="participation.absenceReason?.id || 'present'"
+ @input="sendToServer([participation], 'absenceReason', $event)"
+ />
+ </v-list-item-action>
+ </template>
+ </v-list-item>
+ <v-divider
+ v-if="index < filteredParticipations.length - 1"
+ :key="index"
+ ></v-divider>
</template>
- </v-list-item>
- <v-divider
- v-if="index < filteredParticipations.length - 1"
- :key="index"
- ></v-divider>
+ </v-list-item-group>
+
<mobile-fullscreen-dialog v-model="participationDialogs" max-width="500px">
test
</mobile-fullscreen-dialog>
@@ -74,7 +80,7 @@ import updateParticipationMixin from "./updateParticipationMixin.js";
<script>
export default {
name: "ParticipationList",
- mixins: [selectParticipationMixin, updateParticipationMixin],
+ mixins: [updateParticipationMixin],
data() {
return {
loading: false,
@@ -88,6 +94,10 @@ export default {
required: false,
default: true,
},
+ value: {
+ type: Array,
+ required: true,
+ },
},
computed: {
filteredParticipations() {
@@ -101,13 +111,10 @@ export default {
},
},
methods: {
- handleParticipationSelect(value, participation) {
- if (value) {
- this.handleSelect(participation.id);
- } else {
- this.handleDeselect(participation.id);
- }
+ changeSelect(value) {
+ console.log(value);
+ this.$emit("input", value);
},
- },
+ }
};
</script>