fix. 슬라이드 감도 조절
This commit is contained in:
@@ -43,7 +43,7 @@ const options = computed((): ResponsiveOptions => {
|
|||||||
pagination: props.pagination && isMultipleItems.value,
|
pagination: props.pagination && isMultipleItems.value,
|
||||||
autoplay: props.autoplay,
|
autoplay: props.autoplay,
|
||||||
interval: props.interval,
|
interval: props.interval,
|
||||||
flickPower: 400,
|
flickPower: 300,
|
||||||
classes: {
|
classes: {
|
||||||
arrows: 'splide-arrows',
|
arrows: 'splide-arrows',
|
||||||
arrow: 'splide-arrow',
|
arrow: 'splide-arrow',
|
||||||
|
|||||||
@@ -42,7 +42,7 @@ const options = computed((): ResponsiveOptions => {
|
|||||||
pagination: props.pagination && isMultipleItems.value,
|
pagination: props.pagination && isMultipleItems.value,
|
||||||
autoplay: props.autoplay,
|
autoplay: props.autoplay,
|
||||||
interval: props.interval,
|
interval: props.interval,
|
||||||
flickPower: 400,
|
flickPower: 300,
|
||||||
classes: {
|
classes: {
|
||||||
arrows: 'splide-arrows',
|
arrows: 'splide-arrows',
|
||||||
arrow: 'splide-arrow',
|
arrow: 'splide-arrow',
|
||||||
|
|||||||
@@ -58,7 +58,7 @@ const options = computed((): ResponsiveOptions => {
|
|||||||
arrows: props.arrows,
|
arrows: props.arrows,
|
||||||
pagination: props.pagination,
|
pagination: props.pagination,
|
||||||
destroy: props.destroy,
|
destroy: props.destroy,
|
||||||
flickPower: 400,
|
flickPower: 300,
|
||||||
classes: {
|
classes: {
|
||||||
arrows: 'splide-arrows',
|
arrows: 'splide-arrows',
|
||||||
arrow: 'splide-arrow',
|
arrow: 'splide-arrow',
|
||||||
|
|||||||
@@ -46,7 +46,7 @@ const options = computed((): ResponsiveOptions => {
|
|||||||
pauseOnFocus: false,
|
pauseOnFocus: false,
|
||||||
arrows: props.arrows,
|
arrows: props.arrows,
|
||||||
pagination: props.pagination,
|
pagination: props.pagination,
|
||||||
flickPower: 400,
|
flickPower: 300,
|
||||||
classes: {
|
classes: {
|
||||||
arrows: 'splide-arrows type-full',
|
arrows: 'splide-arrows type-full',
|
||||||
arrow: 'splide-arrow',
|
arrow: 'splide-arrow',
|
||||||
|
|||||||
@@ -61,7 +61,7 @@ const thumbOptions = computed<Options>(() => ({
|
|||||||
pagination: false,
|
pagination: false,
|
||||||
isNavigation: true,
|
isNavigation: true,
|
||||||
updateOnMove: true,
|
updateOnMove: true,
|
||||||
flickPower: 400,
|
flickPower: 300,
|
||||||
classes: {
|
classes: {
|
||||||
arrows: 'splide-arrows',
|
arrows: 'splide-arrows',
|
||||||
arrow: 'splide-arrow',
|
arrow: 'splide-arrow',
|
||||||
|
|||||||
@@ -154,18 +154,18 @@ const { data: rewardCompletedData } = await useAsyncData(
|
|||||||
|
|
||||||
// Reward Images
|
// Reward Images
|
||||||
const rewardImages = computed(() => {
|
const rewardImages = computed(() => {
|
||||||
const defaultList = getComponentGroupAry(props.components, 'imgAccReward')
|
const completeList = getComponentGroupAry(props.components, 'imgAccReward')
|
||||||
const incompleteList = getComponentGroupAry(
|
const incompleteList = getComponentGroupAry(
|
||||||
props.components,
|
props.components,
|
||||||
'imgAccRewardIncomplete'
|
'imgAccRewardIncomplete'
|
||||||
)
|
)
|
||||||
|
|
||||||
if (!defaultList?.length) return []
|
if (!completeList?.length || !incompleteList?.length) return []
|
||||||
|
|
||||||
return defaultList.map((defaultItem, index) => ({
|
return completeList.map((completeItem, index) => ({
|
||||||
id: defaultItem.id ?? `reward-${index}`,
|
id: completeItem.id ?? `reward-${index}`,
|
||||||
incomplete: incompleteList?.[index] ?? null,
|
incomplete: incompleteList?.[index],
|
||||||
complete: defaultItem ?? null,
|
complete: completeItem,
|
||||||
flagType: rewardCompletedData.value?.[index]?.flag_type ?? 0,
|
flagType: rewardCompletedData.value?.[index]?.flag_type ?? 0,
|
||||||
}))
|
}))
|
||||||
})
|
})
|
||||||
|
|||||||
@@ -93,6 +93,7 @@ const onArrowClick = (direction, targetIndex) => {
|
|||||||
<div class="slide-inner border-line">
|
<div class="slide-inner border-line">
|
||||||
<BlocksVisualContent
|
<BlocksVisualContent
|
||||||
:resources-data="getComponentGroup(item, 'imgList')"
|
:resources-data="getComponentGroup(item, 'imgList')"
|
||||||
|
:alt="getComponentGroup(item, 'imgTitle')?.display?.text"
|
||||||
object-fit="cover"
|
object-fit="cover"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Reference in New Issue
Block a user