{"version":3,"file":"Cks04Ixl.js","sources":["../../../../assets/images/generator-background.webp","../../../../components/Wok/WokGeneratorImage.vue","../../../../components/Wok/WokStatusPanel.vue","../../../../components/Wok/WokProductSelectItem.vue","../../../../components/Wok/WokProductSelect.vue","../../../../components/Wok/WokCategory.vue","../../../../pages/make-wok.vue"],"sourcesContent":["export default \"__VITE_ASSET__CAygcZrJ__\"","<script lang=\"ts\" setup>\nimport { PropType } from 'vue'\n\n/* Assets */\nimport ProductNoImage from '~/assets/images/ProductNoImage.png'\nimport GeneratorBackgroud from '~/assets/images/generator-background.webp'\n\n/* Types */\nimport { CompositionOfWok } from '~/types/api/api-v3/make-wok'\n\nconst props = defineProps({\n  compositionOfWok: {\n    type: Object as PropType<CompositionOfWok>,\n    required: true,\n  },\n})\n</script>\n\n<template>\n  <svg viewBox=\"0 0 15 10\">\n    <rect\n      id=\"background\"\n      fill=\"url(#background-gradient)\"\n      width=\"100%\"\n      height=\"100%\"\n    />\n    <image :href=\"GeneratorBackgroud\" width=\"100%\" height=\"100%\" />\n    <defs>\n      <linearGradient id=\"background-gradient\">\n        <stop stop-color=\"white\" />\n        <stop offset=\"1\" stop-color=\"#FAFAFA\" />\n      </linearGradient>\n\n      <clipPath id=\"common\">\n        <polygon\n          :points=\"\n            props.compositionOfWok['Начинка']\n              ? '0 0, 15 0, 15 10'\n              : '0 0, 15 0, 15 10, 0 10'\n          \"\n        />\n      </clipPath>\n      <clipPath id=\"fill\">\n        <polygon\n          :points=\"\n            props.compositionOfWok['Основа']\n              ? '0 0, 0 10, 15 10'\n              : '0 0, 0 10, 15 10, 15 0'\n          \"\n        />\n      </clipPath>\n      <clipPath id=\"souce\">\n        <rect x=\"10\" y=\"5\" width=\"5\" height=\"5\" />\n      </clipPath>\n    </defs>\n    <image\n      v-if=\"props.compositionOfWok['Основа']\"\n      :href=\"props.compositionOfWok['Основа'].image || ProductNoImage\"\n      height=\"100%\"\n      width=\"100%\"\n      clip-path=\"url(#common)\"\n      preserveAspectRatio=\"xMidYMid slice\"\n    />\n    <image\n      v-if=\"props.compositionOfWok['Начинка']\"\n      :href=\"props.compositionOfWok['Начинка'].image || ProductNoImage\"\n      height=\"100%\"\n      width=\"100%\"\n      preserveAspectRatio=\"xMidYMid slice\"\n      clip-path=\"url(#fill)\"\n    />\n    <image\n      v-if=\"props.compositionOfWok['Соус']\"\n      x=\"10\"\n      y=\"5\"\n      :href=\"props.compositionOfWok['Соус'].image || ProductNoImage\"\n      height=\"5\"\n      width=\"5\"\n      clip-path=\"url(#souce)\"\n    />\n  </svg>\n</template>\n","<script lang=\"ts\" setup>\nimport { PropType, computed } from 'vue'\n\n/* Components */\nimport WokGeneratorImage from '~/components/Wok/WokGeneratorImage.vue'\n\n/* Types */\nimport { CompositionOfWok, Category } from '@/types/api/api-v3/make-wok'\n\nconst { isDesktop, isMobileOrTablet } = useDevice()\n\nconst props = defineProps({\n  categories: {\n    type: Array as PropType<Category[]>,\n    required: true,\n  },\n  compositionOfWok: {\n    type: Object as PropType<CompositionOfWok>,\n    required: true,\n  },\n  totalPrice: {\n    type: Number as PropType<number | undefined>,\n    required: true,\n  },\n  totalWeight: {\n    type: Number,\n    required: true,\n  },\n  currency: {\n    type: String,\n    required: true,\n  },\n  valid: {\n    type: Boolean,\n    required: false,\n    default: true,\n  },\n})\n\nconst filterWeight = computed(() =>\n  props.totalWeight < 1000\n    ? `${props.totalWeight} г`\n    : `${(props.totalWeight / 1000).toFixed(2)} кг`,\n)\n\nconst emits = defineEmits(['addWokToBasket'])\n</script>\n\n<template>\n  <div class=\"panel\" :class=\"{ 'panel--desktop': isDesktop }\">\n    <wok-generator-image\n      v-if=\"isDesktop\"\n      :composition-of-wok=\"compositionOfWok\"\n      class=\"image\"\n    />\n    <div class=\"information\">\n      <div class=\"products\">\n        <span v-for=\"(category, index) in categories\" :key=\"category.name\">\n          <span\n            v-if=\"\n              compositionOfWok[category.name] &&\n              compositionOfWok[category.name].name\n            \"\n            class=\"product\"\n          >\n            {{ compositionOfWok[category.name].name }}\n            <span v-if=\"index !== categories.length - 1\" class=\"plus\">\n              {{ '+ ' }}\n            </span>\n          </span>\n          <span v-else-if=\"category.name\" class=\"category\">\n            {{ category.name }}\n            <span v-if=\"index !== categories.length - 1\" class=\"plus\">\n              {{ '+ ' }}\n            </span>\n          </span>\n        </span>\n      </div>\n      <div class=\"price-wrapper\">\n        <div v-if=\"totalPrice !== undefined\" class=\"price\">\n          {{ totalPrice }} {{ currency }}\n        </div>\n        <div v-if=\"totalWeight !== undefined\" class=\"weight\">\n          {{ filterWeight }}\n        </div>\n      </div>\n      <v-tooltip\n        v-if=\"isMobileOrTablet && !valid\"\n        bottom\n        :open-on-click=\"true\"\n        :open-on-hover=\"false\"\n        color=\"#000000\"\n      >\n        <template #activator=\"{ props }\">\n          <app-button\n            class=\"add-button\"\n            v-bind=\"props\"\n            @click=\"emits('addWokToBasket')\"\n          >\n            Хочу!\n          </app-button>\n        </template>\n        <span>Выберите, пожалуйста, ингредиенты</span>\n      </v-tooltip>\n\n      <app-button v-else class=\"add-button\" @click=\"emits('addWokToBasket')\">\n        Хочу!\n      </app-button>\n    </div>\n  </div>\n</template>\n\n<style lang=\"scss\" scoped>\n.panel {\n  .information {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    padding: 20px 10px;\n    background: #fff;\n    border-top: 1px solid $very-light-grey;\n    .products {\n      flex: 0 1 180px;\n      margin-right: 10px;\n      font-size: 14px;\n      .product {\n        font-weight: 800;\n      }\n      .category {\n        color: $unactive-grey;\n        text-transform: lowercase;\n      }\n    }\n    .price-wrapper {\n      flex: 0 0 auto;\n      margin-right: 10px;\n      .price {\n        font-size: 14px;\n        font-weight: 800;\n      }\n      .weight {\n        font-size: 14px;\n        font-weight: 500;\n        color: $dark-grey;\n      }\n    }\n    .add-button {\n      flex: 0 0 90px;\n      font-weight: 700 !important;\n      border-radius: 40px;\n    }\n  }\n}\n.panel--desktop {\n  .image {\n    width: 100%;\n    margin-bottom: 40px;\n    border-radius: 40px;\n  }\n  .information {\n    flex-wrap: wrap;\n    padding: 0;\n    border-top: unset;\n    .products {\n      flex: 0 1 100%;\n      margin-right: 0;\n      margin-bottom: 20px;\n      font-size: 24px;\n    }\n    .price-wrapper {\n      display: flex;\n      align-items: center;\n      .price {\n        order: 2;\n        font-size: 24px;\n        color: #2c2c2c;\n      }\n      .weight {\n        order: 1;\n        margin-right: 16px;\n        font-size: 14px;\n      }\n    }\n  }\n}\n</style>\n","<script lang=\"ts\" setup>\nimport { computed } from 'vue'\n\nimport ProductNoImage from '~/assets/images/ProductNoImage.png'\n\nconst { isDesktop } = useDevice()\n\nconst props = defineProps({\n  isSelected: {\n    type: Boolean,\n    required: false,\n    default: false,\n  },\n  currency: {\n    type: String,\n    required: true,\n  },\n  image: {\n    type: String,\n    required: true,\n  },\n  name: {\n    type: String,\n    required: true,\n  },\n  composition: {\n    type: String,\n    required: true,\n  },\n  price: {\n    type: Number,\n    required: true,\n  },\n})\n\nconst productImage = computed(() => props.image || ProductNoImage)\n\nconst emits = defineEmits(['clickImage'])\n</script>\n\n<template>\n  <div\n    class=\"product\"\n    :class=\"{\n      'product--selected': isSelected,\n      'product--desktop': isDesktop,\n    }\"\n  >\n    <div\n      class=\"image\"\n      :style=\"{ 'background-image': `url(${productImage})` }\"\n      @click=\"emits('clickImage')\"\n    />\n\n    <div v-if=\"name\" class=\"name\">{{ name }}</div>\n    <div class=\"structure-wrapper\">\n      <div v-if=\"composition\" class=\"structure-wrapper__compasition\">\n        Состав\n        <v-tooltip\n          activator=\"parent\"\n          attach=\"#__nuxt\"\n          color=\"#000000\"\n          :location=\"'top'\"\n        >\n          <span class=\"structure-wrapper__compasition-block\">\n            {{ composition }}\n          </span>\n        </v-tooltip>\n      </div>\n      <div v-if=\"price !== undefined\" class=\"price\">\n        <span class=\"amount\">{{ `${price} ` }}</span>\n        <span class=\"currency\">{{ currency }}</span>\n      </div>\n    </div>\n  </div>\n</template>\n\n<style lang=\"scss\" scoped>\n.v-overlay__content {\n  font-size: 22px !important;\n}\n$product-width: 95px;\n.product {\n  display: flex;\n  flex-direction: column;\n  width: $product-width;\n  margin-bottom: 25px;\n  margin-left: 20px;\n  &--selected {\n    .image {\n      position: relative;\n      border: 4px solid $success !important;\n      &::after {\n        position: absolute;\n        top: -15px;\n        right: -15px;\n        display: block;\n        width: 32px;\n        height: 32px;\n        content: '';\n        background-size: contain;\n      }\n    }\n  }\n  .name {\n    margin-bottom: 8px;\n    font-size: 12px;\n    font-weight: bold;\n    color: $text-black;\n  }\n  .image {\n    width: 100%;\n    height: $product-width;\n    margin-bottom: 20px;\n    background-position: center;\n    background-origin: border-box;\n    background-size: cover;\n    border: 4px solid transparent;\n    border-radius: 20px;\n  }\n  .structure-wrapper {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    margin-top: auto;\n\n    &__compasition {\n      font-size: 12px;\n      font-weight: 700;\n      color: #9ea7b6;\n      cursor: pointer;\n    }\n    &__proposition__left {\n      display: block;\n    }\n    &__compasition-block {\n      position: relative;\n      display: block;\n      background: $black !important;\n    }\n    .price {\n      margin-left: auto;\n      font-size: 14px;\n      font-weight: 800;\n      color: #2c2c2c;\n    }\n\n    &__inside {\n      font-size: 12px !important;\n      background: green;\n    }\n  }\n}\n\n:deep(.v-overlay__content) {\n  width: initial;\n  max-width: 190px !important;\n  padding: 20px 16px !important;\n  font-size: 12px !important;\n  font-weight: 600 !important;\n  line-height: 20px !important;\n  color: #fff;\n  background-color: #000;\n  border-radius: 10px;\n  opacity: 0.8;\n}\n\n.product--desktop {\n  width: 120px;\n  margin-bottom: 35px;\n  margin-left: 40px;\n\n  .name {\n    margin-bottom: 10px;\n    font-size: 14px;\n    color: #2c2c2c;\n  }\n\n  .image {\n    height: 120px;\n    margin-bottom: 25px;\n  }\n}\n</style>\n","<script lang=\"ts\" setup>\nimport { PropType } from 'vue'\n\nimport WokProductSelectItem from '~/components/Wok/WokProductSelectItem.vue'\n\nimport { Product } from '@/types/api/api-v3/make-wok'\n\nconst { isDesktop } = useDevice()\n\nconst props = defineProps({\n  products: {\n    type: Array as PropType<Product[]>,\n    required: true,\n  },\n  currency: {\n    type: String,\n    required: true,\n  },\n  value: {\n    type: Number,\n    required: false,\n    default: null,\n  },\n})\n\nconst emits = defineEmits(['input'])\n\nconst selectProduct = (id: number) => emits('input', id)\n</script>\n\n<template>\n  <div\n    class=\"products\"\n    :class=\"{\n      'products--desktop': isDesktop,\n    }\"\n  >\n    <wok-product-select-item\n      v-for=\"product in products\"\n      :key=\"product.id\"\n      :name=\"product.name\"\n      :image=\"product.image\"\n      :composition=\"product.marking_composition\"\n      :price=\"product.price\"\n      :currency=\"currency\"\n      :is-selected=\"product.id === props.value\"\n      @click-image=\"selectProduct(product.id)\"\n    />\n  </div>\n</template>\n\n<style lang=\"scss\" scoped>\n.products {\n  display: flex;\n  flex-wrap: wrap;\n  margin-bottom: -20px;\n  margin-left: -25px;\n}\n</style>\n\n<style lang=\"scss\" scoped>\n.products--desktop {\n  margin-bottom: -35px;\n  margin-left: -40px;\n}\n</style>\n","<script lang=\"ts\" setup>\nimport WokProductSelect from '@/components/Wok/WokProductSelect.vue'\n\nconst { isDesktop } = useDevice()\n\nconst props = defineProps({\n  description: {\n    type: String,\n    required: false,\n    default: null,\n  },\n  numberCategory: {\n    type: Number,\n    required: true,\n  },\n  name: {\n    type: String,\n    required: false,\n    default: null,\n  },\n  currency: {\n    type: String,\n    required: true,\n  },\n  products: {\n    type: Array,\n    required: true,\n  },\n  value: {\n    type: Number,\n    required: false,\n    default: null,\n  },\n})\n\nconst emits = defineEmits(['input'])\n\nconst selectProduct = (id: number) => {\n  emits('input', props.name, id)\n}\n</script>\n\n<template>\n  <div class=\"category\" :class=\"{ 'category--desktop': isDesktop }\">\n    <h2 v-if=\"name\" class=\"name\">\n      {{ `${numberCategory + 1} ${name}` }}\n    </h2>\n    <div v-if=\"description\" class=\"description\">\n      {{ description }}\n    </div>\n    <wok-product-select\n      :value=\"value\"\n      :products=\"products\"\n      :currency=\"currency\"\n      @input=\"selectProduct\"\n    />\n  </div>\n</template>\n\n<style lang=\"scss\" scoped>\n.category {\n  .name {\n    margin-bottom: 15px;\n    font-size: 16px;\n    font-weight: 800;\n    color: $text-black;\n  }\n  .description {\n    margin-bottom: 20px;\n    font-size: 14px;\n    font-weight: 500;\n    color: $dark-grey;\n  }\n}\n.category--desktop {\n  .name {\n    margin-bottom: 30px;\n    color: #373b4d;\n  }\n  .description {\n    margin-bottom: 50px;\n    font-size: 16px;\n  }\n}\n</style>\n","<script lang=\"ts\" setup>\nimport { computed, ref } from 'vue'\n\n/* Utils */\nimport { Field as VeeField, Form as VeeForm, defineRule } from 'vee-validate'\nimport { requiredValidator } from '@/utils/rulesOfValidate'\n\n/* Components */\nimport WokStatusPanel from '@/components/Wok/WokStatusPanel.vue'\nimport WokCategory from '@/components/Wok/WokCategory.vue'\nimport WokAlert from '@/components/Wok/WokAlert.vue'\n\n/* Store */\nimport { useCityStore } from '~/store/city/city'\nimport { useBasketStore } from '~/store/basket/basket'\nimport { useAppStore } from '@/store/app/app'\n\n/* Types */\nimport { CompositionOfWok, Product } from '~/types/api/api-v3/make-wok'\nimport {\n  Success,\n  HttpStatusCode,\n  NotFoundError,\n  ServerError,\n} from '@/api/results'\n\nimport { SnackbarType } from '~/store/app/app.types'\n\nconst { isDesktop } = useDevice()\n\nconst cityStore = useCityStore()\nconst basketStore = useBasketStore()\n\nconst { showSnackbar } = useAppStore()\nconst { $sentryCaptureException } = useNuxtApp()\n\nconst compositionOfWok = ref({} as CompositionOfWok)\n\nconst wokConstructorEnabled = computed(\n  () => cityStore.cityInfo.wok_constructor_enabled,\n)\n\nconst { data: page, error } = await useAsyncData(async (nuxtApp) => {\n  if (!wokConstructorEnabled.value) {\n    throw createError({\n      statusCode: HttpStatusCode.NOT_FOUND,\n    })\n  }\n\n  const result = await nuxtApp?.$apiService.wok.fetchPage()\n\n  if (result instanceof NotFoundError) {\n    throw createError({\n      statusCode: HttpStatusCode.NOT_FOUND,\n    })\n  }\n\n  if (result instanceof ServerError) {\n    throw createError({\n      statusCode: HttpStatusCode.INTERNAL_SERVER_ERROR,\n    })\n  }\n\n  if (result instanceof Success) return result.data\n})\n\nif (error.value) showError(error.value)\n\nconst selectedWok = computed(() => {\n  const compositionOfWokProductId = new Set(\n    Object.keys(compositionOfWok.value).map(\n      (category) => compositionOfWok.value[category].id,\n    ),\n  )\n\n  return page.value?.products.find((wok) => {\n    return wok.components.every((component) => {\n      return compositionOfWokProductId.has(component.product_id)\n    })\n  })\n})\n\nconst padeg = computed(() => cityStore.cityInfo.padeg)\n\nconst breadcrumbs = computed(() => [\n  { text: `Доставка суши в ${padeg.value?.pred}`, href: '/' },\n  { text: `Лапша WOK в ${padeg.value?.pred}`, href: '/category/wok/' },\n  { text: `Конструктор WOK в ${padeg.value?.pred}`, href: '/make-wok/' },\n])\n\nconst snackbar = computed(() => useAppStore().snackbar)\n\nconst categories = computed(() => page.value?.categories || [])\n\nconst currencySymbol = computed(() => cityStore.currencySymbol)\n\nconst showBreadcrumb = computed(\n  () => breadcrumbs.value.length !== 0 && isDesktop,\n)\n\nconst totalWeight = computed(() => {\n  let totalWeight = 0\n\n  Object.keys(compositionOfWok.value).forEach((category) => {\n    totalWeight = totalWeight + (compositionOfWok.value[category].weight || 0)\n  })\n\n  return totalWeight\n})\n\nconst totalPrice = computed(() => {\n  let totalPrice = 0\n\n  Object.keys(compositionOfWok.value).forEach((category) => {\n    totalPrice = totalPrice + (compositionOfWok.value[category].price || 0)\n  })\n\n  return totalPrice\n})\n\nconst basketError = computed(() => basketStore.error)\nconst basketIsDisabled = computed(() => basketStore.basketIsDisabled)\n\nconst getProductOfCategory = (categoryName: string, productId: number) => {\n  const category = page.value?.categories.find(\n    (category) => category.name === categoryName,\n  )\n\n  if (!category) return undefined\n\n  return category.products.find((product) => product.id === productId)\n}\n\nconst setProductToCompositionOfWok = (\n  categoryName: string,\n  product: Product | undefined,\n) => {\n  // @ts-ignore\n  compositionOfWok.value[categoryName] = product\n}\n\nconst addIngredientInCompositionOfWok = (\n  categoryName: string,\n  productId: number,\n) => {\n  const product = getProductOfCategory(categoryName, productId)\n\n  setProductToCompositionOfWok(categoryName, product)\n}\n\nconst clearCompositionOfWok = () => (compositionOfWok.value = {})\n\nconst addIngredient = (categoryName: string, productId: number) => {\n  const product: Product | undefined = getProductOfCategory(\n    categoryName,\n    productId,\n  )\n\n  if (!product) {\n    showSnackbar({\n      message: 'Что-то пошло не так',\n    })\n\n    return\n  }\n\n  addIngredientInCompositionOfWok(categoryName, productId)\n}\nconst addWokToBasket = async () => {\n  if (!selectedWok.value) {\n    showSnackbar({\n      message: 'Выберите пожалуйста, ингредиенты',\n    })\n\n    return\n  }\n\n  await basketStore.addProduct(selectedWok.value.id)\n\n  if (!basketError.value) {\n    clearCompositionOfWok()\n\n    showSnackbar({\n      message: 'Добавлено в корзину',\n      type: SnackbarType.SUCCESS,\n    })\n  } else if (\n    basketError.value.response?.status === 422 &&\n    basketError.value.response?.data?.product_id\n  ) {\n    showSnackbar({\n      message: basketError.value.response?.data?.product_id[0],\n    })\n  } else if (basketIsDisabled.value) {\n    showSnackbar({\n      message: 'Приём заказов приостановлен',\n    })\n  } else {\n    showSnackbar({\n      message: 'Что-то пошло не так :( Попробуйте позже',\n    })\n\n    // @ts-ignore\n    $sentryCaptureException(basketError.value)\n  }\n}\n\ndefineRule('required', requiredValidator)\n</script>\n\n<template>\n  <div class=\"page\" :class=\"{ 'page--desktop': isDesktop }\">\n    <app-head\n      :title=\"page?.seo?.seo_title\"\n      :seo=\"{\n        title: page?.seo?.seo_title,\n        description: page?.seo?.seo_description,\n        keywords: page?.seo?.seo_keywords,\n        seo_title: page?.seo?.seo_title,\n      }\"\n    />\n\n    <app-breadcrumbs\n      v-if=\"showBreadcrumb\"\n      class=\"breadcrumbs\"\n      :server-breadcrumbs=\"breadcrumbs\"\n    />\n\n    <h1 class=\"page-title\">Соберите свой WOK</h1>\n\n    <vee-form v-slot=\"{ errors }\">\n      <v-form class=\"flex-wrapper\" :value=\"!Object.keys(errors).length\">\n        <div class=\"categories\">\n          <vee-field\n            v-for=\"(category, index) in categories\"\n            :key=\"category.name\"\n            immediate\n            :vid=\"category.name\"\n            :name=\"category.name\"\n            rules=\"required\"\n          >\n            <wok-category\n              :description=\"category.description\"\n              :name=\"category.name\"\n              :number-category=\"index\"\n              :products=\"category.products\"\n              :currency=\"currencySymbol\"\n              :value=\"\n                compositionOfWok[category.name]\n                  ? compositionOfWok[category.name].id\n                  : null\n              \"\n              @input=\"addIngredient\"\n            />\n            <hr v-if=\"index !== categories.length - 1\" class=\"line\" />\n          </vee-field>\n        </div>\n        <div class=\"sticky-block\">\n          <transition v-if=\"isDesktop\" name=\"alert\">\n            <wok-alert v-if=\"!selectedWok && !snackbar.show\" class=\"alert\">\n              Выберите, пожалуйста, ингредиенты\n            </wok-alert>\n          </transition>\n\n          <wok-status-panel\n            :composition-of-wok=\"compositionOfWok\"\n            :categories=\"categories\"\n            :total-price=\"totalPrice\"\n            :total-weight=\"totalWeight\"\n            :currency=\"currencySymbol\"\n            :valid=\"!Object.keys(errors).length\"\n            @add-wok-to-basket=\"addWokToBasket\"\n          />\n        </div>\n      </v-form>\n    </vee-form>\n  </div>\n</template>\n<style lang=\"scss\" scoped>\n.breadcrumbs {\n  margin-bottom: 50px;\n}\n.page-title {\n  margin-bottom: 26px;\n  font-size: 18px;\n  font-weight: 800;\n  color: #2c2c2c;\n}\n.flex-wrapper {\n  display: flex;\n  flex-direction: column;\n  .categories {\n    flex: 1 1 auto;\n    margin-bottom: 20px;\n    .line {\n      margin-top: 40px;\n      margin-bottom: 30px;\n      border-color: $very-light-grey;\n      border-width: 0 0 1px 0;\n    }\n  }\n  .sticky-block {\n    position: sticky;\n    bottom: 0;\n    display: flex;\n    flex-direction: column;\n    margin: 0 -16px;\n    .alert {\n      margin: 0 10px 16px 10px;\n      &-enter-active,\n      &-leave-active {\n        max-height: 400px;\n        opacity: 0.9;\n        transition: 0.15s ease-in-out;\n      }\n      &-enter,\n      &-leave-to {\n        max-height: 0;\n        opacity: 0;\n      }\n    }\n  }\n}\n\n.ingredients {\n  font-size: 12px;\n  font-weight: 600;\n  background: $black;\n  border-radius: 10px;\n}\n</style>\n\n<style lang=\"scss\" scoped>\n.page--desktop {\n  padding-top: 50px;\n  .page-title {\n    margin-bottom: 30px;\n    font-size: 28px;\n  }\n  .flex-wrapper {\n    flex-direction: row;\n    justify-content: space-between;\n    .categories {\n      margin-right: 85px;\n      margin-bottom: 0;\n      .line {\n        margin-top: 30px;\n        margin-bottom: 20px;\n      }\n    }\n    .sticky-block {\n      top: 138px;\n      bottom: unset;\n      flex: 0 0 384px;\n      align-self: flex-start;\n      margin: 0;\n      .alert {\n        order: 2;\n        margin: 60px auto 0 0;\n      }\n    }\n  }\n}\n</style>\n"],"names":["GeneratorBackgroud","props","__props","isDesktop","isMobileOrTablet","useDevice","filterWeight","computed","emits","__emit","productImage","ProductNoImage","selectProduct","id","cityStore","useCityStore","basketStore","useBasketStore","showSnackbar","useAppStore","$sentryCaptureException","useNuxtApp","compositionOfWok","ref","wokConstructorEnabled","page","error","__temp","__restore","_withAsyncContext","useAsyncData","nuxtApp","createError","HttpStatusCode","result","NotFoundError","ServerError","Success","showError","selectedWok","compositionOfWokProductId","category","_a","wok","component","padeg","breadcrumbs","_b","_c","snackbar","categories","currencySymbol","showBreadcrumb","totalWeight","totalPrice","basketError","basketIsDisabled","getProductOfCategory","categoryName","productId","product","setProductToCompositionOfWok","addIngredientInCompositionOfWok","clearCompositionOfWok","addIngredient","addWokToBasket","_e","_d","SnackbarType","defineRule","requiredValidator"],"mappings":";;+qCAAA,MAAeA,GAAA,GAAA,IAAA,IAAA,qCAAA,YAAA,GAAA,EAAA,iiBCUf,MAAMC,EAAQC,2jDCDd,KAAM,CAAE,UAAAC,EAAW,iBAAAC,CAAiB,EAAIC,EAAU,EAE5CJ,EAAQC,EA4BRI,EAAeC,EAAS,IAC5BN,EAAM,YAAc,IAChB,GAAGA,EAAM,WAAW,KACpB,IAAIA,EAAM,YAAc,KAAM,QAAQ,CAAC,CAAC,KAAA,EAGxCO,EAAQC,gtDCxCR,KAAA,CAAE,UAAAN,GAAcE,IAEhBJ,EAAQC,EA4BRQ,EAAeH,EAAS,IAAMN,EAAM,OAASU,CAAc,EAE3DH,EAAQC,yzBC9BR,KAAA,CAAE,UAAAN,GAAcE,IAEhBJ,EAAQC,EAgBRM,EAAQC,EAERG,EAAiBC,GAAeL,EAAM,QAASK,CAAE,gyBCxBjD,KAAA,CAAE,UAAAV,GAAcE,IAEhBJ,EAAQC,EA8BRM,EAAQC,EAERG,EAAiBC,GAAe,CAC9BL,EAAA,QAASP,EAAM,KAAMY,CAAE,CAAA,ylBCVzB,KAAA,CAAE,UAAAV,GAAcE,IAEhBS,EAAYC,KACZC,EAAcC,KAEd,CAAE,aAAAC,GAAiBC,KACnB,CAAE,wBAAAC,GAA4BC,KAE9BC,EAAmBC,GAAI,CAAA,CAAsB,EAE7CC,EAAwBjB,EAC5B,IAAMO,EAAU,SAAS,uBAAA,EAGrB,CAAE,KAAMW,EAAM,MAAAC,CAAU,GAAA,CAAAC,EAAAC,CAAA,EAAAC,GAAA,SAAMC,GAAa,MAAOC,GAAY,CAC9D,GAAA,CAACP,EAAsB,MACzB,MAAMQ,EAAY,CAChB,WAAYC,EAAe,SAAA,CAC5B,EAGH,MAAMC,EAAS,MAAMH,GAAA,YAAAA,EAAS,YAAY,IAAI,aAE9C,GAAIG,aAAkBC,GACpB,MAAMH,EAAY,CAChB,WAAYC,EAAe,SAAA,CAC5B,EAGH,GAAIC,aAAkBE,GACpB,MAAMJ,EAAY,CAChB,WAAYC,EAAe,qBAAA,CAC5B,EAGH,GAAIC,aAAkBG,GAAS,OAAOH,EAAO,IAAA,EAC/C,aAAC,CAAA,mBAEGR,EAAM,OAAOY,GAAUZ,EAAM,KAAK,EAEhC,MAAAa,EAAchC,EAAS,IAAM,OACjC,MAAMiC,EAA4B,IAAI,IACpC,OAAO,KAAKlB,EAAiB,KAAK,EAAE,IACjCmB,GAAanB,EAAiB,MAAMmB,CAAQ,EAAE,EACjD,CAAA,EAGF,OAAOC,EAAAjB,EAAK,QAAL,YAAAiB,EAAY,SAAS,KAAMC,GACzBA,EAAI,WAAW,MAAOC,GACpBJ,EAA0B,IAAII,EAAU,UAAU,CAC1D,EACF,CACF,EAEKC,EAAQtC,EAAS,IAAMO,EAAU,SAAS,KAAK,EAE/CgC,EAAcvC,EAAS,IAAM,WAAA,OACjC,CAAE,KAAM,oBAAmBmC,EAAAG,EAAM,QAAN,YAAAH,EAAa,IAAI,GAAI,KAAM,GAAI,EAC1D,CAAE,KAAM,gBAAeK,EAAAF,EAAM,QAAN,YAAAE,EAAa,IAAI,GAAI,KAAM,gBAAiB,EACnE,CAAE,KAAM,sBAAqBC,EAAAH,EAAM,QAAN,YAAAG,EAAa,IAAI,GAAI,KAAM,YAAa,CAAA,EACtE,EAEKC,GAAW1C,EAAS,IAAMY,KAAc,QAAQ,EAEhD+B,EAAa3C,EAAS,IAAM,OAAA,QAAAmC,EAAAjB,EAAK,QAAL,YAAAiB,EAAY,aAAc,CAAA,EAAE,EAExDS,EAAiB5C,EAAS,IAAMO,EAAU,cAAc,EAExDsC,GAAiB7C,EACrB,IAAMuC,EAAY,MAAM,SAAW,GAAK3C,CAAA,EAGpCkD,GAAc9C,EAAS,IAAM,CACjC,IAAI8C,EAAc,EAElB,cAAO,KAAK/B,EAAiB,KAAK,EAAE,QAASmB,GAAa,CACxDY,EAAcA,GAAe/B,EAAiB,MAAMmB,CAAQ,EAAE,QAAU,EAAA,CACzE,EAEMY,CAAA,CACR,EAEKC,GAAa/C,EAAS,IAAM,CAChC,IAAI+C,EAAa,EAEjB,cAAO,KAAKhC,EAAiB,KAAK,EAAE,QAASmB,GAAa,CACxDa,EAAaA,GAAchC,EAAiB,MAAMmB,CAAQ,EAAE,OAAS,EAAA,CACtE,EAEMa,CAAA,CACR,EAEKC,EAAchD,EAAS,IAAMS,EAAY,KAAK,EAC9CwC,GAAmBjD,EAAS,IAAMS,EAAY,gBAAgB,EAE9DyC,EAAuB,CAACC,EAAsBC,IAAsB,OAClE,MAAAlB,GAAWC,EAAAjB,EAAK,QAAL,YAAAiB,EAAY,WAAW,KACrCD,GAAaA,EAAS,OAASiB,GAGlC,GAAKjB,EAEL,OAAOA,EAAS,SAAS,KAAMmB,GAAYA,EAAQ,KAAOD,CAAS,CAAA,EAG/DE,GAA+B,CACnCH,EACAE,IACG,CAEctC,EAAA,MAAMoC,CAAY,EAAIE,CAAA,EAGnCE,GAAkC,CACtCJ,EACAC,IACG,CACG,MAAAC,EAAUH,EAAqBC,EAAcC,CAAS,EAE5DE,GAA6BH,EAAcE,CAAO,CAAA,EAG9CG,GAAwB,IAAOzC,EAAiB,MAAQ,CAAA,EAExD0C,GAAgB,CAACN,EAAsBC,IAAsB,CAMjE,GAAI,CALiCF,EACnCC,EACAC,CAAA,EAGY,CACCzC,EAAA,CACX,QAAS,qBAAA,CACV,EAED,MACF,CAEA4C,GAAgCJ,EAAcC,CAAS,CAAA,EAEnDM,GAAiB,SAAY,eAC7B,GAAA,CAAC1B,EAAY,MAAO,CACTrB,EAAA,CACX,QAAS,kCAAA,CACV,EAED,MACF,CAEA,MAAMF,EAAY,WAAWuB,EAAY,MAAM,EAAE,EAE5CgB,EAAY,QAQfb,EAAAa,EAAY,MAAM,WAAlB,YAAAb,EAA4B,UAAW,OACvCM,GAAAD,EAAAQ,EAAY,MAAM,WAAlB,YAAAR,EAA4B,OAA5B,MAAAC,EAAkC,YAErB9B,EAAA,CACX,SAASgD,GAAAC,EAAAZ,EAAY,MAAM,WAAlB,YAAAY,EAA4B,OAA5B,YAAAD,EAAkC,WAAW,EAAC,CACxD,EACQV,GAAiB,MACbtC,EAAA,CACX,QAAS,6BAAA,CACV,GAEYA,EAAA,CACX,QAAS,yCAAA,CACV,EAGDE,EAAwBmC,EAAY,KAAK,IAvBnBQ,KAET7C,EAAA,CACX,QAAS,sBACT,KAAMkD,GAAa,OAAA,CACpB,EAmBH,EAGF,OAAAC,GAAW,WAAYC,EAAiB","debug_id":"b44a724b-325e-5c5b-a8a1-58057834055f"}