62 lines
1.7 KiB
Vue
62 lines
1.7 KiB
Vue
<template>
|
|
<article class="card">
|
|
<hgroup class="order-last">
|
|
<h3 class="card__title | font-serif | text-lg">
|
|
<router-link :to="uri" class="link-full">
|
|
{{ pdf.label.length ? pdf.label : pdf.name.replace(".pdf", "") }}
|
|
</router-link>
|
|
</h3>
|
|
</hgroup>
|
|
|
|
<DateTime :date="pdf.modified" />
|
|
|
|
<template v-if="hasImage">
|
|
<figure
|
|
v-if="pdf.cover"
|
|
class="card__images pdf-cover"
|
|
style="aspect-ratio: unset"
|
|
>
|
|
<img :src="pdf.cover" alt="" />
|
|
</figure>
|
|
<div v-else class="card__images" data-icon="document"></div>
|
|
</template>
|
|
|
|
<footer
|
|
v-if="pdf.comments?.length > 0"
|
|
class="order-last | text-sm text-primary font-medium"
|
|
>
|
|
<router-link :to="'/' + step.uri + '&comments=true'">
|
|
{{ pdf.comments.length }} commentaire{{
|
|
pdf.comments.length > 1 ? "s" : ""
|
|
}}
|
|
</router-link>
|
|
</footer>
|
|
<div class="btn btn--xs btn--dtl | mt-16" v-if="isDesignToLightStep(step)" data-icon="leaf" lang="en">Design to Light</div>
|
|
</article>
|
|
</template>
|
|
<script setup>
|
|
import { useRoute } from "vue-router";
|
|
import DateTime from "./DateTime.vue";
|
|
import { computed } from "vue";
|
|
import { useDesignToLightStore } from "../../../stores/designToLight";
|
|
|
|
const { step, pdf, index } = defineProps({
|
|
step: Object,
|
|
pdf: Object,
|
|
index: Number,
|
|
hasImage: {
|
|
default: true,
|
|
type: Boolean,
|
|
},
|
|
});
|
|
|
|
const { isDesignToLightStep } = useDesignToLightStore();
|
|
|
|
const route = useRoute();
|
|
|
|
const uri = computed(() => {
|
|
const fileIndex =
|
|
index ?? step.files.findIndex((file) => file.type === "document");
|
|
return `${route.fullPath}?dialog=${step.slug}&fileIndex=${fileIndex}`;
|
|
});
|
|
</script>
|