refactor: update product label in CuttingPosResultCatalogPanel for clarity and streamline component structure
Some checks are pending
linter / quality (push) Waiting to run
tests / ci (8.3) (push) Waiting to run
tests / ci (8.4) (push) Waiting to run
tests / ci (8.5) (push) Waiting to run

This commit is contained in:
Yoga Pangestu 2026-07-05 22:27:23 +07:00
parent 318de0ba30
commit 42d4bc05bc

View File

@ -40,7 +40,7 @@ const quickCreateOpen = ref(false);
<template> <template>
<Card class="min-w-0"> <Card class="min-w-0">
<CardHeader class="flex flex-row items-center justify-between pb-3 space-y-0"> <CardHeader class="flex flex-row items-center justify-between pb-3 space-y-0">
<CardTitle class="text-base">Pilih Produk Hasil</CardTitle> <CardTitle class="text-base">Pilih Nama Produk</CardTitle>
<Button type="button" variant="outline" size="sm" @click="quickCreateOpen = true"> <Button type="button" variant="outline" size="sm" @click="quickCreateOpen = true">
<Plus class="size-3.5 mr-1" /> <Plus class="size-3.5 mr-1" />
Baru Baru
@ -65,27 +65,18 @@ const quickCreateOpen = ref(false);
</div> </div>
<div v-else class="grid grid-cols-1 gap-4 sm:grid-cols-2"> <div v-else class="grid grid-cols-1 gap-4 sm:grid-cols-2">
<PosCatalogCard <PosCatalogCard v-for="product in filteredProducts" :key="product.id" :title="product.name"
v-for="product in filteredProducts" :cover-image="getFirstCoverImage(product.variants)">
:key="product.id"
:title="product.name"
:cover-image="getFirstCoverImage(product.variants)"
>
<p v-if="!product.variants.length" class="px-3 py-4 text-sm text-muted-foreground"> <p v-if="!product.variants.length" class="px-3 py-4 text-sm text-muted-foreground">
Belum ada varian Belum ada varian
</p> </p>
<div <div v-for="variant in product.variants" :key="variant.id"
v-for="variant in product.variants" class="flex items-center gap-2.5 px-3 py-2.5 transition-all duration-200" :class="[
:key="variant.id"
class="flex items-center gap-2.5 px-3 py-2.5 transition-all duration-200"
:class="[
'cursor-pointer hover:bg-muted/30', 'cursor-pointer hover:bg-muted/30',
getResultCartItem(variant.id) getResultCartItem(variant.id)
? 'mx-1 my-0.5 rounded-md border-2 border-primary bg-primary/5' ? 'mx-1 my-0.5 rounded-md border-2 border-primary bg-primary/5'
: '', : '',
]" ]" @click="!getResultCartItem(variant.id) && emit('add-result', product, variant)">
@click="!getResultCartItem(variant.id) && emit('add-result', product, variant)"
>
<PosCatalogVariantThumb :items="variant.images" /> <PosCatalogVariantThumb :items="variant.images" />
<div class="min-w-0 flex-1"> <div class="min-w-0 flex-1">
<p class="truncate text-sm font-medium"> <p class="truncate text-sm font-medium">
@ -100,46 +91,28 @@ const quickCreateOpen = ref(false);
<span class="text-primary mr-1"> <span class="text-primary mr-1">
<Check class="size-4" /> <Check class="size-4" />
</span> </span>
<Button <Button type="button" variant="outline" size="icon-sm"
type="button"
variant="outline"
size="icon-sm"
class="hover:text-destructive hover:bg-destructive/10" class="hover:text-destructive hover:bg-destructive/10"
@click.stop="emit('decrease-result-qty', variant.id)" @click.stop="emit('decrease-result-qty', variant.id)">
>
<Minus class="size-3.5" /> <Minus class="size-3.5" />
</Button> </Button>
</template> </template>
<template v-else> <template v-else>
<Button <Button type="button" variant="outline" size="icon-sm"
type="button" @click.stop="emit('decrease-result-qty', variant.id)">
variant="outline"
size="icon-sm"
@click.stop="emit('decrease-result-qty', variant.id)"
>
<Minus class="size-3.5" /> <Minus class="size-3.5" />
</Button> </Button>
<span class="min-w-5 text-center text-xs font-semibold tabular-nums"> <span class="min-w-5 text-center text-xs font-semibold tabular-nums">
{{ getResultCartItem(variant.id)!.cutting_result }} {{ getResultCartItem(variant.id)!.cutting_result }}
</span> </span>
<Button <Button type="button" variant="outline" size="icon-sm"
type="button" @click.stop="emit('add-result', product, variant)">
variant="outline"
size="icon-sm"
@click.stop="emit('add-result', product, variant)"
>
<Plus class="size-3.5" /> <Plus class="size-3.5" />
</Button> </Button>
</template> </template>
</div> </div>
<Button <Button v-else type="button" variant="outline" size="icon-sm" class="shrink-0"
v-else @click.stop="emit('add-result', product, variant)">
type="button"
variant="outline"
size="icon-sm"
class="shrink-0"
@click.stop="emit('add-result', product, variant)"
>
<Plus class="size-3.5" /> <Plus class="size-3.5" />
</Button> </Button>
</div> </div>
@ -149,10 +122,6 @@ const quickCreateOpen = ref(false);
</CardContent> </CardContent>
</Card> </Card>
<QuickCreateProductModal <QuickCreateProductModal v-model:open="quickCreateOpen" :categories="categories" :selected-materials="materialCart"
v-model:open="quickCreateOpen" @created="emit('product-created', $event)" />
:categories="categories"
:selected-materials="materialCart"
@created="emit('product-created', $event)"
/>
</template> </template>