Display efforts on group page

aleksis/apps/maka/frontend/components/efforts/GroupPage_EffortTab.vue

 <script>
 import groupOverviewTabMixin from "aleksis.core/mixins/groupOverviewTabMixin.js";
 import PersonChip from "aleksis.core/components/person/PersonChip.vue";
+import SecondaryActionButton from "aleksis.core/components/generic/buttons/SecondaryActionButton.vue";
+import {
+  effortsWithGrades
+} from "./effortTab.graphql";
+import GradeChip from "../grades/GradeChip.vue";
 
 export default {
   name: "GroupPage_EffortTab",
-  components: { PersonChip },
+  components: { GradeChip, PersonChip, SecondaryActionButton },
   mixins: [groupOverviewTabMixin],
   computed: {
     headers() {
@@ -14,11 +19,34 @@ export default {
           align: "start",
           value: "fullName",
         },
-
+        ...this.efforts.map(effort => ({
+          text: effort.name,
+          value: `effort-${effort.id}`,
+          align: "center",
+          sortable: false, // TODO: change once we figured out how to access the correct value for sorting
+        })),
         { align: "end", sortable: false, value: "id" },
       ];
+    },
+  },
+  data() {
+    return {
+      efforts: [],
     }
   },
+  apollo: {
+    efforts: {
+      query: effortsWithGrades,
+      variables() {
+        return {
+          filters: JSON.stringify({
+            group: this.group.id,
+          })
+        };
+      },
+      update: (data) => data.efforts,
+    },
+  },
 }
 </script>
 
@@ -28,6 +56,25 @@ export default {
     <template #item.fullName="{ item }">
       <person-chip :person="item" />
     </template>
+
+    <template
+      v-for="effort in efforts"
+      #[`item.effort-${effort.id}`]="{ item }"
+    >
+      <template v-if="!effort.canEdit">
+        <template v-if="effort.grades.find(grade => grade.person.id === item.id)">
+          <!-- There exists a grade → show edit dialog -->
+          Hier edit für:
+          {{ effort.grades.find(grade => grade.person.id === item.id)?.id }}
+        </template>
+        <template v-else>
+          <secondary-action-button i18n-key="maka.grades.add" icon-text="mdi-star-plus-outline" rounded small text />
+        </template>
+      </template>
+      <template v-else>
+        <grade-chip :grade="effort.grades.find(grade => grade.person.id === item.id)" />
+      </template>
+    </template>
   </v-data-table>
 </template>
 

aleksis/apps/maka/frontend/components/efforts/effortTab.graphql

+query effortsWithGrades($orderBy: [String], $filters: JSONString) {
+  efforts(orderBy: $orderBy, filters: $filters) {
+    id
+    name
+    effortType {
+      id
+      name
+      color
+    }
+    group {
+      id
+      name
+    }
+    gradeSet {
+      id
+      name
+    }
+    grades {
+      id
+      person {
+        id
+      }
+      grade {
+        id
+        name
+        value
+      }
+    }
+    canEdit
+    canDelete
+  }
+}
\ No newline at end of file