skillbox/client/src/components/StudentSubmissionDocument.vue

44 lines
879 B
Vue

<template>
<div class="submission-document">
<p
class="submission-document__content content"
v-if="document && document.length > 0">
<document-icon class="content__icon"/><span class="content__text">{{ filename }}</span>
</p>
</div>
</template>
<script>
import filenameFromUrl from '@/helpers/urls';
const DocumentIcon = () => import(/* webpackChunkName: "icons" */'@/components/icons/DocumentIcon');
export default {
name: 'StudentSubmissionDocument',
props: ['document'],
components: { DocumentIcon },
computed: {
filename() {
return filenameFromUrl(this.document);
}
},
};
</script>
<style scoped lang="scss">
.content {
display: flex;
&__icon {
width: 25px;
align-self: center;
}
&__text {
align-self: center;
padding-left: 5px;
}
}
</style>