v4.0.17 小程序版本优化

apps/mini-user/src/components/StoreRedeemMarquee.tsx

@@ -1,28 +1,33 @@
 import { useMemo } from 'react';
 import { View, Text, Swiper, SwiperItem } from '@tarojs/components';
+import { formatRedeemRelativeTime } from '../lib/datetime';
 
 export type StoreRedeemMarqueeItem = {
   userLabel: string;
   amount: string;
+  createdAt?: string | null;
 };
 
 type StoreRedeemMarqueeProps = {
   items: StoreRedeemMarqueeItem[];
 };
 
-const STAY_MS = 20000;
+const STAY_MS = 5000;
 
 function MarqueeRow({ item }: { item: StoreRedeemMarqueeItem }) {
+  const timeLabel = formatRedeemRelativeTime(item.createdAt);
   return (
     <View className="store-detail-marquee-inner">
       <View className="store-detail-marquee-dot" />
-      <Text className="store-detail-marquee-text">{item.userLabel} 刚刚到店核销</Text>
+      <Text className="store-detail-marquee-text">
+        {item.userLabel} {timeLabel}到店核销
+      </Text>
       <Text className="store-detail-marquee-amount">{item.amount}</Text>
     </View>
   );
 }
 
-/** 核销记录：单条静止；多条竖向循环，每条停留 20 秒 */
+/** 核销记录：单条静止；多条竖向循环，支持手动滑动，每条停留 5 秒 */
 export default function StoreRedeemMarquee({ items }: StoreRedeemMarqueeProps) {
   const list = useMemo(
     () =>
@@ -30,6 +35,7 @@ export default function StoreRedeemMarquee({ items }: StoreRedeemMarqueeProps) {
         .map((row) => ({
           userLabel: String(row.userLabel || '用户***').trim() || '用户***',
           amount: String(row.amount || '').trim(),
+          createdAt: row.createdAt ?? null,
         }))
         .filter((row) => row.amount),
     [items],
@@ -57,7 +63,7 @@ export default function StoreRedeemMarquee({ items }: StoreRedeemMarqueeProps) {
         indicatorDots={false}
       >
         {list.map((row, index) => (
-          <SwiperItem key={`${row.userLabel}|${row.amount}|${index}`}>
+          <SwiperItem key={`${row.userLabel}|${row.amount}|${row.createdAt}|${index}`}>
             <MarqueeRow item={row} />
           </SwiperItem>
         ))}