{"version":3,"file":"index-pYsLMLSq.js","sources":["../../src/views/Article/Detail/components/PhotoGallery/index.vue","../../src/views/Article/Detail/components/ArticleContent/index.vue","../../src/views/Article/components/GhostCard/index.vue","../../src/views/Article/Detail/components/Relation/index.vue","../../src/components/TvbDraggable/index.vue","../../src/views/Article/Detail/components/Article/index.vue","../../src/views/Article/Detail/components/Recommend/index.vue","../../src/views/Article/Detail/index.vue"],"sourcesContent":["<script setup>\n// 图集\nimport { computed } from 'vue'\n\nconst props = defineProps({\n  mode: { type: String, default: 'horizontal' }, // horizontal | vertical\n  images: { type: Array, default: () => [] }\n})\n\ndefineEmits(['imgClick'])\n\nconst showImages = computed(() =>\n  props.mode === 'horizontal' ? props.images.slice(0, 5) : props.images\n)\nconst remainder = computed(() => (props.images.length > 5 ? props.images.length - 5 : 0))\nconst getHClassName = (index) => {\n  const length = showImages.value.length\n  switch (length) {\n    case 1:\n      return 'col-span-12'\n    case 2:\n      return 'col-span-6'\n    case 3:\n      return 'col-span-4'\n    case 4:\n      return 'col-span-6'\n    default:\n      if (index === 0 || index === 1) return 'col-span-6'\n      return 'col-span-4'\n  }\n}\n</script>\n\n<template>\n  <div class=\"tvb-photo-gallery\">\n    <div v-if=\"mode === 'horizontal'\" class=\"photo-gallery-horizontal\">\n      <template v-for=\"(img, idx) in showImages\" :key=\"idx\">\n        <tvb-router-link\n          :to=\"img.jump_url\"\n          v-bind=\"img.jump_url ? { linkRel: 1, linkTarget: 1 } : null\"\n          class=\"photo-gallery__image-wrap\"\n          :class=\"getHClassName(idx)\"\n          @click=\"$emit('imgClick', img)\"\n        >\n          <!-- <tvb-image\n            class=\"photo-gallery__cover\"\n            :src=\"img.thumb\"\n            :alt=\"img.image_alt_text\"\n          ></tvb-image> -->\n          <img class=\"photo-gallery__cover\" v-lazy=\"img.thumb.medium\" :alt=\"img.image_alt_text\" />\n          <div\n            v-if=\"showImages.length === idx + 1 && remainder > 0\"\n            class=\"photo-gallery__remainder\"\n          >\n            +{{ remainder }}\n          </div>\n        </tvb-router-link>\n      </template>\n    </div>\n    <div v-if=\"mode === 'vertical'\" class=\"photo-gallery-vertical\">\n      <template v-for=\"(img, idx) in showImages\" :key=\"idx\">\n        <figure>\n          <tvb-router-link\n            :to=\"img.jump_url\"\n            v-bind=\"img.jump_url ? { linkRel: 1, linkTarget: 1 } : null\"\n            class=\"photo-gallery__image-wrap\"\n            :class=\"{ 'tvb-img_href': img.jump_url }\"\n            @click=\"$emit('imgClick', img)\"\n          >\n            <!-- <tvb-image\n              class=\"photo-gallery__cover\"\n              :src=\"img.thumb\"\n              :alt=\"img.image_alt_text\"\n            ></tvb-image> -->\n            <img class=\"photo-gallery__cover\" v-lazy=\"img.thumb.medium\" :alt=\"img.image_alt_text\" />\n          </tvb-router-link>\n          <figcaption v-if=\"img.description\" class=\"tvb-img_des\">{{ img.description }}</figcaption>\n        </figure>\n      </template>\n    </div>\n  </div>\n</template>\n\n<style lang=\"scss\" scoped>\n.tvb-photo-gallery {\n  .photo-gallery-horizontal {\n    display: grid;\n    grid-auto-flow: row;\n    grid-template-columns: repeat(12, minmax(0px, 1fr));\n    gap: 0.25rem;\n\n    .col-span-12 {\n      grid-column: span 12 / span 12;\n    }\n    .col-span-6 {\n      grid-column: span 6 / span 6;\n    }\n    .col-span-4 {\n      grid-column: span 4 / span 4;\n    }\n\n    .photo-gallery__image-wrap {\n      position: relative;\n      padding-top: 75%; // 2:1.5\n    }\n\n    .photo-gallery__cover {\n      position: absolute;\n      top: 0;\n      left: 0;\n      width: 100%;\n      height: 100%;\n      object-fit: cover;\n    }\n  }\n\n  .photo-gallery-vertical {\n    display: grid;\n    gap: var(--tvb-editor-view-img-padding);\n    .photo-gallery__image-wrap {\n      img[lazy='error'],\n      img[lazy='loading'] {\n        aspect-ratio: 16 / 9;\n      }\n    }\n    .photo-gallery__cover {\n      max-width: 100%;\n      width: 100%;\n    }\n  }\n\n  .photo-gallery__image-wrap {\n    cursor: pointer;\n    font-size: 0;\n    img[lazy='error'],\n    img[lazy='loading'] {\n      padding: 0 calc(50% - (98px / 2));\n      object-fit: contain;\n    }\n  }\n\n  .photo-gallery__cover {\n    background-color: #f8f9fa;\n  }\n\n  .photo-gallery__remainder {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    color: rgba(255, 255, 255, 0.9);\n    font-size: 28px;\n    position: absolute;\n    inset: 0px;\n    background-color: rgb(0 0 0 / 0.4);\n  }\n\n  &.mobile {\n    .photo-gallery-horizontal {\n      gap: 3px;\n    }\n    .photo-gallery__remainder {\n      font-size: 20px;\n    }\n  }\n}\n</style>\n","<script setup>\nimport { inject, ref, computed, watch, onMounted } from 'vue'\nimport usePhotoswipe from './usePhotoswipe'\nimport '@/assets/style/editorView.css'\nimport PhotoGallery from '../PhotoGallery/index.vue'\nimport { sha1 } from 'js-sha1'\n\nconst props = defineProps({\n  content: { type: Array, default: () => [] },\n  id: { type: [String, Number], default: null },\n  img: { type: String, default: '' },\n  thumbnail: { type: String, default: '' }\n})\n\nconst emit = defineEmits(['viewerShown', 'viewerChange'])\n\nconst size = inject('size')\nconst isMobile = computed(() => ['s', 'xs'].includes(size.value))\nconst contents = computed(() => handle(props.content))\nconst images = ref([])\nconst richTextImgs = computed(() =>\n  props.img ? [{ src: props.img, thumbnail: props.thumbnail }, ...images.value] : images.value\n)\nconst changeFn = (pswp) => {\n  emit('viewerChange', pswp)\n  window.history.replaceState(\n    history.state,\n    null,\n    location.origin + location.pathname + `?photo_id=${sha1(pswp.currSlide.data.src)}`\n  )\n}\nconst { lightbox } = usePhotoswipe(richTextImgs, changeFn)\n\n// 1：richtext 2：图集\nconst handle = (value = []) => {\n  let arr = value.filter((v) => v.type)\n  for (const item of arr) {\n    if (item.type === 1) {\n      item.rich_text.html = handleRichtext(item.rich_text.html)\n    }\n    if (item.type === 2) handleAlbum(item.image)\n  }\n  return arr\n}\n\nconst replaceBookmarks = (hash) => {\n  return `javascript:window.scrollBy({top: document.getElementById('${hash.substr(\n    1\n  )}').getBoundingClientRect().top - (document.querySelector('.editor-content-view-mobile') ? 84 : 64)})`\n}\n\nconst letslazyload = (str) => {\n  let regexp1 = new RegExp(/(<img )([^>]*)(src=\")([^\"]*\")([^>]*)(>)/, 'g')\n  let res = str.replace(regexp1, function (match, p1, p2, p3, p4, p5, p6) {\n    return p1 + p2 + 'data-src=\"' + p4 + p5 + p6\n  })\n  return res\n}\n\nconst handleRichtext = (value) => {\n  try {\n    const res = new DOMParser().parseFromString(value, 'text/html')\n    const imgNodes = res.querySelectorAll('img')\n    let imgs = []\n    for (const target of imgNodes) {\n      // target.loading = 'lazy'\n      const desc = target.dataset?.desc\n      const href = target.dataset?.href\n      // 处理错误图片\n      // const onerror = `javascript:this.src='/image/img_header_logo@2x.png';this.classList.add('tvb-img_error')`\n      // let imgHtml = target.outerHTML.replace(/<img/g, `<img onerror=\"${onerror}\"`)\n      let imgHtml = letslazyload(target.outerHTML)\n      // 处理图片链接和描述\n      if (href) {\n        imgHtml = `<a class=\"tvb-img_href\" href=\"${href}\" target=\"_self\" rel=\"follow\" >${imgHtml}</a>`\n      } else {\n        imgs.push({ src: target.src, 'data-desc': desc || '' })\n      }\n      imgHtml = `<figure class=\"tvb-img_des-wrap\">${imgHtml}${\n        desc ? `<figcaption class='tvb-img_des'>${desc}</figcaption>` : ''\n      }</figure>`\n      target.outerHTML = imgHtml\n    }\n    images.value.push(...imgs)\n\n    // 替换书签\n    const aNodes = res.querySelectorAll('a')\n    for (const target of aNodes) {\n      const hash = target?.attributes?.href?.value\n      if (hash && hash.trim().indexOf('#') === 0) {\n        target.href = replaceBookmarks(hash)\n        target.target = ''\n      }\n    }\n\n    // 检查嵌入式帖子\n    const insNode = res.querySelector('.instagram-media')\n    const twisNode = res.querySelector('.twitter-tweet')\n    if (insNode) hasInsPost.value = true\n    if (twisNode) hasXPost.value = true\n\n    return res.body.innerHTML\n  } catch (error) {\n    return value\n  }\n}\n\nconst hasInsPost = ref(false)\nconst hasXPost = ref(false)\n\nwatch(\n  () => [hasInsPost.value, hasXPost.value],\n  () => {\n    if (hasInsPost.value) {\n      setTimeout(() => {\n        window.instgrm?.Embeds.process()\n      }, 500)\n    }\n    if (hasXPost.value) {\n      setTimeout(() => {\n        window.twttr?.widgets.load(document.getElementById(`editor${props.id}`))\n      }, 500)\n    }\n  },\n  { flush: 'post' }\n)\n\n// 图集\nconst handleAlbum = (value) => {\n  if (value?.images) {\n    const res = value.images.map((v) => {\n      return { src: v.thumb.large, thumbnail: v.thumb.small, 'data-desc': v.description || '' }\n    })\n    images.value.push(...res)\n  }\n}\n\n/**\n * 图片查看器\n */\nconst findImgIndex = (src) => {\n  return richTextImgs.value.findIndex((v) => v.src === src)\n}\n\nconst showViewer = (src, num = 0) => {\n  const findIndex = src ? findImgIndex(src) : num\n  const index = findIndex > -1 ? findIndex : 0\n  lightbox.value?.loadAndOpen(index)\n}\n\nconst onRichtextClick = (e) => {\n  const target = e.target\n  if (target?.localName === 'img') {\n    try {\n      if (target?.dataset?.href) return\n      showViewer(target?.src)\n    } catch (error) {\n      console.warn(error)\n    }\n  }\n}\n\nconst onImgClick = (e) => {\n  if (e.jump_url) return\n  showViewer(e.thumb.large)\n}\nonMounted(() => {\n  lightbox.value.on('initialLayout', () => {\n    emit('viewerShown', lightbox.value.pswp)\n  })\n  lightbox.value.on('close', () => {\n    window.history.replaceState(history.state, null, location.origin + location.pathname)\n  })\n})\ndefineExpose({ showViewer, richTextImgs })\n</script>\n\n<template>\n  <div\n    :id=\"`editor${id}`\"\n    class=\"editor-content-view article-editor-content-view\"\n    :class=\"{ 'article-editor-content-view-mobile': isMobile }\"\n  >\n    <template v-for=\"(item, i) in contents\" :key=\"i\">\n      <div\n        v-if=\"item.type === 1\"\n        class=\"richtext\"\n        :class=\"{ 'frist-child': i === 0, 'last-child': i === contents.length - 1 }\"\n        v-html=\"item.rich_text?.html\"\n        v-lazy-container=\"{ selector: 'img' }\"\n        @click=\"onRichtextClick\"\n      ></div>\n      <template v-if=\"item.type === 2 && item.image.images.length > 0\">\n        <photo-gallery\n          class=\"e-photo-gallery\"\n          :class=\"{\n            'frist-child': i === 0,\n            'last-child': i === contents.length - 1,\n            mobile: isMobile\n          }\"\n          :images=\"item.image.images\"\n          :mode=\"item.image.layout === 2 ? 'vertical' : 'horizontal'\"\n          @imgClick=\"onImgClick\"\n        ></photo-gallery>\n      </template>\n    </template>\n  </div>\n</template>\n\n<style lang=\"scss\">\n@import '@/assets/style/photoswipe.scss';\n\n.article-editor-content-view {\n  --tvb-editor-view-img-padding: 32px;\n  --tvb-editor-view-title-color: #1e1e1e;\n  text-align: justify;\n  letter-spacing: 0.8px;\n  font-size: 18px;\n  line-height: 32px;\n  overflow: hidden;\n\n  .richtext {\n    p,\n    h1,\n    h2,\n    h3,\n    h4,\n    h5,\n    h6 {\n      margin-top: var(--tvb-editor-view-img-padding) !important;\n      margin-bottom: var(--tvb-editor-view-img-padding) !important;\n    }\n\n    h1,\n    h2,\n    h3,\n    h4,\n    h5,\n    h6 {\n      color: var(--tvb-editor-view-title-color);\n    }\n\n    // &.frist-child {\n    //   p:first-child,\n    //   figure:first-child.tvb-img_des-wrap,\n    //   div:first-child.w-e-post {\n    //     margin-top: 0 !important;\n    //   }\n    // }\n    &.last-child {\n      p:last-child,\n      h1:last-child,\n      h2:last-child,\n      h3:last-child,\n      h4:last-child,\n      h5:last-child,\n      h6:last-child,\n      figure:last-child.tvb-img_des-wrap,\n      div:last-child.w-e-post,\n      div[data-w-e-type='video']:last-child {\n        margin-bottom: 0 !important;\n      }\n    }\n\n    img {\n      max-width: 100%;\n      cursor: pointer;\n    }\n\n    img[lazy='error'],\n    img[lazy='loading'] {\n      background-color: #f8f9fa;\n      aspect-ratio: 16 / 9;\n      padding: 0 calc(50% - (98px / 2));\n      width: 100%;\n      object-fit: contain;\n    }\n\n    iframe {\n      display: block;\n    }\n\n    .tvb-img_des-wrap {\n      margin-top: var(--tvb-editor-view-img-padding);\n      margin-bottom: var(--tvb-editor-view-img-padding);\n    }\n\n    /* 图片处理 */\n    .tvb-img_href {\n      text-decoration: none;\n    }\n\n    .tvb-img_des {\n      margin-top: 10px;\n      font-size: 16px;\n      color: #818d95;\n      line-height: 22px;\n      letter-spacing: 0.5px;\n      display: block;\n      word-break: break-all;\n    }\n\n    .tvb-img_error {\n      background-color: #f8f9fa;\n      aspect-ratio: 16 / 9;\n      padding: 0 calc(50% - (98px / 2));\n      width: 100%;\n      object-fit: contain;\n    }\n  }\n\n  // 图集\n  .e-photo-gallery {\n    margin-top: var(--tvb-editor-view-img-padding);\n    margin-bottom: var(--tvb-editor-view-img-padding);\n    // &.frist-child {\n    //   margin-top: 0 !important;\n    // }\n    &.last-child {\n      margin-bottom: 0 !important;\n    }\n\n    .tvb-img_href {\n      text-decoration: none;\n    }\n\n    .tvb-img_des {\n      margin-top: 10px;\n      font-size: 16px;\n      color: #818d95;\n      line-height: 22px;\n      letter-spacing: 0.5px;\n      display: block;\n      word-break: break-all;\n    }\n  }\n\n  // 贴文\n  .w-e-post,\n  div[data-w-e-type='video'] {\n    margin-top: var(--tvb-editor-view-img-padding);\n    margin-bottom: var(--tvb-editor-view-img-padding);\n\n    .twitter-tweet,\n    .instagram-media {\n      margin-top: 0 !important;\n      margin-bottom: 0 !important;\n    }\n  }\n}\n\n/* 移动端样式 */\n.article-editor-content-view-mobile {\n  --tvb-editor-view-img-padding: 22px;\n  --tvb-editor-view-title-color: #333;\n  letter-spacing: 0.6px;\n  line-height: 30px;\n  color: #333;\n\n  .richtext {\n    img {\n      pointer-events: auto;\n    }\n\n    .tvb-img_des {\n      margin-top: 8px;\n      font-size: 15px;\n      letter-spacing: 0px;\n    }\n  }\n\n  .e-photo-gallery {\n    .tvb-img_des {\n      margin-top: 8px;\n      font-size: 15px;\n      letter-spacing: 0px;\n    }\n  }\n}\n</style>\n","<script setup>\nimport { computed } from 'vue'\nimport dayjs from 'dayjs'\n\nconst props = defineProps({\n  size: { type: String, default: null },\n  loading: { type: Boolean, default: false },\n  autoheight: { type: Boolean, default: true },\n  img: { type: [Object, String], default: null },\n  title: { type: String, default: '' },\n  subtitle: { type: String, default: '' },\n  date: { type: [String, Number], default: '' },\n  isVideo: { type: Boolean, default: false },\n  titleTag: { type: String, default: 'h3' },\n  backgroundc: { type: String, default: '#F8F9FA' },\n  playIcon: {\n    type: Object,\n    default: () => {\n      return {}\n    }\n  },\n  link: {\n    type: Object,\n    default() {\n      return { url: '', rel: '', target: '' }\n    }\n  }\n})\n\ndefineEmits(['tracking'])\n\nconst isMobile = computed(() => ['s', 'xs'].includes(props.size))\nconst dateTime = computed(() => {\n  const time = props.date\n  if (time && dayjs(time).isValid()) {\n    return dayjs.unix(time).format('YYYY-MM-DD HH:mm')\n  } else {\n    return ''\n  }\n})\n</script>\n\n<template>\n  <div\n    class=\"tvb-article-ghost-card\"\n    :class=\"[size ? 'card-' + size : '', { 'card-autoheight': autoheight }]\"\n  >\n    <div v-if=\"loading\" class=\"tvb-article-card__skeleton\">\n      <div class=\"tvb-article-card__image tvb-hairline--surround\">\n        <div class=\"tvb-article-card__image--wrap\">\n          <tvb-image class=\"tvb-article-card__cover\" src=\"\" backgroundc=\"#F0F1F2\"></tvb-image>\n        </div>\n      </div>\n      <div class=\"tvb-article-card__skeleton--info\">\n        <div class=\"tvb-article-card__skeleton--text\"></div>\n        <div\n          class=\"tvb-article-card__skeleton--text\"\n          style=\"width: 62.5%; margin-top: var(--gc-info-margin-top)\"\n        ></div>\n      </div>\n    </div>\n    <tvb-router-link\n      v-else\n      :to=\"link.url\"\n      :linkRel=\"link.rel\"\n      :linkTarget=\"link.target\"\n      :class=\"{ 'disable-hover': isMobile }\"\n      @click=\"$emit('tracking')\"\n    >\n      <div\n        class=\"tvb-article-card__image tvb-hairline--surround\"\n        :class=\"{ 'tvb-article-card__image--hover': !isMobile }\"\n      >\n        <div class=\"tvb-article-card__image--wrap\">\n          <tvb-image\n            class=\"tvb-article-card__cover\"\n            :src=\"img\"\n            :alt=\"title\"\n            :isVideo=\"isVideo\"\n            :playIcon=\"playIcon\"\n            :transform=\"isMobile ? false : true\"\n            :backgroundc=\"backgroundc\"\n          ></tvb-image>\n        </div>\n      </div>\n    </tvb-router-link>\n    <div class=\"tvb-article-card__info\">\n      <component :is=\"titleTag\" class=\"clear-h tvb-article-card__info--tit\" :title=\"title\">\n        <tvb-router-link\n          :to=\"link.url\"\n          :linkRel=\"link.rel\"\n          :linkTarget=\"link.target\"\n          :class=\"{ 'disable-hover': isMobile }\"\n          @click=\"$emit('tracking')\"\n        >\n          {{ title }}\n        </tvb-router-link>\n      </component>\n      <div v-if=\"subtitle || date\" class=\"tvb-article-card__info--bottom\">\n        <span class=\"tvb-article-card__info--author\" :title=\"subtitle\">{{ subtitle }}</span>\n        <span v-if=\"date\" class=\"tvb-article-card__info--date\">{{ dateTime }}</span>\n      </div>\n    </div>\n  </div>\n</template>\n\n<style lang=\"scss\" scoped>\n.tvb-article-ghost-card {\n  --gc-title-font-size: 16px;\n  --gc-title-line-height: 22px;\n  --gc-title-font-color: #333;\n  --gc-subtitle-font-size: 13px;\n  --gc-subtitle-line-height: 18px;\n  --gc-subtitle-font-color: #818d95;\n  --gc-info-margin-top: 8px;\n  --gc-info-padding: 0px;\n  --gc-subtitle-margin-top: 4px;\n  --gc-cover-radio: 56.25%; // 如何计算值？ 9 / 16（高除以宽）\n  --gc-hover-color: #0062a3;\n  --gc-img-border-radius: 6px;\n  position: relative;\n\n  a {\n    text-decoration: none;\n    background-color: transparent;\n    color: inherit;\n    transition: color 0.15s linear;\n    cursor: pointer;\n    &:visited {\n      color: inherit;\n    }\n  }\n  a:not(.disable-hover):hover {\n    color: var(--gc-hover-color) !important;\n  }\n\n  // img样式\n  .tvb-article-card__image {\n    position: relative;\n    border-radius: var(--gc-img-border-radius);\n    --tvb-hairline-border-radius: calc(2 * var(--gc-img-border-radius));\n  }\n  .tvb-article-card__image--wrap {\n    padding-top: var(--gc-cover-radio);\n    border-radius: inherit;\n    cursor: pointer;\n  }\n  .tvb-article-card__cover {\n    position: absolute;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n    border-radius: inherit;\n    overflow: hidden;\n    @include safari-overflow-hidden();\n  }\n\n  // 内容样式\n  .tvb-article-card__info {\n    margin-top: var(--gc-info-margin-top);\n    padding: var(--gc-info-padding);\n    min-height: calc(var(--gc-title-line-height) * 2);\n\n    .tvb-article-card__info--tit {\n      color: var(--gc-title-font-color);\n      font-size: var(--gc-title-font-size);\n      line-height: var(--gc-title-line-height);\n      height: calc(2 * var(--gc-title-line-height));\n      letter-spacing: 0.5px;\n      word-break: break-all;\n      @include line-text-ellipsis(2);\n\n      & > a {\n        color: var(--gc-title-font-color);\n      }\n    }\n\n    .tvb-article-card__info--bottom {\n      margin-top: var(--gc-subtitle-margin-top);\n      color: var(--gc-subtitle-font-color);\n      font-size: var(--gc-subtitle-font-size);\n      display: flex;\n      align-items: center;\n      display: inline-flex;\n    }\n\n    .tvb-article-card__info--author {\n      flex: 1;\n      word-break: break-word;\n      line-height: var(--gc-subtitle-line-height);\n      @include line-text-ellipsis(1);\n    }\n\n    .tvb-article-card__info--date {\n      margin-left: 12px;\n      line-height: var(--gc-subtitle-line-height);\n    }\n  }\n\n  // 动态高度样式\n  &.card-autoheight {\n    .tvb-article-card__info {\n      min-height: auto;\n      .tvb-article-card__info--tit {\n        height: auto;\n      }\n    }\n  }\n\n  // 骨架屏样式\n  .tvb-article-card__skeleton {\n    .tvb-article-card__skeleton--info {\n      margin-top: var(--gc-info-margin-top);\n      padding: var(--gc-info-padding);\n      .tvb-article-card__skeleton--text {\n        height: 26px;\n        background-color: #f0f1f2;\n        border-radius: 4px;\n      }\n    }\n  }\n}\n</style>\n","<script setup>\nimport { inject, ref, computed, watch, onMounted } from 'vue'\nimport { action } from '@/utils/gtm'\nimport { getArticleRelation } from '@/api/article.js'\nimport ArticleGhostCard from '../../../components/GhostCard/index.vue'\n\nconst props = defineProps({\n  id: { type: [String, Number], default: null },\n  fixed: { type: Boolean, default: false }\n})\n\nconst windowHeight = inject('height')\nconst height = computed(() =>\n  windowHeight.value ? windowHeight.value - 64 - (props.fixed ? 32 : 70) - 32 - 52 : null\n) // 可视高度 - header高度 - 顶部间距 - 底部间距 - 标题高度\nconst size = inject('size')\nconst scrollTop = ref(0)\nconst onscroll = (e) => {\n  let obj = {\n    scrollTop: e?.target?.scrollTop,\n    scrollHeight: e?.target?.scrollHeight,\n    clientHeight: e?.target?.clientHeight\n  }\n  let distance = obj.scrollHeight - obj.scrollTop - obj.clientHeight\n  if (distance <= 200) onload() // 无限滚动加载\n  scrollTop.value = obj.scrollTop || 0\n}\n\n// 滚动条 - 有滚动行为则显示，滚动停止则隐藏\nlet timer = null\nconst clearTimer = () => clearTimeout(timer)\nconst scrollbarShow = ref(false)\nwatch(scrollTop, () => {\n  clearTimer()\n  scrollbarShow.value = true\n  timer = setTimeout(() => {\n    scrollbarShow.value = false\n  }, 500)\n})\n\nconst loading = ref(false)\nconst list = ref([])\nconst headInfo = computed(() => list.value[0])\nconst slist = computed(() => list.value.slice(1))\nconst isEmpty = computed(() => list.value.length === 0)\nconst finished = ref(false) // 最後頁完成狀態\nconst page = ref(1)\nconst onload = async (mode) => {\n  const isInit = mode === 'init'\n  if (loading.value || finished.value) return\n  loading.value = true\n  try {\n    const limit = isInit ? 20 : 10\n    const res = await getArticleRelation({\n      article_id: props.id,\n      page: page.value,\n      limit\n    })\n    if (res.code !== 0) throw new Error(res.message)\n    let newsList = res.data?.list || []\n    if (isInit) list.value = newsList\n    else list.value.push(...newsList)\n\n    if (newsList.length < limit) finished.value = true\n    else page.value++\n    loading.value = false\n  } catch (error) {\n    console.warn(error)\n    loading.value = false\n  }\n}\n\nonMounted(() => onload('init'))\n\nconst layerData = inject('layerData')\nconst tracking = (item) => {\n  action({\n    ...layerData.value,\n    eventID: 'B014',\n    page_title: item.title || '',\n    screen_class: item.title || '',\n    eventCategory: 'sub_category',\n    eventLabel: item.title || '',\n    screenLabel: item.link || ''\n  })\n}\n</script>\n\n<template>\n  <div v-show=\"!isEmpty\" class=\"tvb-article-relation tvb-hairline--surround\">\n    <div class=\"tvb-article-relation-tit\">相關文章</div>\n    <n-scrollbar\n      v-if=\"!isEmpty\"\n      trigger=\"hover\"\n      :style=\"`max-height: ${height > 1200 ? 1200 : height}px`\"\n      :class=\"[scrollTop > 0 ? 'tvb-hairline--top' : '', { 'scrollbar-show': scrollbarShow }]\"\n      :on-scroll=\"onscroll\"\n    >\n      <div\n        class=\"tvb-article-relation_scroll-wrap\"\n        :style=\"loading ? '--scroll-wrap-padding-bottom: 16px' : ''\"\n      >\n        <article-ghost-card\n          v-if=\"headInfo\"\n          :size=\"size\"\n          :img=\"headInfo.image_info\"\n          :isVideo=\"headInfo.video_url ? true : false\"\n          :playIcon=\"{ size: 40 }\"\n          :title=\"headInfo.title\"\n          :subtitle=\"headInfo.category_name\"\n          :date=\"headInfo.publish_at\"\n          :link=\"{ url: headInfo.link, rel: headInfo.link_rel, target: headInfo.link_target }\"\n          titleTag=\"div\"\n          backgroundc=\"#F0F1F2\"\n          @tracking=\"tracking(headInfo)\"\n        ></article-ghost-card>\n        <div v-if=\"list.length > 1\" class=\"tvb-article-relation-divider\"></div>\n        <tvb-article-card-lateral\n          class=\"tvb-article-relation_scroll-wrap-article-card\"\n          v-for=\"(item, index) in slist\"\n          :key=\"index\"\n          :info=\"item\"\n          title-tag=\"p\"\n          backgroundc=\"#F0F1F2\"\n          @tracking=\"tracking(item)\"\n        />\n\n        <div v-if=\"loading\" class=\"tvb-loading-box loading-box\"><n-spin /></div>\n        <div v-if=\"finished && list.length >= 20\" class=\"text-center finished-tip\">\n          - 暫無更多數據 -\n        </div>\n      </div>\n    </n-scrollbar>\n  </div>\n</template>\n\n<style lang=\"scss\" scoped>\n.tvb-article-relation {\n  box-sizing: border-box;\n  width: 100%;\n  max-width: 400px;\n  // max-height: 1200px;\n  background: #f8f9fa;\n  border-radius: 8px;\n  --tvb-hairline-border-radius: calc(2 * 8px);\n  --scroll-wrap-padding: 20px;\n  --scroll-wrap-padding-bottom: var(--scroll-wrap-padding);\n  padding-left: var(--scroll-wrap-padding);\n\n  .tvb-article-relation-tit {\n    font-size: 18px;\n    font-weight: 500;\n    color: #333333;\n    line-height: 24px;\n    letter-spacing: 0.5px;\n    padding: 16px 0 12px;\n  }\n\n  .tvb-article-relation-divider {\n    height: 1px;\n    background-color: rgba(163, 178, 188, 0.35);\n    margin: 16px 0;\n  }\n\n  :deep(.n-scrollbar-container) {\n    overscroll-behavior: contain; // 不会对相邻的滚动区域进行滚动\n  }\n\n  // 滚动条样式\n  :deep(.n-scrollbar) {\n    --n-scrollbar-width: 4px !important;\n    --n-scrollbar-color: #ced5db !important;\n    --n-scrollbar-color-hover: #ced5db !important;\n    --n-scrollbar-border-radius: 2px !important;\n    max-height: 1200px - 52px;\n    --tvb-hairline-border-width: 2px;\n    --tvb-hairline-border-radius: 0;\n    &.tvb-hairline--top::after {\n      margin-right: 27px;\n    }\n    & > .n-scrollbar-rail.n-scrollbar-rail--vertical,\n    & + .n-scrollbar-rail.n-scrollbar-rail--vertical {\n      top: 0px;\n      right: 8px;\n      bottom: var(--scroll-wrap-padding);\n    }\n    .n-scrollbar-rail__scrollbar {\n      visibility: hidden;\n    }\n    &.scrollbar-show .n-scrollbar-rail__scrollbar {\n      visibility: visible;\n    }\n  }\n\n  .tvb-article-relation_scroll-wrap {\n    padding-right: var(--scroll-wrap-padding);\n    padding-bottom: var(--scroll-wrap-padding-bottom);\n    .loading-box {\n      padding-top: 16px;\n      :deep(.n-spin) {\n        --n-size: 16px !important;\n      }\n    }\n\n    .tvb-article-relation_scroll-wrap-article-card {\n      :deep(.tvb-article-card-lateral-title) {\n        @include line-text-ellipsis(2);\n      }\n      :deep(.tvb-article-card-lateral-description) {\n        display: none;\n      }\n    }\n\n    .finished-tip {\n      font-size: 13px;\n      color: #818d95;\n      line-height: 18px;\n      margin-top: 16px;\n    }\n\n    :deep(.tvb-article-ghost-card) {\n      --gc-cover-radio: 56.3888888%;\n    }\n\n    :deep(.tvb-article-card-lateral) {\n      height: 72px;\n      & + .tvb-article-card-lateral {\n        margin-top: 16px;\n      }\n      .tvb-article-card-lateral-image {\n        min-width: 128px;\n        width: 128px;\n        aspect-ratio: calc(128px / 72px);\n        .tvb-image_play-icon {\n          width: 32px !important;\n          height: 32px !important;\n          font-size: calc(32px / 2) !important;\n          border-radius: calc(32px / 2) !important;\n        }\n        .tvb-image_placeholder {\n          width: 77px;\n          height: 28px;\n        }\n      }\n      .tvb-article-card-lateral-info {\n        margin-left: 10px;\n        width: auto;\n        flex: 1;\n        min-width: 0;\n        .tvb-article-card-lateral-title {\n          font-size: 16px;\n          line-height: 22px;\n          font-weight: 400;\n        }\n        .tvb-article-card-lateral-category_name-publish_at {\n          padding-bottom: 6px;\n          .tvb-article-card-lateral-category_name,\n          .tvb-article-card-lateral-publish_at {\n            font-size: 13px;\n            line-height: 18px;\n            letter-spacing: 0;\n          }\n\n          .tvb-article-card-lateral-publish_at {\n            margin-right: 0;\n          }\n        }\n      }\n    }\n  }\n}\n</style>\n","<script setup name=\"TvbDraggable\">\nimport { ref, inject, nextTick, watch } from 'vue'\nimport { UseDraggable } from '@vueuse/components'\n\nconst size = inject('size')\nconst width = inject('width')\nconst handle = ref(null)\nconst draggableRef = ref()\nconst draggableContainerRef = ref()\nconst draggableMoveSetTimeout = ref(null)\n\ndefineProps({\n  disabled: {\n    type: Boolean,\n    default: false\n  },\n  initialValue: {\n    type: Object,\n    default: null\n  }\n})\n\n/** 边界处理 */\nconst draggableMove = () => {\n  const { left, top, width, height } = draggableContainerRef.value.getBoundingClientRect()\n  const headerEl = document.querySelector('.tvb-home-header')\n  const draggableEl = draggableRef.value.$el\n  if (left <= 0) {\n    clearTimeout(draggableMoveSetTimeout.value)\n    nextTick(() => {\n      draggableEl.style.left = `0px`\n      draggableMoveSetTimeout.value = setTimeout(() => {\n        draggableEl.style.left = `1px`\n      }, 100)\n    })\n  } else if (top <= headerEl.clientHeight || 0) {\n    clearTimeout(draggableMoveSetTimeout.value)\n    console.log()\n    nextTick(() => {\n      draggableEl.style.top = `${headerEl.clientHeight}px`\n      draggableMoveSetTimeout.value = setTimeout(() => {\n        draggableEl.style.top = `${headerEl.clientHeight + 1}px`\n      }, 100)\n    })\n  } else if (left + width >= window.innerWidth) {\n    clearTimeout(draggableMoveSetTimeout.value)\n    nextTick(() => {\n      draggableEl.style.left = `${window.innerWidth - width}px`\n      draggableMoveSetTimeout.value = setTimeout(() => {\n        draggableEl.style.left = `${window.innerWidth - width - 1}px`\n      }, 100)\n    })\n  } else if (top + height >= window.innerHeight) {\n    clearTimeout(draggableMoveSetTimeout.value)\n    nextTick(() => {\n      draggableEl.style.top = `${window.innerHeight - height}px`\n      draggableMoveSetTimeout.value = setTimeout(() => {\n        draggableEl.style.top = `${window.innerHeight - height - 1}px`\n      }, 100)\n    })\n  }\n}\n\nwatch(width, () => draggableMove())\n</script>\n\n<template>\n  <use-draggable\n    class=\"tvb-draggable\"\n    :class=\"{ disabled: disabled, mobile: ['s', 'xs'].includes(size) }\"\n    :initial-value=\"initialValue\"\n    :prevent-default=\"true\"\n    :handle=\"handle\"\n    ref=\"draggableRef\"\n    @move=\"draggableMove\"\n    :preventDefault=\"true\"\n  >\n    <div class=\"tvb-draggable_container\" ref=\"draggableContainerRef\">\n      <div ref=\"handle\" class=\"tvb-draggable_cursor-move\" v-show=\"!disabled\" title=\"按此移動\">\n        <svg data-v-083f18dc=\"\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 1024 1024\">\n          <path\n            fill=\"#fff\"\n            d=\"m186.496 544 41.408 41.344a32 32 0 1 1-45.248 45.312l-96-96a32 32 0 0 1 0-45.312l96-96a32 32 0 1 1 45.248 45.312L186.496 480h290.816V186.432l-41.472 41.472a32 32 0 1 1-45.248-45.184l96-96.128a32 32 0 0 1 45.312 0l96 96.064a32 32 0 0 1-45.248 45.184l-41.344-41.28V480H832l-41.344-41.344a32 32 0 0 1 45.248-45.312l96 96a32 32 0 0 1 0 45.312l-96 96a32 32 0 0 1-45.248-45.312L832 544H541.312v293.44l41.344-41.28a32 32 0 1 1 45.248 45.248l-96 96a32 32 0 0 1-45.312 0l-96-96a32 32 0 1 1 45.312-45.248l41.408 41.408V544H186.496z\"\n          ></path>\n        </svg>\n      </div>\n      <slot />\n    </div>\n  </use-draggable>\n</template>\n\n<style lang=\"scss\" scoped>\n.tvb-draggable {\n  width: max-content;\n  height: max-content;\n  position: fixed;\n  z-index: 99999;\n  &:not(.disabled) {\n    &[style*='left: 0px'] {\n      &[style*='top: 0px'] {\n        left: max(\n          calc(768px / 1920px * 100%),\n          calc((100vw - 1280px) / 2 + (848px - 400px))\n        ) !important;\n        top: calc(100vh - 261px) !important; // 自身高度 + 36\n        &.mobile {\n          left: calc(100vw - 200px - 12px) !important;\n          top: calc(100vh - 168px) !important; // 自身高度 + 56\n        }\n      }\n    }\n  }\n  &.disabled,\n  &.disabled.mobile {\n    position: relative !important;\n    top: 0 !important;\n    left: 0 !important;\n    height: unset !important;\n    width: unset !important;\n    z-index: unset !important;\n  }\n  .tvb-draggable_container {\n    position: relative;\n    width: 100%;\n    height: 100%;\n    .tvb-draggable_cursor-move {\n      position: absolute;\n      top: 0;\n      left: 0;\n      z-index: 999;\n      cursor: move;\n      color: #fff;\n      svg {\n        width: 26px;\n        height: 26px;\n      }\n    }\n  }\n}\n</style>\n","<script setup>\nimport { inject, ref, computed, onBeforeUnmount, watch, watchEffect, nextTick } from 'vue'\nimport { useRoute } from 'vue-router'\nimport { TvbSsoButton } from '@tvb-sz/tvb-headerfooter-frontend'\nimport { postArticleLike } from '@/api/article.js'\nimport { filterSpecial, toISOString } from '@/utils'\nimport { pageview, action, popUp } from '@/utils/gtm'\nimport {\n  useIntersectionObserver,\n  useElementBounding,\n  useElementVisibility,\n  useElementSize\n} from '@vueuse/core'\nimport { useAppStore } from '@/stores/app'\nimport { useSeoMeta, useHead } from '@vueuse/head'\nimport { sha1 } from 'js-sha1'\nimport useArticle from './useArticle'\nimport ArticleContent from '../ArticleContent/index.vue'\nimport Relation from '../Relation/index.vue'\nimport Subtitle from '../Subtitle/index.vue'\nimport leftTool from '../ArticleTool/leftTool.vue'\nimport bottomTool from '../ArticleTool/bottomTool.vue'\nimport TvbPlayer from './../../../../../components/TvbPlayer/index.vue'\nimport TvbDraggable from './../../../../../components/TvbDraggable/index.vue'\nimport { contentCopyHandler } from '@/utils/copyright'\n\nconst emits = defineEmits(['play'])\n\nconst props = defineProps({\n  info: {\n    type: Object,\n    default() {\n      return {}\n    }\n  }\n})\n\nconst { config } = useAppStore()\nconst route = useRoute()\nconst isPreview = inject('isPreview')\nconst size = inject('size')\nconst width = inject('width')\nconst setAdParams = inject('setAdParams')\nconst activeArticle = inject('activeArticle')\nconst seoTitleSuffix = inject('seoTitleSuffix')\nconst loginRef = ref()\n\nconst articleRef = ref(null)\nconst draggableRef = ref(null)\nconst tvbPlayerRef = ref(null)\nconst isPlay = ref(false)\nconst isMobile = computed(() => ['s', 'xs'].includes(size.value))\nconst showRelation = computed(() => ['xl'].includes(size.value))\nconst articleId = computed(() => props.info.id)\nconst isActive = computed(() => activeArticle.value?.id === articleId.value)\nconst author = computed(() => props.info.author?.join('、'))\nconst draggableDisabled = ref(true)\nconst elementBounding = useElementBounding(articleRef)\nconst info = computed(() => props.info)\n\nconst { delayShow, breadcrumbs, categoryInfo, cloading, fetchCategoryInfo, fetchExtraInfo } =\n  useArticle()\n\nconst onStateChange = ({ state }) => {\n  isPlay.value = state === 'play'\n  if (isPlay.value) emits('play')\n  if (state === 'ended') draggableDisabled.value = true\n}\n\nconst pause = () => {\n  tvbPlayerRef?.value?.pause()\n  draggableDisabled.value = true\n}\n\nconst play = () => {\n  tvbPlayerRef?.value?.play()\n  draggableDisabled.value = true\n}\n\nconst draggableIntersectionObserver = useIntersectionObserver(\n  draggableRef,\n  ([{ isIntersecting }]) => {\n    draggableDisabled.value = isIntersecting || !isPlay.value\n  }\n)\n\n// 面包屑\nfetchCategoryInfo(props.info.category_id)\n\nconst is_like = ref(false)\nconst like_num = ref(0)\nconst extraCallback = (data) => {\n  is_like.value = data?.is_like\n  like_num.value = data?.like_num || 0\n}\nfetchExtraInfo(articleId.value, { content_type: info.value.content_type }, extraCallback)\n\n// 处理点赞\nconst onClickLike = async () => {\n  try {\n    const res = await postArticleLike({\n      type: 1,\n      liked_id: articleId.value,\n      status: is_like.value ? 2 : 1\n    })\n    if (res.code === 150001) {\n      loginRef.value?.login && loginRef.value.login()\n      throw new Error(res.message)\n    }\n    if (res.code !== 0) throw new Error(res.message)\n    is_like.value = !is_like.value\n    like_num.value = is_like.value ? like_num.value + 1 : like_num.value - 1\n  } catch (error) {\n    console.warn(error)\n  }\n}\n\n// 交互\nconst dividerRef = ref()\nconst targetIsVisible = useElementVisibility(dividerRef)\nconst relationRef = ref(null)\nconst { height: relationHeight } = useElementSize(relationRef)\nconst asideRef = ref(null)\nconst { width: asideWidth } = useElementSize(asideRef)\n// - 封面图预览\nconst richRef = ref()\nconst handleViewer = (src) => {\n  richRef.value?.showViewer?.(src)\n}\nconst relationFixed = ref(false)\nconst onAffixChange = (e) => (relationFixed.value = e)\n\n// seo - start\nconst canonical = computed(() => {\n  const { title, seo_title, id } = props.info\n  return categoryInfo.value?.path\n    ? `${location.origin}/${categoryInfo.value.path}-c/${encodeURIComponent(\n        filterSpecial(seo_title || title)\n      )}-${id}`\n    : ''\n})\nconst head = ref({})\nuseHead(head)\nconst seoMeta = ref({})\nconst setSeo = (isSeo) => {\n  if (isPreview.value) return\n  if (isSeo) {\n    setAdParams({\n      content_type: 'content',\n      vtype: props.info.video_url ? 'vod' : 'x',\n      article_id: props.info.id || 'x',\n      sub_category_path: categoryInfo.value?.path || 'x'\n    })\n    const { title, seo_title, meta_description, og_image_alt_txt, og_image_info, image_info } =\n      props.info\n    const _title = `${seo_title || title}${seoTitleSuffix}`\n    seoMeta.value = {\n      title: _title,\n      twitterTitle: _title,\n      ogTitle: _title,\n      ogType: 'article',\n      description: `${meta_description || ''}`,\n      ogImage: `${og_image_info?.large || image_info?.large || ''}`,\n      ogImageAlt: `${og_image_alt_txt || ''}`,\n      ogDescription: meta_description || '',\n      ogUrl: canonical.value,\n      twitterUrl: canonical.value,\n      twitterImage: `${og_image_info?.large || ''}`,\n      twitterImageAlt: `${og_image_alt_txt || ''}`,\n      twitterDescription: `${meta_description || ''}`,\n      author: props.info.author?.join(',') || 'TVB'\n    }\n    if (canonical.value) window.history.replaceState(history.state, null, canonical.value)\n    let newsArticleLdJson = {\n      '@context': 'https://schema.org',\n      '@type': 'NewsArticle',\n      image: {\n        '@type': 'ImageObject',\n        contentUrl: seoMeta.value.ogImage,\n        creditText: 'TVB 無綫電視',\n        creator: {\n          '@type': 'Organization',\n          name: 'TVB 無綫電視'\n        }\n      },\n      headline: props.info.title,\n      datePublished: toISOString(props.info.publish_at),\n      dateModified: toISOString(props.info.publish_at),\n      isAccessibleForFree: 'true',\n      author: {\n        '@type': 'Organization',\n        name: 'TVB 無綫電視',\n        url: location.origin\n      },\n      publisher: {\n        name: 'TVB 無綫電視',\n        url: location.origin\n      }\n    }\n    if (author.value) {\n      newsArticleLdJson.author = author.value?.split('、')?.reduce((p, c) => {\n        p.push({ name: c })\n        return p\n      }, [])\n    }\n    head.value = {\n      link: [\n        {\n          rel: 'canonical',\n          key: 'canonical',\n          href: canonical.value\n        },\n        {\n          rel: 'alternate',\n          hreflang: 'x-default',\n          key: 'alternate-x-default',\n          href: canonical.value\n        },\n        {\n          rel: 'alternate',\n          hreflang: 'zh-hk',\n          key: 'alternate-zh-hk',\n          href: canonical.value\n        }\n      ],\n      script: [\n        {\n          key: 'application-ld-json',\n          type: 'application/ld+json',\n          children: JSON.stringify([\n            newsArticleLdJson,\n            {\n              '@context': 'https://schema.org',\n              '@type': 'BreadcrumbList',\n              itemListElement: [\n                ...breadcrumbs.value.map((v, i) => {\n                  return {\n                    '@type': 'ListItem',\n                    position: i + 1,\n                    name: v.name,\n                    item: v.path == '/' ? location.origin : v.path\n                  }\n                }),\n                {\n                  '@type': 'ListItem',\n                  position: 4,\n                  name: props.info.title,\n                  item: canonical.value\n                }\n              ]\n            }\n          ])\n        }\n      ]\n    }\n  } else {\n    head.value = {}\n    seoMeta.value = {}\n  }\n}\n// seo - end\n\nwatch(\n  () => [isActive.value, cloading.value],\n  () => {\n    if (!cloading.value) nextTick(() => setSeo(isActive.value))\n  },\n  { immediate: true }\n)\nwatchEffect(() => {\n  useSeoMeta(seoMeta.value)\n})\n\nwatch(\n  cloading,\n  () => {\n    if (!cloading.value) {\n      if (isActive.value) {\n        // 直接打开图片查看器\n        setTimeout(() => {\n          let photoId = route.query?.photo_id\n            ? route.query?.photo_id\n            : route.hash && route.hash.split('#photo_id=')?.[1]\n          if (photoId) {\n            const richTextImgs = richRef.value?.richTextImgs || []\n            const hashImgs = richTextImgs.map((v) => sha1(v.src))\n            const findIndex = hashImgs.findIndex((v) => v === photoId)\n            if (findIndex > -1) {\n              richRef.value?.showViewer?.(null, findIndex)\n            }\n          }\n        }, 300)\n      }\n\n      pageview({\n        ...layerData.value,\n        page_title: 'article',\n        screen_class: `${categoryInfo.value.parent.title}/${categoryInfo.value.title}/${props.info.title}`,\n        eventCategory: 'sub_category',\n        eventLabel: 'article',\n        eventID: categoryInfo.value.id || '',\n        screenLabel: canonical.value\n      })\n    }\n  },\n  { flush: 'post' }\n)\n\nconst layerData = inject('layerData')\nconst onViewerShown = (pswp) => {\n  const index = pswp?.currIndex\n  popUp({\n    ...layerData.value,\n    eventID: 'o003',\n    page_title: 'popUp',\n    eventLabel: `${categoryInfo.value.title || ''}_popup`,\n    screen_class: props.info?.title || '',\n    eventCategoy: 'sub_category',\n    screenLabel: canonical.value,\n    listName: index + 1\n  })\n  nextTick(() => {\n    const slide = pswp?.currSlide\n    pageview({\n      screenID: 'S006',\n      page_title: 'album_view',\n      eventLabel: 'album_view',\n      screen_class: props.info.title || '',\n      eventCategoy: 'sub_category',\n      eventID: categoryInfo.value.id || '',\n      screenLabel: canonical.value + '?' + sha1(slide?.data.src),\n      photo_id: sha1(slide?.data.src)\n    })\n  })\n}\n\nconst onViewerChange = (pswp) => {\n  action({\n    ...layerData.value,\n    eventID: 'B021',\n    page_title: 'album_popup',\n    eventLabel: 'album_popup',\n    screen_class: props.info?.title || '',\n    eventCategoy: 'sub_category',\n    screenLabel: canonical.value,\n    photo_id: sha1(pswp?.currSlide?.data.src)\n  })\n}\n\nconst onCopyHandler = function (event) {\n  contentCopyHandler(config.article_copyright_text, `${location.origin}/${articleId.value}`, event)\n}\n\nonBeforeUnmount(() => {\n  draggableIntersectionObserver.stop()\n})\n\ndefineExpose({ pause, play, elementBounding })\n</script>\n\n<template>\n  <div\n    @copy=\"onCopyHandler\"\n    class=\"tvb-article\"\n    :class=\"size ? 'article-' + size : ''\"\n    ref=\"articleRef\"\n  >\n    <div\n      v-show=\"categoryInfo && !cloading\"\n      class=\"tvb-article-breadcrumb\"\n      :class=\"{ 'tvb-preview relative': isPreview }\"\n    >\n      <tvb-breadcrumb :breadcrumbs=\"breadcrumbs\" :size=\"size\" :loading=\"cloading\"></tvb-breadcrumb>\n    </div>\n\n    <div class=\"tvb-article-wrap\" :class=\"'affix-container-wrap-' + info.id\">\n      <article class=\"tvb-main-article\" :class=\"'article-' + info.id\">\n        <h1 class=\"clear-h tvb-article-title\" :title=\"info.title\">{{ info.title }}</h1>\n        <template v-if=\"!isMobile && !isPreview\">\n          <left-tool\n            :share-id=\"info.id\"\n            :size=\"size\"\n            :is-like=\"is_like\"\n            :like-num=\"like_num\"\n            @like=\"onClickLike\"\n          ></left-tool>\n        </template>\n        <subtitle :info=\"info\" :size=\"size\" />\n\n        <div v-if=\"info.video_url\" class=\"tvb-article-video-contain tvb-article-video_box\">\n          <div class=\"tvb-article-video-contain-img\">\n            <img :src=\"info.image_info.large\" style=\"width:100%; height:100%;\">\n          </div>\n          <span ref=\"draggableRef\"></span>\n          <tvb-draggable :disabled=\"draggableDisabled\">\n            <div\n              class=\"tvb-article-video_box tvb-hairline--surround\"\n              :class=\"{ draggable: !draggableDisabled, mobile: isMobile }\"\n            >\n              <tvb-player\n                ref=\"tvbPlayerRef\"\n                class=\"tvb-article-video_player\"\n                :src=\"info.video_url\"\n                @play-click=\"\n                  action({\n                    ...layerData.value,\n                    eventID: 'B013',\n                    page_title: props.info?.title || '',\n                    eventLabel: categoryInfo?.path,\n                    screen_class: props.info?.title || '',\n                    eventCategoy: 'sub_category',\n                    screenLabel: props.info?.video_url || '',\n                    listName: 'video'\n                  })\n                \"\n                @stateChange=\"onStateChange\"\n              />\n              <tvb-image\n                class=\"tvb-article-video_image\"\n                :src=\"info.image_info\"\n                :alt=\"info.title\"\n              ></tvb-image>\n            </div>\n          </tvb-draggable>\n        </div>\n        <div\n          v-else\n          class=\"tvb-article-cover_box tvb-hairline--surround\"\n          @click=\"handleViewer(info.image_info?.large)\"\n        >\n          <tvb-image :src=\"info.image_info\" :alt=\"info.title\"></tvb-image>\n        </div>\n\n        <tvb-ads\n          v-if=\"categoryInfo?.path && articleId\"\n          ad-type=\"os\"\n          :position=\"9\"\n          :unit=\"`/${articleId}`\"\n          :params=\"{\n            content_type: 'content',\n            vtype: info.video_url ? 'vod' : 'x',\n            article_id: articleId || 'x',\n            sub_category_path: categoryInfo?.path || 'x'\n          }\"\n        />\n\n        <div class=\"tvb-article-content\">\n          <article-content\n            ref=\"richRef\"\n            :content=\"info.contents\"\n            :id=\"articleId\"\n            :img=\"info.video_url ? '' : info.image_info?.large\"\n            :thumbnail=\"info.image_info?.small\"\n            @viewerShown=\"onViewerShown\"\n            @viewerChange=\"onViewerChange\"\n          ></article-content>\n        </div>\n\n        <div\n          v-if=\"info.tags.length > 0\"\n          class=\"tvb-article-tags\"\n          :class=\"{ 'tvb-preview': isPreview, 'tvb-article-tags_hover': !isMobile }\"\n        >\n          <template v-for=\"item in info.tags\" :key=\"item.id\">\n            <tvb-router-link\n              v-if=\"item.name\"\n              class=\"tvb-article-tag tvb-hairline--surround\"\n              :to=\"`/search?tag=${item.id}&tag_name=${item.name}`\"\n            >\n              <h6 class=\"clear-h tvb-article-tag_inner\">#{{ item.name }}</h6>\n            </tvb-router-link>\n          </template>\n        </div>\n\n        <div ref=\"dividerRef\" class=\"tvb-article-divider\"></div>\n      </article>\n\n      <transition name=\"tvb-fade-out\">\n        <div\n          v-if=\"showRelation && !isPreview\"\n          ref=\"asideRef\"\n          class=\"tvb-article-relation-container\"\n        >\n          <tvb-affix\n            :target=\"'.affix-container-wrap-' + info.id\"\n            :offset=\"96\"\n            zIndex=\"9\"\n            :rootSize=\"{\n              rootHeight: relationHeight || null,\n              rootWidth: asideWidth || null\n            }\"\n            @change=\"onAffixChange\"\n          >\n            <relation ref=\"relationRef\" :id=\"articleId\" :fixed=\"relationFixed\" />\n          </tvb-affix>\n        </div>\n      </transition>\n    </div>\n\n    <tvb-ads\n      style=\"max-width: 848px\"\n      :style=\"['s', 'xs'].includes(size) ? 'margin-top: 8px' : 'margin-top: 12px'\"\n      :ad-type=\"['s', 'xs'].includes(size) ? 'bn' : width <= 1244 && width >= 1025 ? 'bn' : 'sb'\"\n      :key=\"['s', 'xs'].includes(size) ? 'bn' : width <= 1244 && width >= 1025 ? 'bn' : 'sb'\"\n      :position=\"9\"\n      :unit=\"`/${articleId}`\"\n      v-if=\"categoryInfo?.path && articleId\"\n      :params=\"{\n        content_type: 'content',\n        vtype: info.video_url ? 'vod' : 'x',\n        article_id: articleId || 'x',\n        sub_category_path: categoryInfo?.path || 'x'\n      }\"\n    />\n\n    <transition name=\"tvb-slide-up\">\n      <bottom-tool\n        v-if=\"isMobile && delayShow\"\n        v-show=\"!targetIsVisible && isActive && elementBounding.bottom.value > 0\"\n        :share-id=\"info.id\"\n        :size=\"size\"\n        :is-like=\"is_like\"\n        :like-num=\"like_num\"\n        :show-btn=\"!isPreview\"\n        @like=\"onClickLike\"\n      ></bottom-tool>\n    </transition>\n\n    <tvb-sso-button type=\"login-logout\" ref=\"loginRef\" style=\"display: none\" />\n  </div>\n</template>\n\n<style lang=\"scss\" scoped>\n.tvb-article {\n  --tvb-article-spacing: 32px;\n  position: relative;\n  & + .tvb-article {\n    margin-top: var(--tvb-article-spacing);\n  }\n\n  .tvb-article-divider {\n    height: 1px;\n    background: rgba(163, 178, 188, 0.35);\n  }\n\n  .tvb-article-breadcrumb {\n    margin-bottom: 32px;\n  }\n\n  .tvb-article-wrap {\n    position: relative;\n    display: flex;\n  }\n\n  // 主体文章内容\n  .tvb-main-article {\n    width: 100%;\n    max-width: 848px;\n    position: relative;\n\n    .tvb-article-title {\n      font-size: 28px;\n      font-weight: 500;\n      color: #1e1e1e;\n      line-height: 34px;\n      letter-spacing: 0.5px;\n      margin-bottom: 16px;\n    }\n\n    .tvb-article-author {\n      margin-bottom: 2px;\n    }\n\n    .tvb-article-date {\n      display: flex;\n      flex-wrap: wrap;\n      .tvb-article-date_publish {\n        margin-right: 12px;\n      }\n    }\n\n    .tvb-article-cover_box,\n    .tvb-article-video_box {\n      aspect-ratio: 16 / 9;\n      // border-radius: 8px;\n      // --tvb-hairline-border-radius: calc(2 * 8px);\n      // @include safari-overflow-hidden();\n      overflow: hidden;\n      // margin-bottom: 32px;\n    }\n    .tvb-article-cover_box {\n      position: relative;\n      cursor: pointer;\n      .viewer-placeholder {\n        position: absolute;\n        visibility: hidden;\n      }\n      @supports not (aspect-ratio: 16 / 9) {\n        padding-top: 56.25%;\n        .tvb-image,\n        .viewer-placeholder {\n          position: absolute;\n          top: 0;\n          left: 0;\n          width: 100%;\n          height: 100%;\n        }\n      }\n    }\n    .tvb-article-video_box {\n      &.draggable {\n        width: 400px;\n        height: 225px;\n        box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.16);\n\n        &.mobile {\n          width: 200px;\n          height: 112px;\n          box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.12);\n        }\n      }\n      .tvb-article-video_player {\n        width: 100%;\n        height: 100%;\n        z-index: 1;\n      }\n      .tvb-article-video_image {\n        position: absolute;\n        top: 0px;\n        left: 0px;\n        z-index: 0;\n        // border-radius: 8px;\n        // @include safari-overflow-hidden();\n        // overflow: hidden;\n      }\n    }\n\n    .tvb-article-content {\n      margin-bottom: 32px;\n      position: relative;\n    }\n\n    // 标签样式\n    .tvb-article-tags {\n      margin-bottom: 32px;\n      display: flex;\n      flex-wrap: wrap;\n      gap: 12px;\n      position: relative;\n      a {\n        text-decoration: none;\n        background-color: transparent;\n        color: inherit;\n        transition: color 0.15s linear;\n        cursor: pointer;\n        &:visited {\n          color: inherit;\n        }\n      }\n      .tvb-article-tag {\n        --tvb-article-tag-color: #555555;\n        --tvb-article-tag-bgc: #f8f9fa;\n        --tvb-article-tag-fs: 14px;\n        --tvb-article-tag-lh: 20px;\n        --tvb-article-tag-ls: 0.3px;\n        box-sizing: border-box;\n        max-width: 100%;\n        height: 32px;\n        border-radius: 16px;\n        --tvb-hairline-border-radius: calc(2 * 16px);\n        background-color: var(--tvb-article-tag-bgc);\n        padding: 0 12px;\n        display: inline-flex;\n        justify-content: center;\n        align-items: center;\n        transition: background-color 0.15s linear;\n        .tvb-article-tag_inner {\n          color: var(--tvb-article-tag-color);\n          font-size: var(--tvb-article-tag-fs);\n          letter-spacing: var(--tvb-article-tag-ls);\n          line-height: var(--tvb-article-tag-lh);\n          @include text-ellipsis();\n        }\n      }\n\n      &.tvb-article-tags_hover .tvb-article-tag:hover {\n        --tvb-article-tag-color: #0062a3;\n        --tvb-article-tag-bgc: #fff;\n      }\n    }\n\n    .tvb-article-video-contain{\n      width: 100%; \n      position: relative; \n      \n      .tvb-article-video-contain-img {\n        width:100%;\n        height:100%; \n        filter:blur(10px); \n        position: absolute;\n        background: #000;\n      }\n    }\n  }\n\n  &.article-s,\n  &.article-xs {\n    --tvb-article-spacing: 22px;\n    .tvb-article-breadcrumb {\n      margin-bottom: 16px;\n    }\n\n    .tvb-main-article {\n      .tvb-article-title {\n        font-size: 22px;\n        line-height: 28px;\n        margin-bottom: 10px;\n        color: #333;\n      }\n\n      .tvb-article-date_publish {\n        margin-right: 8px;\n      }\n\n      .tvb-article-cover_box,\n      .tvb-article-video_box {\n        // border-radius: 6px;\n        // --tvb-hairline-border-radius: calc(2 * 6px);\n        // margin-bottom: 22px;\n      }\n\n      .tvb-article-content {\n        margin-bottom: 22px;\n      }\n\n      .tvb-article-tags {\n        margin-bottom: 22px;\n        gap: 10px;\n        .tvb-article-tag {\n          --tvb-article-tag-fs: 15px;\n          --tvb-article-tag-lh: 22px;\n          --tvb-article-tag-ls: 0px;\n        }\n      }\n    }\n  }\n\n  // 相關文章\n  .tvb-article-relation-container {\n    margin-left: 32px;\n    flex: 1;\n    min-width: 360px;\n  }\n}\n</style>\n","<script setup>\nimport { inject, ref, computed, onMounted } from 'vue'\nimport { getArticleRecommend } from '@/api/article.js'\nimport { action } from '@/utils/gtm'\nimport SmallCard from '../../../components/SmallCard/index.vue'\nimport ArticleGhostCard from '../../../components/GhostCard/index.vue'\n\nconst size = inject('size')\nconst isMobile = computed(() => ['s', 'xs'].includes(size.value))\nconst articleList = inject('articleList')\nconst categoryId = computed(() => articleList.value?.[0]?.category_id)\nconst excludeId = computed(() => articleList.value?.map((v) => v.id))\n\nconst loading = ref(false)\nconst list = ref([])\nconst isEmpty = computed(() => list.value.length === 0)\nconst mlist = computed(() => list.value.filter((v, i) => i > 0))\nconst fetchArticleRecommend = async () => {\n  if (!categoryId.value) return\n  loading.value = true\n  try {\n    const res = await getArticleRecommend({\n      category_id: categoryId.value,\n      exclude_ids: excludeId.value\n    })\n    if (res.code !== 0) throw new Error(res.message)\n    list.value = (res.data?.list || []).slice(0, 5)\n    loading.value = false\n  } catch (error) {\n    loading.value = false\n  }\n}\n\nconst layerData = inject('layerData')\nconst tracking = (item) => {\n  action({\n    ...layerData.value,\n    page_title: item.title || '',\n    screen_class: item.title || '',\n    eventCategory: 'sub_category',\n    eventLabel: item.title || '',\n    eventID: 'B015',\n    screenLabel: item.link || ''\n  })\n}\n\n// 调用时机为没有下一篇且可见时\nonMounted(() => fetchArticleRecommend())\n</script>\n\n<template>\n  <div\n    v-if=\"loading ? true : !isEmpty\"\n    class=\"tvb-article-recommend\"\n    :class=\"size ? 'recommend-' + size : ''\"\n  >\n    <div class=\"tvb-article-recommend_tit\">推薦內容</div>\n    <div v-if=\"!isMobile\" class=\"tvb-article-recommend_cont\">\n      <template v-if=\"loading\">\n        <div\n          v-for=\"(item, i) in 5\"\n          :key=\"item\"\n          class=\"tvb-skeleton tvb-article-recommend_card tvb-hairline--surround\"\n          :class=\"{ 'tvb-article-recommend_card-frist': i === 0 }\"\n        >\n          <tvb-image src=\"\" backgroundc=\"#F0F1F2\"></tvb-image>\n        </div>\n      </template>\n      <template v-else>\n        <SmallCard\n          v-for=\"(item, i) in list\"\n          :key=\"item.id\"\n          class=\"tvb-article-recommend_card\"\n          :class=\"{ 'tvb-article-recommend_card-frist': i === 0 }\"\n          :img=\"item.image_info\"\n          :title=\"item.title\"\n          title-tag=\"p\"\n          :iconSize=\"i === 0 ? 40 : 32\"\n          :isVideo=\"item.video_url ? true : false\"\n          :link=\"{ url: item.link, rel: item.link_rel, target: item.link_target }\"\n          @tracking=\"tracking(item)\"\n        ></SmallCard>\n      </template>\n    </div>\n    <div v-else class=\"tvb-article-recommend_cont-m\">\n      <tvb-article-card\n        class=\"tvb-article-recommend_card-m-frist\"\n        :loading=\"loading\"\n        :size=\"size\"\n        :autoheight=\"isMobile\"\n        :img=\"list[0].image_info\"\n        :isVideo=\"list[0].video_url ? true : false\"\n        :playIcon=\"{ size: 40 }\"\n        :title=\"list[0].title\"\n        :link=\"{ url: list[0].link, rel: list[0].link_rel, target: list[0].link_target }\"\n        @tracking=\"tracking(item)\"\n      ></tvb-article-card>\n\n      <n-scrollbar x-scrollable>\n        <div class=\"tvb-article-recommend_scroll-wrap\">\n          <template v-if=\"loading\">\n            <article-ghost-card v-for=\"item in 3\" :key=\"item\" loading></article-ghost-card>\n          </template>\n          <template v-else>\n            <article-ghost-card\n              v-for=\"item in mlist\"\n              :key=\"item.id\"\n              :size=\"size\"\n              :img=\"item.image_info\"\n              :isVideo=\"item.video_url ? true : false\"\n              :playIcon=\"{ size: 32 }\"\n              :title=\"item.title\"\n              :link=\"{ url: item.link, rel: item.link_rel, target: item.link_target }\"\n              @tracking=\"tracking(item)\"\n            ></article-ghost-card>\n          </template>\n        </div>\n      </n-scrollbar>\n    </div>\n  </div>\n</template>\n\n<style lang=\"scss\" scoped>\n.tvb-article-recommend {\n  margin-top: 56px;\n  .tvb-article-recommend_tit {\n    font-size: 22px;\n    font-weight: 500;\n    color: #1e1e1e;\n    line-height: 32px;\n    letter-spacing: 0.5px;\n    margin-bottom: 16px;\n  }\n\n  &.recommend-s,\n  &.recommend-xs {\n    margin-top: 22px;\n    .tvb-article-recommend_tit {\n      font-size: 17px;\n      line-height: 24px;\n      margin-bottom: 10px;\n      padding: 0 var(--tvb-article-detail-m-padding);\n    }\n  }\n\n  .tvb-article-recommend_cont {\n    --gap: 16px;\n    --columns: 4;\n    gap: var(--gap);\n    display: grid;\n    grid-template-columns: repeat(var(--columns), 1fr);\n    .tvb-skeleton {\n      border-radius: 8px;\n      --tvb-hairline-border-radius: calc(2 * 8px);\n      overflow: hidden;\n      @include safari-overflow-hidden();\n    }\n    .tvb-article-recommend_card {\n      aspect-ratio: calc(308px / 173px);\n      &.tvb-article-recommend_card-frist {\n        grid-column: 1/3;\n        grid-row: 1/3;\n        aspect-ratio: calc(632px / 362px);\n        --sc-mask-padding: 16px 16px;\n      }\n      &:not(.tvb-article-recommend_card-frist) {\n        --sc-title-font-size: 16px;\n        --sc-title-line-height: 22px;\n        --sc-icon-margin-left: 12px;\n        --sc-mask-padding: 10px 12px;\n      }\n    }\n  }\n\n  .tvb-article-recommend_cont-m {\n    .tvb-article-recommend_card-m-frist {\n      margin-bottom: 10px;\n      margin-left: var(--tvb-article-detail-m-padding);\n      margin-right: var(--tvb-article-detail-m-padding);\n    }\n    :deep(.n-scrollbar-rail__scrollbar) {\n      opacity: 0;\n    }\n    .tvb-article-recommend_scroll-wrap {\n      display: flex;\n      gap: 10px;\n      padding: 0 var(--tvb-article-detail-m-padding);\n      :deep(.tvb-article-ghost-card) {\n        width: 160px;\n        --gc-info-margin-top: 6px;\n      }\n    }\n  }\n}\n</style>\n","<script setup>\nimport {\n  provide,\n  inject,\n  ref,\n  computed,\n  watch,\n  watchEffect,\n  onBeforeUnmount,\n  nextTick\n} from 'vue'\nimport { useRoute, useRouter } from 'vue-router'\nimport { useWindowScroll, watchThrottled } from '@vueuse/core'\nimport { getArticleDetail, getArticleNext, getArticlePreview } from '@/api/article.js'\nimport MainArticle from './components/Article/index.vue'\nimport LazyComponent from '../components/LazyComponent/index.vue'\nimport ArticleRecommend from './components/Recommend/index.vue'\nimport previewLogin from '../components/PreviewLogin/index.vue'\nimport { getSessionStorage } from '@/utils'\n\nconst route = useRoute()\nconst router = useRouter()\nconst { y: scrollY } = useWindowScroll()\nconst isPreview = inject('isPreview')\nconst perviewLogin = ref(false)\nconst perviewLoginKey = ref(false)\nconst isPreviewSecret = ref(false)\n\n// 監聽加載更多\nconst scrollerFooter = ref()\nconst intersectionObserver = new IntersectionObserver(function (entries) {\n  if (entries[0].intersectionRatio <= 0) return\n  fetchArticleInfo()\n})\nconst observe = () => scrollerFooter.value && intersectionObserver.observe(scrollerFooter.value)\nconst unobserve = () => scrollerFooter.value && intersectionObserver.unobserve(scrollerFooter.value) // 停止\nconst disconnect = () => {\n  unobserve()\n  intersectionObserver.disconnect() // 關閉\n}\n\nconst articleId = ref(route?.params?.articleId)\nconst list = ref([])\nconst mainArticleRefs = ref([])\nconst isEmpty = computed(() => list.value.length === 0)\nconst initLoading = ref(true)\nconst loading = ref(false)\nconst finished = ref(false) // 最後頁完成狀態\nconst page = ref(1)\nconst limit = ref(3)\nconst getExcludeIds = (id) => {\n  const index = list.value.findIndex((v) => v.id == id)\n  if (index > 0) {\n    const arr = list.value.slice(0, index)\n    return arr.map((v) => v.id)\n  }\n  return []\n}\nconst fetchArticleInfo = async (mode) => {\n  const isInit = mode === 'init'\n  if (!isInit) {\n    loading.value = true\n    unobserve()\n  }\n  try {\n    const apiFun = isInit\n      ? isPreview.value\n        ? getArticlePreview\n        : getArticleDetail\n      : getArticleNext\n\n    const extraParams = {}\n    if (isPreview.value) {\n      const pwd = getSessionStorage(articleId.value)\n      isPreviewSecret.value = !!pwd\n      if (pwd) {\n        extraParams.pwd = pwd\n      }\n    }\n\n    const apiParams = isInit\n      ? { article_id: articleId.value, ...extraParams }\n      : {\n          article_id: articleId.value,\n          query: { exclude_ids: getExcludeIds(articleId.value), ...extraParams }\n        }\n    const res = await apiFun(apiParams)\n\n    if(isPreview.value && res.code === 103023){\n      return window.location = '/403.html'\n    }\n    if (isPreview.value && res.code === 203043) {\n      perviewLogin.value = true\n      perviewLoginKey.value = !perviewLoginKey.value\n    } else {\n      perviewLogin.value = false\n    }\n    if (res.code !== 0) throw new Error(res.message)\n    // console.log('文章详情--', res.data)\n    let _data = res.data || {}\n    if (!_data.contents) _data.contents = [{ type: 1, rich_text: { html: _data.content } }] // 兼容旧数据\n    if(isPreview.value && _data.source != 1){\n      router.replace(`/preview/vote/${articleId.value}`)\n    }\n    articleId.value = _data.id\n    if (isInit) activeArticle.value = _data\n    list.value.push(_data)\n\n    if (page.value >= limit.value) finished.value = true\n    else page.value++\n\n    if (isInit) {\n      initLoading.value = false\n      nextTick(() => mainArticleRefs.value[0].play?.())\n    } else loading.value = false\n    if (isInit && !finished.value) nextTick(() => observe())\n  } catch (error) {\n    console.warn(error)\n    if (isInit) initLoading.value = false\n    else {\n      loading.value = false\n      finished.value = true\n    }\n  }\n}\nfetchArticleInfo('init')\n\nconst play = (_index) => {\n  for (let index = 0; index < mainArticleRefs.value.length; index++) {\n    const article = mainArticleRefs.value[index]\n    if (index !== _index) {\n      article.pause()\n    }\n  }\n}\n\nwatch(loading, (val) => {\n  if (val) unobserve()\n  else if (finished.value) disconnect()\n  else observe()\n})\n\nwatchEffect(() => {\n  if (!initLoading.value && isEmpty.value && !perviewLogin.value)\n    window.history.replaceState(history.state, null, '/notice.html')\n})\n\n// bottom为负数，取下一篇文章为当前文章，没有下一篇文章则还是当前文章。scrollY节流\nconst activeArticle = ref({})\nwatchThrottled(\n  scrollY,\n  () => {\n    try {\n      if (mainArticleRefs.value && mainArticleRefs.value.length > 0) {\n        let arr1 = mainArticleRefs.value.map((v) => v.elementBounding.bottom.value - 64)\n        let index = arr1.map((v) => (v < 0 ? 'false' : 'true')).lastIndexOf('false')\n        if (index >= 0) {\n          if (list.value[index + 1]) {\n            activeArticle.value = list.value[index + 1]\n          } else {\n            activeArticle.value = list.value[index]\n          }\n        } else {\n          activeArticle.value = list.value[0]\n        }\n      }\n    } catch (error) {\n      console.warn(error)\n    }\n  },\n  { throttle: 500 }\n)\n\nprovide('articleList', list)\nprovide('activeArticle', activeArticle)\nonBeforeUnmount(() => {\n  disconnect()\n})\n</script>\n\n<template>\n  <div\n    v-if=\"initLoading || isEmpty\"\n    class=\"init-page\"\n    :class=\"{ 'error-page': !initLoading && isEmpty }\"\n  >\n    <div v-if=\"initLoading\" class=\"tvb-loading-box init-loading-box\"><n-spin /></div>\n    <preview-login\n      v-else-if=\"isPreview && perviewLogin\"\n      :key=\"perviewLoginKey\"\n      :value=\"articleId\"\n      :pwd-error=\"isPreviewSecret\"\n      :query-fun=\"() => fetchArticleInfo('init')\"\n    >\n    </preview-login>\n    <tvb-empty\n      v-else\n      icon=\"img_article_deleted\"\n      :des=\"isPreview ? '預覽鏈接已失效，請重新獲取' : '抱歉，找不到相關資料'\"\n      :showbtn=\"!isPreview\"\n    ></tvb-empty>\n  </div>\n  <template v-else>\n    <div class=\"tvb-article-detail\">\n      <div class=\"tvb-article-detail-wrap\">\n        <div class=\"tvb-article-detail_w\">\n          <template v-for=\"(item, index) in list\" :key=\"item.id\">\n            <main-article :info=\"item\" ref=\"mainArticleRefs\" @play=\"play(index)\"></main-article>\n          </template>\n        </div>\n\n        <div v-if=\"loading\" class=\"tvb-loading-box loading-box\"><n-spin /></div>\n        <div\n          v-if=\"!finished && !isPreview\"\n          ref=\"scrollerFooter\"\n          class=\"scroller-footer\"\n          style=\"height: 0.5px\"\n        ></div>\n\n        <lazy-component v-if=\"finished\">\n          <article-recommend></article-recommend>\n        </lazy-component>\n      </div>\n    </div>\n  </template>\n</template>\n\n<style lang=\"scss\" scoped>\n.init-page {\n  padding-top: 0 !important;\n  padding-bottom: 0 !important;\n  .init-loading-box {\n    padding: 32px 0;\n  }\n}\n\n.error-page {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  .tvb-empty {\n    height: 500px;\n  }\n  &.s,\n  &.xs {\n    align-items: stretch;\n    padding-top: 100px !important;\n    padding-bottom: 100px !important;\n    .tvb-empty {\n      height: 400px;\n    }\n  }\n}\n\n.tvb-article-detail {\n  padding-top: 16px !important;\n  &.s,\n  &.xs {\n    padding-top: 10px !important;\n    padding-left: 0 !important;\n    padding-right: 0 !important;\n    .tvb-article-detail_w {\n      padding: 0 var(--tvb-article-detail-m-padding);\n    }\n  }\n\n  .tvb-article-detail-wrap {\n    max-width: var(--tvb-article-max-width);\n    margin: 0 auto;\n    .loading-box {\n      padding: 32px 0;\n      max-width: 848px;\n    }\n  }\n}\n</style>\n"],"names":["props","__props","showImages","computed","remainder","getHClassName","index","emit","__emit","size","inject","isMobile","contents","handle","images","ref","richTextImgs","changeFn","pswp","sha1","lightbox","usePhotoswipe","value","arr","v","item","handleRichtext","handleAlbum","replaceBookmarks","hash","letslazyload","str","regexp1","match","p1","p2","p3","p4","p5","p6","res","imgNodes","imgs","target","desc","_a","href","_b","imgHtml","aNodes","_d","_c","insNode","twisNode","hasInsPost","hasXPost","watch","findImgIndex","src","showViewer","num","findIndex","onRichtextClick","e","error","onImgClick","onMounted","__expose","dateTime","time","dayjs","windowHeight","height","scrollTop","onscroll","obj","onload","timer","clearTimer","scrollbarShow","loading","list","headInfo","slist","isEmpty","finished","page","mode","isInit","limit","getArticleRelation","newsList","layerData","tracking","action","width","draggableRef","draggableContainerRef","draggableMoveSetTimeout","draggableMove","left","top","headerEl","draggableEl","nextTick","emits","config","useAppStore","route","useRoute","isPreview","setAdParams","activeArticle","seoTitleSuffix","loginRef","articleRef","tvbPlayerRef","isPlay","showRelation","articleId","isActive","author","draggableDisabled","elementBounding","useElementBounding","info","delayShow","breadcrumbs","categoryInfo","cloading","fetchCategoryInfo","fetchExtraInfo","useArticle","onStateChange","state","pause","play","draggableIntersectionObserver","useIntersectionObserver","isIntersecting","is_like","like_num","extraCallback","data","onClickLike","postArticleLike","dividerRef","targetIsVisible","useElementVisibility","relationRef","relationHeight","useElementSize","asideRef","asideWidth","richRef","handleViewer","relationFixed","onAffixChange","canonical","title","seo_title","id","filterSpecial","head","useHead","seoMeta","setSeo","isSeo","meta_description","og_image_alt_txt","og_image_info","image_info","_title","newsArticleLdJson","toISOString","p","c","i","watchEffect","useSeoMeta","photoId","_f","_e","pageview","onViewerShown","popUp","slide","onViewerChange","onCopyHandler","event","contentCopyHandler","onBeforeUnmount","articleList","categoryId","excludeId","mlist","fetchArticleRecommend","getArticleRecommend","router","useRouter","scrollY","useWindowScroll","perviewLogin","perviewLoginKey","isPreviewSecret","scrollerFooter","intersectionObserver","entries","fetchArticleInfo","observe","unobserve","disconnect","mainArticleRefs","initLoading","getExcludeIds","apiFun","getArticlePreview","getArticleDetail","getArticleNext","extraParams","pwd","getSessionStorage","apiParams","_data","_index","article","val","watchThrottled","provide"],"mappings":"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"}