31 lines
1.1 KiB
Vue
31 lines
1.1 KiB
Vue
<script setup>
|
|
defineProps({
|
|
inventory: { type: Array, required: true },
|
|
missingImages: { type: Number, default: 0 },
|
|
});
|
|
</script>
|
|
|
|
<template>
|
|
<section id="workflow-images" class="inventory-images-step" aria-labelledby="inventory-images-step-title">
|
|
<div class="inventory-images-step__header">
|
|
<div>
|
|
<p class="catalog-kicker">Step 4</p>
|
|
<h2 id="inventory-images-step-title">Add Images</h2>
|
|
<p class="inventory-images-step__intro">Add clear photos to each physical copy before publishing its listing.</p>
|
|
</div>
|
|
<span class="inventory-images-step__count">{{ missingImages }} missing</span>
|
|
</div>
|
|
<p v-if="!inventory.length" class="state state--empty">Create a physical copy before adding images.</p>
|
|
<ul v-else class="inventory-images-step__list">
|
|
<li v-for="item in inventory" :key="item.id">
|
|
<span>{{ item.id }} · {{ item.status }}</span>
|
|
<a :href="`/admin/inventory/${item.id}/images`">Manage images</a>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
</template>
|
|
|
|
<style scoped lang="scss">
|
|
@use './InventoryImagesStep.scss';
|
|
</style>
|