From cc5f7e3ef40398c4524f20864022977ecfc8fe8c Mon Sep 17 00:00:00 2001 From: clkim Date: Tue, 2 Dec 2025 14:28:58 +0900 Subject: [PATCH] =?UTF-8?q?fix.=20[PWT-158]=20=EA=B3=B5=EC=8B=9D=20?= =?UTF-8?q?=EC=98=81=EC=83=81=20>=20=EC=B6=94=EC=B2=9C=20=EC=98=81?= =?UTF-8?q?=EC=83=81=20=EC=9E=90=EB=8F=99=20=EB=A1=A4=EB=A7=81=20=EA=B8=B0?= =?UTF-8?q?=EB=8A=A5=20=EB=AF=B8=EB=8F=99=EC=9E=91?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../components/atoms/icons/PlayRoundFill.vue | 27 +++++++++++++++++++ .../components/blocks/slide/CenterFocus.vue | 3 +++ .../blocks/slide/CenterHighlight.vue | 3 +++ layers/components/blocks/slide/Default.vue | 3 +++ layers/components/blocks/slide/Fade.vue | 3 +++ layers/templates/FxVideo01/index.vue | 2 ++ layers/templates/GrDetail01/index.vue | 1 - layers/templates/GrDetail02/index.vue | 4 ++- layers/templates/GrDetail03/index.vue | 8 +++--- 9 files changed, 49 insertions(+), 5 deletions(-) create mode 100644 layers/components/atoms/icons/PlayRoundFill.vue diff --git a/layers/components/atoms/icons/PlayRoundFill.vue b/layers/components/atoms/icons/PlayRoundFill.vue new file mode 100644 index 0000000..34c8f94 --- /dev/null +++ b/layers/components/atoms/icons/PlayRoundFill.vue @@ -0,0 +1,27 @@ + + + diff --git a/layers/components/blocks/slide/CenterFocus.vue b/layers/components/blocks/slide/CenterFocus.vue index 076bc04..ad2a89b 100644 --- a/layers/components/blocks/slide/CenterFocus.vue +++ b/layers/components/blocks/slide/CenterFocus.vue @@ -8,6 +8,7 @@ interface Props { slideItemSize: SlideItemSize slideItemLength?: number autoplay?: boolean + interval?: number arrows?: boolean pagination?: boolean class?: string @@ -15,6 +16,7 @@ interface Props { const props = withDefaults(defineProps(), { autoplay: false, + interval: 5000, arrows: true, pagination: true, }) @@ -38,6 +40,7 @@ const options = computed((): ResponsiveOptions => { arrows: props.arrows && isMultipleItems.value, pagination: props.pagination && isMultipleItems.value, autoplay: props.autoplay, + interval: props.interval, classes: { arrows: 'splide-arrows', arrow: 'splide-arrow', diff --git a/layers/components/blocks/slide/CenterHighlight.vue b/layers/components/blocks/slide/CenterHighlight.vue index 3443c9b..70c94ab 100644 --- a/layers/components/blocks/slide/CenterHighlight.vue +++ b/layers/components/blocks/slide/CenterHighlight.vue @@ -7,6 +7,7 @@ interface Props { slideItemSize: SlideItemSize slideItemLength?: number autoplay?: boolean + interval?: number arrows?: boolean pagination?: boolean class?: string @@ -14,6 +15,7 @@ interface Props { const props = withDefaults(defineProps(), { autoplay: false, + interval: 5000, arrows: true, pagination: true, }) @@ -37,6 +39,7 @@ const options = computed((): ResponsiveOptions => { arrows: props.arrows && isMultipleItems.value, pagination: props.pagination && isMultipleItems.value, autoplay: props.autoplay, + interval: props.interval, classes: { arrows: 'splide-arrows', arrow: 'splide-arrow', diff --git a/layers/components/blocks/slide/Default.vue b/layers/components/blocks/slide/Default.vue index 6a2bf2a..e605e0a 100644 --- a/layers/components/blocks/slide/Default.vue +++ b/layers/components/blocks/slide/Default.vue @@ -8,6 +8,7 @@ interface Props { slideItemLength?: number gap?: number autoplay?: boolean + interval?: number perPage?: number drag?: boolean arrows?: boolean @@ -20,6 +21,7 @@ interface Props { const props = withDefaults(defineProps(), { gap: 0, autoplay: false, + interval: 5000, perPage: 1, drag: true, arrows: true, @@ -49,6 +51,7 @@ const options = computed((): ResponsiveOptions => { easing: 'ease-in-out', updateOnMove: true, autoplay: props.autoplay, + interval: props.interval, drag: props.drag, arrows: props.arrows, pagination: props.pagination, diff --git a/layers/components/blocks/slide/Fade.vue b/layers/components/blocks/slide/Fade.vue index 46dce24..51d2941 100644 --- a/layers/components/blocks/slide/Fade.vue +++ b/layers/components/blocks/slide/Fade.vue @@ -8,6 +8,7 @@ import type { PageDataResourceGroups } from '#layers/types/api/pageData' interface Props { drag?: boolean autoplay?: boolean + interval?: number arrows?: boolean pagination?: boolean paginationData?: PageDataResourceGroups @@ -16,6 +17,7 @@ interface Props { const props = withDefaults(defineProps(), { drag: true, autoplay: false, + interval: 5000, arrows: true, pagination: true, }) @@ -37,6 +39,7 @@ const options = computed((): ResponsiveOptions => { updateOnMove: true, drag: props.drag, autoplay: props.autoplay, + interval: props.interval, pauseOnHover: false, pauseOnFocus: false, arrows: props.arrows, diff --git a/layers/templates/FxVideo01/index.vue b/layers/templates/FxVideo01/index.vue index 39401a8..fec4743 100644 --- a/layers/templates/FxVideo01/index.vue +++ b/layers/templates/FxVideo01/index.vue @@ -140,6 +140,8 @@ const handleLoadMoreRecent = () => { class="relative content-static bg-[#fff] rounded-[12px] md:rounded-[16px]" > { v-if="slideData" ref="splideRef" :autoplay="true" - :interval="5000" :arrows="false" :pagination="false" class="h-full" diff --git a/layers/templates/GrDetail02/index.vue b/layers/templates/GrDetail02/index.vue index 33f8fc6..c648430 100644 --- a/layers/templates/GrDetail02/index.vue +++ b/layers/templates/GrDetail02/index.vue @@ -17,7 +17,9 @@ const slideData = computed(() => { return getComponentContainer(props.components, 'group_sets', { maxLength: 7 }) }) const thumbnailData = computed(() => { - return slideData.value.map(item => item.pagenaviThumbnail?.groups?.[0]) + return slideData.value + .map(item => item?.pagenaviThumbnail?.groups?.[0]) + .filter((group): group is NonNullable => group != null) }) const paginationData = computed(() => { return getComponentGroupAry(props.components, 'pagination') diff --git a/layers/templates/GrDetail03/index.vue b/layers/templates/GrDetail03/index.vue index 4d76952..86fdc36 100644 --- a/layers/templates/GrDetail03/index.vue +++ b/layers/templates/GrDetail03/index.vue @@ -29,15 +29,17 @@ const slideData = computed(() => { }) }) const thumbnailData = computed(() => { - return slideData.value.map(item => item.pagenaviThumbnail?.groups?.[0]) + return slideData.value + .map(item => item?.pagenaviThumbnail?.groups?.[0]) + .filter((group): group is NonNullable => group != null) }) const paginationData = computed(() => { return getComponentGroupAry(props.components, 'pagination') }) const videoSrc = (item: PageDataTemplateComponent) => { - const src = getComponentGroup(item, 'video')?.res_path - return getCurrentSrc(src) + const videoData = getComponentGroup(item, 'video') + return getCurrentSrc(videoData) } const handleSplideMove = (_splide: SplideType, newIndex: number) => {