From f6d95bd5136af7a18c7862e21236526402fac246 Mon Sep 17 00:00:00 2001
From: magicfelix <felix@felix-zauberer.de>
Date: Mon, 1 Aug 2022 12:59:04 +0200
Subject: [PATCH] Move LessonDocumentation edit card to new component
---
.../coursebook/LessonDocumentation.vue | 132 ++++++++++++++++++
.../coursebook/LessonDocumentations.vue | 123 ++--------------
2 files changed, 140 insertions(+), 115 deletions(-)
create mode 100644 aleksis/apps/alsijil/assets/components/coursebook/LessonDocumentation.vue
diff --git a/aleksis/apps/alsijil/assets/components/coursebook/LessonDocumentation.vue b/aleksis/apps/alsijil/assets/components/coursebook/LessonDocumentation.vue
new file mode 100644
index 000000000..67fc82d38
--- /dev/null
+++ b/aleksis/apps/alsijil/assets/components/coursebook/LessonDocumentation.vue
@@ -0,0 +1,132 @@
+<template>
+ <ApolloMutation
+ :mutation="require('./LessonDocumentation.graphql')"
+ :variables=lessonDocumentationEdit
+ @done="onDone"
+ >
+ <template v-slot="{ mutate, loading, error }">
+ <v-card elevation="2" :loading="loading">
+ <v-form v-model="valid">
+ <v-row class="ma-0">
+ <v-col cols="12" md="4" lg="3" xl="2">
+ <v-hover v-slot="{ hover }">
+ <div>
+ <v-menu
+ v-model="showPicker"
+ :close-on-content-click="false"
+ transition="scale-transition"
+ offset-y
+ min-width="auto"
+ >
+ <template v-slot:activator="{ on, attrs }">
+ <v-card-title>
+ <span v-text="new Date(lessonDocumentationEdit.date).toLocaleDateString($root.languageCode)" class="ma-1"></span>
+ <v-btn right v-bind="attrs" v-on="on" icon v-if="hover && dateAndPeriodEditable">
+ <v-icon>mdi-pencil-outline</v-icon>
+ </v-btn>
+ </v-card-title>
+ </template>
+ <v-date-picker
+ scrollable
+ no-title
+ @input="showPicker = false; $emit('change-date', $event)"
+ v-model="lessonDocumentationEdit.date"
+ ></v-date-picker>
+ </v-menu>
+ </div>
+ </v-hover>
+ <v-hover v-slot="{ hover }">
+ <div>
+ <v-menu offset-y>
+ <template v-slot:activator="{ on, attrs }">
+ <v-card-title>
+ <span v-text="period" class="ma-1"></span>
+ <v-btn
+ right
+ v-bind="attrs"
+ v-on="on"
+ icon
+ v-if="hover && dateAndPeriodEditable"
+ >
+ <v-icon>mdi-pencil-outline</v-icon>
+ </v-btn>
+ </v-card-title>
+ </template>
+ <v-list>
+ <!-- Fixme: load valid lessons -->
+ <v-list-item
+ v-for="(item, index) in [1, 2, 3, 4, 5, 6, 7, 8, 9]"
+ :key="index"
+ >
+ <v-list-item-title>{{ item }}</v-list-item-title>
+ </v-list-item>
+ </v-list>
+ </v-menu>
+ </div>
+ </v-hover>
+ </v-col>
+ <v-col cols="12" md="4" lg="6" xl="7">
+ <message-box type="error" v-if="error">Error updating data</message-box>
+ <v-textarea
+ name="input-7-1"
+ :label="$root.django.gettext('Topic')"
+ rows="1"
+ auto-grow
+ required
+
+ v-model="lessonDocumentationEdit.topic"
+ @change="mutate()"
+ ></v-textarea>
+ <v-textarea
+ name="input-7-1"
+ :label="$root.django.gettext('Homework')"
+ rows="1"
+ auto-grow
+
+ v-model="lessonDocumentationEdit.homework"
+ @change="mutate()"
+ ></v-textarea>
+ <v-textarea
+ name="input-7-1"
+ :label="$root.django.gettext('Group note')"
+ rows="1"
+ auto-grow
+
+ v-model="lessonDocumentationEdit.groupNote"
+ @change="mutate()"
+ ></v-textarea>
+ </v-col>
+ <v-col cols="12" md="4" lg="3">
+ <personal-notes
+ :lesson-documentation-id="lessonDocumentationEdit.id"
+ :groups="groups"
+ :excuse-types="excuseTypes"
+ :extra-marks="extraMarks"
+
+ v-model="lessonDocumentationEdit.personalNotes"
+ @change="$emit('change-personal-notes', $event)"
+ ></personal-notes>
+ </v-col>
+ </v-row>
+ </v-form>
+ </v-card>
+ </template>
+ </ApolloMutation>
+</template>
+
+<script>
+ import PersonalNotes from "./PersonalNotes.vue";
+ export default {
+ components: { PersonalNotes },
+ props: [ "lessonDocumentationEdit", "groups", "excuseTypes", "extraMarks" ],
+ name: "lesson-documentation",
+ data () {
+ return {
+ //lessonDocumentationEdit: {},
+ }
+ },
+ //created() {
+ //this.lessonDocumentationEdit = this.lessonDocumentation
+ //}
+ }
+</script>
diff --git a/aleksis/apps/alsijil/assets/components/coursebook/LessonDocumentations.vue b/aleksis/apps/alsijil/assets/components/coursebook/LessonDocumentations.vue
index 7127093b3..5758de154 100644
--- a/aleksis/apps/alsijil/assets/components/coursebook/LessonDocumentations.vue
+++ b/aleksis/apps/alsijil/assets/components/coursebook/LessonDocumentations.vue
@@ -27,119 +27,12 @@
</v-col>
</v-row>
</template>
- <ApolloMutation
- :mutation="require('./LessonDocumentation.graphql')"
- :variables=lessonDocumentationEdit
- @done="onDone"
- >
- <template v-slot="{ mutate, loading, error }">
- <v-card elevation="2" :loading="loading">
- <v-form v-model="valid">
- <v-row class="ma-0">
- <v-col cols="12" md="4" lg="3" xl="2">
- <v-hover v-slot="{ hover }">
- <div>
- <v-menu
- v-model="showPicker"
- :close-on-content-click="false"
- transition="scale-transition"
- offset-y
- min-width="auto"
- >
- <template v-slot:activator="{ on, attrs }">
- <v-card-title>
- <span v-text="new Date(lessonDocumentationEdit.date).toLocaleDateString($root.languageCode)" class="ma-1"></span>
- <v-btn right v-bind="attrs" v-on="on" icon v-if="hover && dateAndPeriodEditable">
- <v-icon>mdi-pencil-outline</v-icon>
- </v-btn>
- </v-card-title>
- </template>
- <v-date-picker
- scrollable
- no-title
- @input="showPicker = false; $emit('change-date', $event)"
- v-model="lessonDocumentationEdit.date"
- ></v-date-picker>
- </v-menu>
- </div>
- </v-hover>
- <v-hover v-slot="{ hover }">
- <div>
- <v-menu offset-y>
- <template v-slot:activator="{ on, attrs }">
- <v-card-title>
- <span v-text="period" class="ma-1"></span>
- <v-btn
- right
- v-bind="attrs"
- v-on="on"
- icon
- v-if="hover && dateAndPeriodEditable"
- >
- <v-icon>mdi-pencil-outline</v-icon>
- </v-btn>
- </v-card-title>
- </template>
- <v-list>
- <!-- Fixme: load valid lessons -->
- <v-list-item
- v-for="(item, index) in [1, 2, 3, 4, 5, 6, 7, 8, 9]"
- :key="index"
- >
- <v-list-item-title>{{ item }}</v-list-item-title>
- </v-list-item>
- </v-list>
- </v-menu>
- </div>
- </v-hover>
- </v-col>
- <v-col cols="12" md="4" lg="6" xl="7">
- <message-box type="error" v-if="error">Error updating data</message-box>
- <v-textarea
- name="input-7-1"
- :label="$root.django.gettext('Topic')"
- rows="1"
- auto-grow
- required
-
- v-model="lessonDocumentationEdit.topic"
- @change="mutate()"
- ></v-textarea>
- <v-textarea
- name="input-7-1"
- :label="$root.django.gettext('Homework')"
- rows="1"
- auto-grow
-
- v-model="lessonDocumentationEdit.homework"
- @change="mutate()"
- ></v-textarea>
- <v-textarea
- name="input-7-1"
- :label="$root.django.gettext('Group note')"
- rows="1"
- auto-grow
-
- v-model="lessonDocumentationEdit.groupNote"
- @change="mutate()"
- ></v-textarea>
- </v-col>
- <v-col cols="12" md="4" lg="3">
- <personal-notes
- :lesson-documentation-id="lessonDocumentationEdit.id"
- :groups="groups"
- :excuse-types="excuseTypes"
- :extra-marks="extraMarks"
-
- v-model="lessonDocumentationEdit.personalNotes"
- @change="$emit('change-personal-notes', $event)"
- ></personal-notes>
- </v-col>
- </v-row>
- </v-form>
- </v-card>
- </template>
- </ApolloMutation>
+ <lesson-documentation
+ :lessonDocumentationEdit="lessonDocumentationEdit"
+ :groups="groups"
+ :excuse-types="excuseTypes"
+ :extra-marks="extraMarks"
+ />
</v-dialog>
<v-data-table
:headers="headers"
@@ -150,9 +43,9 @@
</div></template>
<script>
- import PersonalNotes from "./PersonalNotes.vue";
+ import LessonDocumentation from "./LessonDocumentation.vue";
export default {
- components: { PersonalNotes },
+ components: { LessonDocumentation },
props: [ "lessonDocumentations","plannedLessonperiodsDatetimes", "groups", "excuseTypes", "extraMarks" ],
name: "lesson-documentations",
data () {
--
GitLab