studio-variable/designtopack
3
0
Fork 0
Code Issues 7 Pull requests Projects Releases Packages Wiki Activity Actions

kanban : prepare empty states

Browse source
This commit is contained in:
isUnknown 2024-11-21 18:10:24 +01:00
parent d4c2f9e408
commit 91233e6672
2 changed files with 100 additions and 87 deletions
Download patch file Download diff file Expand all files Collapse all files

2
public/content/projects/1_miss-dior-blooming-bouquet/3_extended-brief/extended-brief.txt
View file

@ -6,7 +6,7 @@ Stepname: extendedBrief
----
Pdf: - file://znIEFNoLyfGe7Lw4
Pdf:
----

185
src/components/project/ProjectStep.vue
View file

@ -9,112 +9,125 @@
<span :data-icon="step.id">{{ step.label }}</span>
</h2>
<div class="cards | flow">
<article class="card" v-if="step.id !== 'proposal'">
<hgroup class="order-last">
<h3 class="card__title | font-serif | text-lg">
<router-link :to="'/' + step.uri" class="link-full">{{
step.label
}}</router-link>
</h3>
</hgroup>
<div class="card__meta | flex">
<time
class="card__date | text-grey-700"
:datetime="dayjs(step.modified).format('YYYY-M-DD')"
>{{ dayjs(step.modified).format("DD MMMM YYYY") }}</time
>
</div>
<!-- All images -->
<figure
v-if="step.id.includes('Brief') && step.files[0]?.type === 'image'"
class="card__images"
:data-count="step.files.dynamic.length"
:data-plus="
step.files.dynamic.length > 3
? step.files.dynamic.length - 3
: undefined
"
>
<img
v-for="image in step.files.dynamic.slice(0, 3)"
:key="image.uuid"
:src="image.url"
:alt="image.alt"
/>
</figure>
<figure
v-if="step.id === 'virtualSample'"
class="card__images"
:data-count="step.files.dynamic.length"
:data-plus="
step.files.dynamic.length > 3
? step.files.dynamic.length - 3
: undefined
"
>
<img
v-for="track in step.files.dynamic"
:key="track.files[0].slug"
:src="track.files[0].url"
:alt="track.files[0].alt"
/>
</figure>
<!-- Document -->
<div
v-if="step.files[0]?.type === 'document'"
class="card__images"
data-icon="document"
></div>
<footer
v-if="step?.files[0]?.comments?.length > 0"
class="order-last | text-sm text-primary font-medium"
>
{{ step.files[0].comments.length }} commentaire{{
step.files[0].comments.length > 1 ? "s" : ""
}}
</footer>
</article>
<template v-if="step.id == 'proposal' && step.files.length">
<article
class="card"
v-for="(file, index) in step.files"
:key="file.name"
>
<template
v-if="
step.id === 'clientBrief' ||
step.files.dynamic ||
step.files.static ||
step.files.length
"
>
<article class="card" v-if="step.id !== 'proposal'">
<hgroup class="order-last">
<h3 class="card__title | font-serif | text-lg">
<router-link
:to="'/' + step.uri + '&fileIndex=' + index"
class="link-full"
>
{{
file.label.length ? file.label : file.name.replace(".pdf", "")
}}
</router-link>
<router-link :to="'/' + step.uri" class="link-full">{{
step.label
}}</router-link>
</h3>
</hgroup>
<div class="card__meta | flex">
<time
class="card__date | text-grey-700"
:datetime="dayjs(file.modified).format('YYYY-M-DD')"
>{{ dayjs(file.modified).format("DD MMMM YYYY") }}</time
:datetime="dayjs(step.modified).format('YYYY-M-DD')"
>{{ dayjs(step.modified).format("DD MMMM YYYY") }}</time
>
</div>
<!-- All images -->
<figure
v-if="step.id.includes('Brief') && step.files[0]?.type === 'image'"
class="card__images"
:data-count="step.files.dynamic.length"
:data-plus="
step.files.dynamic.length > 3
? step.files.dynamic.length - 3
: undefined
"
>
<img
v-for="image in step.files.dynamic.slice(0, 3)"
:key="image.uuid"
:src="image.url"
:alt="image.alt"
/>
</figure>
<figure
v-if="step.id === 'virtualSample'"
class="card__images"
:data-count="step.files.dynamic.length"
:data-plus="
step.files.dynamic.length > 3
? step.files.dynamic.length - 3
: undefined
"
>
<img
v-for="track in step.files.dynamic"
:key="track.files[0].slug"
:src="track.files[0].url"
:alt="track.files[0].alt"
/>
</figure>
<!-- Document -->
<div
v-if="index === 0"
v-if="step.files[0]?.type === 'document'"
class="card__images"
data-icon="document"
></div>
<footer
v-if="file.comments?.length > 0"
v-if="step?.files[0]?.comments?.length > 0"
class="order-last | text-sm text-primary font-medium"
>
{{ file.comments.length }} commentaire{{
file.comments.length > 1 ? "s" : ""
{{ step.files[0].comments.length }} commentaire{{
step.files[0].comments.length > 1 ? "s" : ""
}}
</footer>
</article>
<template v-if="step.id == 'proposal' && step.files.length">
<article
class="card"
v-for="(file, index) in step.files"
:key="file.name"
>
<hgroup class="order-last">
<h3 class="card__title | font-serif | text-lg">
<router-link
:to="'/' + step.uri + '&fileIndex=' + index"
class="link-full"
>
{{
file.label.length
? file.label
: file.name.replace(".pdf", "")
}}
</router-link>
</h3>
</hgroup>
<div class="card__meta | flex">
<time
class="card__date | text-grey-700"
:datetime="dayjs(file.modified).format('YYYY-M-DD')"
>{{ dayjs(file.modified).format("DD MMMM YYYY") }}</time
>
</div>
<div
v-if="index === 0"
class="card__images"
data-icon="document"
></div>
<footer
v-if="file.comments?.length > 0"
class="order-last | text-sm text-primary font-medium"
>
{{ file.comments.length }} commentaire{{
file.comments.length > 1 ? "s" : ""
}}
</footer>
</article>
</template>
</template>
<!-- Empty state -->
<template v-else> </template>
</div>
</section>
</template>