Merge branch 'feature/student-submissions'

2018-10-08 16:57:06 +02:00 · 2018-10-08 16:57:06 +02:00 · 9fad28f97c
parent 6f15ac4173 ace485bca2
commit 9fad28f97c
8 changed files with 140 additions and 63 deletions
--- a/client/src/components/AssignmentWithSubmissions.vue
+++ b/client/src/components/AssignmentWithSubmissions.vue
@ -0,0 +1,39 @@
+<template>
+  <div class="assignment-with-submissions">
+    <h1 class="assignment-with-submissions__title">{{assignment.title}}</h1>
+
+    <student-submission class="assignment-with-submissions__submission"
+                        v-for="(submission, index) in assignment.submissions"
+                        :key="index"
+                        :submission="submission"
+    >
+    </student-submission>
+  </div>
+</template>
+
+<script>
+  import StudentSubmission from '@/components/StudentSubmission';
+
+  export default {
+    props: ['assignment'],
+
+    components: {
+      StudentSubmission
+    }
+  }
+</script>
+
+<style scoped lang="scss">
+  @import "@/styles/_variables.scss";
+  @import "@/styles/_functions.scss";
+
+  .assignment-with-submissions {
+    &__title {
+      font-size: toRem(35px);
+    }
+
+    &__submission:first-of-type {
+      border-top: 1px solid $color-grey;
+    }
+  }
+</style>
--- a/client/src/components/StudentSubmission.vue
+++ b/client/src/components/StudentSubmission.vue
@ -1,7 +1,7 @@
 <template>
  <div class="student-submission">
    <div class="student-submission__student-name">
-      {{submission.name}}
+      {{name}}
    </div>
    <div class="student-submission__entry">
      {{submission.text}}
@ -11,7 +11,14 @@

 <script>
  export default {
-    props: ['submission']
+    props: ['submission'],
+
+    computed: {
+      name() {
+        return this.submission && this.submission.student
+          ? `${this.submission.student.firstName} ${this.submission.student.lastName}` : '';
+      }
+    }
  }
 </script>

--- a/client/src/components/modules/ModuleNavigation.vue
+++ b/client/src/components/modules/ModuleNavigation.vue
@ -1,27 +1,39 @@
 <template>
  <div>
    <nav class="module-navigation">
-      <h3 class="module-navigation__heading">Inhalte: {{module.metaTitle}}</h3>
-      <div class="module-navigation__anchors">
-        <a href="#" class="module-navigation__anchor module-navigation__anchor--active">Einleitung</a>
-        <a href="#" v-scroll-to="'#objectives'" class="module-navigation__anchor">Lernziele</a>
-
-        <a href="#" class="module-navigation__anchor"
-           v-scroll-to="chapterId(index)"
-           v-for="(chapter, index) in module.chapters"
-           :key="chapter.id">{{chapter.title}}</a>
-        <a href="#" class="module-navigation__anchor">Lernzielkontrolle</a>
-      </div>
-      <router-link tag="h3" to="/module/submissions" class="module-navigation__heading">Ergebnisse: {{module.metaTitle}}
-      </router-link>
-      <div class="module-navigation__anchors">
+      <div class="module-navigation__module-content">
        <router-link
-          to="/module/geld/submissions"
-          v-for="assignment in module.assignments"
-          :key="assignment.id"
-          class="module-navigation__anchor"
-        >{{assignment.title}}
+          tag="h3"
+          :to="moduleContentLink"
+          class="module-navigation__heading"
+        >Inhalte: {{module.metaTitle}}
        </router-link>
+        <div class="module-navigation__anchors" v-if="onModulePage">
+          <a href="#" class="module-navigation__anchor module-navigation__anchor--active">Einleitung</a>
+          <a href="#" v-scroll-to="'#objectives'" class="module-navigation__anchor">Lernziele</a>
+
+          <a href="#" class="module-navigation__anchor"
+             v-scroll-to="chapterId(index)"
+             v-for="(chapter, index) in module.chapters"
+             :key="chapter.id">{{chapter.title}}</a>
+          <a href="#" class="module-navigation__anchor">Lernzielkontrolle</a>
+        </div>
+      </div>
+
+      <div class="module-navigation__module-submissions">
+        <router-link tag="h3" to="/module/submissions" class="module-navigation__heading">Ergebnisse:
+          {{module.metaTitle}}
+        </router-link>
+        <div class="module-navigation__anchors">
+          <router-link
+            :to="submissionsLink(assignment)"
+            v-for="assignment in module.assignments"
+            :key="assignment.id"
+            class="module-navigation__anchor"
+            exact-active-class="module-navigation__anchor--active"
+          >{{assignment.title}}
+          </router-link>
+        </div>
      </div>
    </nav>
  </div>
@ -37,6 +49,15 @@
      module: moduleQuery
    },

+    computed: {
+      onModulePage() {
+        return this.$route.name === 'module';
+      },
+      moduleContentLink() {
+        return `/module/${this.module.slug}`;
+      }
+    },
+
    data() {
      return {
        module: {}
@ -46,6 +67,9 @@
    methods: {
      chapterId(index) {
        return `#chapter-${index}`
+      },
+      submissionsLink(assignment) {
+        return `/module/${this.module.slug}/submissions/${assignment.id}`;
      }
    }
  }
@ -65,15 +89,20 @@
    position: sticky;
    top: 32px;

+    &__module-content {
+      margin-bottom: 18px;
+    }
+
    &__heading {
      @include module-navigation-typography;
      margin: 0;
      font-size: 1.0625rem;
+      cursor: pointer;
    }
    &__anchors {
      display: flex;
      flex-direction: column;
-      padding: 16px 24px;
+      padding: 16px 24px 0;
    }
    &__anchor {
      @include module-navigation-typography;
--- a/client/src/graphql/gql/assignmentWithSubmissionsQuery.gql
+++ b/client/src/graphql/gql/assignmentWithSubmissionsQuery.gql
@ -0,0 +1,14 @@
+query AssignmentWithSubmissions($id: ID!) {
+  assignment(id: $id) {
+    title
+    submissions {
+      id
+      text
+      document
+      student {
+        firstName
+        lastName
+      }
+    }
+  }
+}
--- a/client/src/pages/submissions.vue
+++ b/client/src/pages/submissions.vue
@ -1,61 +1,49 @@
 <template>
  <div class="submissions-page">
-    <h1 class="submissions-page__title">Auftrag 2 - Aufgabe Interview</h1>
-
-    <student-submission class="submissions-page__submission"
-                        v-for="(submission, index) in submissions"
-                        :key="index"
-                        :submission="submission"
-    >
-    </student-submission>
+    <assignment-with-submissions v-if="!$apollo.queries.assignment.loading"
+      :assignment="assignment"></assignment-with-submissions>
  </div>

 </template>

 <script>
-  import StudentSubmission from '@/components/StudentSubmission';
+  import AssignmentWithSubmissions from '@/components/AssignmentWithSubmissions';
+
+  import ASSIGNMENT_WITH_SUBMISSIONS_QUERY from '@/graphql/gql/assignmentWithSubmissionsQuery.gql';

  export default {
    components: {
-      StudentSubmission
+      AssignmentWithSubmissions
+    },
+
+    apollo: {
+      assignment() {
+        return {
+          query: ASSIGNMENT_WITH_SUBMISSIONS_QUERY,
+          variables() {
+            return {
+              id: this.$route.params.id
+            }
+          },
+          update(result) {
+            return result.assignment;
+          }
+        }
+      },
    },

    data() {
      return {
-        submissions: [
-          {name: 'Hans Muster', text: 'Äusserlich erkennbare Schäden bitten wir sofort bei Lieferung…'},
-          {name: 'Max Steiner', text: 'Als Kommentar wird eine meinungsbildende und… '},
-          {name: 'Corinne Stalder', text: 'interview-LG.pdf'},
-          {name: 'Hans Muster', text: 'Äusserlich erkennbare Schäden bitten wir sofort bei Lieferung…'},
-          {name: 'Max Steiner', text: 'Als Kommentar wird eine meinungsbildende und… '},
-          {name: 'Corinne Stalder', text: 'interview-LG.pdf'},
-          {name: 'Hans Muster', text: 'Äusserlich erkennbare Schäden bitten wir sofort bei Lieferung…'},
-          {name: 'Max Steiner', text: 'Als Kommentar wird eine meinungsbildende und… '},
-          {name: 'Corinne Stalder', text: 'interview-LG.pdf'},
-          {name: 'Hans Muster', text: 'Äusserlich erkennbare Schäden bitten wir sofort bei Lieferung…'},
-          {name: 'Max Steiner', text: 'Als Kommentar wird eine meinungsbildende und… '},
-          {name: 'Corinne Stalder', text: 'interview-LG.pdf'}
-        ]
+        assignment: {
+          submissions: []
+        }
      }
    }
  }
 </script>

 <style scoped lang="scss">
-  @import "@/styles/_variables.scss";
-  @import "@/styles/_functions.scss";
-
  .submissions-page {
-    /*grid-column: span 2;*/
    width: 800px;
-    /*padding-left: 150px;*/
-
-    &__title {
-      font-size: toRem(35px);
-    }
-
-    &__submission:first-of-type {
-      border-top: 1px solid $color-grey;
-    }
  }
 </style>
--- a/client/src/router/index.js
+++ b/client/src/router/index.js
@ -27,7 +27,7 @@ const routes = [
        meta: {filter: true}
      },
      {
-        path: 'submissions',
+        path: 'submissions/:id',
        name: 'submissions',
        component: submissions,
        meta: {filter: true}
--- a/server/assignments/schema/queries.py
+++ b/server/assignments/schema/queries.py
@ -1,5 +1,4 @@
 from graphene import relay
-import graphene
 from graphene_django.filter import DjangoFilterConnectionField

 from assignments.schema.types import AssignmentNode
@ -7,4 +6,4 @@ from assignments.schema.types import AssignmentNode

 class AssignmentsQuery(object):
    assignment = relay.Node.Field(AssignmentNode)
-    assignments = DjangoFilterConnectionField(AssignmentNode)
+    assignments = DjangoFilterConnectionField(AssignmentNode)
--- a/server/assignments/schema/types.py
+++ b/server/assignments/schema/types.py
@ -23,5 +23,6 @@ class AssignmentNode(DjangoObjectType):
    def resolve_submission(self, info, **kwargs):
        return self.submissions.filter(student=info.context.user).first()  #  returns None if it doesn't exist yet

+    #todo: restrict for students
    def resolve_submissions(self, info, **kwargs):
-        return self.submissions.all()
+        return self.submissions.all()