95 lines
3.0 KiB
Vue
95 lines
3.0 KiB
Vue
<template>
|
|
<div v-if="!loading" class="bg-gray-200">
|
|
<div class="container-large">
|
|
<nav class="py-4 pb-4">
|
|
<router-link
|
|
class="btn-text inline-flex items-center pl-0"
|
|
:to="`/course/${props.courseSlug}/cockpit`"
|
|
>
|
|
<it-icon-arrow-left />
|
|
<span>{{ $t("general.back") }}</span>
|
|
</router-link>
|
|
</nav>
|
|
<main v-if="feedbackData">
|
|
<div class="flex items-center justify-between">
|
|
<h2 class="mb-2">{{ $t("feedback.feedbackPageTitle") }}</h2>
|
|
<button
|
|
v-if="feedbackType == 'uk'"
|
|
class="flex"
|
|
data-cy="export-button"
|
|
@click="exportData"
|
|
>
|
|
<it-icon-export></it-icon-export>
|
|
<span class="ml inline-block">{{ $t("a.Als Excel exportieren") }}</span>
|
|
</button>
|
|
</div>
|
|
<p class="mb-10">
|
|
<span class="font-bold" data-cy="feedback-data-amount">
|
|
{{ feedbackData.amount }}
|
|
</span>
|
|
{{ $t("feedback.feedbackPageInfo") }}
|
|
</p>
|
|
<FeedbackPageVV v-if="feedbackType === 'vv'" :feedback-data="feedbackData" />
|
|
<FeedbackPageUK
|
|
v-else-if="feedbackType === 'uk'"
|
|
:feedback-data="feedbackData"
|
|
/>
|
|
</main>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { useCurrentCourseSession } from "@/composables";
|
|
import { itGet } from "@/fetchHelpers";
|
|
import * as log from "loglevel";
|
|
import { onMounted, ref } from "vue";
|
|
import type { FeedbackData, FeedbackType } from "@/types";
|
|
import FeedbackPageVV from "@/pages/cockpit/FeedbackPageVV.vue";
|
|
import FeedbackPageUK from "@/pages/cockpit/FeedbackPageUK.vue";
|
|
import { useExpertCockpitPageData } from "@/pages/cockpit/cockpitPage/composables";
|
|
import { exportFeedback } from "@/services/dashboard";
|
|
import { useUserStore } from "@/stores/user";
|
|
import { openDataAsXls } from "@/utils/export";
|
|
|
|
const props = defineProps<{
|
|
courseSlug: string;
|
|
circleId: string;
|
|
}>();
|
|
|
|
log.debug("FeedbackPage created", props.circleId);
|
|
const { loading } = useExpertCockpitPageData(props.courseSlug);
|
|
const courseSession = useCurrentCourseSession();
|
|
const userStore = useUserStore();
|
|
|
|
const feedbackData = ref<FeedbackData | undefined>(undefined);
|
|
const feedbackType = ref<FeedbackType | undefined>(undefined);
|
|
|
|
async function exportData() {
|
|
const data = await exportFeedback(
|
|
{
|
|
courseSessionIds: [Number(courseSession.value.id)],
|
|
circleIds: [Number(props.circleId)],
|
|
},
|
|
userStore.language
|
|
);
|
|
openDataAsXls(data.encoded_data, data.file_name);
|
|
}
|
|
|
|
onMounted(async () => {
|
|
log.debug("FeedbackPage mounted");
|
|
feedbackData.value = await itGet(
|
|
`/api/core/feedback/${courseSession.value.id}/${props.circleId}`
|
|
);
|
|
log.debug("FeedbackPage feedbackData", feedbackData.value);
|
|
if (
|
|
feedbackData.value &&
|
|
["uk", "vv"].includes(feedbackData.value?.feedbackType ?? "")
|
|
) {
|
|
feedbackType.value = feedbackData.value.feedbackType;
|
|
}
|
|
});
|
|
</script>
|
|
|
|
<style scoped></style>
|