From 71d2f77b3042b4890fefbe3b8e77acd1d76088ab Mon Sep 17 00:00:00 2001
From: sunlizhou <296190577@qq.com>
Date: Tue, 22 Aug 2023 11:17:17 +0800
Subject: [PATCH] =?UTF-8?q?=E5=93=81=E7=89=8C=E5=88=97=E8=A1=A8=E5=93=81?=
 =?UTF-8?q?=E7=89=8C=E8=AF=A6=E6=83=85=E8=B0=83=E6=95=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/brand.ts                              |  1 +
 src/pages/preview/brand/info/info.module.scss | 17 +++++++++++---
 src/pages/preview/brand/info/info.tsx         | 22 ++++++++++++-------
 src/pages/preview/brand/list/list.tsx         |  4 ++--
 4 files changed, 31 insertions(+), 13 deletions(-)

diff --git a/src/api/brand.ts b/src/api/brand.ts
index 6770503..4e636c3 100644
--- a/src/api/brand.ts
+++ b/src/api/brand.ts
@@ -1,6 +1,7 @@
 import {request} from "@/api/request";
 
 export type BrandRecord = {
+  logo: string;
   name: string;
   id: number
   introductory_video: string
diff --git a/src/pages/preview/brand/info/info.module.scss b/src/pages/preview/brand/info/info.module.scss
index 11abb71..9362555 100644
--- a/src/pages/preview/brand/info/info.module.scss
+++ b/src/pages/preview/brand/info/info.module.scss
@@ -1,16 +1,27 @@
+page{
+  background-color: #fff !important;
+}
 .swiper{
   width:750rpx;
   height:600rpx;
-  background-color: pink;
+}
+.curIndexBox{
+  position: absolute;
+  top:450rpx;
+  right:30rpx;
+  background-color: rgba(0,0,0,0.5);
+  border-radius: 30rpx;
+  padding: 5rpx 30rpx;
+  color:#fff;
 }
 .body{
   border-radius: 32rpx 32rpx 0 0;
-  background-color:cadetblue;
+  background-color:#f1f8f6;
   width: 750rpx;
   box-sizing: border-box;
   display: flex;
   flex-direction: column;
-  min-height: 80vh;
+  min-height: 600rpx;
   position: absolute;
   top: 520rpx;
   .top{
diff --git a/src/pages/preview/brand/info/info.tsx b/src/pages/preview/brand/info/info.tsx
index 0ac2089..f5ab470 100644
--- a/src/pages/preview/brand/info/info.tsx
+++ b/src/pages/preview/brand/info/info.tsx
@@ -13,6 +13,7 @@ const BrandInfo: FC = () => {
   const {id} = useRouter().params as unknown as Params
   const [brandInfo, setBrandInfo] = useState<BrandRecord>()
   const [articleList, setArticleList] = useState<ArticleRecord[]>()
+  const [curIndex,setCurIndex] = useState<number>(1)
 
   useEffect(() => {
     getData()
@@ -30,22 +31,26 @@ const BrandInfo: FC = () => {
     }
   }
 
+  function onChange(e){
+    console.log(e)
+    setCurIndex(+e.detail.current+1)
+  }
 
   return (
     <View className='flex flex-column '>
-      {
         <Swiper
           className={styles['swiper']}
           indicatorColor='#999'
           indicatorActiveColor='#333'
           indicatorDots
+          onChange={onChange}
         >
-          <SwiperItem>
+          { brandInfo?.introductory_video_resource?.url && <SwiperItem>
             <Video
               style={{width: '750rpx', height: '600rpx'}}
               playBtnPosition={"center"}
               id='video'
-              src={brandInfo?.introductory_video_resource?.url || ''}
+              src={brandInfo?.introductory_video_resource?.url}
               initialTime={0}
               controls={true}
               enableProgressGesture={false}
@@ -54,16 +59,17 @@ const BrandInfo: FC = () => {
               loop={false}
               muted={false}
             />
-          </SwiperItem>)
+          </SwiperItem>}
           {brandInfo?.brand_album?.length
-            && brandInfo?.brand_album?.map((d) =>
+            && brandInfo?.brand_album?.split(',').map((d) =>
               <SwiperItem>
-                <Image src={d}></Image>
+                <Image mode={'aspectFill'} style={{width:'750rpx',height:'600rpx'}} src={d}></Image>
               </SwiperItem>)
           }
         </Swiper>
-
-      }
+        <View className={styles.curIndexBox}>
+          <Text>{curIndex} / {brandInfo?.brand_album?.split(',').length + ((brandInfo && brandInfo.introductory_video_resource) ? 1:0)}</Text>
+        </View>
       <View className={styles['body']}>
         <View className={styles['top']}>
           <Text className={styles['title']}>{brandInfo?.name}</Text>
diff --git a/src/pages/preview/brand/list/list.tsx b/src/pages/preview/brand/list/list.tsx
index 2ea9aef..fac5737 100644
--- a/src/pages/preview/brand/list/list.tsx
+++ b/src/pages/preview/brand/list/list.tsx
@@ -42,10 +42,10 @@ const BrandList: FC = () => {
       {
         brands.length ? brands.map((d) =>
             <View onClick={() => jumpInfo(d.id)} className={styles.box} key={d.id}>
-              <Image src={d.brand_album?.[0]} mode='aspectFill' className={styles.image}/>
+              <Image src={d.logo} mode='aspectFill' className={styles.image}/>
               <View className={styles.rightBox}>
                 <View className='font-weight mb-2 font-28'>{d.name}</View>
-                <View className={styles.desc}>{d.graphic_introduction.repeat(30)}</View>
+                <View className={styles.desc}>{d.graphic_introduction}</View>
               </View>
             </View>)
           : <Empty name='空空如也'/>