{"version":3,"file":"index-Qb98a7nn.js","sources":["../../src/views/Article/Category/components/Mpm/useMpm.js","../../src/views/Article/Category/components/Mpm/index.vue","../../src/views/Article/Category/components/Mpm2/index.vue","../../src/views/Article/Category/components/CategoryModel/index.vue","../../src/views/Article/Category/MainPage.vue","../../src/views/Article/Category/SubPage.vue","../../src/views/Article/Category/index.vue"],"sourcesContent":["import { inject } from 'vue'\nimport { useIntersectionObserver } from '@vueuse/core'\nimport { impression, action } from '@/utils/gtm'\n\nconst useMpm = () => {\n  const getVisible = (target) => {\n    return new Promise((resolve) => {\n      const { stop } = useIntersectionObserver(target, ([{ isIntersecting }]) => {\n        resolve(isIntersecting)\n        stop()\n      })\n    })\n  }\n\n  const layerData = inject('layerData')\n\n  const mpmImpression = (res) => {\n    impression({\n      ...layerData.value,\n      // eventID: 'o002',\n      eventID: 'impression_mpm_data',\n      page_title: `${res?.category_name || ''}_impression`,\n      eventLabel: `${res?.category_name || ''}_impression`,\n      screen_class: res?.title || '',\n      eventCategoy: 'main_category',\n      screenLabel: res?.link || ''\n    })\n  }\n\n  const mpmTracking = (item, type = '', isurl = true) => {\n    if (!isurl) return\n    action({\n      ...layerData.value,\n      // eventID: 'B012',\n      eventID: 'impression_mpm_data',\n      page_title: `${item.title || ''}_mpm`,\n      screen_class: item.title || '',\n      eventCategory: 'main_category',\n      eventLabel: `${item.title || ''}_mpm`,\n      screenLabel: item.jump_param || item.link || '',\n      listName: type\n    })\n  }\n\n  return { layerData, mpmImpression, mpmTracking, getVisible }\n}\n\nexport default useMpm\n","<script setup>\nimport { ref, computed, watch, nextTick } from 'vue'\nimport useMpm from './useMpm'\nimport dayjs from 'dayjs'\nimport { Swiper, SwiperSlide } from 'swiper/vue'\nimport { Autoplay, A11y } from 'swiper/modules'\nimport 'swiper/css'\nimport 'swiper/css/autoplay'\n\nconst props = defineProps({\n  size: { type: String, default: null },\n  mpms: {\n    type: Array,\n    default: () => []\n  }\n})\nconst { mpmImpression, mpmTracking, getVisible } = useMpm()\nconst isMobile = computed(() => ['s', 'xs'].includes(props.size))\nconst toDateTime = (time) => {\n  if (time && dayjs(time).isValid()) {\n    return dayjs.unix(time).format('YYYY-MM-DD HH:mm')\n  } else {\n    return ''\n  }\n}\n\nconst tvbPlayerRef = ref()\nconst mpmRef = ref()\nconst realIndex = ref(-1)\nconst onActiveIndexChange = (e) => {\n  if (!e?.autoplay?.running) mpmRef.value?.$el?.swiper?.autoplay?.start()\n  realIndex.value = e.realIndex\n}\n\n// 监听播放\nconst onStateChange = ({ index, state }) => {\n  if (index === realIndex.value) {\n    if (state === 'play' || state === 'loading') {\n      mpmRef.value?.$el?.swiper?.autoplay?.stop()\n    } else {\n      mpmRef.value?.$el?.swiper?.autoplay?.start()\n    }\n  }\n}\n\n// 处理自动播放\nconst onSlideChangeTransitionEnd = () => {\n  nextTick(async () => {\n    if (Array.isArray(tvbPlayerRef.value)) {\n      for (const element of tvbPlayerRef.value) {\n        let visible = await getVisible(element)\n        if (visible) {\n          setTimeout(() => element?.play?.(), 300)\n          break\n        }\n      }\n    }\n  })\n}\n\n// 初始化后\nconst onAfterInit = () => onSlideChangeTransitionEnd()\n\nwatch(realIndex, (value) => {\n  if (Array.isArray(tvbPlayerRef.value)) {\n    tvbPlayerRef.value.forEach((element) => element?.pause?.())\n  }\n  const res = props.mpms?.[value]\n  mpmImpression(res)\n})\n\nconst onMouseover = (index) => {\n  if (isMobile.value) return\n  mpmRef.value.$el.swiper.slideToLoop(index)\n}\n</script>\n<template>\n  <div\n    class=\"tvb-main-category-mpm\"\n    :class=\"[\n      size ? 'mpm-' + size : '',\n      { 'slide_image-hover': !isMobile },\n      { 'mpm-onlyone': mpms.length === 1 }\n    ]\"\n  >\n    <swiper\n      ref=\"mpmRef\"\n      class=\"tvb-main-category-swiper\"\n      :class=\"{ 'tvb-hairline--surround': !isMobile }\"\n      :modules=\"[Autoplay, A11y]\"\n      loop\n      :autoplay=\"{\n        delay: 5000,\n        disableOnInteraction: false,\n        pauseOnMouseEnter: true\n      }\"\n      @afterInit=\"onAfterInit\"\n      @activeIndexChange=\"onActiveIndexChange\"\n      @slideChangeTransitionEnd=\"onSlideChangeTransitionEnd\"\n    >\n      <swiper-slide\n        v-for=\"(item, index) in mpms\"\n        :key=\"index\"\n        class=\"tvb-main-category-swiper_slide\"\n      >\n        <tvb-router-link\n          :to=\"item.link\"\n          :linkRel=\"item.link_rel\"\n          :linkTarget=\"item.link_target\"\n          @click=\"mpmTracking(item, item.video_url ? 'video' : 'image')\"\n        >\n          <tvb-image\n            class=\"tvb-main-category-swiper_slide_image\"\n            :src=\"item.image_info\"\n            :alt=\"item.title\"\n            :transform=\"isMobile ? false : true\"\n            backgroundc=\"#F0F1F2\"\n          />\n          <tvb-player\n            v-if=\"item.video_url\"\n            :id=\"item.id\"\n            ref=\"tvbPlayerRef\"\n            class=\"tvb-main-category_swiper-player\"\n            :src=\"item.video_url\"\n            :mute=\"true\"\n            :playerVars=\"{ controls: 0 }\"\n            @state-change=\"(player) => onStateChange({ ...player, index })\"\n          ></tvb-player>\n        </tvb-router-link>\n        <div class=\"tvb-main-category-swiper_slide_mask\">\n          <tvb-router-link\n            :to=\"item.link\"\n            :linkRel=\"item.link_rel\"\n            :linkTarget=\"item.link_target\"\n            @click=\"mpmTracking(item, 'text')\"\n          >\n            <h3 class=\"clear-h tvb-swiper_slide_mask-tit\" :title=\"item.title\">\n              {{ item.title }}\n            </h3>\n            <div v-if=\"!isMobile\" class=\"tvb-swiper_slide_mask-owner\">\n              <span class=\"tvb-swiper_slide_mask-author\" :title=\"item.category_name\">\n                {{ item.category_name }}\n              </span>\n              <span v-if=\"item.publish_at\" class=\"tvb-swiper_slide_mask-date\">\n                {{ toDateTime(item.publish_at) }}\n              </span>\n            </div>\n          </tvb-router-link>\n        </div>\n      </swiper-slide>\n\n      <template v-slot:container-end>\n        <template v-if=\"mpms.length > 1\">\n          <div\n            class=\"tvb-main-category-mpm_nav mpm_nav-prev\"\n            @click.stop=\"() => mpmRef.$el.swiper.slidePrev()\"\n          >\n            <tvb-svg-icon name=\"icon_arrow_mpm\" />\n          </div>\n          <div\n            class=\"tvb-main-category-mpm_nav mpm_nav-next\"\n            @click.stop=\"() => mpmRef.$el.swiper.slideNext()\"\n          >\n            <tvb-svg-icon name=\"icon_arrow_mpm\" />\n          </div>\n        </template>\n      </template>\n    </swiper>\n\n    <div class=\"tvb-main-category-mpm_page\">\n      <div class=\"tvb-main-category-mpm_page_wrap\">\n        <div\n          class=\"tvb-main-category-mpm_dot\"\n          v-for=\"(item, index) in mpms\"\n          :key=\"index\"\n          :class=\"[{ active: realIndex === index }, { hover: !isMobile }]\"\n          @click=\"onMouseover(index)\"\n        ></div>\n      </div>\n    </div>\n  </div>\n</template>\n\n<style lang=\"scss\" scoped>\n.tvb-main-category-mpm {\n  position: relative;\n  width: 100%;\n  height: 100%;\n\n  .tvb-main-category-swiper {\n    width: 100%;\n    height: 100%;\n    border-radius: 8px;\n    --tvb-hairline-border-radius: calc(2 * 8px);\n  }\n\n  // hover\n  &.slide_image-hover {\n    &:hover .tvb-main-category-mpm_nav {\n      &.mpm_nav-prev {\n        left: 0;\n      }\n      &.mpm_nav-next {\n        right: 0;\n      }\n    }\n  }\n\n  // 导航按钮\n  .tvb-main-category-mpm_nav {\n    position: absolute;\n    top: calc(200 / 477 * 100%);\n    width: 28px;\n    height: 48px;\n    background-color: rgba(0, 0, 0, 0.6);\n    z-index: 1;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    font-size: 18px;\n    border-radius: 8px 0px 0px 8px;\n    user-select: none;\n    cursor: pointer;\n    transition:\n      left 0.15s linear,\n      right 0.15s linear,\n      background-color 0.15s linear;\n    &.mpm_nav-prev {\n      left: -28px;\n      transform: scaleX(-1);\n      transition:\n        left 0.15s linear,\n        right 0.15s linear,\n        background-color 0.15s linear;\n    }\n    &.mpm_nav-next {\n      transition:\n        left 0.15s linear,\n        right 0.15s linear,\n        background-color 0.15s linear;\n      right: -28px;\n    }\n    .svg-icon {\n      opacity: 0.85;\n      transition: opacity 0.15s linear;\n    }\n\n    &.mpm_nav-prev:hover,\n    &.mpm_nav-next:hover {\n      background-color: rgba(0, 0, 0, 0.8);\n      .svg-icon {\n        opacity: 1;\n      }\n    }\n  }\n\n  .tvb-main-category-swiper_slide {\n    a {\n      text-decoration: none;\n      background-color: transparent;\n      color: inherit;\n      cursor: pointer;\n      &:visited {\n        color: inherit;\n      }\n    }\n\n    .tvb-main-category_swiper-player {\n      position: absolute;\n      top: 0;\n      left: 0;\n      width: 100%;\n      height: 100%;\n      :deep(.tvb-player-play) {\n        top: calc(200 / 477 * 100%);\n      }\n      &::after {\n        content: ' ';\n        position: absolute;\n        left: 0;\n        right: 0;\n        top: 0;\n        bottom: 0;\n      }\n    }\n\n    .tvb-main-category-swiper_slide_mask {\n      width: 100%;\n      position: absolute;\n      left: 0;\n      bottom: 0;\n      background-color: rgba(0, 0, 0, 0.6);\n      padding: 12px 16px 36px;\n      line-height: 0;\n\n      .tvb-swiper_slide_mask-tit {\n        @include line-text-ellipsis(1);\n        color: #eeeeee;\n        font-size: 22px;\n        font-weight: 500;\n        letter-spacing: 0.5px;\n        line-height: 28px;\n        // text-shadow: 0px 0px 4px rgba(0, 0, 0, 0.6);\n      }\n\n      .tvb-swiper_slide_mask-owner {\n        display: flex;\n        align-items: center;\n        display: inline-flex;\n        color: #eeeeee;\n        font-size: 14px;\n        letter-spacing: 0;\n        line-height: 20px;\n        margin-top: 4px;\n      }\n\n      .tvb-swiper_slide_mask-author {\n        flex: 1;\n        // text-shadow: 0px 0px 4px rgba(0, 0, 0, 0.6);\n        @include line-text-ellipsis(1);\n      }\n\n      .tvb-swiper_slide_mask-date {\n        // text-shadow: 0px 0px 4px rgba(0, 0, 0, 0.6);\n        margin-left: 12px;\n      }\n    }\n  }\n\n  &.mpm-s,\n  &.mpm-xs {\n    padding-bottom: 11px;\n    .tvb-main-category-swiper {\n      border-radius: 0px;\n    }\n\n    .tvb-main-category_swiper-player {\n      :deep(.tvb-player-play) {\n        top: calc(((100% - 40px) / 2) - 40px / 2); // (100% - mask高度) - icon大小\n      }\n    }\n\n    .tvb-main-category-swiper_slide_mask {\n      padding: 8px 12px;\n      .tvb-swiper_slide_mask-tit {\n        font-size: 17px;\n        line-height: 24px;\n      }\n    }\n  }\n\n  // 分页器\n  .tvb-main-category-mpm_page {\n    position: absolute;\n    left: 16px;\n    bottom: 16px;\n    z-index: 1;\n    user-select: none;\n\n    .tvb-main-category-mpm_page_wrap {\n      display: flex;\n\n      .tvb-main-category-mpm_dot {\n        height: 8px;\n        width: 8px;\n        background-color: rgba(255, 255, 255, 0.3);\n        border-radius: 50%;\n        transition: background-color 0.15s linear;\n        cursor: pointer;\n\n        & + .tvb-main-category-mpm_dot {\n          margin-left: 8px;\n        }\n\n        &.active {\n          background-color: rgba(255, 255, 255, 0.8);\n        }\n        &.hover:hover {\n          background-color: rgba(255, 255, 255, 0.8);\n        }\n      }\n    }\n  }\n\n  &.mpm-s,\n  &.mpm-xs {\n    &.mpm-onlyone {\n      .tvb-main-category-mpm_page {\n        display: none;\n      }\n    }\n\n    .tvb-main-category-mpm_page {\n      left: 50%;\n      bottom: 0;\n      transform: translateX(-50%);\n      .tvb-main-category-mpm_dot {\n        height: 3px;\n        background-color: rgba(163, 178, 188, 0.35);\n        border-radius: 2px;\n        cursor: auto;\n        & + .tvb-main-category-mpm_dot {\n          margin-left: 4px;\n        }\n        &.active {\n          background-color: #818d95;\n        }\n      }\n    }\n  }\n}\n</style>\n","<script setup>\nimport { inject, ref, computed, watch, nextTick } from 'vue'\nimport useMpm from '../Mpm/useMpm'\nimport { Swiper, SwiperSlide } from 'swiper/vue'\nimport { Autoplay, A11y } from 'swiper/modules'\nimport 'swiper/css'\nimport 'swiper/css/autoplay'\n\nconst props = defineProps({\n  size: { type: String, default: null },\n  mpms: {\n    type: Array,\n    default: () => []\n  }\n})\n\nconst categoryInfo = inject('categoryInfo')\nconst { mpmImpression, mpmTracking, getVisible } = useMpm()\nconst isMobile = computed(() => ['s', 'xs'].includes(props.size))\nconst isBigScreen = computed(() => ['xl', 'l'].includes(props.size))\nconst twoMpms = computed(() => (props.mpms.length === 2 ? [...props.mpms, ...props.mpms] : []))\nconst _mpms = computed(() => (twoMpms.value.length === 0 ? props.mpms : twoMpms.value))\n\nconst tvbPlayerRef = ref()\nconst mpmRef = ref()\nconst realIndex = ref(-1)\nconst onActiveIndexChange = (e) => {\n  if (!e?.autoplay?.running) mpmRef.value?.$el?.swiper?.autoplay?.start()\n  realIndex.value = e.realIndex\n}\n\n// 监听播放\nconst playing = ref(false)\nconst onStateChange = ({ index, state }) => {\n  if (index === realIndex.value) {\n    if (state === 'play' || state === 'loading') {\n      mpmRef.value?.$el?.swiper?.autoplay?.stop()\n    } else {\n      mpmRef.value?.$el?.swiper?.autoplay?.start()\n    }\n    playing.value = state !== 'ended'\n  }\n}\n\n// 处理自动播放\nconst onSlideChangeTransitionEnd = () => {\n  nextTick(async () => {\n    if (Array.isArray(tvbPlayerRef.value)) {\n      for (const element of tvbPlayerRef.value) {\n        let visible = await getVisible(element)\n        if (visible) {\n          setTimeout(() => element?.play?.(), 300)\n          break\n        }\n      }\n    }\n  })\n}\n\n// 初始化后\nconst onAfterInit = () => onSlideChangeTransitionEnd()\n\nwatch(realIndex, (value) => {\n  playing.value = false\n  if (Array.isArray(tvbPlayerRef.value)) {\n    tvbPlayerRef.value.forEach((element) => element?.pause?.())\n  }\n  const res = props.mpms?.[value]\n  mpmImpression({ ...res, category_name: categoryInfo.value?.title })\n})\n\nconst onMouseover = (index) => {\n  if (!['xl', 'l', 'm'].includes(props.size)) return\n  mpmRef.value.$el.swiper.slideToLoop(index)\n}\n</script>\n\n<template>\n  <div\n    class=\"tvb-main-category-mpm2\"\n    :class=\"[\n      size ? 'mpm-' + size : '',\n      { 'slide_image-hover': isBigScreen },\n      { 'mpm-onlyone': mpms.length === 1 },\n      { 'show-mpm_nav': isBigScreen && playing }\n    ]\"\n  >\n    <swiper\n      ref=\"mpmRef\"\n      class=\"tvb-main-category-swiper\"\n      :class=\"{ 'tvb-hairline--surround': isBigScreen }\"\n      :modules=\"[Autoplay, A11y]\"\n      loop\n      :autoplay=\"{\n        delay: 5000,\n        disableOnInteraction: false,\n        pauseOnMouseEnter: true\n      }\"\n      :spaceBetween=\"8\"\n      :slidesPerView=\"'auto'\"\n      :breakpoints=\"{\n        768: {\n          spaceBetween: 16\n        },\n        1025: {\n          spaceBetween: 0\n        }\n      }\"\n      @afterInit=\"onAfterInit\"\n      @activeIndexChange=\"onActiveIndexChange\"\n      @slideChangeTransitionEnd=\"onSlideChangeTransitionEnd\"\n    >\n      <swiper-slide\n        v-for=\"(item, index) in _mpms\"\n        :key=\"index\"\n        class=\"tvb-main-category-swiper_slide\"\n        #=\"{ isActive }\"\n      >\n        <template v-if=\"item.jump_param\">\n          <tvb-router-link\n            :to=\"item.jump_param\"\n            :linkRel=\"item.link_rel\"\n            :linkTarget=\"item.link_target\"\n            @click=\"mpmTracking(item, item.jump_type === 1 ? 'image' : 'video')\"\n          >\n            <tvb-image\n              v-if=\"isBigScreen\"\n              class=\"tvb-main-category-swiper_slide_image\"\n              :src=\"item.pc_image_info\"\n              :alt=\"item.image_alt_text\"\n              :transform=\"isMobile ? false : true\"\n              backgroundc=\"#F0F1F2\"\n            />\n            <tvb-image\n              v-else\n              class=\"tvb-main-category-swiper_slide_image\"\n              :src=\"item.h5_image_info\"\n              :alt=\"item.image_alt_text\"\n              :transform=\"isMobile ? false : true\"\n              backgroundc=\"#F0F1F2\"\n            />\n          </tvb-router-link>\n        </template>\n        <template v-else>\n          <tvb-image\n            v-if=\"isBigScreen\"\n            class=\"tvb-main-category-swiper_slide_image\"\n            :src=\"item.pc_image_info\"\n            :alt=\"item.image_alt_text\"\n            :transform=\"isMobile ? false : true\"\n            backgroundc=\"#F0F1F2\"\n          />\n          <tvb-image\n            v-else\n            class=\"tvb-main-category-swiper_slide_image\"\n            :src=\"item.h5_image_info\"\n            :alt=\"item.image_alt_text\"\n            :transform=\"isMobile ? false : true\"\n            backgroundc=\"#F0F1F2\"\n          />\n        </template>\n        <tvb-player\n          v-if=\"item.jump_type === 3 && item.jump_param && isActive\"\n          ref=\"tvbPlayerRef\"\n          class=\"tvb-main-category_swiper-player\"\n          :class=\"{ 'slide-player-playing': isActive && playing }\"\n          :src=\"item.jump_param\"\n          :mute=\"true\"\n          :playerVars=\"{ fs: 0 }\"\n          @state-change=\"(player) => onStateChange({ ...player, index })\"\n        ></tvb-player>\n\n        <div\n          v-if=\"item.title\"\n          v-show=\"isBigScreen ? !playing : true\"\n          class=\"tvb-main-category-swiper_slide_mask\"\n          :class=\"{ 'mask-playing': isActive && playing }\"\n        >\n          <tvb-router-link\n            :to=\"item.jump_type === 1 ? item.jump_param : null\"\n            :linkRel=\"item.link_rel\"\n            :linkTarget=\"item.link_target\"\n            @click=\"mpmTracking(item, 'text', item.jump_type === 1 && item.jump_param)\"\n          >\n            <h3 class=\"clear-h tvb-swiper_slide_mask-tit\" :title=\"item.title\">\n              {{ item.title }}\n            </h3>\n          </tvb-router-link>\n        </div>\n      </swiper-slide>\n\n      <template v-slot:container-end>\n        <template v-if=\"mpms.length > 1\">\n          <div\n            class=\"tvb-main-category-mpm_nav mpm_nav-prev\"\n            @click.stop=\"() => mpmRef.$el.swiper.slidePrev()\"\n          >\n            <tvb-svg-icon name=\"icon_arrow_mpm\" />\n          </div>\n          <div\n            class=\"tvb-main-category-mpm_nav mpm_nav-next\"\n            @click.stop=\"() => mpmRef.$el.swiper.slideNext()\"\n          >\n            <tvb-svg-icon name=\"icon_arrow_mpm\" />\n          </div>\n        </template>\n      </template>\n    </swiper>\n\n    <div v-show=\"isBigScreen ? !playing : true\" class=\"tvb-main-category-mpm_page\">\n      <div class=\"tvb-main-category-mpm_page_wrap\">\n        <div\n          class=\"tvb-main-category-mpm_dot\"\n          v-for=\"(item, index) in mpms\"\n          :key=\"index\"\n          :class=\"[\n            {\n              active:\n                twoMpms.length === 0\n                  ? realIndex === index\n                  : realIndex === index || realIndex - 2 === index\n            },\n            { hover: isBigScreen }\n          ]\"\n          @click=\"onMouseover(index)\"\n        ></div>\n      </div>\n    </div>\n  </div>\n</template>\n\n<style lang=\"scss\" scoped>\n.tvb-main-category-mpm2 {\n  box-sizing: border-box;\n  position: relative;\n  width: 100%;\n  height: 100%;\n\n  .tvb-main-category-swiper {\n    width: 100%;\n    height: 100%;\n    border-radius: 8px;\n    --tvb-hairline-border-radius: calc(2 * 8px);\n    box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.16);\n  }\n\n  // 播放一直显示\n  &.show-mpm_nav {\n    .tvb-main-category-mpm_nav {\n      &.mpm_nav-prev {\n        left: 0;\n      }\n      &.mpm_nav-next {\n        right: 0;\n      }\n    }\n  }\n\n  // hover\n  &.slide_image-hover {\n    &:hover .tvb-main-category-mpm_nav {\n      &.mpm_nav-prev {\n        left: 0;\n      }\n      &.mpm_nav-next {\n        right: 0;\n      }\n    }\n  }\n\n  // 导航按钮\n  .tvb-main-category-mpm_nav {\n    position: absolute;\n    top: calc(200 / 477 * 100%);\n    width: 28px;\n    height: 48px;\n    background-color: rgba(0, 0, 0, 0.6);\n    z-index: 1;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    font-size: 18px;\n    border-radius: 8px 0px 0px 8px;\n    user-select: none;\n    cursor: pointer;\n    transition:\n      left 0.15s linear,\n      right 0.15s linear,\n      background-color 0.15s linear;\n    &.mpm_nav-prev {\n      left: -28px;\n      transform: scaleX(-1);\n      transition:\n        left 0.15s linear,\n        right 0.15s linear,\n        background-color 0.15s linear;\n    }\n    &.mpm_nav-next {\n      transition:\n        left 0.15s linear,\n        right 0.15s linear,\n        background-color 0.15s linear;\n      right: -28px;\n    }\n    .svg-icon {\n      opacity: 0.85;\n      transition: opacity 0.15s linear;\n    }\n\n    &.mpm_nav-prev:hover,\n    &.mpm_nav-next:hover {\n      background-color: rgba(0, 0, 0, 0.8);\n      .svg-icon {\n        opacity: 1;\n      }\n    }\n  }\n\n  .tvb-main-category-swiper_slide {\n    a {\n      text-decoration: none;\n      background-color: transparent;\n      color: inherit;\n      cursor: pointer;\n      &:visited {\n        color: inherit;\n      }\n    }\n\n    // :deep(.tvb-main-category-swiper_slide_image) {\n    //   --img-hover-transition: transform 0.35s ease-out;\n    // }\n\n    .tvb-main-category_swiper-player {\n      position: absolute;\n      top: 0;\n      left: 0;\n      width: 100%;\n      height: 100%;\n      :deep(.tvb-player-play) {\n        // top: calc(200 / 477 * 100%);\n        top: calc(((100% - 76px) / 2) - 48px / 2); // (100% / 2) - icon大小\n      }\n    }\n\n    .tvb-main-category-swiper_slide_mask {\n      width: 100%;\n      position: absolute;\n      left: 0;\n      bottom: 0;\n      background-color: rgba(0, 0, 0, 0.6);\n      padding: 12px 16px 36px;\n      line-height: 0;\n      z-index: 9;\n      --tvb-cmpm2-tit-fs: 22px;\n      --tvb-cmpm2-tit-lh: 28px;\n      .tvb-swiper_slide_mask-tit {\n        @include line-text-ellipsis(1);\n        color: #eeeeee;\n        font-size: var(--tvb-cmpm2-tit-fs);\n        font-weight: 500;\n        letter-spacing: 0.5px;\n        line-height: var(--tvb-cmpm2-tit-lh);\n        // text-shadow: 0px 0px 4px rgba(0, 0, 0, 0.6);\n      }\n    }\n  }\n\n  &.mpm-m,\n  &.mpm-s,\n  &.mpm-xs {\n    padding-bottom: 0px;\n    padding-top: 12px;\n    padding-left: 12px;\n\n    &.mpm-onlyone {\n      padding-top: 0;\n      padding-left: 0px;\n      // padding-right: 12px;\n      .tvb-main-category-swiper {\n        padding-bottom: 0;\n        .tvb-main-category-swiper_slide {\n          aspect-ratio: auto;\n          width: 100%;\n        }\n      }\n      .tvb-main-category-mpm_page {\n        display: none;\n      }\n    }\n\n    .tvb-main-category-swiper {\n      border-radius: 0;\n      box-sizing: border-box;\n      padding-bottom: 11px;\n      box-shadow: none;\n\n      .tvb-main-category-swiper_slide {\n        border-radius: 6px;\n        overflow: hidden;\n        aspect-ratio: calc(354px / 223px);\n        width: auto;\n        box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.2);\n        // 播放时底黑\n        .tvb-main-category_swiper-player.slide-player-playing {\n          background-color: #000;\n        }\n      }\n    }\n\n    .tvb-main-category_swiper-player {\n      :deep(.tvb-player-container) {\n        height: calc(100% - 40px);\n      }\n      :deep(.tvb-player-play) {\n        top: calc(((100% - 40px) / 2) - 40px / 2); // (100% / 2) - icon大小\n      }\n    }\n\n    .tvb-main-category-swiper_slide_mask {\n      padding: 8px 12px;\n      --tvb-cmpm2-tit-fs: 16px;\n      --tvb-cmpm2-tit-lh: 24px;\n\n      &.mask-playing {\n        background-color: rgba($color: #fff, $alpha: 0.08);\n      }\n    }\n  }\n\n  &.mpm-m {\n    padding-top: 0px;\n    padding-left: 32px;\n    // &.mpm-onlyone {\n    //   padding-right: 32px;\n    // }\n    .tvb-main-category-swiper {\n      padding-bottom: 13px;\n      .tvb-main-category-swiper_slide {\n        border-radius: 8px;\n        aspect-ratio: calc(936px / 592px);\n        box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.16);\n      }\n    }\n    .tvb-main-category_swiper-player {\n      :deep(.tvb-player-container) {\n        height: calc(100% - 52px);\n      }\n      :deep(.tvb-player-play) {\n        top: calc(((100% - 52px) / 2) - 48px / 2); // (100% / 2) - icon大小\n      }\n    }\n    .tvb-main-category-swiper_slide_mask {\n      padding: 12px 16px;\n      --tvb-cmpm2-tit-fs: 22px;\n      --tvb-cmpm2-tit-lh: 28px;\n    }\n  }\n\n  // 分页器\n  .tvb-main-category-mpm_page {\n    position: absolute;\n    left: 16px;\n    bottom: 16px;\n    z-index: 1;\n    user-select: none;\n\n    .tvb-main-category-mpm_page_wrap {\n      display: flex;\n\n      .tvb-main-category-mpm_dot {\n        height: 8px;\n        width: 8px;\n        background-color: rgba(255, 255, 255, 0.3);\n        border-radius: 50%;\n        transition: background-color 0.15s linear;\n        cursor: pointer;\n\n        & + .tvb-main-category-mpm_dot {\n          margin-left: 8px;\n        }\n\n        &.active {\n          background-color: rgba(255, 255, 255, 0.8);\n        }\n        &.hover:hover {\n          background-color: rgba(255, 255, 255, 0.8);\n        }\n      }\n    }\n  }\n\n  &.mpm-m,\n  &.mpm-s,\n  &.mpm-xs {\n    .tvb-main-category-mpm_page {\n      left: 50%;\n      bottom: 0;\n      transform: translateX(-50%);\n      .tvb-main-category-mpm_dot {\n        height: 3px;\n        background-color: rgba(163, 178, 188, 0.35);\n        border-radius: 2px;\n        cursor: auto;\n        & + .tvb-main-category-mpm_dot {\n          margin-left: 4px;\n        }\n        &.active {\n          background-color: #818d95;\n        }\n      }\n    }\n  }\n\n  &.mpm-m {\n    .tvb-main-category-mpm_page .tvb-main-category-mpm_dot {\n      width: 12px;\n      cursor: pointer;\n      & + .tvb-main-category-mpm_dot {\n        margin-left: 6px;\n      }\n      &:hover {\n        background-color: #818d95;\n      }\n    }\n  }\n}\n</style>\n","<script setup>\nimport { ref, computed } from 'vue'\nimport { getArticleList } from '@/api/article.js'\n\nconst props = defineProps({\n  empty: { type: Boolean, default: false },\n  size: { type: String, default: null },\n  categoryId: { type: Number, default: null },\n  categoryTitle: { type: String, default: null },\n  categoryPath: { type: String, default: null },\n  mainCategoryPath: { type: String, default: null },\n  title: { type: String, default: null },\n  link: {\n    type: Object,\n    default() {\n      return { url: '', rel: '', target: '' }\n    }\n  }\n})\n\nconst errorSum = ref(0)\nconst isMobile = computed(() => ['s', 'xs'].includes(props.size))\nconst isEmpty = computed(() => list.value.length === 0)\nconst list = ref([])\nconst _list = computed(() =>\n  isMobile.value ? list.value.slice(0, 5 + errorSum.value) : list.value.slice(0, 8 + errorSum.value)\n)\nconst showMore = computed(() =>\n  isMobile.value ? list.value.length > 5 + errorSum.value : list.value.length >= 8 + errorSum.value\n)\nconst loading = ref(true)\nconst handle = async () => {\n  try {\n    const res = await getArticleList({ category_id: props.categoryId, page: 1, limit: 9 })\n    if (res.code !== 0) throw new Error(res.message)\n    list.value = res.data?.list || []\n    loading.value = false\n  } catch (error) {\n    loading.value = false\n  }\n}\nhandle()\n\nconst adsError = () => {\n  errorSum.value++\n}\n</script>\n\n<template>\n  <section\n    v-if=\"loading ? true : !isEmpty\"\n    class=\"tvb-category-model\"\n    :class=\"size ? 'model-' + size : ''\"\n  >\n    <div class=\"model-h\">\n      <template v-if=\"loading\">\n        <div class=\"tvb-skeleton title\" style=\"width: 20%\"></div>\n        <div class=\"tvb-skeleton more\"></div>\n      </template>\n      <template v-else>\n        <h2 class=\"clear-h title\" :title=\"title\">\n          <tvb-router-link :to=\"link.url\" :linkRel=\"link.rel\" :linkTarget=\"link.target\">\n            {{ title }}\n          </tvb-router-link>\n        </h2>\n        <tvb-button\n          v-if=\"showMore\"\n          class=\"more\"\n          :type=\"!isMobile ? 'more' : 'more-text'\"\n          :animation=\"!isMobile ? 'more' : ''\"\n          icon=\"icon_list_arrow_grey\"\n          :path=\"link.url\"\n          >查看更多</tvb-button\n        >\n      </template>\n    </div>\n    <div class=\"model-content\">\n      <template v-if=\"loading\">\n        <tvb-article-card\n          v-for=\"i in 6\"\n          :key=\"i\"\n          :size=\"size\"\n          :autoheight=\"isMobile\"\n          :loading=\"loading\"\n        ></tvb-article-card>\n      </template>\n      <template v-else>\n        <template v-for=\"(item, index) in _list\" :key=\"item.id\">\n          <tvb-ads\n            v-if=\"\n              index + 1 === 3 && mainCategoryPath && _list.length > 2 && ['xl', 'l'].includes(size)\n            \"\n            ad-type=\"lrec\"\n            :position=\"7\"\n            class=\"tvb-article-card card-xl tvb-hairline--surround\"\n            :unit=\"`/${mainCategoryPath}`\"\n            @error=\"adsError\"\n            style=\"\n              background-color: #f8f9fa;\n              border-radius: 8px;\n              --tvb-hairline-border-radius: calc(2 * 8px);\n            \"\n            :params=\"{\n              content_type: 'content' || 'x',\n              main_category_path: mainCategoryPath\n            }\"\n          />\n          <tvb-article-card\n            :size=\"size\"\n            :autoheight=\"isMobile\"\n            :img=\"item.image_info\"\n            :isVideo=\"item.video_url ? true : false\"\n            :playIcon=\"{ size: isMobile ? 40 : 48 }\"\n            :title=\"item.title\"\n            :subtitle=\"item.category_name\"\n            :date=\"item.publish_at\"\n            :link=\"{ url: item.link, rel: item.link_rel, target: item.link_target }\"\n          ></tvb-article-card>\n        </template>\n      </template>\n    </div>\n    <tvb-button\n      v-if=\"!loading && isMobile && showMore\"\n      class=\"big-more\"\n      type=\"more\"\n      animation=\"\"\n      icon=\"icon_list_arrow_grey\"\n      :path=\"link.url\"\n    >\n      查看更多\n    </tvb-button>\n  </section>\n</template>\n\n<style lang=\"scss\" scoped>\n.tvb-category-model {\n  margin-top: 40px;\n  .model-h {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    margin-bottom: 16px;\n    .title {\n      height: 32px;\n      line-height: 32px;\n      color: #1e1e1e;\n      font-size: 22px;\n      font-weight: 500;\n      letter-spacing: 0.5px;\n      @include text-ellipsis();\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    }\n    .more {\n      --tvb-button-height: 32px;\n      width: 94px;\n      font-size: 14px;\n      letter-spacing: 0.3px;\n      margin-left: 24px;\n      flex: none;\n      > :deep(.span) {\n        --tvb-button-padding: 0 10px 0 14px;\n      }\n      &.tvb-skeleton {\n        height: var(--tvb-button-height);\n      }\n    }\n  }\n\n  .model-content {\n    --gap: 16px;\n    --columns: 3;\n    gap: var(--gap);\n    display: grid;\n    grid-template-columns: repeat(var(--columns), 1fr);\n  }\n\n  .big-more {\n    --tvb-button-height: 40px;\n    width: 100%;\n    font-size: 14px;\n    letter-spacing: 0.3px;\n    margin-top: 10px;\n  }\n\n  &.model-s,\n  &.model-xs {\n    margin-top: 32px;\n    .model-h {\n      margin-bottom: 10px;\n      .title {\n        height: 24px;\n        line-height: 24px;\n        font-size: 17px;\n      }\n      .more {\n        --tvb-button-height: 20px;\n        width: auto;\n        > :deep(.span) {\n          --tvb-button-padding: 0px;\n        }\n        &.tvb-skeleton {\n          height: 20px;\n          width: 58px + 12px;\n        }\n      }\n    }\n\n    .model-content {\n      --gap: 10px;\n      --columns: 1;\n    }\n  }\n}\n</style>\n","<script setup>\nimport { inject, ref, computed } from 'vue'\nimport { getCategoryMpm } from '@/api/article.js'\nimport SmallCard from '../components/SmallCard/index.vue'\nimport Mpm from './components/Mpm/index.vue'\nimport Mpm2 from './components/Mpm2/index.vue'\nimport CategoryModel from './components/CategoryModel/index.vue'\nimport LazyComponent from '../components/LazyComponent/index.vue'\n\nconst size = inject('size')\nconst setAdParams = inject('setAdParams')\nconst isMobile = computed(() => ['s', 'xs'].includes(size.value))\nconst categoryInfo = inject('categoryInfo')\nconst sublist = computed(() => categoryInfo.value.children || [])\nconst isSubEmpty = computed(() => sublist.value.length === 0)\n\n// 轮播图\nconst mpmloading = ref(true)\nconst mpmList = ref([])\nconst mpmBanner = ref([])\nconst mpmType = ref(1)\nconst isMpmEmpty = computed(() =>\n  mpmType.value === 1 ? bigMpm.value.length === 0 : mpmBanner.value.length === 0\n)\nconst bigMpm = computed(() => {\n  // let num = 2\n  // if (isMobile.value || mpmList.value.length <= 1) return mpmList.value\n  // if (mpmList.value.length < 3) num = 1\n  if (isMobile.value) return mpmList.value\n  if (mpmList.value.length < 3) return []\n  return mpmList.value.slice(0, 1).concat(mpmList.value.slice(3))\n})\nconst smallMpm = computed(() => {\n  // if (mpmList.value.length <= 1) return []\n  // if (mpmList.value.length < 3) return mpmList.value.slice(-1)\n  if (mpmList.value.length < 3) return []\n  return mpmList.value.slice(1, 3)\n})\nconst fetchMpm = async () => {\n  try {\n    const res = await getCategoryMpm({ category_path: categoryInfo.value.path })\n    if (res.code !== 0) throw new Error(res.message)\n    mpmList.value = res.data?.mpm_list || []\n    mpmBanner.value = res.data?.mpm_banner || []\n    mpmType.value = res.data?.mpm_type || 1\n    mpmloading.value = false\n  } catch (error) {\n    mpmloading.value = false\n  }\n}\nfetchMpm()\n\nsetAdParams({ content_type: 'content', main_category_path: categoryInfo?.value?.path || 'x' })\n\nconst isAllEmpty = computed(() => !mpmloading.value && isMpmEmpty.value && isSubEmpty.value)\n</script>\n\n<template>\n  <div\n    class=\"tvb-article-main-category\"\n    :class=\"[{ 'error-page': isAllEmpty }, { 'mpm-type_2': mpmType === 2 }]\"\n  >\n    <template v-if=\"isAllEmpty\">\n      <tvb-empty icon=\"img_article_deleted\" des=\"抱歉，找不到相關資料\"></tvb-empty>\n    </template>\n    <template v-else>\n      <div class=\"tvb-article-main-category-container\">\n        <template v-if=\"mpmloading ? true : !isMpmEmpty\">\n          <div v-if=\"mpmType === 1\" class=\"main-category-header\">\n            <div class=\"main-category-mpm\">\n              <div\n                v-if=\"mpmloading\"\n                class=\"tvb-skeleton\"\n                :class=\"{ 'tvb-hairline--surround': !isMobile }\"\n                style=\"height: 100%\"\n              ></div>\n              <template v-else>\n                <mpm :mpms=\"bigMpm\" :size=\"size\"></mpm>\n              </template>\n            </div>\n            <template v-if=\"!isMobile\">\n              <template v-if=\"mpmloading\">\n                <div class=\"tvb-skeleton tvb-hairline--surround\"></div>\n                <div class=\"tvb-skeleton tvb-hairline--surround\"></div>\n              </template>\n              <template v-else>\n                <template v-for=\"(item, i) in smallMpm\" :key=\"i\">\n                  <SmallCard\n                    :img=\"item.image_info\"\n                    backgroundc=\"#F0F1F2\"\n                    :title=\"item.title\"\n                    :isVideo=\"item.video_url ? true : false\"\n                    :link=\"{ url: item.link, rel: item.link_rel, target: item.link_target }\"\n                  ></SmallCard>\n                </template>\n              </template>\n            </template>\n          </div>\n          <div\n            class=\"main-category-mpm2\"\n            :class=\"{ 'main-category-mpm2-onlyone': mpmBanner.length === 1 }\"\n            v-else\n          >\n            <mpm2 :mpms=\"mpmBanner\" :size=\"size\"></mpm2>\n          </div>\n        </template>\n\n        <tvb-ads\n          :ad-type=\"['s', 'xs'].includes(size) ? 'bn' : 'sb'\"\n          :position=\"7\"\n          :key=\"['s', 'xs'].includes(size) ? 'bn' : 'sb'\"\n          :unit=\"`/${categoryInfo?.path}`\"\n          :style=\"{\n            marginTop: ['s', 'xs'].includes(size) ? '32px' : '40px'\n          }\"\n          :params=\"{\n            content_type: 'content',\n            main_category_path: categoryInfo?.path\n          }\"\n        />\n        <div v-if=\"!isSubEmpty\" class=\"main-category-content\">\n          <template v-for=\"(item, i) in sublist\" :key=\"item.id\">\n            <lazy-component>\n              <category-model\n                :class=\"{ frist: isMobile ? i === 0 : i === 0 && isMpmEmpty && !mpmloading }\"\n                :size=\"size\"\n                :category-id=\"item.id\"\n                :category-path=\"item.path\"\n                :main-category-path=\"categoryInfo?.path\"\n                :category-title=\"item.title\"\n                :title=\"item.title\"\n                :link=\"{ url: item.link }\"\n              ></category-model>\n              <tvb-ads\n                v-if=\"(i + 1) % 1 === 0\"\n                :style=\"{\n                  marginTop: ['s', 'xs'].includes(size) ? '32px' : '40px'\n                }\"\n                :ad-type=\"['s', 'xs'].includes(size) ? 'bn' : 'sb'\"\n                :position=\"7\"\n                :unit=\"`/${categoryInfo?.path}`\"\n                :params=\"{\n                  content_type: 'content',\n                  main_category_path: categoryInfo?.path || 'x'\n                }\"\n              />\n              <template #loading><div style=\"height: 700px\"></div></template>\n            </lazy-component>\n          </template>\n        </div>\n      </div>\n      <tvb-ads\n        :position=\"7\"\n        :ad-type=\"'to'\"\n        :unit=\"`/${categoryInfo?.path}`\"\n        :params=\"{\n          content_type: 'content',\n          main_category_path: categoryInfo?.path || 'x'\n        }\"\n      />\n    </template>\n  </div>\n</template>\n\n<style lang=\"scss\" scoped>\n.tvb-article-main-category {\n  .tvb-empty {\n    height: 500px;\n  }\n  &.s,\n  &.xs {\n    padding-top: 0 !important;\n    padding-left: 0 !important;\n    padding-right: 0 !important;\n    .tvb-empty {\n      height: 400px;\n    }\n  }\n  &.mpm-type_2.m {\n    padding-left: 0 !important;\n    padding-right: 0 !important;\n    .main-category-content {\n      padding-right: 32px;\n      padding-left: 32px;\n    }\n  }\n\n  .tvb-article-main-category-container {\n    max-width: var(--tvb-article-max-width);\n    margin: 0 auto;\n  }\n\n  .main-category-header {\n    --gap: 16px;\n    --columns: 3;\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    }\n    .main-category-mpm {\n      grid-column: 1/3;\n      grid-row: 1/3;\n      aspect-ratio: calc(848px / 477px);\n    }\n  }\n\n  .main-category-mpm2 {\n    aspect-ratio: calc(1280px / 477px);\n  }\n\n  .main-category-content {\n    .frist {\n      margin-top: 32px - 20px;\n    }\n  }\n\n  &.m,\n  &.s,\n  &.xs {\n    // 单个换比例\n    .main-category-mpm2.main-category-mpm2-onlyone {\n      aspect-ratio: calc(1053px / 666px);\n      @supports not (aspect-ratio: calc(1053px / 666px)) {\n        position: relative;\n        &::before {\n          content: '';\n          float: left;\n          padding-top: calc((666px / 1053px) * 100%);\n        }\n        &::after {\n          content: '';\n          display: block;\n          clear: both;\n        }\n        .tvb-main-category-mpm2 {\n          position: absolute;\n          top: 0;\n        }\n      }\n    }\n  }\n\n  &.s,\n  &.xs {\n    .main-category-header {\n      --columns: 1;\n      .tvb-skeleton {\n        border-radius: 0px;\n      }\n      .main-category-mpm {\n        aspect-ratio: calc(390px / 230px);\n        @supports not (aspect-ratio: calc(390px / 230px)) {\n          position: relative;\n          &::before {\n            content: '';\n            float: left;\n            padding-top: calc((230px / 390px) * 100%);\n          }\n          &::after {\n            content: '';\n            display: block;\n            clear: both;\n          }\n          .tvb-main-category-mpm {\n            position: absolute;\n            top: 0;\n          }\n        }\n      }\n    }\n\n    .main-category-mpm2 {\n      aspect-ratio: calc(390px / 246px);\n      @supports not (aspect-ratio: calc(390px / 246px)) {\n        position: relative;\n        &::before {\n          content: '';\n          float: left;\n          padding-top: calc((246px / 390px) * 100%);\n        }\n        &::after {\n          content: '';\n          display: block;\n          clear: both;\n        }\n        .tvb-main-category-mpm2 {\n          position: absolute;\n          top: 0;\n        }\n      }\n      &.main-category-mpm2-onlyone {\n        margin-top: 12px;\n        margin-left: 12px;\n        margin-right: 12px;\n      }\n    }\n\n    .main-category-content {\n      padding: 0 12px;\n      .frist {\n        margin-top: 24px;\n      }\n    }\n  }\n\n  &.m {\n    .main-category-mpm2 {\n      aspect-ratio: calc(1024px / 605px);\n      @supports not (aspect-ratio: calc(1024px / 605px)) {\n        position: relative;\n        &::before {\n          content: '';\n          float: left;\n          padding-top: calc((605px / 1024px) * 100%);\n        }\n        &::after {\n          content: '';\n          display: block;\n          clear: both;\n        }\n        .tvb-main-category-mpm2 {\n          position: absolute;\n          top: 0;\n        }\n      }\n      &.main-category-mpm2-onlyone {\n        margin-left: 32px;\n        margin-right: 32px;\n      }\n    }\n  }\n}\n</style>\n","<script setup>\nimport { inject, ref, computed, watch, watchEffect, onBeforeUnmount, nextTick } from 'vue'\nimport { useHead } from '@vueuse/head'\nimport { getArticleList } from '@/api/article.js'\n\nconst size = inject('size')\nconst categoryInfo = inject('categoryInfo')\nconst setAdParams = inject('setAdParams')\nconst isMobile = computed(() => ['s', 'xs'].includes(size.value))\nconst head = ref({})\nuseHead(head)\n// 面包屑\nconst breadcrumbs = computed(() => {\n  return [\n    {\n      name: '主頁',\n      path: '/'\n    },\n    {\n      name: categoryInfo.value?.parent?.title,\n      path: categoryInfo.value?.parent?.link,\n      seoLink: categoryInfo.value?.parent?.link\n    },\n    {\n      name: categoryInfo.value?.title,\n      path: '',\n      seoLink: categoryInfo.value?.link\n    }\n  ]\n})\nwatchEffect(() => {\n  head.value.script = [\n    {\n      type: 'application/ld+json',\n      children: JSON.stringify({\n        '@context': 'https://schema.org',\n        '@type': 'BreadcrumbList',\n        itemListElement: 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.seoLink\n          }\n        })\n      })\n    }\n  ]\n})\n\n// 監聽加載更多\nconst scrollerFooter = ref()\nconst intersectionObserver = new IntersectionObserver(function (entries) {\n  if (entries[0].intersectionRatio <= 0) return\n  onload()\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 initLoading = ref(true)\nconst loading = ref(false)\nconst isEmpty = computed(() => list.value.length === 0)\nconst list = ref([])\nconst finished = ref(false) // 最後頁完成狀態\nconst page = ref(1)\nconst limit = ref(9)\nconst onload = async (mode) => {\n  const isInit = mode === 'init'\n  if (!isInit) {\n    loading.value = true\n    unobserve()\n  }\n  try {\n    const res = await getArticleList({\n      category_id: categoryInfo.value.id,\n      page: page.value,\n      limit: limit.value\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.value) finished.value = true\n    else page.value++\n\n    if (isInit) initLoading.value = false\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 loading.value = false\n  }\n}\nonload('init')\n\nwatch(loading, (val) => {\n  if (val) unobserve()\n  else if (finished.value) disconnect()\n  else observe()\n})\n\nsetAdParams({\n  content_type: 'content',\n  article_id: 'x',\n  sub_category_path: categoryInfo?.value?.path || 'x'\n})\n\nonBeforeUnmount(() => disconnect())\n</script>\n\n<template>\n  <div class=\"tvb-article-sub-category\" :class=\"{ 'error-page': !initLoading && isEmpty }\">\n    <template v-if=\"initLoading || isEmpty\">\n      <div v-if=\"initLoading\" class=\"tvb-loading-box\"><n-spin /></div>\n      <tvb-empty v-else icon=\"img_article_deleted\" des=\"抱歉，找不到相關資料\"></tvb-empty>\n    </template>\n    <template v-else>\n      <div class=\"tvb-article-sub-category-container\">\n        <div class=\"tvb-article-breadcrumb\">\n          <tvb-breadcrumb :breadcrumbs=\"breadcrumbs\" :size=\"size\"></tvb-breadcrumb>\n        </div>\n\n        <div v-if=\"initLoading\" class=\"tvb-loading-box\"><n-spin /></div>\n        <template v-else>\n          <div class=\"sub-category-content\">\n            <div class=\"model-h\">\n              <h1 class=\"clear-h title\" :title=\"categoryInfo.title\">{{ categoryInfo.title }}</h1>\n            </div>\n            <div class=\"model-content\">\n              <template v-for=\"(item, i) in list\" :key=\"i\">\n                <tvb-article-card\n                  :size=\"size\"\n                  :autoheight=\"isMobile\"\n                  :img=\"item.image_info\"\n                  :isVideo=\"item.video_url ? true : false\"\n                  :playIcon=\"{ size: isMobile ? 40 : 48 }\"\n                  :title=\"item.title\"\n                  :subtitle=\"item.category_name\"\n                  :date=\"item.publish_at\"\n                  :link=\"{ url: item.link, rel: item.link_rel, target: item.link_target }\"\n                ></tvb-article-card>\n                <tvb-ads\n                  v-if=\"((i + 1) / 2) % 4 === 1 && !['s', 'xs'].includes(size) && list.length > 2\"\n                  :ad-type=\"'lrec'\"\n                  :position=\"8\"\n                  class=\"tvb-article-card card-xl tvb-hairline--surround\"\n                  :unit=\"`/${categoryInfo?.path}`\"\n                  :params=\"{\n                    content_type: 'content',\n                    article_id: 'x',\n                    sub_category_path: categoryInfo?.path || 'x'\n                  }\"\n                  style=\"\n                    background-color: #f8f9fa;\n                    border-radius: 8px;\n                    --tvb-hairline-border-radius: calc(2 * 8px);\n                  \"\n                />\n                <tvb-ads\n                  v-if=\"(i + 1) % (['s', 'xs'].includes(size) ? 3 : 8) === 0 && list.length > 2\"\n                  :ad-type=\"['s', 'xs'].includes(size) ? 'bn' : 'sb'\"\n                  :key=\"['s', 'xs'].includes(size) ? 'bn' : 'sb'\"\n                  :position=\"8\"\n                  class=\"tvb-article-card card-xl\"\n                  :style=\"{ gridColumn: `1 / span ${['s', 'xs'].includes(size) ? 1 : 3}` }\"\n                  :unit=\"`/${categoryInfo?.path}`\"\n                  :params=\"{\n                    content_type: 'content',\n                    article_id: 'x',\n                    sub_category_path: categoryInfo?.path || 'x'\n                  }\"\n                />\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\"\n              ref=\"scrollerFooter\"\n              class=\"scroller-footer\"\n              style=\"height: 0.5px\"\n            ></div>\n          </div>\n        </template>\n      </div>\n      <tvb-ads\n        :position=\"8\"\n        :ad-type=\"'to'\"\n        :unit=\"`/${categoryInfo?.path}`\"\n        :params=\"{\n          content_type: 'content',\n          article_id: 'x',\n          sub_category_path: categoryInfo?.path || 'x'\n        }\"\n      />\n    </template>\n  </div>\n</template>\n\n<style lang=\"scss\" scoped>\n.tvb-article-sub-category {\n  padding-top: 16px !important;\n  .loading-box {\n    padding: 16px 0;\n  }\n  .tvb-empty {\n    height: 500px;\n  }\n  &.s,\n  &.xs {\n    padding-top: 10px !important;\n    .loading-box {\n      padding: 10px 0;\n    }\n    .tvb-empty {\n      height: 400px;\n    }\n  }\n\n  .tvb-article-sub-category-container {\n    max-width: var(--tvb-article-max-width);\n    margin: 0 auto;\n  }\n\n  .tvb-article-breadcrumb {\n    margin-bottom: 32px;\n  }\n\n  .sub-category-content {\n    .model-h {\n      margin-bottom: 16px;\n      .title {\n        height: 32px;\n        line-height: 32px;\n        color: #1e1e1e;\n        font-size: 22px;\n        font-weight: 500;\n        letter-spacing: 0.5px;\n        @include text-ellipsis();\n      }\n    }\n\n    .model-content {\n      --gap: 16px;\n      --columns: 3;\n      gap: var(--gap);\n      display: grid;\n      grid-template-columns: repeat(var(--columns), 1fr);\n    }\n  }\n\n  &.s,\n  &.xs {\n    .tvb-article-breadcrumb {\n      margin-bottom: 16px;\n    }\n\n    .sub-category-content {\n      .model-h {\n        height: 24px;\n        margin-bottom: 10px;\n        .title {\n          height: 24px;\n          line-height: 24px;\n          font-size: 17px;\n        }\n      }\n\n      .model-content {\n        --gap: 10px;\n        --columns: 1;\n      }\n    }\n  }\n}\n</style>\n","<script setup>\nimport { provide, ref, computed, nextTick, inject, watchEffect } from 'vue'\nimport { useRoute, useRouter } from 'vue-router'\nimport { getCategoryList } from '@/api/article.js'\nimport MainPage from './MainPage.vue'\nimport SubPage from './SubPage.vue'\nimport { useHead, useSeoMeta } from '@vueuse/head'\nimport { pageview } from '@/utils/gtm'\n\nconst route = useRoute()\nconst router = useRouter()\nconst head = ref({})\nuseHead(head)\nconst seoTitleSuffix = inject('seoTitleSuffix')\nconst layerData = inject('layerData')\nconst categoryPath = computed(() => {\n  const _categoryPath = route?.params?.categoryPath\n  if (_categoryPath?.endsWith('-c')) {\n    return _categoryPath.slice(0, _categoryPath.length - 2)\n  }\n  return _categoryPath\n})\nconst categoryInfo = ref({})\nprovide('categoryInfo', categoryInfo)\nconst isSub = computed(() => categoryInfo.value?.pid !== 0)\nconst componentName = computed(() => (isSub.value ? SubPage : MainPage))\nconst canonical = computed(() => categoryInfo.value?.link || categoryInfo.value?.parent?.link)\n\nconst loading = ref(true)\nconst failed = ref(false)\nconst fetchInfo = async () => {\n  try {\n    const res = await getCategoryList({ category_path: categoryPath.value })\n    if (res.code !== 0) throw new Error(res.message)\n    categoryInfo.value = res?.data || {}\n    route.meta.layerData = { screenID: !isSub.value ? 'S002' : 'S003' }\n    loading.value = false\n    nextTick(() => {\n      if (canonical.value)\n        window.history.replaceState(history.state, null, new URL(canonical.value)?.pathname)\n      head.value = {\n        share_text: categoryInfo.value?.share_text || categoryInfo.value?.parent?.share_text || '',\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      }\n      pageview({\n        ...layerData.value,\n        page_title: !isSub.value ? 'main_category' : 'sub_category',\n        screen_class: !isSub.value\n          ? categoryInfo.value.title\n          : `${categoryInfo.value.parent.title}/${categoryInfo.value.title}`,\n        eventCategory: !isSub.value ? 'main_category' : 'sub_category',\n        eventLabel: !isSub.value\n          ? categoryInfo.value.title\n          : `${categoryInfo.value.parent.title}/${categoryInfo.value.title}`,\n        eventID: categoryInfo.value.id || '',\n        screenLabel: canonical.value\n      })\n    })\n  } catch (error) {\n    failed.value = true\n    loading.value = false\n    router.replace('/notice.html')\n  }\n}\nfetchInfo()\n\nwatchEffect(() => {\n  const title = `${\n    categoryInfo.value?.seo_title || categoryInfo.value?.parent?.seo_title || ''\n  }${seoTitleSuffix}`\n  useSeoMeta({\n    title,\n    description:\n      categoryInfo.value?.meta_description || categoryInfo.value?.parent?.meta_description || '',\n    ogTitle: title,\n    ogUrl: canonical.value,\n    ogImage: categoryInfo.value?.og_image_url || categoryInfo.value?.parent?.og_image_url || '',\n    ogImageAlt:\n      categoryInfo.value?.og_image_alt_txt || categoryInfo.value?.parent?.og_image_alt_txt || '',\n    ogDescription:\n      categoryInfo.value?.meta_description || categoryInfo.value?.parent?.meta_description || '',\n    twitterTitle: title,\n    twitterImage:\n      categoryInfo.value?.og_image_url || categoryInfo.value?.parent?.og_image_url || '',\n    twitterDescription:\n      categoryInfo.value?.meta_description || categoryInfo.value?.parent?.meta_description || '',\n    twitterUrl: canonical.value\n  })\n})\n</script>\n\n<template>\n  <div v-if=\"loading || failed\" :class=\"{ 'error-page': failed }\">\n    <!-- v-if=\"loading\"  -->\n    <div class=\"tvb-loading-box\"><n-spin /></div>\n    <!-- <tvb-empty v-else icon=\"img_underdev\" des=\"此頁面開發中，敬請期待\"></tvb-empty> -->\n  </div>\n  <template v-else>\n    <component :is=\"componentName\"></component>\n  </template>\n</template>\n\n<style lang=\"scss\" scoped>\n.error-page {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding-top: 0 !important;\n  padding-bottom: 0 !important;\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</style>\n"],"names":["useMpm","getVisible","target","resolve","stop","useIntersectionObserver","isIntersecting","layerData","inject","res","impression","item","type","isurl","action","props","__props","mpmImpression","mpmTracking","isMobile","computed","toDateTime","time","dayjs","tvbPlayerRef","ref","mpmRef","realIndex","onActiveIndexChange","e","_a","_e","_d","_c","_b","onStateChange","index","state","_h","_g","_f","onSlideChangeTransitionEnd","nextTick","element","onAfterInit","watch","value","onMouseover","categoryInfo","isBigScreen","twoMpms","_mpms","playing","errorSum","isEmpty","list","_list","showMore","loading","getArticleList","adsError","size","setAdParams","sublist","isSubEmpty","mpmloading","mpmList","mpmBanner","mpmType","isMpmEmpty","bigMpm","smallMpm","getCategoryMpm","isAllEmpty","head","useHead","breadcrumbs","watchEffect","v","i","scrollerFooter","intersectionObserver","entries","onload","observe","unobserve","disconnect","initLoading","finished","page","limit","mode","isInit","newsList","error","val","onBeforeUnmount","route","useRoute","router","useRouter","seoTitleSuffix","categoryPath","_categoryPath","provide","isSub","componentName","SubPage","MainPage","canonical","failed","getCategoryList","pageview","title","useSeoMeta","_i","_j","_l","_k","_m","_o","_n","_p","_r","_q","_s","_u","_t"],"mappings":"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"}