46 lines
1.3 KiB
Vue
46 lines
1.3 KiB
Vue
<script setup lang="ts">
|
|
import type { PerformanceCriteria } from "@/types";
|
|
|
|
interface Props {
|
|
criteria: PerformanceCriteria;
|
|
showState?: boolean;
|
|
}
|
|
|
|
const props = withDefaults(defineProps<Props>(), {
|
|
criteria: undefined,
|
|
showState: false,
|
|
});
|
|
</script>
|
|
|
|
<template>
|
|
<div class="flex flex-col lg:flex-row lg:items-center justify-between">
|
|
<div class="flex flex-row items-center">
|
|
<div v-if="showState" class="h-8 w-8 mr-4">
|
|
<it-icon-smiley-happy
|
|
v-if="criteria.completion_status === 'success'"
|
|
></it-icon-smiley-happy>
|
|
<it-icon-smiley-thinking
|
|
v-else-if="criteria.completion_status === 'fail'"
|
|
></it-icon-smiley-thinking>
|
|
<it-icon-smiley-neutral v-else></it-icon-smiley-neutral>
|
|
</div>
|
|
<div class="pr-5 lg:mr-10 mb-4 lg:mb-0">
|
|
<h4 class="text-bold mb-2">{{ criteria.title }}</h4>
|
|
<p>
|
|
Lerneinheit:
|
|
<a class="link" :href="criteria.learning_unit.frontend_url">
|
|
{{ criteria.learning_unit.title }}
|
|
</a>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<span class="whitespace-nowrap">
|
|
<a class="link" :href="criteria.learning_unit.frontend_url">
|
|
Sich nochmals einschätzen
|
|
</a>
|
|
</span>
|
|
</div>
|
|
</template>
|
|
|
|
<style lang="scss" scoped></style>
|