refactor: improve layout and styling in cutting forms for better user experience and responsiveness
This commit is contained in:
parent
d2ddc5e6b7
commit
da4467b500
@ -31,7 +31,7 @@ const page = usePage();
|
||||
<UserNav />
|
||||
</div>
|
||||
</header>
|
||||
<div class="flex min-w-0 flex-1 flex-col gap-4 overflow-y-auto p-4 pb-24 lg:pb-4">
|
||||
<div class="flex min-w-0 flex-1 flex-col gap-4 overflow-y-auto overflow-x-hidden p-4 pb-24 lg:pb-4">
|
||||
<slot />
|
||||
</div>
|
||||
</SidebarInset>
|
||||
|
||||
@ -265,7 +265,7 @@ function onProductCreated(product: CuttingProductCatalogItem) {
|
||||
|
||||
<template>
|
||||
<div class="grid min-w-0 gap-4 xl:grid-cols-[1fr_400px]">
|
||||
<div class="space-y-4">
|
||||
<div class="min-w-0 space-y-4">
|
||||
<CuttingPosMaterialCatalogPanel v-model:material-search="materialSearch"
|
||||
:filtered-raw-materials="filteredRawMaterials" :raw-material-catalog="rawMaterialCatalogState"
|
||||
:material-cart="materialCart" :get-material-cart-item="getMaterialCartItem" :units="units"
|
||||
|
||||
@ -77,7 +77,7 @@ function openCombination(rawMaterial: CuttingRawMaterialCatalogItem, price: Cutt
|
||||
</Empty>
|
||||
</div>
|
||||
|
||||
<div v-else class="columns-1 gap-4 sm:columns-2 xl:columns-3">
|
||||
<div v-else class="grid grid-cols-1 gap-4 md:grid-cols-2">
|
||||
<template v-for="rawMaterial in filteredRawMaterials" :key="rawMaterial.id">
|
||||
<PosCatalogCard v-if="rawMaterial.prices.length > 0"
|
||||
:title="rawMaterial.name" :cover-image="getFirstCoverImage(rawMaterial.prices)">
|
||||
|
||||
@ -98,7 +98,7 @@ function setCombinationResult(combinationId: number | undefined, value: string)
|
||||
Belum ada bahan baku dipilih.
|
||||
</div>
|
||||
|
||||
<div v-else class="scrollbar-thin max-h-80 space-y-3 overflow-y-auto overscroll-y-contain">
|
||||
<div v-else class="scrollbar-thin max-h-80 space-y-3 overflow-y-auto overflow-x-hidden overscroll-y-contain">
|
||||
<template v-for="group in materialGroups" :key="group.combinationId ?? `single-${group.items[0]?.index}`">
|
||||
<div v-if="group.type === 'combination'"
|
||||
class="rounded-lg border-2 border-dashed border-primary/30 p-3">
|
||||
|
||||
@ -41,7 +41,7 @@ const emit = defineEmits<{
|
||||
Belum ada produk hasil dipilih.
|
||||
</div>
|
||||
|
||||
<div v-else class="scrollbar-thin max-h-80 space-y-3 overflow-y-auto overscroll-y-contain">
|
||||
<div v-else class="scrollbar-thin max-h-80 space-y-3 overflow-y-auto overflow-x-hidden overscroll-y-contain">
|
||||
<div v-for="(item, index) in resultCart" :key="item.product_variant_id" class="rounded-lg border p-3">
|
||||
<div class="mb-2 flex items-start justify-between gap-2">
|
||||
<div class="min-w-0 flex-1">
|
||||
|
||||
Loading…
Reference in New Issue
Block a user