Simplify catalog UI - remove chips, add drawer for list
All checks were successful
Build Docker Image / build (push) Successful in 3m59s
All checks were successful
Build Docker Image / build (push) Successful in 3m59s
- Remove product/hub chips from QuoteForm.vue (duplicate of toggle) - Add drawer state to useCatalogSearch.ts (isDrawerOpen, selectDrawerItem, applyDrawerFilter) - Convert SelectionPanel to drawer with header, scrollable content, and footer - Add "Список" button to CatalogPage.vue to open drawer - Add "Применить фильтр" button in drawer footer - Add slide animations for drawer (left on desktop, up on mobile) - Update translations: catalog.list, catalog.applyFilter
This commit is contained in:
@@ -260,6 +260,47 @@ export function useCatalogSearch() {
|
||||
mapViewCookie.value = mode
|
||||
}
|
||||
|
||||
// Drawer state for list view
|
||||
const isDrawerOpen = ref(false)
|
||||
const drawerSelectedItem = ref<{ uuid: string; name: string } | null>(null)
|
||||
|
||||
const openDrawer = () => {
|
||||
isDrawerOpen.value = true
|
||||
drawerSelectedItem.value = null
|
||||
|
||||
// Set selectMode based on mapViewMode so SelectionPanel shows the right list
|
||||
const newSelectMode: SelectMode = mapViewMode.value === 'hubs' ? 'hub'
|
||||
: mapViewMode.value === 'suppliers' ? 'supplier'
|
||||
: 'product'
|
||||
startSelect(newSelectMode)
|
||||
}
|
||||
|
||||
const closeDrawer = () => {
|
||||
isDrawerOpen.value = false
|
||||
drawerSelectedItem.value = null
|
||||
cancelSelect() // Also exit selection mode
|
||||
}
|
||||
|
||||
const selectDrawerItem = (uuid: string, name: string) => {
|
||||
drawerSelectedItem.value = { uuid, name }
|
||||
}
|
||||
|
||||
const applyDrawerFilter = () => {
|
||||
if (!drawerSelectedItem.value) {
|
||||
closeDrawer()
|
||||
return
|
||||
}
|
||||
|
||||
// Determine filter type based on mapViewMode
|
||||
const type = mapViewMode.value === 'hubs' ? 'hub'
|
||||
: mapViewMode.value === 'suppliers' ? 'supplier'
|
||||
: 'product' // offers -> select product from offer
|
||||
|
||||
const { uuid, name } = drawerSelectedItem.value
|
||||
selectItem(type, uuid, name)
|
||||
closeDrawer()
|
||||
}
|
||||
|
||||
// Catalog mode: explore (map browsing) or quote (search for offers)
|
||||
const catalogMode = computed<CatalogMode>(() => {
|
||||
return route.query.mode === 'quote' ? 'quote' : 'explore'
|
||||
@@ -292,6 +333,10 @@ export function useCatalogSearch() {
|
||||
searchQuery,
|
||||
mapViewMode,
|
||||
|
||||
// Drawer state
|
||||
isDrawerOpen,
|
||||
drawerSelectedItem,
|
||||
|
||||
// Colors
|
||||
entityColors,
|
||||
|
||||
@@ -317,6 +362,12 @@ export function useCatalogSearch() {
|
||||
setMapViewMode,
|
||||
setCatalogMode,
|
||||
|
||||
// Drawer actions
|
||||
openDrawer,
|
||||
closeDrawer,
|
||||
selectDrawerItem,
|
||||
applyDrawerFilter,
|
||||
|
||||
// Labels cache
|
||||
filterLabels
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user