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

refactor: simplify selected materials management in CuttingPosCombinationDialog; streamline removal logic and enhance layout for better responsiveness and user interaction
Some checks are pending
linter / quality (push) Waiting to run
Details
tests / ci (8.3) (push) Waiting to run
Details
tests / ci (8.4) (push) Waiting to run
Details
tests / ci (8.5) (push) Waiting to run
Details

Browse Source
This commit is contained in:
Yoga Pangestu 2026-07-05 14:53:41 +07:00
parent 2a49018c5e
commit 0f9865ffb3
1 changed files with 26 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

48
resources/js/pages/admin/manage/cuttings/form/CuttingPosCombinationDialog.vue
View File

@ -79,9 +79,7 @@ function toggleVariant(rawMaterial: CuttingRawMaterialCatalogItem, price: Cuttin
);
if (index !== -1) {
if (!selectedMaterials.value[index].is_initial) {
selectedMaterials.value.splice(index, 1);
}
selectedMaterials.value.splice(index, 1);
} else {
selectedMaterials.value.push({
raw_material_price_id: price.id,
@ -99,7 +97,7 @@ function toggleVariant(rawMaterial: CuttingRawMaterialCatalogItem, price: Cuttin
function removeSelected(priceId: number) {
selectedMaterials.value = selectedMaterials.value.filter(
(item) => item.raw_material_price_id !== priceId || item.is_initial,
(item) => item.raw_material_price_id !== priceId,
);
}
@ -183,26 +181,32 @@ watch(open, (value) => {
<p class="text-sm font-medium">Bahan Baku Terpilih ({{ selectedMaterials.length }})</p>
<div class="space-y-2">
<div v-for="item in selectedMaterials" :key="item.raw_material_price_id"
class="flex items-center gap-2 rounded-md border p-2"
class="flex flex-col gap-2 rounded-md border p-2 sm:flex-row sm:items-center"
:class="item.is_initial ? 'border-primary bg-primary/5' : ''">
<PosCatalogVariantThumb :items="item.images" />
<div class="min-w-0 flex-1">
<p class="truncate text-sm font-medium">
{{ item.raw_material_name }} - {{ item.variant }}
</p>
<Badge variant="outline" class="text-xs mt-0.5 select-none font-normal">
Stok: {{ item.stock_formatted }}
</Badge>
<div class="flex items-center gap-2 flex-1 min-w-0">
<PosCatalogVariantThumb :items="item.images" />
<div class="min-w-0 flex-1">
<p class="truncate text-sm font-medium">
{{ item.raw_material_name }} - {{ item.variant }}
</p>
<Badge variant="outline" class="text-xs mt-0.5 select-none font-normal">
Stok: {{ item.stock_formatted }}
</Badge>
</div>
<Button type="button" variant="ghost" size="icon-sm"
class="text-destructive shrink-0 sm:hidden" @click="removeSelected(item.raw_material_price_id)">
<X class="size-3.5" />
</Button>
</div>
<div class="flex items-center gap-1" @click.stop>
<div class="flex items-center gap-2 sm:gap-1">
<Label class="text-xs whitespace-nowrap">Pemakaian:</Label>
<DecimalInput v-model="item.material_usage" class="h-7 w-20" />
<span class="text-xs text-muted-foreground">{{ item.unit_abbreviation }}</span>
<Button type="button" variant="ghost" size="icon-sm"
class="text-destructive shrink-0 hidden sm:inline-flex" @click="removeSelected(item.raw_material_price_id)">
<X class="size-3.5" />
</Button>
</div>
<Button v-if="!item.is_initial" type="button" variant="ghost" size="icon-sm"
class="text-destructive" @click="removeSelected(item.raw_material_price_id)">
<X class="size-3.5" />
</Button>
</div>
</div>
</div>
@ -255,8 +259,8 @@ watch(open, (value) => {
</div>
</div>
<div class="flex items-center justify-between border-t pt-4">
<div class="flex items-center gap-3">
<div class="flex flex-col gap-3 border-t pt-4 sm:flex-row sm:items-center sm:justify-between">
<div class="flex flex-wrap items-center gap-3">
<div class="flex items-center gap-2">
<Label class="text-sm whitespace-nowrap">Hasil:</Label>
<NumberInput v-model="combinationResult" class="h-8 w-20" placeholder="0" />
@ -267,10 +271,10 @@ watch(open, (value) => {
</p>
</div>
<div class="flex gap-2">
<Button type="button" variant="outline" :disabled="loading" @click="open = false">
<Button type="button" variant="outline" class="flex-1 sm:flex-none" :disabled="loading" @click="open = false">
Batal
</Button>
<Button type="button" :disabled="loading || selectedMaterials.length < 2" @click="submit">
<Button type="button" class="flex-1 sm:flex-none" :disabled="loading || selectedMaterials.length < 2" @click="submit">
<Layers class="size-4 mr-1" />
{{ loading ? 'Menyimpan...' : 'Simpan Kombinasi' }}
</Button>