dst/store
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor: enhance StockVerifyDialog layout by improving material display with thumbnails and better alignment for improved user interaction

Browse Source
This commit is contained in:
Yoga Pangestu 2026-07-05 16:28:42 +07:00
parent 60aae40575
commit 87adc68376
1 changed files with 23 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
resources/js/pages/admin/manage/stocks/table/StockVerifyDialog.vue
View File

@ -273,7 +273,29 @@ function submitVerify() {
</div>
<div class="space-y-2">
<div v-for="material in group.items" :key="material.id"
class="rounded-md border bg-background p-2.5">
class="flex items-center gap-3 rounded-md border bg-background p-2.5">
<div class="shrink-0">
<MediaThumbnailCell :items="material.images ?? material.raw_material_price?.images ?? []" :max-visible="1" />
</div>
<div class="min-w-0 flex-1">
<p class="truncate text-sm font-medium">
{{ material.raw_material_name || material.raw_material_price?.raw_material?.name }}
</p>
<p class="truncate text-xs text-muted-foreground">
{{ material.variant || material.raw_material_price?.variant }}
</p>
</div>
</div>
</div>
</div>
<template v-else>
<div v-for="material in group.items" :key="material.id"
class="flex items-center gap-3 rounded-lg border p-3">
<div class="shrink-0">
<MediaThumbnailCell :items="material.images ?? material.raw_material_price?.images ?? []" :max-visible="1" />
</div>
<div class="min-w-0 flex-1">
<p class="truncate text-sm font-medium">
{{ material.raw_material_name || material.raw_material_price?.raw_material?.name }}
</p>
@ -282,18 +304,6 @@ function submitVerify() {
</p>
</div>
</div>
</div>
<template v-else>
<div v-for="material in group.items" :key="material.id"
class="rounded-lg border p-3">
<p class="truncate text-sm font-medium">
{{ material.raw_material_name || material.raw_material_price?.raw_material?.name }}
</p>
<p class="truncate text-xs text-muted-foreground">
{{ material.variant || material.raw_material_price?.variant }}
</p>
</div>
</template>
</template>
</div>