{"version":3,"file":"BobChORs.js","sources":["../../../../components/uikit/celebrity/CelebrityCard.vue","../../../../components/business/celebrity/CelebrityBlock.vue"],"sourcesContent":["<template>\n  <div class=\"osk-celebrity-card\">\n    <img\n      v-if=\"celebrityComp.avatarPath\"\n      :src=\"celebrityComp.avatarPath\"\n      :alt=\"String(celebrityComp.id ?? 'avatar')\"\n      class=\"osk-celebrity-card__img\"\n    >\n\n    <account-o-community-badge\n      v-if=\"celebrityComp.communityBadge\"\n      :model-value=\"celebrityComp.communityBadge\"\n      :user=\"celebrityComp\"\n      with-dialog\n      class=\"osk-celebrity-card__badge\"\n      border-color=\"#f5f5f5\"\n    />\n\n    <div\n      v-if=\"celebrityComp.name\"\n      class=\"osk-celebrity-card__name\"\n    >\n      {{ celebrityComp.name }}\n    </div>\n\n    <div\n      v-if=\"celebrityComp.followersCount\"\n      class=\"osk-celebrity-card__subscribers\"\n    >\n      {{ celebrityComp.followersCount }} подписчиков\n    </div>\n\n    <div\n      v-if=\"celebrityComp.productsCount\"\n      class=\"osk-celebrity-card__productsCount\"\n    >\n      {{ celebrityComp.productsCount }} {{ pluralize(celebrityComp.productsCount, ['товар', 'товара', 'товаров']) }}\n    </div>\n\n    <UikitButton\n      :to=\"`/profile/${celebrityComp.id}`\"\n      outline\n      full-width\n      :size=\"!isMounted || isDesktop ? 'm' : 's'\"\n      class=\"osk-celebrity-card__button\"\n      @click=\"handleClick\"\n    >\n      К товарам\n    </UikitButton>\n  </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { SocialAccountDTO, CelebrityDTO, PublicProfileDTO } from '~/restAPI/data-contracts';\n\nconst props = defineProps<{\n  data: SocialAccountDTO | CelebrityDTO\n  index?: number\n}>();\n\nconst emits = defineEmits<{\n  (e: 'click', value: { id?: string | number, index?: number }): void,\n}>();\n\nconst { isDesktop, isMounted } = useUiBreakpoints();\n\nconst celebrityComp = computed(() => {\n  const { data } = props;\n\n  const isSocialAccountDTO = checkSocialAccountDTO(data);\n\n  return {\n    id: isSocialAccountDTO ? data.userId : data.userDTO?.id,\n    avatarPath: isSocialAccountDTO ? data.avatarPath : data.userDTO?.avatarPath,\n    name: isSocialAccountDTO ? data.name : data.userDTO?.name,\n    followersCount: isSocialAccountDTO ? data.subscribersCount : data.instagramFollowerCount,\n    productsCount: isSocialAccountDTO ? data.productsCount : data.productCount,\n    communityBadge: isSocialAccountDTO ? data.communityBadge : data.userDTO?.communityBadge,\n    nickname: isSocialAccountDTO ? data.nickname : data.userDTO?.nickName,\n  } as PublicProfileDTO;\n});\n\nfunction checkSocialAccountDTO(data: SocialAccountDTO | CelebrityDTO): data is SocialAccountDTO {\n  return !!(data as SocialAccountDTO).userId;\n}\n\nfunction handleClick() {\n  emits('click', { id: celebrityComp.value.id, index: props.index });\n}\n</script>\n\n<style scoped lang=\"scss\">\n@import \"~/assets/scss/settings/index\";\n\n.osk-celebrity-card {\n  background-color: rgba(0,0,0,.04);\n  border-radius: 4px;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  padding: 22px 16px 16px;\n  min-height: 309px;\n\n  @include media-query(lg-and-up) {\n    padding: 32px 20px 20px;\n    min-height: 412px;\n  }\n\n  &__img {\n    display: block;\n    width: 100px;\n    height: 100px;\n    border-radius: 100px;\n\n    @include media-query(lg-and-up) {\n      width: 189px;\n      height: 189px;\n      border-radius: 189px;\n    }\n  }\n\n  &__badge {\n    max-width: 100%;\n    margin-top: -15px;\n    margin-bottom: 24px;\n\n    @include media-query(lg-and-up) {\n      margin-bottom: 32px;\n    }\n  }\n\n  &__productsCount {\n    @include media-query(lg-and-up) {\n      margin-bottom: 8px;\n    }\n  }\n\n  &__name {\n    font-weight: 700;\n    font-size: 16px;\n    line-height: normal;\n    margin-bottom: 12px;\n    text-align: center;\n  }\n\n  &__button {\n    margin-top: auto;\n    background: $grey-4;\n  }\n}\n</style>\n","<template>\n  <section\n    ref=\"$block\"\n    class=\"osk-celebrity-block\"\n  >\n    <div class=\"osk-wrapper\">\n      <h2\n        v-if=\"title\"\n        class=\"osk-celebrity-block__title\"\n      >\n        {{ title }}\n      </h2>\n\n      <UikitSwiper\n        v-if=\"data?.length\"\n        ref=\"$swiper\"\n        off\n        navigation\n        :css-mode=\"!isDesktop\"\n        :breakpoints=\"sliderBreakpoints\"\n        class=\"osk-celebrity-block__swiper\"\n        @slide-change=\"handleSlideChange\"\n      >\n        <UikitSwiperSlide\n          v-for=\"(item, index) in data\"\n          :key=\"index\"\n        >\n          <UikitCelebrityCard\n            :data=\"item\"\n            :index=\"index\"\n            @click=\"handleClick\"\n          />\n        </UikitSwiperSlide>\n      </UikitSwiper>\n    </div>\n  </section>\n</template>\n\n<script lang=\"ts\" setup>\nimport { SocialAccountDTO, CelebrityDTO } from '~/restAPI/data-contracts';\nimport { IOptions } from '~/types/analytics';\n\nconst sliderBreakpoints = {\n  0: {\n    slidesPerView: 1.5,\n    slidesPerGroup: 1,\n    spaceBetween: 0,\n    navigation: { enabled: false },\n  },\n  478: {\n    slidesPerView: 2,\n    slidesPerGroup: 2,\n    spaceBetween: 0,\n    navigation: { enabled: false },\n  },\n  580: {\n    slidesPerView: 2.5,\n    slidesPerGroup: 2,\n    spaceBetween: 0,\n    navigation: { enabled: false },\n  },\n  700: {\n    slidesPerView: 3,\n    slidesPerGroup: 3,\n    spaceBetween: 0,\n    navigation: { enabled: false },\n  },\n  1024: {\n    slidesPerView: 4,\n    slidesPerGroup: 4,\n    spaceBetween: 24,\n    navigation: { enabled: true },\n  },\n};\n\nconst props = defineProps<{\n  title?: string\n  data: (SocialAccountDTO | CelebrityDTO)[] | null\n  chapter?: string\n  chapterId?: string\n  analytics?: IOptions\n}>();\n\nconst $block = ref<ComponentPublicInstance>();\nconst $swiper = ref();\n\nconst { isDesktop } = useUiBreakpoints();\n\nfunction isSocialAccountDTO(value: SocialAccountDTO | CelebrityDTO): value is SocialAccountDTO {\n  return !!(value as SocialAccountDTO).userId;\n}\n\nconst allIds = computed(() => props.data?.map((p) => {\n  if (isSocialAccountDTO(p)) {\n    return p.userId!;\n  }\n\n  return p.id!;\n}) ?? []);\n\nconst { event, clickEvent } = useSwiperAnalytics(\n  $swiper,\n  $block,\n  allIds,\n  {\n    chapter: props.analytics?.chapter || props.chapter,\n    chapter_index: props.analytics?.chapter_index,\n    segment_id: props.analytics?.segment_id,\n    id_chapter: props.analytics?.id_chapter || props.chapterId,\n  },\n  sliderBreakpoints,\n);\n\nfunction handleClick(item: { id?: string | number, index?: number }) {\n  clickEvent({\n    id_item: String(item.id),\n    index: item.index,\n    item: 'celebrity',\n  });\n}\n\nfunction handleSlideChange() {\n  event();\n}\n</script>\n\n<style lang=\"scss\">\n@import \"~/assets/scss/settings/index\";\n\n.osk-celebrity-block {\n  padding-bottom: 42px;\n\n  @include media-query(lg-and-up) {\n    padding-bottom: 82px;\n  }\n\n  &__title {\n    @include font-style($font-size-heading, normal, $font-weight-bold);\n    padding: 0 16px 22px;\n\n    @include media-query(lg-and-up) {\n      text-transform: uppercase;\n      text-align: center;\n      padding-bottom: 34px;\n    }\n  }\n\n  .osk-wrapper {\n    padding: 0;\n\n    @include media-query(lg-and-up) {\n      padding: 0 16px;\n    }\n  }\n\n  .swiper-slide {\n    padding: 0 16px;\n    margin-right: -20px;\n\n    @include media-query(lg-and-up) {\n      padding: 0;\n      margin: 0;\n    }\n  }\n\n  .osk-swiper_off {\n    .swiper-wrapper {\n      overflow: visible;\n      justify-content: space-between;\n    }\n\n    .swiper-slide {\n      max-width: 282px;\n      margin-right: 24px;\n      flex-shrink: 0;\n    }\n  }\n\n  &__swiper {\n    .osk-swiper-button-prev,\n    .osk-swiper-button-next {\n      @media screen and (min-width: 700px) {\n        top: -42px !important;\n      }\n\n      @include media-query(lg-and-up) {\n        top: -58px !important;\n      }\n    }\n  }\n}\n</style>\n"],"names":["props","__props","emits","__emit","isDesktop","isMounted","useUiBreakpoints","celebrityComp","computed","data","isSocialAccountDTO","checkSocialAccountDTO","_a","_b","_c","_d","_e","handleClick","sliderBreakpoints","$block","ref","$swiper","value","allIds","p","event","clickEvent","useSwiperAnalytics","item","handleSlideChange"],"mappings":"m1BAuDA,MAAMA,EAAQC,EAKRC,EAAQC,EAIR,CAAE,UAAAC,EAAW,UAAAC,CAAU,EAAIC,EAAiB,EAE5CC,EAAgBC,EAAS,IAAM,eAC7B,KAAA,CAAE,KAAAC,CAAS,EAAAT,EAEXU,EAAqBC,EAAsBF,CAAI,EAE9C,MAAA,CACL,GAAIC,EAAqBD,EAAK,QAASG,EAAAH,EAAK,UAAL,YAAAG,EAAc,GACrD,WAAYF,EAAqBD,EAAK,YAAaI,EAAAJ,EAAK,UAAL,YAAAI,EAAc,WACjE,KAAMH,EAAqBD,EAAK,MAAOK,EAAAL,EAAK,UAAL,YAAAK,EAAc,KACrD,eAAgBJ,EAAqBD,EAAK,iBAAmBA,EAAK,uBAClE,cAAeC,EAAqBD,EAAK,cAAgBA,EAAK,aAC9D,eAAgBC,EAAqBD,EAAK,gBAAiBM,EAAAN,EAAK,UAAL,YAAAM,EAAc,eACzE,SAAUL,EAAqBD,EAAK,UAAWO,EAAAP,EAAK,UAAL,YAAAO,EAAc,QAAA,CAC/D,CACD,EAED,SAASL,EAAsBF,EAAiE,CACvF,MAAA,CAAC,CAAEA,EAA0B,MACtC,CAEA,SAASQ,GAAc,CACff,EAAA,QAAS,CAAE,GAAIK,EAAc,MAAM,GAAI,MAAOP,EAAM,KAAA,CAAO,CACnE,8kCC9CA,MAAMkB,EAAoB,CACxB,EAAG,CACD,cAAe,IACf,eAAgB,EAChB,aAAc,EACd,WAAY,CAAE,QAAS,EAAM,CAC/B,EACA,IAAK,CACH,cAAe,EACf,eAAgB,EAChB,aAAc,EACd,WAAY,CAAE,QAAS,EAAM,CAC/B,EACA,IAAK,CACH,cAAe,IACf,eAAgB,EAChB,aAAc,EACd,WAAY,CAAE,QAAS,EAAM,CAC/B,EACA,IAAK,CACH,cAAe,EACf,eAAgB,EAChB,aAAc,EACd,WAAY,CAAE,QAAS,EAAM,CAC/B,EACA,KAAM,CACJ,cAAe,EACf,eAAgB,EAChB,aAAc,GACd,WAAY,CAAE,QAAS,EAAK,CAC9B,CAAA,EAGIlB,EAAQC,EAQRkB,EAASC,IACTC,EAAUD,IAEV,CAAE,UAAAhB,GAAcE,IAEtB,SAASI,EAAmBY,EAAmE,CACtF,MAAA,CAAC,CAAEA,EAA2B,MACvC,CAEA,MAAMC,EAASf,EAAS,IAAM,OAAA,QAAAI,EAAAZ,EAAM,OAAN,YAAAY,EAAY,IAAKY,GACzCd,EAAmBc,CAAC,EACfA,EAAE,OAGJA,EAAE,MACL,CAAE,EAAA,EAEF,CAAE,MAAAC,EAAO,WAAAC,CAAA,EAAeC,EAC5BN,EACAF,EACAI,EACA,CACE,UAASX,EAAAZ,EAAM,YAAN,YAAAY,EAAiB,UAAWZ,EAAM,QAC3C,eAAea,EAAAb,EAAM,YAAN,YAAAa,EAAiB,cAChC,YAAYC,EAAAd,EAAM,YAAN,YAAAc,EAAiB,WAC7B,aAAYC,EAAAf,EAAM,YAAN,YAAAe,EAAiB,aAAcf,EAAM,SACnD,EACAkB,CAAA,EAGF,SAASD,EAAYW,EAAgD,CACxDF,EAAA,CACT,QAAS,OAAOE,EAAK,EAAE,EACvB,MAAOA,EAAK,MACZ,KAAM,WAAA,CACP,CACH,CAEA,SAASC,GAAoB,CACrBJ,GACR"}