From 0f9ca732966aa814b467c85b564486ba463b629d Mon Sep 17 00:00:00 2001
From: dopamine <coderzyou@gmail.com>
Date: Mon, 19 May 2025 20:30:50 +0800
Subject: [PATCH] wip

---
 packages/components/carousel/src/constants.ts |  1 +
 .../carousel/src/use-carousel-item.ts         | 13 +++---------
 .../components/carousel/src/use-carousel.ts   | 20 +++++++++----------
 3 files changed, 13 insertions(+), 21 deletions(-)

diff --git a/packages/components/carousel/src/constants.ts b/packages/components/carousel/src/constants.ts
index e2a7c7ebf3..ca768a145f 100644
--- a/packages/components/carousel/src/constants.ts
+++ b/packages/components/carousel/src/constants.ts
@@ -17,6 +17,7 @@ export type CarouselItemContext = {
   states: CarouselItemStates
   uid: number
   translateItem: (index: number, activeIndex: number, oldIndex?: number) => void
+  preprocessTranslate: (index: number) => void
 }
 
 export type CarouselContext = {
diff --git a/packages/components/carousel/src/use-carousel-item.ts b/packages/components/carousel/src/use-carousel-item.ts
index 638095e74f..3ea90364d0 100644
--- a/packages/components/carousel/src/use-carousel-item.ts
+++ b/packages/components/carousel/src/use-carousel-item.ts
@@ -89,17 +89,9 @@ export const useCarouselItem = (props: CarouselItemProps) => {
     return distance * (index - activeIndex)
   }
 
-  function processTranslate(
-    translateDirection: 'prev' | 'next',
-    activeIndex: number,
-    isVertical: boolean
-  ) {
+  function preprocessTranslate(index: number) {
     animating.value = false
-    if (translateDirection === 'prev') {
-      translate.value = calcTranslate(activeIndex - 1, activeIndex, isVertical)
-    } else if (translateDirection === 'next') {
-      translate.value = calcTranslate(activeIndex + 1, activeIndex, isVertical)
-    }
+    translate.value = calcTranslate(index, activeIndex, isVertical)
   }
 
   const translateItem = (
@@ -175,6 +167,7 @@ export const useCarouselItem = (props: CarouselItemProps) => {
       }),
       uid: instance.uid,
       translateItem,
+      preprocessTranslte,
     })
   })
 
diff --git a/packages/components/carousel/src/use-carousel.ts b/packages/components/carousel/src/use-carousel.ts
index c166412b2e..0fd4837053 100644
--- a/packages/components/carousel/src/use-carousel.ts
+++ b/packages/components/carousel/src/use-carousel.ts
@@ -11,7 +11,7 @@ import {
 } from 'vue'
 import { throttle } from 'lodash-unified'
 import { useResizeObserver } from '@vueuse/core'
-import { debugWarn, isString, isUndefined } from '@element-plus/utils'
+import { debugWarn, isString } from '@element-plus/utils'
 import { useOrderedChildren } from '@element-plus/hooks'
 import { CHANGE_EVENT } from '@element-plus/constants'
 import { CAROUSEL_ITEM_NAME, carouselContextKey } from './constants'
@@ -94,9 +94,7 @@ export const useCarousel = (
   }
 
   const playSlides = () => {
-    if (activeIndex.value < items.value.length - 1) {
-      setActiveItem(activeIndex.value + 1)
-    } else if (props.loop) {
+    if (props.loop || activeIndex.value < items.value.length - 1) {
       setActiveItem(activeIndex.value + 1)
     }
   }
@@ -118,14 +116,9 @@ export const useCarousel = (
 
     const itemCount = items.value.length
     const oldIndex = activeIndex.value
-    translateDirection = undefined
-    if (itemCount === 2 && !isCardType.value && props.loop && oldIndex > -1) {
-      if (index < oldIndex) {
-        translateDirection = 'prev'
-      } else if (index > oldIndex) {
-        translateDirection = 'next'
-      }
+    if (itemCount === 2 && !isCardType.value && props.loop) {
     }
+
     if (index < 0) {
       activeIndex.value = props.loop ? itemCount - 1 : 0
     } else if (index >= itemCount) {
@@ -140,6 +133,11 @@ export const useCarousel = (
   }
 
   function resetItemPosition(oldIndex?: number) {
+    const shouldProcessIndex = rawIndex !== false
+    if (shouldProcessIndex) {
+      if (activeIndex.value === 0)
+        items.value[0].preprocessTranslate(1, activeIndex.value)
+    }
     items.value.forEach((item, index) => {
       item.translateItem(index, activeIndex.value, oldIndex)
     })