карты пвз

composables/useCheckout.ts

@@ -5,8 +5,6 @@ export const useCheckout = createSharedComposable(() => {
   const router = useRouter()
   const route = useRoute()
 
-  const isPickupPointSelected = ref(false)
-
   const checkoutPickupPoint = useStorage<PickupPoint | undefined>(
     'checkout-pickupPoint',
     undefined,
@@ -23,6 +21,8 @@ export const useCheckout = createSharedComposable(() => {
     checkoutPickupPoint.value = point
   }
 
+  const isPickupPointSelected = computed(() => !!checkoutPickupPoint.value)
+
   const checkoutContacts = useStorage('checkout-contacts', { name: '', surname: '', phone: '', email: '' })
 
   const setCheckoutContacts = (data: { name: string, surname: string, phone: string, email: string }) => {
@@ -49,7 +49,6 @@ export const useCheckout = createSharedComposable(() => {
 
   function previewStep() {
     if (isPickupPointSelected.value) {
-      isPickupPointSelected.value = false
       setCheckoutPickupPoint(undefined)
       return
     }

pages/checkout/delivery.vue

@@ -28,7 +28,7 @@
             v-for="pickupPoint in filteredPoints"
             :key="pickupPoint.id"
             class="pickup-point-card"
-            @click="selectedPickupPoint = pickupPoint"
+            @click="checkoutPickupPoint = pickupPoint"
           >
             <div class="pickup-point-card__content">
               <h3>Yandex</h3>
@@ -42,8 +42,9 @@
     </div>
 
     <PvzMap
-      v-model="selectedPickupPoint"
+      v-model="checkoutPickupPoint"
       :pickup-points="filteredPoints"
+      @update:model-value="setCheckoutPickupPoint(checkoutPickupPoint)"
     />
   </div>
 </template>
@@ -56,11 +57,10 @@ import DeliveryInfo from '~/components/DeliveryInfo.vue'
 import PvzMap from '~/components/PvzMap.vue'
 import { useCheckout } from '~/composables/useCheckout'
 
-const { setCheckoutPickupPoint, isPickupPointSelected } = useCheckout()
+const { setCheckoutPickupPoint, isPickupPointSelected, checkoutPickupPoint } = useCheckout()
 const { coords } = useGeolocation()
 const yandexPvz = ref<YandexPvzResponse>()
 const searchTerm = ref('')
-const selectedPickupPoint = ref<PickupPoint | undefined>()
 
 const waitForCoords = () =>
   new Promise<void>((resolve) => {
@@ -111,11 +111,6 @@ const filteredPoints = computed<PickupPoint[]>(() => {
   ) || []
 })
 
-watch(() => selectedPickupPoint.value, (newPickupPoint) => {
-  setCheckoutPickupPoint(newPickupPoint)
-  isPickupPointSelected.value = true
-})
-
 definePageMeta({
   layout: 'checkout',
 })