refactor: 智能体生成展示优化结构

src/pages/agent-gen/components/step/ResultSwiper.tsx

@@ -0,0 +1,72 @@
+import { View, Swiper, SwiperItem, Image } from "@tarojs/components";
+import React, { useEffect, useState } from "react";
+import { AvatarMedia } from "@/components/AvatarMedia";
+import { TAvatarItem } from "@/service/storage";
+import style from "./index.module.less";
+interface IProps {
+  avatarsList: TAvatarItem[]
+}
+export default React.memo(function Index({ avatarsList }: IProps) {
+  const [currentSwiperIndex, setCurrentSwiperIndex] = useState(0);
+
+  const onSwiperChange = (e: any) => {
+    const i = e.detail.current;
+    console.log(i)
+    setCurrentSwiperIndex(i);
+  };
+
+  const renderIndicator = (currentIndex: number) => {
+    return (
+      <>
+        <View className={style.indicatorContainer}>
+          {avatarsList.map((_item, index) => {
+            return (
+              <View
+                key={index}
+                className={
+                  index === currentIndex
+                    ? `${style.indicator} ${style.indicatorActive}`
+                    : style.indicator
+                }
+              ></View>
+            );
+          })}
+        </View>
+      </>
+    );
+  };
+
+  return (
+    <View className={`${style.pickAvatarCard}`}>
+      <Swiper
+        className={style.mySwiper}
+        indicatorColor="#999"
+        indicatorActiveColor="#333"
+        indicatorDots={false}
+        duration={200}
+        next-margin="-120rpx"
+        current={currentSwiperIndex}
+        onChange={(e) => onSwiperChange(e)}
+      >
+        {avatarsList.map(avatar => {
+          return <SwiperItem>
+            <View className={style.swiperItem}>
+              <AvatarMedia roundedFull={false} source={avatar.avatarUrl} className="w-full h-full" />
+              {/* <Image
+                mode="widthFix"
+                src={avatar.avatarUrl}
+              ></Image> */}
+              {avatar.isOriginal && <View className={style.pickAvatarOriginal}>
+                <View>原图</View>
+              </View> }
+              {!avatar.isOriginal && <View className={style.aiTips}>图片由AI生成</View> }
+
+            </View>
+          </SwiperItem>
+        })}
+      </Swiper>
+      {/* <!-- 自定义指示点容器 --> */}
+      {renderIndicator(currentSwiperIndex)}
+    </View>
+  );
+});

src/pages/agent-gen/components/step/StepPick.tsx

@@ -8,6 +8,7 @@ import useSWR from 'swr';
 import Taro from "@tarojs/taro";
 import { isSuccess } from "@/utils";
 import WemetaButton from '@/components/buttons/WemetaButton'
+import ResultSwiper from "./ResultSwiper";
 interface IProps {
   prev: () => void;
   next: () => void;
@@ -151,68 +152,68 @@ export default React.memo(function Index({ prev, next, taskId, avatars, videos,
   }
 
 
-  const onSwiperChange = (e: any) => {
-    const i = e.detail.current;
-    console.log(i)
-    setCurrentSwiperIndex(i);
-  };
+  // const onSwiperChange = (e: any) => {
+  //   const i = e.detail.current;
+  //   console.log(i)
+  //   setCurrentSwiperIndex(i);
+  // };
 
-  const renderSwipers = () => {
-    const renderIndicator = (currentIndex: number) => {
-      return (
-        <>
-          <View className={style.indicatorContainer}>
-            {avatarsList.map((_item, index) => {
-              return (
-                <View
-                  key={index}
-                  className={
-                    index === currentIndex
-                      ? `${style.indicator} ${style.indicatorActive}`
-                      : style.indicator
-                  }
-                ></View>
-              );
-            })}
-          </View>
-        </>
-      );
-    };
+  // const renderSwipers = () => {
+  //   const renderIndicator = (currentIndex: number) => {
+  //     return (
+  //       <>
+  //         <View className={style.indicatorContainer}>
+  //           {avatarsList.map((_item, index) => {
+  //             return (
+  //               <View
+  //                 key={index}
+  //                 className={
+  //                   index === currentIndex
+  //                     ? `${style.indicator} ${style.indicatorActive}`
+  //                     : style.indicator
+  //                 }
+  //               ></View>
+  //             );
+  //           })}
+  //         </View>
+  //       </>
+  //     );
+  //   };
 
-    return (
-      <View className={`${style.pickAvatarCard}`}>
-        <Swiper
-          className={style.mySwiper}
-          indicatorColor="#999"
-          indicatorActiveColor="#333"
-          indicatorDots={false}
-          duration={200}
-          next-margin="-120rpx"
-          current={currentSwiperIndex}
-          onChange={(e) => onSwiperChange(e)}
-        >
-          {avatarsList.map(avatar => {
-            return <SwiperItem>
-              <View className={style.swiperItem}>
-                <AvatarMedia roundedFull={false} source={avatar.avatarUrl} className="w-full h-full" />
-                {/* <Image
-                  mode="widthFix"
-                  src={avatar.avatarUrl}
-                ></Image> */}
-                {avatar.isOriginal && <View className={style.pickAvatarOriginal}>
-                  <View>原图</View>
-                </View> }
-                {!avatar.isOriginal && <View className={style.aiTips}>图片由AI生成</View> }
+  //   return (
+  //     <View className={`${style.pickAvatarCard}`}>
+  //       <Swiper
+  //         className={style.mySwiper}
+  //         indicatorColor="#999"
+  //         indicatorActiveColor="#333"
+  //         indicatorDots={false}
+  //         duration={200}
+  //         next-margin="-120rpx"
+  //         current={currentSwiperIndex}
+  //         onChange={(e) => onSwiperChange(e)}
+  //       >
+  //         {avatarsList.map(avatar => {
+  //           return <SwiperItem>
+  //             <View className={style.swiperItem}>
+  //               <AvatarMedia roundedFull={false} source={avatar.avatarUrl} className="w-full h-full" />
+  //               {/* <Image
+  //                 mode="widthFix"
+  //                 src={avatar.avatarUrl}
+  //               ></Image> */}
+  //               {avatar.isOriginal && <View className={style.pickAvatarOriginal}>
+  //                 <View>原图</View>
+  //               </View> }
+  //               {!avatar.isOriginal && <View className={style.aiTips}>图片由AI生成</View> }
 
-              </View>
-            </SwiperItem>
-          })}
-        </Swiper>
-        {/* <!-- 自定义指示点容器 --> */}
-        {renderIndicator(currentSwiperIndex)}
-      </View>
-    );
-  };
+  //             </View>
+  //           </SwiperItem>
+  //         })}
+  //       </Swiper>
+  //       {/* <!-- 自定义指示点容器 --> */}
+  //       {renderIndicator(currentSwiperIndex)}
+  //     </View>
+  //   );
+  // };
 
   // 生成中提示文本
   const renderStatusText = () => {
@@ -249,7 +250,7 @@ export default React.memo(function Index({ prev, next, taskId, avatars, videos,
   const renderContent = ()=> {
     if((avatars.length && !videoGenerating) || (videos.length)){
 
-      return renderSwipers()
+      return <ResultSwiper avatarsList={avatarsList}  />
     }
 
     return <View className={`${style.pickAvatarCard} ${style.pickGenCard}`}>

src/pages/agent/hooks/useConfirms.tsx

@@ -27,7 +27,7 @@ export const useConfirms = () => {
       showModal({
         content: <View className="text-black font-pingfangSCMedium font-medium text-14 leading-22">为你的智能体设置一个形象吧</View>,
         confirmText: "继续设置",
-        cancelText: "暂时不设置",
+        cancelText: "暂不设置",
         onConfirm() {
           Taro.showTabBar().catch(()=> {});
           resolve(true)
@@ -66,7 +66,7 @@ export const useConfirms = () => {
               <View className="text-gray-5 text-14 leading-22" style="max-width: 280px;">让商务伙伴在访问你的智能体时，可以更深入的了解你的企业和业务</View>
           </View>,
         confirmText: "编辑微官网",
-        cancelText: "暂时不编辑",
+        cancelText: "暂不编辑",
         onConfirm() {
           Taro.showTabBar().catch(()=> {});
           resolve(true)