diff --git a/aleksis/apps/alsijil/frontend/components/coursebook/Coursebook.vue b/aleksis/apps/alsijil/frontend/components/coursebook/Coursebook.vue index 4e673db88090f473f2bc036bd128881327d21fc3..86b2a5fa258db6f0d4e4e077219e65105fde2816 100644 --- a/aleksis/apps/alsijil/frontend/components/coursebook/Coursebook.vue +++ b/aleksis/apps/alsijil/frontend/components/coursebook/Coursebook.vue @@ -1,67 +1,70 @@ <template> - <c-r-u-d-iterator - i18n-key="alsijil.coursebook" - :gql-query="gqlQuery" - :gql-additional-query-args="gqlQueryArgs" - :enable-create="false" - :enable-edit="false" - :elevated="false" - @lastQuery="lastQuery = $event" - ref="iterator" - fixed-header - disable-pagination - hide-default-footer - use-deep-search - > - <template #additionalActions="{ attrs, on }"> - <coursebook-filters v-model="filters" /> - </template> - <template #default="{ items }"> - <coursebook-loader /> - <coursebook-day - v-for="{ date, docs, first, last } in groupDocsByDay(items)" - v-intersect="{ - handler: intersectHandler(date, first, last), - options: { - rootMargin: '-' + topMargin + 'px 0px 0px 0px', - threshold: [0, 1], - }, - }" - :date="date" - :docs="docs" - :lastQuery="lastQuery" - :focus-on-mount="initDate && initDate.toMillis() === date.toMillis()" - @init="transition" - :key="'day-' + date" - ref="days" - /> - <coursebook-loader /> + <div> + <c-r-u-d-iterator + i18n-key="alsijil.coursebook" + :gql-query="gqlQuery" + :gql-additional-query-args="gqlQueryArgs" + :enable-create="false" + :enable-edit="false" + :elevated="false" + @lastQuery="lastQuery = $event" + ref="iterator" + fixed-header + disable-pagination + hide-default-footer + use-deep-search + > + <template #additionalActions="{ attrs, on }"> + <coursebook-filters v-model="filters" /> + </template> + <template #default="{ items }"> + <coursebook-loader /> + <coursebook-day + v-for="{ date, docs, first, last } in groupDocsByDay(items)" + v-intersect="{ + handler: intersectHandler(date, first, last), + options: { + rootMargin: '-' + topMargin + 'px 0px 0px 0px', + threshold: [0, 1], + }, + }" + :date="date" + :docs="docs" + :lastQuery="lastQuery" + :focus-on-mount="initDate && initDate.toMillis() === date.toMillis()" + @init="transition" + :key="'day-' + date" + ref="days" + /> + <coursebook-loader /> - <date-select-footer - :value="currentDate" - @input="gotoDate" - @prev="gotoPrev" - @next="gotoNext" - /> - </template> - <template #loading> - <coursebook-loader :number-of-days="10" :number-of-docs="5" /> - </template> + <date-select-footer + :value="currentDate" + @input="gotoDate" + @prev="gotoPrev" + @next="gotoNext" + /> + </template> + <template #loading> + <coursebook-loader :number-of-days="10" :number-of-docs="5" /> + </template> - <template #no-data> - <CoursebookEmptyMessage icon="mdi-book-off-outline"> - {{ $t("alsijil.coursebook.no_data") }} - </CoursebookEmptyMessage> - </template> + <template #no-data> + <CoursebookEmptyMessage icon="mdi-book-off-outline"> + {{ $t("alsijil.coursebook.no_data") }} + </CoursebookEmptyMessage> + </template> - <template #no-results> - <CoursebookEmptyMessage icon="mdi-book-alert-outline"> - {{ - $t("alsijil.coursebook.no_results", { search: $refs.iterator.search }) - }} - </CoursebookEmptyMessage> - </template> - </c-r-u-d-iterator> + <template #no-results> + <CoursebookEmptyMessage icon="mdi-book-alert-outline"> + {{ + $t("alsijil.coursebook.no_results", { search: $refs.iterator.search }) + }} + </CoursebookEmptyMessage> + </template> + </c-r-u-d-iterator> + <absence-creation-dialog /> + </div> </template> <script> @@ -74,6 +77,8 @@ import CoursebookFilters from "./CoursebookFilters.vue"; import CoursebookLoader from "./CoursebookLoader.vue"; import CoursebookEmptyMessage from "./CoursebookEmptyMessage.vue"; +import AbsenceCreationDialog from "./absences/AbsenceCreationDialog.vue"; + export default { name: "Coursebook", components: { @@ -83,6 +88,7 @@ export default { CRUDIterator, DateSelectFooter, CoursebookDay, + AbsenceCreationDialog, }, props: { filterType: {