{"version":3,"file":"BgkJCqKc.js","sources":["../../../../types/plugins/yandex-metrika.ts","../../../../composables/useProductMetrics.ts","../../../../composables/useProductCounter.ts","../../../../components/Icons/IconIncrease.vue","../../../../components/Icons/IconDecrease.vue","../../../../components/App/AppCounter.vue"],"sourcesContent":["export type Products = Product[]\n\nexport interface Product {\n  id: string\n  name: string\n  price?: number | null\n  brand?: string\n  category: string\n  variant: string\n  quantity?: number | null\n}\n\nexport enum EcommerceEventName {\n  ADD = 'add',\n  PURCHASE = 'purchase',\n  REMOVE = 'remove',\n  DETAIL = 'detail',\n}\n\nexport interface YmPropTypes {\n  main: () => void\n  city: () => void\n}\n","/* Types */\nimport { Modification } from '@/types/api/api-v3/product'\nimport { EcommerceEventName } from '@/types/plugins/yandex-metrika'\n\n/* Utils */\nimport { mapEcommerceData } from '@/services/metrics/utils/ecommerce'\n\n/* Stores */\nimport { useCityStore } from '@/store/city/city'\n\n/* Комплексная отправка метрики добавления/удаления единиц продукта */\nexport const useSendMetricsOfProduct = (\n  currentProduct?: Partial<Modification> | null,\n) => {\n  const { $metrics } = useNuxtApp()\n\n  const route = useRoute()\n\n  const cityStore = useCityStore()\n\n  const currencyCode = computed(() => cityStore.currencyCode)\n\n  const pushMetrics = (typeEvent: EcommerceEventName, quantity: number) => {\n    if (!currentProduct) return\n\n    const ecommerceData = mapEcommerceData(\n      currentProduct,\n      typeEvent,\n      currencyCode.value || '',\n      quantity,\n    )\n\n    $metrics?.eventAddProduct({ ym: ecommerceData })\n    $metrics?.eventSendGoal({ mt: 'Basketcomplete' })\n\n    window.carrotquest?.track('cart_added', {\n      name: currentProduct.full_name,\n      url: route.path + currentProduct.slug,\n      amount: currentProduct.price,\n      img: currentProduct.image,\n    })\n  }\n\n  return { pushMetrics }\n}\n","import { computed, ref } from 'vue'\nimport { debounce } from 'throttle-debounce'\n\n/* Types */\nimport { Product, Modification } from '@/types/api/api-v3/product'\nimport { EcommerceEventName } from '@/types/plugins/yandex-metrika'\n\n/* Stores */\nimport { useBasketStore } from '@/store/basket/basket'\nimport { useBasketChangeStore } from '@/store/basket/basket-change'\nimport { useAppStore } from '~/store/app/app'\nimport { SnackbarType } from '~/store/app/app.types'\n\n/* Composables */\nimport { useSendMetricsOfProduct } from '@/composables/useProductMetrics'\n\nexport const useProductCounter = (\n  productId: ComputedRef<number>,\n  currentProduct?: Partial<Modification> | null,\n  product?: Product,\n) => {\n  const previousQuantity = ref(0)\n  // Счетчик кликов без учета единиц продуктов в корзине\n  const countClickedQuantity = ref(0)\n\n  const appStore = useAppStore()\n  const basketStore = useBasketStore()\n  const basketChangeStore = useBasketChangeStore()\n\n  const basketError = computed(() => basketStore.error)\n\n  const quantitySelectedProducts = computed(() => {\n    return basketChangeStore.getQuantitySelectedProducts(productId.value)\n  })\n\n  // Получаем общее количество модификаций в корзине в рамках одного товара\n  const totalSelectedProductsQuantity = computed(() => {\n    if (!product) return 0\n\n    let totalCount = 0\n\n    for (const { id } of product.modifications) {\n      totalCount += basketChangeStore.getQuantitySelectedProducts(id)\n    }\n\n    return totalCount\n  })\n\n  const { pushMetrics } = useSendMetricsOfProduct(currentProduct)\n\n  const setProductQuantity = (quantity: number) => {\n    basketChangeStore.setQuantitySelectedProducts({\n      index: productId.value,\n      value: quantity,\n    })\n  }\n\n  // Устанавливаем общее количество модификаций добавленных в корзину в рамках одного товара\n  const setTotalProductsQuantity = () => {\n    if (!product) return\n\n    for (const { id } of product.modifications) {\n      const value = basketStore.basketSelectedProducts[id]\n\n      if (value === undefined) continue\n\n      basketChangeStore.setQuantitySelectedProducts({\n        index: id,\n        value,\n      })\n    }\n  }\n\n  const changeQuantity = debounce(\n    300,\n    async (quantity: number, eventType: EcommerceEventName) => {\n      await basketStore.setProduct({\n        product_id: productId.value,\n        quantity,\n      })\n\n      // Отправляем метрику добавления/удаляения единиц продукта\n      if (countClickedQuantity.value)\n        pushMetrics(eventType, countClickedQuantity.value)\n\n      // Сбрасываем счетчик кликов\n      countClickedQuantity.value = 0\n\n      // Если произошла ошибка, приводим кол- во товара к изначальному и выводим снекбар\n      if (basketError.value) {\n        setProductQuantity(previousQuantity.value)\n\n        // Показываем снекбар с ошибкой\n        appStore.showSnackbar({\n          message: 'Что-то пошло не так',\n          type: SnackbarType.MESSAGE,\n        })\n      }\n    },\n  )\n\n  const decreaseQuantity = () => {\n    if (quantitySelectedProducts.value === 0) return\n\n    previousQuantity.value = quantitySelectedProducts.value\n\n    const newQuantity = quantitySelectedProducts.value - 1\n\n    countClickedQuantity.value += 1\n\n    setProductQuantity(newQuantity)\n    changeQuantity(newQuantity, EcommerceEventName.REMOVE)\n  }\n\n  const increaseQuantity = () => {\n    previousQuantity.value = quantitySelectedProducts.value\n\n    const newQuantity = quantitySelectedProducts.value + 1\n\n    // Фиксируем кол-во кликов\n    countClickedQuantity.value += 1\n\n    setProductQuantity(newQuantity)\n    changeQuantity(newQuantity, EcommerceEventName.ADD)\n  }\n\n  return {\n    basketError,\n    quantitySelectedProducts,\n    totalSelectedProductsQuantity,\n    setProductQuantity,\n    setTotalProductsQuantity,\n    decreaseQuantity,\n    increaseQuantity,\n  }\n}\n","<script lang=\"ts\" setup>\nconst props = defineProps({\n  disabled: {\n    type: Boolean,\n    required: false,\n    default: false,\n  },\n})\n</script>\n\n<template>\n  <svg\n    width=\"10\"\n    height=\"10\"\n    viewBox=\"0 0 10 10\"\n    fill=\"none\"\n    xmlns=\"http://www.w3.org/2000/svg\"\n  >\n    <path\n      fill-rule=\"evenodd\"\n      clip-rule=\"evenodd\"\n      d=\"M3.89728 6.12676H1.10161C0.493208 6.12676 0 5.63355 0 5.02515C0 4.41675 0.493208 3.92354 1.10161 3.92354H3.89728V1.10272C3.89728 0.493705 4.39099 0 5 0C5.60901 0 6.10272 0.493704 6.10272 1.10272V3.92354H8.89839C9.50679 3.92354 10 4.41675 10 5.02515C10 5.63355 9.50679 6.12676 8.89839 6.12676H6.10272V8.89728C6.10272 9.5063 5.60901 10 5 10C4.39099 10 3.89728 9.5063 3.89728 8.89728V6.12676Z\"\n      :fill=\"props.disabled ? '#D8DEE9' : ' #2C2F39'\"\n    />\n  </svg>\n</template>\n","<script lang=\"ts\" setup>\nconst props = defineProps({\n  disabled: {\n    type: Boolean,\n    required: false,\n    default: false,\n  },\n})\n</script>\n\n<template>\n  <svg\n    width=\"10\"\n    height=\"3\"\n    viewBox=\"0 0 10 3\"\n    fill=\"none\"\n    xmlns=\"http://www.w3.org/2000/svg\"\n  >\n    <path\n      fill-rule=\"evenodd\"\n      clip-rule=\"evenodd\"\n      d=\"M1.2 2.4C0.537259 2.4 0 1.86274 0 1.2C0 0.537258 0.537259 0 1.2 0H8.8C9.46274 0 10 0.537258 10 1.2C10 1.86274 9.46274 2.4 8.8 2.4H1.2Z\"\n      :fill=\"props.disabled ? '#D8DEE9' : '#2C2F39'\"\n    />\n  </svg>\n</template>\n","<script lang=\"ts\" setup>\nimport increaseIcon from '@/components/Icons/IconIncrease.vue'\nimport decreaseIcon from '@/components/Icons/IconDecrease.vue'\n\nconst props = defineProps({\n  background: {\n    type: String,\n    required: false,\n    default: () => '#f1f4f9',\n  },\n  modelValue: {\n    type: Number,\n    required: true,\n  },\n  minValue: {\n    type: Number,\n    required: false,\n    default: 0,\n  },\n  maxValue: {\n    type: Number,\n    required: false,\n    default: undefined,\n  },\n  large: {\n    type: Boolean,\n    required: false,\n    default: false,\n  },\n})\n\nconst emit = defineEmits(['decrease', 'increase'])\n</script>\n\n<template>\n  <div\n    class=\"app-count\"\n    :class=\"{ 'app-count--large': props.large }\"\n    :style=\"{ background }\"\n  >\n    <v-btn\n      :disabled=\"props.modelValue <= props.minValue\"\n      icon\n      append\n      class=\"app-count__btn product-decrease\"\n      aria-label=\"Убавить\"\n      data-test-id=\"product-decrease\"\n      @click=\"emit('decrease')\"\n    >\n      <decrease-icon :disabled=\"props.modelValue <= props.minValue\" />\n    </v-btn>\n    <div class=\"app-count__value\" data-test-id=\"product-quantity\">\n      {{ props.modelValue }}\n    </div>\n    <v-btn\n      :disabled=\"\n        props.maxValue === undefined\n          ? false\n          : props.modelValue === props.maxValue\n      \"\n      icon\n      class=\"app-count__btn app-count__btn--color product-increase\"\n      aria-label=\"Добавить\"\n      data-test-id=\"product-increase\"\n      @click=\"emit('increase')\"\n    >\n      <increase-icon\n        :disabled=\"\n          props.maxValue === undefined\n            ? false\n            : props.modelValue === props.maxValue\n        \"\n      />\n    </v-btn>\n  </div>\n</template>\n\n<style lang=\"scss\" scoped>\n.app-count {\n  display: inline-flex;\n  align-items: center;\n  justify-content: space-between;\n  justify-items: center;\n  font-size: 16px;\n  font-weight: bold;\n  background: #f1f4f9;\n  border-radius: 100px;\n  transition: 0.2s ease-in-out;\n  @include media('<=desktop-mini') {\n    height: 40px;\n  }\n\n  &__btn {\n    width: 40px !important;\n    min-width: 30px !important;\n    height: 40px !important;\n    min-height: 30px !important;\n    margin: 0;\n    overflow: hidden;\n    cursor: pointer;\n    user-select: none;\n    background: transparent;\n    box-shadow: none !important;\n\n    @include media('<=tablet') {\n      width: 30px !important;\n      height: 30px !important;\n    }\n\n    &:hover::before {\n      @include media('<=desktop-mini') {\n        opacity: 0;\n      }\n    }\n\n    :deep(.v-btn__overlay) {\n      display: none;\n    }\n  }\n\n  &__value {\n    width: auto;\n    min-width: 18px;\n    margin: 0 5px;\n    font-size: 12px;\n    color: $text-black;\n    text-align: center;\n    @include media('<=desktop-mini') {\n      margin: 0;\n    }\n    @include media('<=tablet') {\n      min-width: 20px;\n    }\n  }\n\n  .v-btn.v-btn--disabled {\n    background: #f1f4f9 !important;\n    box-shadow: none !important;\n\n    .app-count__decrease,\n    .app-count__increase {\n      color: $very-light-grey !important;\n    }\n  }\n  &--large {\n    .app-count__btn {\n      width: 64px !important;\n      height: 64px !important;\n    }\n    .app-count__value {\n      min-width: 39px;\n      font-size: 18px;\n      font-weight: 600;\n    }\n    .product-decrease {\n      svg {\n        width: 17px !important;\n        height: 4px !important;\n      }\n    }\n    .product-increase {\n      svg {\n        width: 17px !important;\n        height: 17px !important;\n      }\n    }\n  }\n}\n</style>\n"],"names":["EcommerceEventName","useSendMetricsOfProduct","currentProduct","$metrics","useNuxtApp","route","useRoute","cityStore","useCityStore","currencyCode","computed","typeEvent","quantity","ecommerceData","mapEcommerceData","_a","useProductCounter","productId","product","previousQuantity","ref","countClickedQuantity","appStore","useAppStore","basketStore","useBasketStore","basketChangeStore","useBasketChangeStore","basketError","quantitySelectedProducts","totalSelectedProductsQuantity","totalCount","id","pushMetrics","setProductQuantity","setTotalProductsQuantity","value","changeQuantity","debounce","eventType","SnackbarType","newQuantity","props","__props","emit","__emit"],"mappings":";;0lBAYY,IAAAA,GAAAA,IACVA,EAAA,IAAM,MACNA,EAAA,SAAW,WACXA,EAAA,OAAS,SACTA,EAAA,OAAS,SAJCA,IAAAA,GAAA,CAAA,CAAA,ECDC,MAAAC,EACXC,GACG,CACG,KAAA,CAAE,SAAAC,GAAaC,IAEfC,EAAQC,IAERC,EAAYC,IAEZC,EAAeC,EAAS,IAAMH,EAAU,YAAY,EAuB1D,MAAO,CAAE,YArBW,CAACI,EAA+BC,IAAqB,OACvE,GAAI,CAACV,EAAgB,OAErB,MAAMW,EAAgBC,EACpBZ,EACAS,EACAF,EAAa,OAAS,GACtBG,CAAA,EAGFT,GAAA,MAAAA,EAAU,gBAAgB,CAAE,GAAIU,CAAe,GAC/CV,GAAA,MAAAA,EAAU,cAAc,CAAE,GAAI,gBAAkB,IAEzCY,EAAA,OAAA,cAAA,MAAAA,EAAa,MAAM,aAAc,CACtC,KAAMb,EAAe,UACrB,IAAKG,EAAM,KAAOH,EAAe,KACjC,OAAQA,EAAe,MACvB,IAAKA,EAAe,KAAA,EACrB,CAGkB,CACvB,EC5Bac,GAAoB,CAC/BC,EACAf,EACAgB,IACG,CACG,MAAAC,EAAmBC,EAAI,CAAC,EAExBC,EAAuBD,EAAI,CAAC,EAE5BE,EAAWC,IACXC,EAAcC,IACdC,EAAoBC,IAEpBC,EAAclB,EAAS,IAAMc,EAAY,KAAK,EAE9CK,EAA2BnB,EAAS,IACjCgB,EAAkB,4BAA4BT,EAAU,KAAK,CACrE,EAGKa,EAAgCpB,EAAS,IAAM,CAC/C,GAAA,CAACQ,EAAgB,MAAA,GAErB,IAAIa,EAAa,EAEjB,SAAW,CAAE,GAAAC,KAAQd,EAAQ,cACba,GAAAL,EAAkB,4BAA4BM,CAAE,EAGzD,OAAAD,CAAA,CACR,EAEK,CAAE,YAAAE,CAAA,EAAgBhC,EAAwBC,CAAc,EAExDgC,EAAsBtB,GAAqB,CAC/Cc,EAAkB,4BAA4B,CAC5C,MAAOT,EAAU,MACjB,MAAOL,CAAA,CACR,CAAA,EAIGuB,EAA2B,IAAM,CACrC,GAAKjB,EAEL,SAAW,CAAE,GAAAc,KAAQd,EAAQ,cAAe,CACpC,MAAAkB,EAAQZ,EAAY,uBAAuBQ,CAAE,EAE/CI,IAAU,QAEdV,EAAkB,4BAA4B,CAC5C,MAAOM,EACP,MAAAI,CAAA,CACD,CACH,CAAA,EAGIC,EAAiBC,EACrB,IACA,MAAO1B,EAAkB2B,IAAkC,CACzD,MAAMf,EAAY,WAAW,CAC3B,WAAYP,EAAU,MACtB,SAAAL,CAAA,CACD,EAGGS,EAAqB,OACXY,EAAAM,EAAWlB,EAAqB,KAAK,EAGnDA,EAAqB,MAAQ,EAGzBO,EAAY,QACdM,EAAmBf,EAAiB,KAAK,EAGzCG,EAAS,aAAa,CACpB,QAAS,sBACT,KAAMkB,EAAa,OAAA,CACpB,EAEL,CAAA,EA4BK,MAAA,CACL,YAAAZ,EACA,yBAAAC,EACA,8BAAAC,EACA,mBAAAI,EACA,yBAAAC,EACA,iBA/BuB,IAAM,CACzB,GAAAN,EAAyB,QAAU,EAAG,OAE1CV,EAAiB,MAAQU,EAAyB,MAE5C,MAAAY,EAAcZ,EAAyB,MAAQ,EAErDR,EAAqB,OAAS,EAE9Ba,EAAmBO,CAAW,EACfJ,EAAAI,EAAazC,EAAmB,MAAM,CAAA,EAsBrD,iBAnBuB,IAAM,CAC7BmB,EAAiB,MAAQU,EAAyB,MAE5C,MAAAY,EAAcZ,EAAyB,MAAQ,EAGrDR,EAAqB,OAAS,EAE9Ba,EAAmBO,CAAW,EACfJ,EAAAI,EAAazC,EAAmB,GAAG,CAAA,CAUlD,CAEJ,sMCtIA,MAAM0C,EAAQC,utBCAd,MAAMD,EAAQC,gpBCGd,MAAMD,EAAQC,EA2BRC,EAAOC","debug_id":"af2bc6cc-4237-552e-92bb-0ad6dae643e3"}