paxton-front/pages/cart.vue
alsaze d1ee94e5c4
All checks were successful
Deploy / build (push) Successful in 6m4s
карты пвз
2025-11-13 16:41:12 +03:00

84 lines
1.9 KiB
Vue

<template>
<div class="cart">
<div v-if="cart.line_items.length > 0" class="cart__items">
<div
v-for="cartItem in cart?.line_items"
:key="cartItem.variation_id"
>
<CartItem :cart-item="cartItem" />
</div>
</div>
<div v-else>
Корзина пока что пуста
</div>
<ClientOnly>
<PayBlock :is-summary="true" />
</ClientOnly>
</div>
</template>
<script setup lang="ts">
import { useCart } from '~/composables'
import PayBlock from '../components/PayBlock.vue'
const route = useRoute()
const { cart, cartRemoveAllItems } = useCart()
const { checkoutContacts, checkoutPickupPoint } = useCheckout()
onMounted(async () => {
if (!route?.query?.ID || cart.value.line_items.length === 0)
return
await $fetch('/api/create', {
method: 'POST',
body: {
payment_method: 'bacs',
payment_method_title: 'Оплата по реквизитам',
set_paid: true,
billing: {
first_name: checkoutContacts?.value?.name,
last_name: checkoutContacts?.value?.surname,
phone: checkoutContacts?.value?.phone,
email: checkoutContacts?.value?.email,
address_1: checkoutPickupPoint.value?.address?.full_address,
postcode: checkoutPickupPoint.value?.address?.postal_code,
city: checkoutPickupPoint?.value?.address?.locality,
country: 'RU',
},
transaction_id: route?.query?.ID,
line_items: cart.value.line_items,
status: 'processing',
},
})
cartRemoveAllItems()
})
</script>
<style lang="scss">
@use '~/assets/scss/utils' as *;
.cart {
margin-top: 120px;
margin-inline: auto;
max-width: 1200px;
display: flex;
flex-direction: row;
justify-content: space-between;
@include mobile {
margin-top: 20px;
flex-direction: column;
padding-inline: 16px;
}
&__items {
display: flex;
flex-direction: column;
gap: 16px;
}
}
</style>