feat: 优化delivered info部分代码

src/components/ShipmentStatus/src/ShipmentStatus.vue

@@ -26,28 +26,34 @@ const isShowDeliveryInfo = ref(false)
 const deliveredInfoRef = ref()
 const simplexContentRef = ref()
 const handleSeeAllDeliveryInfo = () => {
-  nextTick(() => {
-    console.log('isShowDeliveryInfo', deliveredInfoRef.value)
-    // if (deliveredInfoRef.value) {
-    //   deliveredInfoRef.value[0]?.scrollIntoView({ behavior: 'smooth' })
-    // }
-    if (!simplexContentRef.value || !deliveredInfoRef.value) return
-    console.log('simplexContentRef', simplexContentRef.value)
-    console.log('deliveredInfoRef', deliveredInfoRef.value)
-    // 4. 计算滚动位置
-    // 获取子元素相对于父容器顶部的位置
-    const parentRect = simplexContentRef.value.getBoundingClientRect()
-    const childRect = deliveredInfoRef.value[0].getBoundingClientRect()
+  nextTick(async () => {
+    const container = simplexContentRef.value
+    const elements = deliveredInfoRef.value
 
-    // 计算需要滚动的距离
-    // 子元素顶部 - 父容器顶部 - 20px（你想要的偏移量）
-    const scrollTop = simplexContentRef.value.scrollTop + (childRect.top - parentRect.top) - 30
+    if (!container || !elements) return
 
-    // 5. 执行滚动（只在父容器内）
-    simplexContentRef.value.scrollTo({
-      top: scrollTop,
-      behavior: 'smooth'
-    })
+    const targetElement = Array.isArray(elements) ? elements[0] : elements
+    if (!targetElement) return
+
+    // 📏 获取布局信息
+    const containerRect = container.getBoundingClientRect()
+    const elementRect = targetElement.getBoundingClientRect()
+
+    const relativeTop = elementRect.top - containerRect.top
+    const scrollTop = container.scrollTop + relativeTop - 30
+
+    const maxScrollTop = container.scrollHeight - container.clientHeight
+    const safeScrollTop = Math.max(0, Math.min(scrollTop, maxScrollTop))
+
+    try {
+      container.scrollTo({
+        top: safeScrollTop,
+        behavior: 'smooth'
+      })
+    } catch (error) {
+      // 💠 兼容性兜底：某些浏览器不支持 'smooth' 滚动
+      container.scrollTop = safeScrollTop
+    }
   })
 }
 // 中间点 每两个节点之间加上26px  上边距离28px 下边距离54px  如果没有中间点则高度为56px