Initial commit from monorepo
This commit is contained in:
103
app/pages/select-location/map.vue
Normal file
103
app/pages/select-location/map.vue
Normal file
@@ -0,0 +1,103 @@
|
||||
<template>
|
||||
<NuxtLayout name="map">
|
||||
<template #sidebar>
|
||||
<CatalogMapSidebar
|
||||
:title="t('catalogMap.hubsTab')"
|
||||
:back-link="localePath('/select-location')"
|
||||
:back-label="t('catalogMap.actions.list_view')"
|
||||
:items-count="items.length"
|
||||
:filters="filters"
|
||||
:selected-filter="selectedFilter"
|
||||
:loading="isLoading"
|
||||
:empty-text="t('catalogMap.noHubs')"
|
||||
@update:selected-filter="selectedFilter = $event"
|
||||
>
|
||||
<template #cards>
|
||||
<HubCard
|
||||
v-for="hub in items"
|
||||
:key="hub.uuid"
|
||||
:hub="hub"
|
||||
selectable
|
||||
:is-selected="selectedItemId === hub.uuid"
|
||||
@select="selectItem(hub)"
|
||||
/>
|
||||
</template>
|
||||
</CatalogMapSidebar>
|
||||
</template>
|
||||
|
||||
<CatalogMap
|
||||
ref="mapRef"
|
||||
map-id="select-location-fullscreen-map"
|
||||
:items="itemsWithCoords"
|
||||
point-color="#10b981"
|
||||
@select-item="onMapSelectItem"
|
||||
/>
|
||||
</NuxtLayout>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { useLocationStore } from '~/stores/location'
|
||||
|
||||
definePageMeta({
|
||||
layout: false
|
||||
})
|
||||
|
||||
const router = useRouter()
|
||||
const route = useRoute()
|
||||
const { t } = useI18n()
|
||||
const localePath = useLocalePath()
|
||||
const locationStore = useLocationStore()
|
||||
const searchStore = useSearchStore()
|
||||
const isSearchMode = computed(() => route.query.mode === 'search')
|
||||
|
||||
const {
|
||||
items,
|
||||
selectedFilter,
|
||||
filters,
|
||||
isLoading,
|
||||
itemsWithCoords,
|
||||
init
|
||||
} = useCatalogHubs()
|
||||
|
||||
await init()
|
||||
|
||||
const mapRef = ref<{ flyTo: (lat: number, lng: number, zoom?: number) => void } | null>(null)
|
||||
const selectedItemId = ref<string | null>(null)
|
||||
|
||||
const selectItem = async (item: any) => {
|
||||
selectedItemId.value = item.uuid
|
||||
|
||||
if (item.latitude && item.longitude) {
|
||||
mapRef.value?.flyTo(item.latitude, item.longitude, 8)
|
||||
}
|
||||
|
||||
// Selection logic
|
||||
if (isSearchMode.value) {
|
||||
searchStore.setLocation(item.name)
|
||||
searchStore.setLocationUuid(item.uuid)
|
||||
if (route.query.after === 'request' && searchStore.searchForm.productUuid && searchStore.searchForm.locationUuid) {
|
||||
router.push({
|
||||
path: '/request',
|
||||
query: {
|
||||
productUuid: searchStore.searchForm.productUuid,
|
||||
product: searchStore.searchForm.product,
|
||||
locationUuid: searchStore.searchForm.locationUuid,
|
||||
location: searchStore.searchForm.location,
|
||||
quantity: searchStore.searchForm.quantity || undefined
|
||||
}
|
||||
})
|
||||
return
|
||||
}
|
||||
router.push(localePath('/select-location'))
|
||||
return
|
||||
}
|
||||
|
||||
const success = await locationStore.select('hub', item.uuid, item.name, item.latitude, item.longitude)
|
||||
if (success) router.push(localePath('/select-location'))
|
||||
}
|
||||
|
||||
const onMapSelectItem = (uuid: string) => {
|
||||
const item = items.value.find(h => h.uuid === uuid)
|
||||
if (item) selectItem(item)
|
||||
}
|
||||
</script>
|
||||
Reference in New Issue
Block a user