{"version":3,"file":"CA8cFg6C.js","sources":["../../../../components/uikit/user/User.vue","../../../../components/uikit/user/LikesCount.vue"],"sourcesContent":["<template>\n  <div\n    :class=\"{\n      'osk-user': true,\n      [`osk-user_size-${size}`]: !!size\n    }\"\n  >\n    <UikitUserAvatar\n      :user=\"user\"\n      :size=\"size\"\n    />\n\n    <div class=\"osk-user__content\">\n      <div class=\"osk-user__content-name\">\n        <nuxt-link\n          class=\"osk-user__name\"\n          :to=\"`/profile/${user.id}`\"\n          @click=\"handleUserClick(user)\"\n        >\n          {{ user.name }}\n        </nuxt-link>\n\n        <UikitIcon\n          v-if=\"user.isTrusted\"\n          name=\"UserVerified\"\n          class=\"osk-user__trusted\"\n        />\n      </div>\n\n      <div\n        v-if=\"showDate\"\n        class=\"osk-user__type\"\n      >\n        {{ registrationDateStr }} на Oskelly\n      </div>\n\n      <div\n        v-if=\"!hideType\"\n        class=\"osk-user__type\"\n      >\n        {{ userType }}\n      </div>\n\n      <div\n        v-if=\"size === 'l' && user.productsCount\"\n        class=\"osk-user__items-count\"\n      >\n        {{ user.productsCount }} {{ pluralize(user.productsCount, ['товар', 'товара', 'товаров']) }}\n      </div>\n    </div>\n\n    <UikitButton\n      v-if=\"showFollow && !isCurrentUser\"\n      class=\"osk-user__button\"\n      color=\"secondary\"\n      size=\"s\"\n      :outline=\"isFollowed\"\n      :loading=\"followLoading\"\n      @click=\"handleFollow\"\n    >\n      {{ followedText }}\n    </UikitButton>\n  </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { UserDTO, PublicProfileDTO } from '~/restAPI/data-contracts';\nimport { pluralize } from '~/utils/extra';\n\nconst props = withDefaults(defineProps<{\n  user: UserDTO | PublicProfileDTO,\n  size?: 's' | 'm' | 'l',\n  showFollow?: boolean\n  showDate?: boolean\n  hideType?: boolean\n}>(), {\n  size: 's',\n});\n\nconst emits = defineEmits<{\n  (e: 'changeFollow', value: boolean): void,\n  (e: 'userClick', userId: number | string): void,\n}>();\n\nconst { getUserOnOskellyTime } = useDateFormatter();\nconst { openPhoneVerifyDialog, phoneVerifyWebPopup } = usePhoneVerification();\n\nconst userType = computed(() => (props.user.isPro ? 'Бутик' : 'Частный продавец'));\n\nconst registrationDateStr = computed<string>(() => {\n  if (!props.user.registrationTime) return '';\n\n  const registerDate = new Date(props.user.registrationTime * 1000);\n\n  return getUserOnOskellyTime(registerDate);\n});\n\nconst { isAuth, account } = useAccountStore();\nconst {\n  followLoading, isFollowed, follow, followedText,\n} = useFollowUser(props.user);\n\nconst isCurrentUser = computed<boolean>(() => (isAuth.value ? account.value.id === props.user.id : false));\n\nasync function handleFollow() {\n  if (!isFollowed.value && phoneVerifyWebPopup.value?.productSceneSubscribe) {\n    openPhoneVerifyDialog({\n      chapter: 'productSceneSubscribe',\n      phoneText: 'Чтобы всегда быть в курсе новых товаров этого продавца',\n    });\n  }\n\n  await follow();\n  emits('changeFollow', isFollowed.value);\n}\n\nfunction handleUserClick(user: UserDTO | PublicProfileDTO) {\n  if (!user.id) return;\n\n  emits('userClick', user.id);\n}\n</script>\n\n<style scoped lang=\"scss\">\n@import \"~/assets/scss/settings/index\";\n\n.osk-user {\n  display: flex;\n  align-items: center;\n\n  &__content {\n    max-width: calc(100% - 45px);\n  }\n\n  &__content-name {\n    margin-bottom: 2px;\n    display: flex;\n    align-items: center;\n  }\n\n  &__name {\n    @include overflow-ellipsis;\n    font-weight: $font-weight-semibold;\n    display: inline-block;\n\n    &:hover {\n      text-decoration: underline;\n    }\n  }\n\n  &__type {\n    color: $grey;\n  }\n\n  &__trusted {\n    margin-left: 4px;\n    width: 17px;\n    height: 17px;\n    flex-shrink: 0;\n  }\n\n  &_size-s {\n    .osk-user {\n      &__name,\n      &__type {\n        font-size: $font-size-caption;\n        line-height: $line-height-caption;\n      }\n\n      &__name {\n        @media screen and (min-width: 580px) {\n          font-size: $font-size-body;\n          line-height: $line-height-body;\n        }\n      }\n    }\n  }\n\n  &_size-m {\n    .osk-user {\n      &__type {\n        font-size: $font-size-caption;\n        line-height: $line-height-caption;\n      }\n\n      &__name {\n        font-size: $font-size-subheading;\n        line-height: $line-height-subheading;\n        margin-bottom: 4px;\n      }\n    }\n  }\n\n  // TODO Доделать другие размеры\n  // &_size-m {\n  //   .osk-user {\n  //     &__name {\n  //       // @apply lg:text-base text-sm lg:leading-4 leading-[14px] font-bold;\n  //     }\n\n  //     &__type {\n  //       // @apply lg:text-sm text-xs lg:leading-4 leading-3 mt-1;\n  //     }\n  //   }\n  // }\n\n  // &_size-l {\n  //   .osk-user {\n  //     &__name {\n  //       font-size: $font-size-body;\n  //       line-height: $line-height-body;\n\n  //       @media screen and (min-width: 767px) {\n  //         // @apply text-base leading-4;\n  //       }\n  //     }\n\n  //     &__type,\n  //     &__items-count {\n  //       font-size: $font-size-caption;\n  //       line-height: $line-height-caption;\n\n  //       @media screen and (min-width: 767px) {\n  //         // @apply text-sm leading-4 mt-1;\n  //       }\n  //     }\n\n  //     &__items-count {\n  //       color: $grey;\n  //     }\n  //   }\n  // }\n\n  &__button {\n    width: 108px;\n    height: 31px;\n    line-height: 31px;\n    margin-left: auto;\n    font-size: 12px;\n    padding: 0;\n  }\n}\n</style>\n","<template>\n  <component\n    :is=\"isButton ? UikitButton : 'div'\"\n    :class=\"{ 'osk-likes-count__button': isButton }\"\n    :loading=\"loading\"\n    @click=\"handleToggleLike\"\n  >\n    <div\n      :class=\"{\n        'osk-likes-count': true,\n        [`osk-likes-count_active`]: likeOpts.isLiked,\n        [`osk-likes-count_reverse`]: isReverse\n      }\"\n    >\n      <div\n        v-if=\"isShowCount\"\n        class=\"osk-likes-count__count\"\n      >\n        {{ likeOpts.count }}\n      </div>\n\n      <UikitIcon\n        class=\"osk-likes-count__icon\"\n        :name=\"likeOpts.isLiked ? 'HeartFilled' : 'Heart'\"\n        :size=\"iconSize ?? 'm'\"\n        :color=\"iconColor\"\n      />\n    </div>\n  </component>\n</template>\n\n<script lang=\"ts\" setup>\nimport UikitButton from '@/components/uikit/Button.vue';\nimport { IOptions } from '~/types/analytics';\n\nconst props = defineProps<{\n  likesCount?: number,\n  isLiked?: boolean,\n  isReverse?: boolean,\n  isHideZero?: boolean,\n  hideCount?: boolean,\n  productId: number,\n  chapter?: string\n  chapterId?: string\n  colorWhite?: boolean\n  isButton?: boolean\n  iconSize?: 's' | 'm' | 'l' | 'xl' | 'auto'\n  analytics?: IOptions\n}>();\n\nconst emits = defineEmits<{\n  (e: 'like', productId: number): void,\n  (e: 'dislike', productId: number): void,\n}>();\n\nconst { isAuth, openAuthDialog } = useAccountStore();\nconst { toggleLike } = useWishlistStore();\nconst { openPhoneVerifyDialog, phoneVerifyWebPopup } = usePhoneVerification();\n\nconst loading = ref(false);\n\nconst likeOpts = reactive({\n  count: props.likesCount ?? 0,\n  isLiked: props.isLiked ?? false,\n});\n\nconst isShowCount = computed<boolean>(() => !props.hideCount && (likeOpts.count > 0 ? true : props.isHideZero !== true));\nconst iconColor = computed(() => {\n  if (likeOpts.isLiked) return 'red';\n\n  return props.colorWhite ? 'white' : 'black';\n});\n\nasync function handleToggleLike() {\n  if (!isAuth.value) {\n    openAuthDialog({ chapter: 'product_like' });\n\n    return;\n  }\n\n  if (loading.value) return;\n\n  if (!likeOpts.isLiked && phoneVerifyWebPopup.value?.addToFavorites) {\n    openPhoneVerifyDialog({\n      chapter: 'addToFavorites',\n      phoneText: 'Мы сохраним его для будущих заказов',\n    });\n  }\n\n  loading.value = true;\n\n  try {\n    const res = await toggleLike(props.productId, likeOpts.isLiked, props.chapter, props.chapterId, props.analytics);\n\n    if (res) {\n      if (likeOpts.isLiked) {\n        likeOpts.isLiked = false;\n        emits('dislike', props.productId);\n      } else {\n        likeOpts.isLiked = true;\n        emits('like', props.productId);\n      }\n    }\n    loading.value = false;\n  } catch {\n    loading.value = false;\n  }\n}\n\nwatch(() => props.isLiked, (value) => {\n  likeOpts.isLiked = !!value;\n\n  if (value) {\n    likeOpts.count++;\n  } else {\n    likeOpts.count--;\n  }\n});\n\nwatch(() => props.likesCount, (value) => {\n  likeOpts.count = value ?? 0;\n});\n</script>\n\n<style scoped lang=\"scss\">\n@import \"~/assets/scss/settings/index\";\n\n.osk-likes-count {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  cursor: pointer;\n\n  &_reverse {\n    flex-direction: row-reverse;\n\n    .osk-likes-count__count {\n      margin-right: 0;\n      margin-left: $indent-xsmall;\n    }\n  }\n\n  &__count {\n    @include font-style($font-size-body, $line-height-body, $font-weight-medium);\n    margin-right: $indent-xsmall;\n  }\n\n  &__button {\n    padding: 0 12px !important;\n    min-width: 46px;\n\n    .osk-likes-count__count {\n      padding-left: 4px;\n    }\n  }\n\n  &__icon {\n    flex-shrink: 0;\n  }\n}\n</style>\n"],"names":["props","__props","emits","__emit","getUserOnOskellyTime","useDateFormatter","openPhoneVerifyDialog","phoneVerifyWebPopup","usePhoneVerification","userType","computed","registrationDateStr","registerDate","isAuth","account","useAccountStore","followLoading","isFollowed","follow","followedText","useFollowUser","isCurrentUser","handleFollow","_a","handleUserClick","user","openAuthDialog","toggleLike","useWishlistStore","loading","ref","likeOpts","reactive","isShowCount","iconColor","handleToggleLike","watch","value"],"mappings":"+jCAqEA,MAAMA,EAAQC,EAURC,EAAQC,EAKR,CAAE,qBAAAC,GAAyBC,IAC3B,CAAE,sBAAAC,EAAuB,oBAAAC,CAAoB,EAAIC,EAAqB,EAEtEC,EAAWC,EAAS,IAAOV,EAAM,KAAK,MAAQ,QAAU,kBAAmB,EAE3EW,EAAsBD,EAAiB,IAAM,CAC7C,GAAA,CAACV,EAAM,KAAK,iBAAyB,MAAA,GAEzC,MAAMY,EAAe,IAAI,KAAKZ,EAAM,KAAK,iBAAmB,GAAI,EAEhE,OAAOI,EAAqBQ,CAAY,CAAA,CACzC,EAEK,CAAE,OAAAC,EAAQ,QAAAC,CAAQ,EAAIC,EAAgB,EACtC,CACJ,cAAAC,EAAe,WAAAC,EAAY,OAAAC,EAAQ,aAAAC,CAAA,EACjCC,EAAcpB,EAAM,IAAI,EAEtBqB,EAAgBX,EAAkB,IAAOG,EAAO,MAAQC,EAAQ,MAAM,KAAOd,EAAM,KAAK,GAAK,EAAM,EAEzG,eAAesB,GAAe,OACxB,CAACL,EAAW,SAASM,EAAAhB,EAAoB,QAApB,MAAAgB,EAA2B,wBAC5BjB,EAAA,CACpB,QAAS,wBACT,UAAW,wDAAA,CACZ,EAGH,MAAMY,EAAO,EACPhB,EAAA,eAAgBe,EAAW,KAAK,CACxC,CAEA,SAASO,EAAgBC,EAAkC,CACpDA,EAAK,IAEJvB,EAAA,YAAauB,EAAK,EAAE,CAC5B,ywCCrFA,MAAMzB,EAAQC,EAeRC,EAAQC,EAKR,CAAE,OAAAU,EAAQ,eAAAa,CAAe,EAAIX,EAAgB,EAC7C,CAAE,WAAAY,GAAeC,IACjB,CAAE,sBAAAtB,EAAuB,oBAAAC,CAAoB,EAAIC,EAAqB,EAEtEqB,EAAUC,EAAI,EAAK,EAEnBC,EAAWC,EAAS,CACxB,MAAOhC,EAAM,YAAc,EAC3B,QAASA,EAAM,SAAW,EAAA,CAC3B,EAEKiC,EAAcvB,EAAkB,IAAM,CAACV,EAAM,YAAc+B,EAAS,MAAQ,EAAI,GAAO/B,EAAM,aAAe,GAAK,EACjHkC,EAAYxB,EAAS,IACrBqB,EAAS,QAAgB,MAEtB/B,EAAM,WAAa,QAAU,OACrC,EAED,eAAemC,GAAmB,OAC5B,GAAA,CAACtB,EAAO,MAAO,CACFa,EAAA,CAAE,QAAS,cAAA,CAAgB,EAE1C,MACF,CAEA,GAAI,CAAAG,EAAQ,MAEZ,CAAI,CAACE,EAAS,WAAWR,EAAAhB,EAAoB,QAApB,MAAAgB,EAA2B,iBAC5BjB,EAAA,CACpB,QAAS,iBACT,UAAW,qCAAA,CACZ,EAGHuB,EAAQ,MAAQ,GAEZ,GAAA,CACU,MAAMF,EAAW3B,EAAM,UAAW+B,EAAS,QAAS/B,EAAM,QAASA,EAAM,UAAWA,EAAM,SAAS,IAGzG+B,EAAS,SACXA,EAAS,QAAU,GACb7B,EAAA,UAAWF,EAAM,SAAS,IAEhC+B,EAAS,QAAU,GACb7B,EAAA,OAAQF,EAAM,SAAS,IAGjC6B,EAAQ,MAAQ,EAAA,MACV,CACNA,EAAQ,MAAQ,EAClB,EACF,CAEA,OAAAO,EAAM,IAAMpC,EAAM,QAAUqC,GAAU,CAC3BN,EAAA,QAAU,CAAC,CAACM,EAEjBA,EACON,EAAA,QAEAA,EAAA,OACX,CACD,EAEDK,EAAM,IAAMpC,EAAM,WAAaqC,GAAU,CACvCN,EAAS,MAAQM,GAAS,CAAA,CAC3B"}