vbv/client/src/pages/learningPath/learningContentPage/LearningContentPage.vue

52 lines
1.5 KiB
Vue

<script setup lang="ts">
import LearningContentParent from "@/pages/learningPath/learningContentPage/LearningContentParent.vue";
import * as log from "loglevel";
import { computed, getCurrentInstance, onUpdated } from "vue";
import { useLearningPathWithCompletion } from "@/composables";
import { stringifyParse } from "@/utils/utils";
const props = defineProps<{
courseSlug: string;
circleSlug: string;
contentSlug: string;
}>();
log.debug("LearningContentView created", stringifyParse(props));
const courseData = useLearningPathWithCompletion(props.courseSlug);
const learningContent = computed(() =>
courseData.findLearningContent(props.contentSlug, props.circleSlug)
);
const circle = computed(() => {
return courseData.findCircle(props.circleSlug);
});
onUpdated(() => {
const vueInstance = getCurrentInstance();
if (vueInstance) {
// VBV-489: open external links in new tab
const rootElement: HTMLElement = vueInstance.proxy?.$el;
const anchors = rootElement.querySelectorAll("a");
anchors.forEach((anchor: HTMLAnchorElement) => {
if (
/^https?:\/\//i.test(anchor.href) &&
!anchor.href.includes(window.location.hostname)
) {
anchor.setAttribute("target", "_blank");
anchor.setAttribute("rel", "noopener noreferrer");
}
});
}
});
</script>
<template>
<LearningContentParent
v-if="learningContent && circle"
:learning-content="learningContent"
:circle="circle"
/>
</template>
<style lang="postcss" scoped></style>