From acd6b352b569768a4af35199a8d0b454a4b4815c Mon Sep 17 00:00:00 2001
From: king <2229249788@qq.com>
Date: Mon, 18 Sep 2023 09:27:39 +0800
Subject: [PATCH] =?UTF-8?q?2.=E4=BF=AE=E6=94=B9tab=E7=9A=84=E6=A0=B7?=
 =?UTF-8?q?=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/pageScript/pageScript.tsx      |  2 +-
 src/components/tabs/tabs.tsx                  | 35 +++++++---
 src/pages/index/index.tsx                     |  2 +-
 src/pages/preview/brand/info/info.module.scss | 64 ++++++++++++-------
 src/pages/preview/brand/info/info.tsx         | 10 +--
 src/pages/preview/brand/list/list.tsx         | 33 +++++-----
 6 files changed, 90 insertions(+), 56 deletions(-)

diff --git a/src/components/pageScript/pageScript.tsx b/src/components/pageScript/pageScript.tsx
index 853a9eb..5a7504d 100644
--- a/src/components/pageScript/pageScript.tsx
+++ b/src/components/pageScript/pageScript.tsx
@@ -9,7 +9,7 @@ interface Props {
 
 const PageScript: FC<Props> = (props) => {
   return <View
-    className={'text-center font-24 text-dark py-3 ' + props.className}
+    className={'text-center font-24 text-muted py-3 ' + props.className}
     style={props.styles}>
     {props.text || "暂无更多"}
   </View>
diff --git a/src/components/tabs/tabs.tsx b/src/components/tabs/tabs.tsx
index 1f9f7d4..2b57b99 100644
--- a/src/components/tabs/tabs.tsx
+++ b/src/components/tabs/tabs.tsx
@@ -24,6 +24,7 @@ interface TabsProps {
   backMode?: boolean // 块级模式
   style?: CSSProperties
   hiddenSliding?: boolean // 取消底部滑块
+  scrollable?: boolean
 }
 
 const Tabs: FC<TabsProps> = (opt) => {
@@ -49,19 +50,33 @@ const Tabs: FC<TabsProps> = (opt) => {
     return index === current
   }
 
+  let children = (
+    <View className={'tabs-scroll ' + (opt.tabList.length < 5 ? 'justify-around' : '')}>
+      {opt.tabList.map((d, index) => <View
+        key={index}
+        className={'tabs-item ' + (is_current(d.value, index) && 'current ') + (!opt.hiddenSliding && 'sliding')}
+        onClick={(event) => onChange(event, index, d)}>
+        {d.title}
+      </View>)}
+    </View>
+  )
+  if (opt.scrollable != false) {
+    children = (
+      <ScrollView scrollX scrollLeft={left} scrollWithAnimation showScrollbar={false} style={{height: opt.height}}>
+        {children}
+      </ScrollView>
+    )
+  } else {
+    children = (
+      <View style={{height: opt.height}}>
+        {children}
+      </View>
+    )
+  }
 
   return (
     <View className={`tabs ${opt.backMode && 'tabsBack'}`} style={{height: opt.height, ...opt.style}}>
-      <ScrollView scrollX scrollLeft={left} scrollWithAnimation showScrollbar={false} style={{height: opt.height}}>
-        <View className={'tabs-scroll ' + (opt.tabList.length < 5 ? 'justify-around' : '')}>
-          {opt.tabList.map((d, index) => <View
-            key={index}
-            className={'tabs-item ' + (is_current(d.value, index) && 'current ') + (!opt.hiddenSliding && 'sliding')}
-            onClick={(event) => onChange(event, index, d)}>
-            {d.title}
-          </View>)}
-        </View>
-      </ScrollView>
+      {children}
     </View>
   )
 }
diff --git a/src/pages/index/index.tsx b/src/pages/index/index.tsx
index a42eb35..25e0a68 100644
--- a/src/pages/index/index.tsx
+++ b/src/pages/index/index.tsx
@@ -26,7 +26,7 @@ const Index: FC = () => {
     <View className={styles.content}>
       <NavigationBar
         cancelBack
-        leftNode={<Tabs tabList={category} onChange={tabChange} current={categoryKey} hiddenSliding/>}
+        leftNode={<Tabs tabList={category} onChange={tabChange} current={categoryKey} scrollable={false} hiddenSliding/>}
         backgroundColor={'transparent'}
       />
       <VideoList
diff --git a/src/pages/preview/brand/info/info.module.scss b/src/pages/preview/brand/info/info.module.scss
index abc218a..dce6b41 100644
--- a/src/pages/preview/brand/info/info.module.scss
+++ b/src/pages/preview/brand/info/info.module.scss
@@ -1,48 +1,60 @@
-page{
+page {
   background-color: #fff !important;
 }
-.swiper{
-  width:750rpx;
-  height:600rpx;
+
+.swiper {
+  width: 750rpx;
+  height: 600rpx;
 }
-.curIndexBox{
+
+.curIndexBox {
   position: absolute;
-  top:500rpx;
-  right:30rpx;
-  background-color: rgba(0,0,0,0.5);
+  top: 530rpx;
+  right: 30rpx;
+  background-color: rgba(0, 0, 0, 0.5);
   border-radius: 30rpx;
-  padding: 5rpx 30rpx;
-  color:#fff;
+  padding: 10rpx 20rpx;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  line-height: 1;
+  color: #fff;
+  transform: scale(0.8);
 }
-.body{
-  background-color:#f1f8f6;
+
+.body {
+  background-color: #f1f8f6;
   width: 750rpx;
   box-sizing: border-box;
   display: flex;
   flex-direction: column;
   min-height: 500rpx;
-  .top{
+
+  .top {
     position: sticky;
     position: -webkit-sticky;
     top: 0;
-    padding:40rpx 30rpx 30rpx 30rpx;
+    padding: 40rpx 30rpx 30rpx 30rpx;
     background-color: #fff;
-    .title{
+
+    .title {
       font-size: 32rpx;
       font-weight: bold;
       color: #323635;
-      line-height:44rpx;
+      line-height: 44rpx;
     }
   }
-  .bottom{
+
+  .bottom {
     margin-top: 20rpx;
-    flex:1;
+    flex: 1;
     background-color: #fff;
     border-radius: 32rpx 32rpx 0 0;
     width: 100%;
     padding: 0 30rpx;
     width: 100%;
     box-sizing: border-box;
+
     .box {
       display: flex;
       background-color: #fff;
@@ -50,24 +62,28 @@ page{
       padding: 30rpx;
       box-sizing: border-box;
     }
-    .inner{
-      flex:1;
+
+    .inner {
+      flex: 1;
       display: flex;
       padding-bottom: 24rpx;
       border-bottom: 2rpx solid #F5F8F7;
-      .image{
+
+      .image {
         width: 172rpx;
-        height:128rpx;
+        height: 128rpx;
         background-color: #eee;
         border-radius: 8rpx;
         overflow: hidden;
       }
-      .leftBox{
+
+      .leftBox {
         padding-right: 24rpx;
         box-sizing: border-box;
         flex: 1;
       }
-      .desc{
+
+      .desc {
         font-size: 22rpx;
         font-weight: 500;
         color: #909795;
diff --git a/src/pages/preview/brand/info/info.tsx b/src/pages/preview/brand/info/info.tsx
index bf5c8c0..91eee7a 100644
--- a/src/pages/preview/brand/info/info.tsx
+++ b/src/pages/preview/brand/info/info.tsx
@@ -4,7 +4,6 @@ import {brandApi, BrandRecord} from "@/api";
 import styles from './info.module.scss'
 import Taro, {useReachBottom, useRouter} from "@tarojs/taro";
 import LineEllipsis from "@/components/textCollapse/collapse";
-import Empty from "@/components/empty/empty";
 import Img from "@/components/image/image";
 import Spin from "@/components/spinner";
 import Collect from "@/components/collect/collect";
@@ -103,12 +102,13 @@ const BrandInfo: FC = () => {
             }
           </Swiper>
           <View className={styles.curIndexBox}>
-            <Text>{curIndex} / {(brandInfo?.brand_album?.split(',').length || 0) + ((brandInfo && brandInfo.introductory_video_resource) ? 1 : 0)}</Text>
+            <Text className={'font-26'}>{curIndex}</Text>
+            <Text>/</Text>
+            <Text>{(brandInfo?.brand_album?.split(',').length || 0) + ((brandInfo && brandInfo.introductory_video_resource) ? 1 : 0)}</Text>
           </View>
         </>
       }
 
-
       <View className={styles['body']}>
         <View className={styles['top']}>
           <View className='flex justify-between'>
@@ -123,7 +123,9 @@ const BrandInfo: FC = () => {
                 articleList.map(d => <ArticlesBox data={d}/>)}
                 <PageScript/>
               </>
-              : <Empty name='空空如也'/>
+              : <View className="py-6">
+                <PageScript text="还没有发布文章"/>
+              </View>
           }
         </View>
       </View>
diff --git a/src/pages/preview/brand/list/list.tsx b/src/pages/preview/brand/list/list.tsx
index 0845c9c..457982d 100644
--- a/src/pages/preview/brand/list/list.tsx
+++ b/src/pages/preview/brand/list/list.tsx
@@ -1,5 +1,5 @@
 import {FC, ReactNode, useCallback, useEffect, useState} from "react";
-import {Image, Video, View} from "@tarojs/components";
+import {Text, Video, View} from "@tarojs/components";
 import {brandApi, BrandRecord} from "@/api";
 import Taro, {useReachBottom} from "@tarojs/taro";
 import Empty from "@/components/empty/empty";
@@ -7,12 +7,13 @@ import Spinner from "@/components/spinner";
 import Img from "@/components/image/image";
 import {beforeTime} from "@/utils/time";
 import styles from './list.module.scss'
-import articleLine from "@/static/img/articleLine.png"
-import Collect from "@/components/collect/collect";
+// import articleLine from "@/static/img/articleLine.png"
+// import Collect from "@/components/collect/collect";
 import PageScript from "@/components/pageScript/pageScript";
 
 const BrandItem: FC<{ data: BrandRecord; onClick: VoidFunction }> = ({data, onClick}) => {
   let media: ReactNode
+  let hasMedia = true
   if (data.introductory_video_resource) {
     media = <Video
       style={{width: '100%'}}
@@ -26,10 +27,12 @@ const BrandItem: FC<{ data: BrandRecord; onClick: VoidFunction }> = ({data, onCl
       mode="aspectFill"
       style={{background: '#ededed'}}
     />
+  } else {
+    hasMedia = false
   }
 
   return (
-    <View className="bg-white flex flex-column justify-stretch mb-2_4 rounded-10 clip">
+    <View className="bg-white flex flex-column justify-stretch mb-2 clip">
       <View className="p-3">
         <View onClick={onClick}>
           <View className='mb-2 font-32 flex'>
@@ -39,31 +42,29 @@ const BrandItem: FC<{ data: BrandRecord; onClick: VoidFunction }> = ({data, onCl
               src={data.logo}
               mode='aspectFill'
               errorType='brand'
-              className="rounded-10 clip"
+              className="rounded clip"
               style={{background: '#ededed'}}
             />
             <View className="ml-2 flex-1">
               <View className="text-row1 font-28">{data.name}</View>
-              <View className='font-24 mt-2 text-muted'>{beforeTime(data.created_at)}·加入</View>
+              <View className='font-24 mt-2 text-muted'>
+                <Text>{beforeTime(data.created_at)}</Text>
+                <Text className='ml-2'>文章 {data.article_count || 0}</Text>
+              </View>
             </View>
           </View>
-
-          <View className={styles.previewImag}>
-            {media}
-          </View>
-
-          <View className="font-24 text-muted mb-4 text-row3 mt-2" style={{lineHeight: 1.4}}>
+          {hasMedia && <View className={styles.previewImag + ' mb-2'}>{media}</View>}
+          <View className="font-24 text-muted text-row3" style={{lineHeight: 1.4}}>
             {data.graphic_introduction}
           </View>
         </View>
-
-        <View className="flex gap20rpx font-24 text-muted justify-around">
+        {/*<View className="flex gap20rpx font-24 text-muted justify-around">
           <View className={styles.feature}>
             <Image src={articleLine}/>
             {data.article_count || 0}
           </View>
           <Collect owner_id={data.id} owner_type={4} select={data.collect}/>
-        </View>
+        </View>*/}
       </View>
     </View>
   )
@@ -125,7 +126,7 @@ const BrandList: FC = () => {
 
 
   return (
-    <View className='p-2'>
+    <View className='py-2'>
       <Spinner enable={loading} overlay/>
       {
         brands.length ?