skillbox/client/src/components/AssignmentWithSubmissions.vue

72 lines
1.7 KiB
Vue

<template>
<div class="assignment-with-submissions">
<h1 class="assignment-with-submissions__title">{{assignment.title}}</h1>
<p v-if="!assignment.submissions.length">Zu diesem Auftrag sind noch keine Ergebnisse vorhanden</p>
<router-link
:to="submissionLink(submission)"
v-for="(submission, index) in submissions"
class="assignment-with-submissions__link"
:key="index">
<student-submission class="assignment-with-submissions__submission"
:submission="submission"
>
</student-submission>
</router-link>
</div>
</template>
<script>
import StudentSubmission from '@/components/StudentSubmission';
export default {
props: ['assignment'],
components: {
StudentSubmission
},
methods: {
submissionLink(submission) {
return `/submission/${submission.id}`
},
belongsToSchool(submission) {
if (this.currentFilter === '') {
return true;
}
return submission.student.schoolClasses.edges.some(edge => edge.node.id === this.currentFilter)
}
},
computed: {
submissions() {
return this.assignment.submissions.filter(submission => {
return this.belongsToSchool(submission);
});
},
currentFilter() {
return this.$store.state.filterForSchoolClass;
},
},
}
</script>
<style scoped lang="scss">
@import "@/styles/_variables.scss";
@import "@/styles/_functions.scss";
.assignment-with-submissions {
&__title {
font-size: toRem(35px);
}
&__link {
display: block;
&:first-of-type {
border-top: 1px solid $color-grey;
}
}
}
</style>