Skip to content
Snippets Groups Projects
Verified Commit ca6a4b25 authored by magicfelix's avatar magicfelix
Browse files

Seperate GraphQL query from template and use .vue-style

parent 554f44eb
No related branches found
No related tags found
No related merge requests found
Pipeline #80895 failed
query CourseBook($lessonId: ID!) {
excuseTypes {
name
shortName
}
lesson: lessonsById(id: $lessonId) {
groups {
name
shortName
members {
id
fullName
}
}
subject {
name
}
}
lessonDocumentations: lessonDocumentationsByLessonId(id: $lessonId) {
id
topic
homework
groupNote
period
date
personalNotes {
id
person {
id
fullName
}
late
absent
excused
excuseType {
name
shortName
}
remarks
extraMarks {
name
shortName
}
}
}
extraMarks {
name
shortName
}
}
import {CHANGES, SAVED, UPDATING} from "../../UpdateStatuses.js"; <template>
<ApolloQuery
export default { :query="require('./CourseBook.graphql')"
methods: { :variables="{ lessonId }"
processDataChange(event) { >
this.status = CHANGES;
// alert("Probably save the data");
console.log(event);
setTimeout(() => {
this.status = UPDATING;
}, 500)
setTimeout(() => {
this.status = SAVED;
}, 1000)
},
updateManually(event) {
alert("Data sync triggered manually");
this.status = UPDATING;
setTimeout(() => {
this.status = SAVED;
}, 500)
}
},
props: ["lessonId"],
name: "course-book",
data: () => {
return {
ping: "ping",
status: SAVED,
// lessonId: 352
}
},
template: `
<ApolloQuery
:query="gql => gql\`
query CourseBook($lessonId: ID!) {
excuseTypes {
name
shortName
}
lesson: lessonsById(id: $lessonId) {
groups {
name
shortName
members {
id
fullName
}
}
subject {
name
}
}
lessonDocumentations: lessonDocumentationsByLessonId(id: $lessonId) {
id
topic
homework
groupNote
period
date
personalNotes {
id
person {
id
fullName
}
late
absent
excused
excuseType {
name
shortName
}
remarks
extraMarks {
name
shortName
}
}
}
extraMarks {
name
shortName
}
}
\`"
:variables="{ lessonId }"
>
<template v-slot="{ result: { loading, error, data } }"> <template v-slot="{ result: { loading, error, data } }">
<!-- Error --> <!-- Error -->
<message-box v-if="error" type="error">An error occurred</message-box> <message-box v-if="error" type="error">An error occurred</message-box>
...@@ -133,6 +48,44 @@ export default { ...@@ -133,6 +48,44 @@ export default {
class="ma-auto" class="ma-auto"
></v-progress-circular> ></v-progress-circular>
</div> </div>
</template> </template>
</ApolloQuery>` </ApolloQuery>
</template>
<script>
import {CHANGES, SAVED, UPDATING} from "../../UpdateStatuses.js";
export default {
methods: {
processDataChange(event) {
this.status = CHANGES;
// alert("Probably save the data");
console.log(event);
setTimeout(() => {
this.status = UPDATING;
}, 500)
setTimeout(() => {
this.status = SAVED;
}, 1000)
},
updateManually(event) {
alert("Data sync triggered manually");
this.status = UPDATING;
setTimeout(() => {
this.status = SAVED;
}, 500)
}
},
props: ["lessonId"],
name: "course-book",
data: () => {
return {
ping: "ping",
status: SAVED,
// lessonId: 352
}
}
} }
</script>
...@@ -3,9 +3,9 @@ import Vue from "vue" ...@@ -3,9 +3,9 @@ import Vue from "vue"
import UpdateIndicator from "./components/alsijil/UpdateIndicator.js"; import UpdateIndicator from "./components/alsijil/UpdateIndicator.js";
import PersonalNotes from "./components/alsijil/PersonalNotes.js"; import PersonalNotes from "./components/alsijil/PersonalNotes.js";
import LessonDocumentation from "./components/alsijil/LessonDocumentation.js"; import LessonDocumentation from "./components/alsijil/LessonDocumentation.js";
import CourseBook from './components/alsijil/CourseBook.js' import CourseBook from './components/alsijil/CourseBook.vue'
Vue.component(UpdateIndicator.name, UpdateIndicator); Vue.component(UpdateIndicator.name, UpdateIndicator);
Vue.component(PersonalNotes.name, PersonalNotes); Vue.component(PersonalNotes.name, PersonalNotes);
Vue.component(LessonDocumentation.name, LessonDocumentation); Vue.component(LessonDocumentation.name, LessonDocumentation);
Vue.component(CourseBook.name, CourseBook); Vue.component(CourseBook.name, CourseBook);
\ No newline at end of file
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment