diff --git a/aleksis/apps/maka/frontend/components/efforts/UnwrappedEffortTab.vue b/aleksis/apps/maka/frontend/components/efforts/UnwrappedEffortTab.vue index 371e80e7a1c6720b271c417c4d49628b8cbbfb8b..18afa76f8181cff77bcdc184a4d11454ac9cdcca 100644 --- a/aleksis/apps/maka/frontend/components/efforts/UnwrappedEffortTab.vue +++ b/aleksis/apps/maka/frontend/components/efforts/UnwrappedEffortTab.vue @@ -83,7 +83,7 @@ export default { :key="`updater-${effortIndex * group.members.length + index}`" v-if="effort.canEdit" :effort="effort" - :person-id="item.id" + :person="item" :value="effort.grades.find((grade) => grade.person.id === item.id)" :affected-query="$apollo.queries.efforts" :tab-index="effortIndex * group.members.length + index" diff --git a/aleksis/apps/maka/frontend/components/grades/UpdateOrCreateGrade.vue b/aleksis/apps/maka/frontend/components/grades/UpdateOrCreateGrade.vue index f517b18e0d6639c77dfd06b2488ee307a6cb9f0d..0089da44012f09336d9997f7c1febb3e5da83dc3 100644 --- a/aleksis/apps/maka/frontend/components/grades/UpdateOrCreateGrade.vue +++ b/aleksis/apps/maka/frontend/components/grades/UpdateOrCreateGrade.vue @@ -1,13 +1,17 @@ <script> -import { createGrades, updateGrades } from "./grades.graphql"; +import { createGrades, updateGrades, deleteGrades } from "./grades.graphql"; import mutateMixin from "aleksis.core/mixins/mutateMixin.js"; +import ConfirmDialog from "aleksis.core/components/generic/dialogs/ConfirmDialog.vue"; export default { name: "UpdateOrCreateGrade", mixins: [mutateMixin], + components: { + ConfirmDialog, + }, props: { - personId: { - type: [String, Number], + person: { + type: Object, required: true, }, effort: { @@ -40,6 +44,11 @@ export default { default: 0, }, }, + data() { + return { + showDeleteConfirm: false, + }; + }, computed: { items() { return [ @@ -55,8 +64,10 @@ export default { return this.value?.grade; }, set(newValue) { - // TODO - if (this.value) { + if (!newValue) { + // No new value means deleting + this.showDeleteConfirm = true; + } else if (this.value) { // → Preexisting grade, edit mutation this.mutate( updateGrades, @@ -64,7 +75,7 @@ export default { input: [ { id: this.value.id, - person: this.personId, + person: this.person.id, effort: this.effort.id, grade: newValue, }, @@ -90,7 +101,7 @@ export default { { input: [ { - person: this.personId, + person: this.person.id, effort: this.effort.id, grade: newValue, }, @@ -112,6 +123,27 @@ export default { }, }, }, + methods: { + confirmDelete() { + this.mutate( + deleteGrades, + { + ids: [this.value.id], + }, + (storedEfforts) => { + const effort = storedEfforts.find( + (effort) => effort.id === this.effort.id, + ); + + const index = effort.grades.findIndex((g) => g.id === this.value.id); + effort.grades.splice(index, 1); + + return storedEfforts; + }, + ); + }, + cancelDelete() {}, + }, }; </script> @@ -131,5 +163,25 @@ export default { v-model="selectedGrade" :tabindex="tabIndex" :loading="loading" - /> + > + <template #append> + <confirm-dialog + v-model="showDeleteConfirm" + @confirm="confirmDelete" + @cancel="cancelDelete" + > + <template #title> + {{ $t("maka.grades.confirm_delete") }} + </template> + <template #text> + {{ + $t("maka.grades.confirm_delete_grade", { + grade: value?.name, + name: person.fullName, + }) + }} + </template> + </confirm-dialog> + </template> + </v-autocomplete> </template>