Fix catalog issues: quantity input, checkbox position, glass header
All checks were successful
Build Docker Image / build (push) Successful in 3m21s

1. Quantity input in Quote mode: replaced button with inline number input
2. Checkbox position: moved to left side (next to panel) instead of right
3. MapPanel glass header: fixed sticky positioning by moving negative margins to children
This commit is contained in:
Ruslan Bakiev
2026-01-24 11:40:33 +07:00
parent 690c76ac79
commit 4d018323e7
5 changed files with 50 additions and 27 deletions

View File

@@ -55,14 +55,23 @@
<div class="text-xs text-base-content/60">{{ $t('catalog.filters.hub') }}</div>
<div class="font-medium truncate text-base-content">{{ hubLabel || $t('catalog.quote.selectHub') }}</div>
</button>
<!-- Quantity segment -->
<button
class="flex-1 px-4 py-2 text-left hover:bg-base-200/50 transition-colors min-w-0"
@click="$emit('edit-token', 'quantity')"
>
<!-- Quantity segment (inline input) -->
<div class="flex-1 px-4 py-2 min-w-0">
<div class="text-xs text-base-content/60">{{ $t('catalog.filters.quantity') }}</div>
<div class="font-medium text-base-content">{{ quantity ? `${quantity} ${$t('units.t')}` : '—' }}</div>
</button>
<div class="flex items-center gap-1">
<input
v-model="localQuantity"
type="number"
min="0"
step="0.1"
placeholder="—"
class="w-16 font-medium bg-transparent outline-none text-base-content [appearance:textfield] [&::-webkit-outer-spin-button]:appearance-none [&::-webkit-inner-spin-button]:appearance-none"
@blur="$emit('update-quantity', localQuantity)"
@keyup.enter="$emit('update-quantity', localQuantity)"
/>
<span v-if="localQuantity" class="text-base-content/60 text-sm">{{ $t('units.t') }}</span>
</div>
</div>
<!-- Search button inside -->
<button
class="btn btn-primary btn-circle m-1"
@@ -328,6 +337,7 @@ defineEmits([
'edit-token',
'remove-token',
'update:search-query',
'update-quantity',
// Quote mode
'search',
'set-catalog-mode'
@@ -340,11 +350,16 @@ const { t } = useI18n()
const inputRef = ref<HTMLInputElement>()
const localSearchQuery = ref(props.searchQuery || '')
const localQuantity = ref(props.quantity || '')
watch(() => props.searchQuery, (val) => {
localSearchQuery.value = val || ''
})
watch(() => props.quantity, (val) => {
localQuantity.value = val || ''
})
const focusInput = () => {
inputRef.value?.focus()
}