Frontend for Validity Ranges

aleksis/apps/lesrooster/frontend/components/ValidityRange.vue

+<script setup>
+import InlineCRUDList from "aleksis.core/components/generic/InlineCRUDList.vue";
+import DateField from "aleksis.core/components/generic/forms/DateField.vue";
+import SchoolTermField from "aleksis.core/components/school_term/SchoolTermField.vue";</script>
+
+<template>
+  <inline-c-r-u-d-list
+      :headers="headers"
+      :i18n-key="i18nKey"
+      create-item-i18n-key="lesrooster.validity_range.create_validity_range"
+      :gql-query="gqlQuery"
+      :gql-create-mutation="gqlCreateMutation"
+      :gql-patch-mutation="gqlPatchMutation"
+      :gql-delete-mutation="gqlDeleteMutation"
+      :default-item="defaultItem"
+      :get-create-data="getCreateData"
+      :get-patch-data="getPatchData"
+  >
+    <template #schoolTerm="{ item }">
+      {{ item.schoolTerm.name }}
+    </template>
+    <template #schoolTerm.field="{ attrs, on }">
+      <school-term-field
+          v-bind="attrs"
+          v-on="on"
+      />
+    </template>
+
+    <template #dateStart="{ item }">
+      {{ $d(new Date(item.dateStart), "short") }}
+    </template>
+    <template #dateStart.field="{ attrs, on, item }">
+      <date-field
+          v-bind="attrs"
+          v-on="on"
+          :rules="dateStartRules"
+          :max="item ? item.dateEnd : undefined"
+      ></date-field>
+    </template>
+
+    <template #dateEnd="{ item }">
+      {{ $d(new Date(item.dateEnd), "short") }}
+    </template>
+    <template #dateEnd.field="{ attrs, on, item }">
+      <date-field
+          v-bind="attrs"
+          v-on="on"
+          required
+          :rules="dateStartRules"
+          :min="item ? item.dateStart : undefined"
+      ></date-field>
+    </template>
+  </inline-c-r-u-d-list>
+</template>
+
+<script>
+import {
+  validityRanges,
+  createValidityRange,
+  deleteValidityRange,
+  updateValidityRanges,
+} from "./validityRange.graphql";
+
+export default {
+  name: "ValidityRange",
+  data() {
+    return {
+      headers: [
+        {
+          text: this.$t("lesrooster.validity_range.name"),
+          value: "name",
+        },
+        {
+          text: this.$t("school_term.title"),
+          value: "schoolTerm",
+        },
+        {
+          text: this.$t("lesrooster.validity_range.date_start"),
+          value: "dateStart",
+        },
+        {
+          text: this.$t("lesrooster.validity_range.date_end"),
+          value: "dateEnd",
+        },
+      ],
+      i18nKey: "lesrooster.validity_range",
+      gqlQuery: validityRanges,
+      gqlCreateMutation: createValidityRange,
+      gqlPatchMutation: updateValidityRanges,
+      gqlDeleteMutation: deleteValidityRange,
+      defaultItem: {
+        name: "",
+        dateStart: "",
+        dateEnd: "",
+        schoolTerm: "",
+      },
+      dateStartRules: [(value) => !!value || this.$t("forms.errors.required")],
+    };
+  },
+  methods: {
+    getCreateData(item) {
+      console.log("in getCreateData", item);
+      return {
+        ...item,
+        schoolTerm: item.schoolTerm?.id
+      }
+    },
+    getPatchData(items) {
+      console.log("patch items", items);
+      return items.map(item => ({
+        id: item.id,
+        name: item.name,
+        dateStart: item.dateStart,
+        dateEnd: item.dateEnd,
+        schoolTerm: item.schoolTerm.id,
+      }));
+    }
+  },
+};
+</script>
+
+<style scoped></style>

aleksis/apps/lesrooster/frontend/components/validityRange.graphql

+query validityRanges {
+  items: validityRanges {
+    id
+    name
+    schoolTerm {
+      id
+      name
+    }
+    dateStart
+    dateEnd
+    canEdit
+    canDelete
+  }
+}
+
+mutation createValidityRange($input: CreateValidityRangeInput!) {
+  createValidityRange(input: $input) {
+    item: validityRange {
+      id
+      name
+      schoolTerm {
+        id
+        name
+      }
+      dateStart
+      dateEnd
+      canEdit
+      canDelete
+    }
+  }
+}
+
+mutation deleteValidityRange($id: ID!) {
+  deleteValidityRange(id: $id) {
+    ok
+  }
+}
+
+mutation updateValidityRanges($input: [BatchPatchValidityRangeInput]!) {
+  batchMutation: updateValidityRanges(input: $input) {
+    items: validityRanges {
+      id
+      name
+      schoolTerm {
+        id
+        name
+      }
+      dateStart
+      dateEnd
+      canEdit
+      canDelete
+    }
+  }
+}

aleksis/apps/lesrooster/frontend/index.js

@@ -14,7 +14,7 @@ export default {
     children: [
         {
             path: "validity-ranges/",
-            component: () => import("./components/Dummy.vue"),
+            component: () => import("./components/ValidityRange.vue"),
             name: "lesrooster.validity_ranges",
             meta: {
                 inMenu: true,

aleksis/apps/lesrooster/schema/__init__.py

 import graphene
 
+from .validity_range import (
+    ValidityRangeType,
+    ValidityRangeCreateMutation,
+    ValidityRangeDeleteMutation,
+    ValidityRangeBatchPatchMutation
+)
 from ..models import ValidityRange
-from .validity_range import ValidityRangeType
 
 
 class Query(graphene.ObjectType):
@@ -13,4 +18,6 @@ class Query(graphene.ObjectType):
 
 
 class Mutation(graphene.ObjectType):
-    ...
+    create_validity_range = ValidityRangeCreateMutation.Field()
+    delete_validity_range = ValidityRangeDeleteMutation.Field()
+    update_validity_ranges = ValidityRangeBatchPatchMutation.Field()