translations
This commit is contained in:
@ -1,42 +1,51 @@
|
||||
<template>
|
||||
<div ref="dropdownRef">
|
||||
<i @click="openCart = !openCart" class="uil uil-shopping-cart text-[31px] cursor-pointer"></i>
|
||||
<div class="absolute left-1/2 transform -translate-x-1/2 w-full px-4 sm:max-w-[768px] sm:px-[17px] md:max-w-[1000px] md:px-6 xl:max-w-[1920px] xl:px-20 right-0 z-50 flex items-center justify-end top-[140px]">
|
||||
<div v-if="openCart" class="xl:w-[55%] md:w-[70%] w-full px-4 md:px-0">
|
||||
<div
|
||||
class="absolute left-1/2 transform -translate-x-1/2 w-full px-4 sm:max-w-[768px] sm:px-[17px] md:max-w-[1000px] md:px-6 xl:max-w-[1920px] xl:px-20 right-0 z-50 flex items-center justify-end top-[90px] sm:top-[100px] md:top-[140px]">
|
||||
<div v-if="openCart" class="xl:w-[55%] md:w-[90%] w-full px-4 md:px-0">
|
||||
<div v-if="productStore.cart.cart_items && productStore.cart.cart_items.length > 0"
|
||||
class="w-full p-[25px] sm:p-[50px] first:pt-0 bg-bg-light dark:bg-bg-dark border border-button rounded-[32px] h-full space-y-[55px]">
|
||||
class="w-full p-[25px] sm:p-[50px] bg-bg-light dark:bg-bg-dark border border-button rounded-[32px] h-full space-25-55">
|
||||
<div>
|
||||
<!-- product -->
|
||||
<div v-for="item in productStore.cart.cart_items" class="py-[25px] border-b border-block">
|
||||
<div class="flex items-center max-h-[205px]">
|
||||
<div class="min-w-[100px] sm:w-[205px] flex items-center justify-center">
|
||||
<!-- <img :src="`https://www.yourgold.cz/api/public/file/${item.picture_uuid}.webp`"
|
||||
alt="pics" class="max-h-[95px] sm:max-h-[180px] md:max-h-[205px] rounded-[5px]" /> -->
|
||||
<div v-for="item in productStore.cart.cart_items"
|
||||
class="py-[13px] sm:py-[25px] first:pt-0 border-b border-block">
|
||||
<div class="flex items-center h-[100px] sm:h-[205px]">
|
||||
<div
|
||||
class="min-w-[100px] sm:min-w-[205px] flex items-center justify-center h-[100px] sm:h-[205px]">
|
||||
<img :src="`https://www.yourgold.cz/api/public/file/${item.picture_uuid}.webp`"
|
||||
alt="" class="max-w-full max-h-full object-contain">
|
||||
</div>
|
||||
<div class="flex flex-col justify-between h-full w-full gap-[7px] sm:gap-[15px">
|
||||
|
||||
<div class="flex flex-col justify-between min-h-full w-full gap-[7px] sm:gap-[15px]">
|
||||
<div class="w-full flex items-center justify-between">
|
||||
<h3
|
||||
class="text-[10px] sm:text-base md:text-lg text-xl font-bold leading-[130%] sm:leading-[150%] max-w-[250px]">
|
||||
class="text-[10px] sm:text-base md:text-lg text-xl font-bold leading-[130%] sm:leading-[150%] max-w-[100px] sm:max-w-[200px] md:max-w-[250px]">
|
||||
{{ item.name }}
|
||||
</h3>
|
||||
<i @click="productStore.deleteCartItem(item.cart_item_id)"
|
||||
class="uil uil-trash-alt text-2xl cursor-pointer"></i>
|
||||
class="uil uil-trash-alt text-lg sm:text-2xl cursor-pointer"></i>
|
||||
</div>
|
||||
<div class="flex flex-col gap-[10px]">
|
||||
<p
|
||||
class="text-accent-green-light dark:text-accent-green-dark font-inter text-[12px] sm:text-[21px] md:text-2xl leading-[150%] font-bold">
|
||||
{{ item.total_price }}
|
||||
</p>
|
||||
<div class="flex items-center gap-4 text-xl">
|
||||
<i class="uil uil-minus cursor-pointer text-gray dark:text-button-disabled hover:text-gray-200 transition-all"
|
||||
@click="productStore.decrementCartItem(item.cart_item_id)"></i>
|
||||
<div class="flex items-center gap-[2px] sm:gap-4 text-xl">
|
||||
<div
|
||||
class="w-11 min-h-11 border border-button flex items-center justify-center rounded-[4px]">
|
||||
class="w-5 min-h-5 sm:w-11 sm:min-h-11 text-[10px] sm:text-lg flex items-center justify-center">
|
||||
<i class="uil uil-minus cursor-pointer text-gray dark:text-button-disabled hover:text-gray-200 transition-all"
|
||||
@click="productStore.decrementCartItem(item.cart_item_id)"></i>
|
||||
</div>
|
||||
<div
|
||||
class="w-5 min-h-5 sm:w-10 sm:min-h-11 text-[10px] sm:text-xl border border-button flex items-center justify-center rounded-[4px]">
|
||||
{{ item.quantity }}
|
||||
</div>
|
||||
<i class="uil uil-plus cursor-pointer hover:text-gray-200 transition-all"
|
||||
@click="productStore.incrementCartItem(item.product_id)"></i>
|
||||
<div
|
||||
class="w-5 min-h-5 sm:w-11 sm:min-h-11 text-[10px] sm:text-lg flex items-center justify-center">
|
||||
<i class="uil uil-plus cursor-pointer hover:text-gray-200 transition-all"
|
||||
@click="productStore.incrementCartItem(item.product_id)"></i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -44,7 +53,8 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex items-center justify-between">
|
||||
<h4 class="h4-uppercase-bold-inter">{{ $t('total_amount') }}</h4>
|
||||
<h4 class="font-inter text-[12px] leading-[150%] font-bold uppercase sm:text-[24px]">{{
|
||||
$t('total_amount') }}</h4>
|
||||
<p
|
||||
class="text-accent-green-light dark:text-accent-green-dark font-inter text-[12px] sm:text-[21px] md:text-2xl leading-[150%] font-bold">
|
||||
{{ productStore.cart.total_value }}
|
||||
|
@ -6,8 +6,8 @@
|
||||
<div class="hidden h-[120px] w-full items-center gap-[145px] xl:flex">
|
||||
<ul class="flex items-center justify-between whitespace-nowrap w-full">
|
||||
<li v-for="(item, index) in menuStore.menu" @click="menuStore.navigateToItem(item)" :key="item.id"
|
||||
:class="['hover:text-accent-green-light dark:hover:text-accent-green-dark cursor-pointer text-lg transition-all text-inter',
|
||||
route.params.id == item.id ? 'text-accent-green-light dark:text-accent-green-dark font-bold underline' : false]">
|
||||
:class="['hover:text-accent-green-light dark:hover:text-accent-green-dark cursor-pointer text-lg transition-all text-inter',
|
||||
route.params.id == item.id ? 'text-accent-green-light dark:text-accent-green-dark font-bold underline' : false]">
|
||||
0{{ index + 1 }} <br />
|
||||
{{ item.front_menu_lang[0].name }}
|
||||
</li>
|
||||
@ -28,7 +28,7 @@
|
||||
<ThemeSwitcher />
|
||||
<button @click="menuStore.navigateToShop" :class="[
|
||||
'cursor-pointer transition-all text-inter',
|
||||
route.params.id == 5
|
||||
route.params.id == '5'
|
||||
? 'text-accent-green-light dark:text-accent-green-dark font-bold pb-1 border-b-2 bg-accented px-6 py-3 rounded-xl'
|
||||
: 'hover:bg-button-hover bg-button text-white font-medium rounded-xl px-6 py-3'
|
||||
]">
|
||||
|
@ -18,7 +18,7 @@
|
||||
{{ props.product?.formatted_price }}
|
||||
</p>
|
||||
<button
|
||||
class="w-[22px] h-[22px] sm:w-9 sm:h-9 md:w-12 md:h-12 rounded-[5px] sm:rounded-xl bg-button cursor-pointer hover:bg-button-hover transition-all flex items-center justify-center p-1">
|
||||
class="w-[22px] h-[22px] sm:w-9 sm:h-9 md:w-12 md:h-12 rounded-[5px] text-bg-light sm:rounded-xl bg-button cursor-pointer hover:bg-button-hover transition-all flex items-center justify-center p-1">
|
||||
<i class="uil uil-shopping-cart text-lg sm:text-2xl md:text-[31px] cursor-pointer"></i>
|
||||
</button>
|
||||
</div>
|
||||
|
@ -192,9 +192,6 @@ const props = defineProps<{
|
||||
}
|
||||
}>();
|
||||
|
||||
console.log(props.component);
|
||||
|
||||
|
||||
const openCategories = ref(false);
|
||||
const isInfo = ref<boolean>(true);
|
||||
const selectedFilters = ref<any>([]);
|
||||
|
@ -58,10 +58,10 @@ export const useMenuStore = defineStore("menuStore", () => {
|
||||
|
||||
|
||||
const getLocales = async () => {
|
||||
const { data: countrriesList } = await useMyFetch<GenericResponse<Country[]>>(`/api/public/country/list`);
|
||||
countries.value = countrriesList;
|
||||
selectedCountry.value = countrriesList.find((country) => country.iso_code === $session.currentCountryIso.value) as Country;
|
||||
selectedPhoneCountry.value = countrriesList.find((country) => country.iso_code === $session.currentCountryIso.value) as Country;
|
||||
const { data: countriesList } = await useMyFetch<GenericResponse<Country[]>>(`/api/public/country/list`);
|
||||
countries.value = countriesList;
|
||||
selectedCountry.value = countriesList.find((country) => country.iso_code === $session.currentCountryIso.value) as Country;
|
||||
selectedPhoneCountry.value = countriesList.find((country) => country.iso_code === $session.currentCountryIso.value) as Country;
|
||||
|
||||
|
||||
const { data: currenciesList } = await useMyFetch<GenericResponseItems<Currency[]>>(`/api/public/currencies`)
|
||||
|
@ -1,5 +1,6 @@
|
||||
import { useMyFetch } from "#imports";
|
||||
import type {
|
||||
CartItem,
|
||||
GenericResponse,
|
||||
GenericResponseChildren,
|
||||
GenericResponseItems,
|
||||
|
Reference in New Issue
Block a user