|
|
|
@ -4,17 +4,17 @@ import styles from './list.module.scss' |
|
|
|
import Taro from "@tarojs/taro"; |
|
|
|
import Taro from "@tarojs/taro"; |
|
|
|
import Empty from "@/components/empty/empty"; |
|
|
|
import Empty from "@/components/empty/empty"; |
|
|
|
import Img from "@/components/image/image"; |
|
|
|
import Img from "@/components/image/image"; |
|
|
|
import { SearchApi } from "@/api/search"; |
|
|
|
import {SearchApi} from "@/api/search"; |
|
|
|
import { AtLoadMore } from 'taro-ui' |
|
|
|
import {AtLoadMore} from 'taro-ui' |
|
|
|
import {rfc33392time} from "@/utils/day"; |
|
|
|
import {rfc33392time} from "@/utils/day"; |
|
|
|
import play from "@/static/img/play.png"; |
|
|
|
import play from "@/static/img/play-back.png"; |
|
|
|
|
|
|
|
|
|
|
|
type Props = { |
|
|
|
type Props = { |
|
|
|
name:string |
|
|
|
name: string |
|
|
|
clear:boolean |
|
|
|
clear: boolean |
|
|
|
} |
|
|
|
} |
|
|
|
const SearchList: FC<Props> = ({name,clear}) => { |
|
|
|
const SearchList: FC<Props> = ({name, clear}) => { |
|
|
|
console.log(name,'name') |
|
|
|
console.log(name, 'name') |
|
|
|
const globalData = Taro.getApp().globalData |
|
|
|
const globalData = Taro.getApp().globalData |
|
|
|
const [page, setPage] = useState(1) |
|
|
|
const [page, setPage] = useState(1) |
|
|
|
const [brands, setBrands] = useState<any[]>([]) |
|
|
|
const [brands, setBrands] = useState<any[]>([]) |
|
|
|
@ -22,21 +22,21 @@ const SearchList: FC<Props> = ({name,clear}) => { |
|
|
|
const [text, setText] = useState('') |
|
|
|
const [text, setText] = useState('') |
|
|
|
const [loading, setLoading] = useState(true) |
|
|
|
const [loading, setLoading] = useState(true) |
|
|
|
|
|
|
|
|
|
|
|
useEffect(()=>{ |
|
|
|
useEffect(() => { |
|
|
|
if(!clear){ |
|
|
|
if (!clear) { |
|
|
|
setBrands([]) |
|
|
|
setBrands([]) |
|
|
|
setLoading(true) |
|
|
|
setLoading(true) |
|
|
|
} |
|
|
|
} |
|
|
|
},[clear]) |
|
|
|
}, [clear]) |
|
|
|
useEffect(() => { |
|
|
|
useEffect(() => { |
|
|
|
if(name && clear){ |
|
|
|
if (name && clear) { |
|
|
|
getData() |
|
|
|
getData() |
|
|
|
} |
|
|
|
} |
|
|
|
}, [page,name,clear]) |
|
|
|
}, [page, name, clear]) |
|
|
|
|
|
|
|
|
|
|
|
const getData = useCallback(async () => { |
|
|
|
const getData = useCallback(async () => { |
|
|
|
try { |
|
|
|
try { |
|
|
|
const data = await SearchApi.list(page, 10,name) |
|
|
|
const data = await SearchApi.list(page, 10, name) |
|
|
|
if (page === 1) { |
|
|
|
if (page === 1) { |
|
|
|
if (data.data.length < 10) { |
|
|
|
if (data.data.length < 10) { |
|
|
|
setText('没有更多了~') |
|
|
|
setText('没有更多了~') |
|
|
|
@ -46,7 +46,7 @@ const SearchList: FC<Props> = ({name,clear}) => { |
|
|
|
setBrands([ |
|
|
|
setBrands([ |
|
|
|
...data.data |
|
|
|
...data.data |
|
|
|
]) |
|
|
|
]) |
|
|
|
}else{ |
|
|
|
} else { |
|
|
|
setBrands([ |
|
|
|
setBrands([ |
|
|
|
...brands, |
|
|
|
...brands, |
|
|
|
...data.data |
|
|
|
...data.data |
|
|
|
@ -57,13 +57,13 @@ const SearchList: FC<Props> = ({name,clear}) => { |
|
|
|
} catch (e) { |
|
|
|
} catch (e) { |
|
|
|
} |
|
|
|
} |
|
|
|
setLoading(false) |
|
|
|
setLoading(false) |
|
|
|
}, [page,name]) |
|
|
|
}, [page, name]) |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
function jumpInfo(id: number,type:string) { |
|
|
|
function jumpInfo(id: number, type: string) { |
|
|
|
console.log(type,'type') |
|
|
|
console.log(type, 'type') |
|
|
|
let url = '' |
|
|
|
let url = '' |
|
|
|
switch (type){ |
|
|
|
switch (type) { |
|
|
|
case 'brand': |
|
|
|
case 'brand': |
|
|
|
url = '/pages/preview/brand/info/info'; |
|
|
|
url = '/pages/preview/brand/info/info'; |
|
|
|
break; |
|
|
|
break; |
|
|
|
@ -81,13 +81,13 @@ const SearchList: FC<Props> = ({name,clear}) => { |
|
|
|
|
|
|
|
|
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
function onScrollToLower(){ |
|
|
|
function onScrollToLower() { |
|
|
|
if (brands?.length < total) { |
|
|
|
if (brands?.length < total) { |
|
|
|
setPage(page + 1) |
|
|
|
setPage(page + 1) |
|
|
|
getData().then() |
|
|
|
getData().then() |
|
|
|
} else { |
|
|
|
} else { |
|
|
|
setText('没有更多了~') |
|
|
|
setText('没有更多了~') |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
return ( |
|
|
|
return ( |
|
|
|
@ -95,65 +95,71 @@ const SearchList: FC<Props> = ({name,clear}) => { |
|
|
|
className='scrollview' |
|
|
|
className='scrollview' |
|
|
|
scrollY |
|
|
|
scrollY |
|
|
|
scrollWithAnimation |
|
|
|
scrollWithAnimation |
|
|
|
style={{height:`${globalData.screenHeight-140}px`,backgroundColor:`#f5f5f5`}} |
|
|
|
style={{height: `${globalData.screenHeight - 140}px`, backgroundColor: `#f5f5f5`}} |
|
|
|
onScrollToLower={onScrollToLower} |
|
|
|
onScrollToLower={onScrollToLower} |
|
|
|
> |
|
|
|
> |
|
|
|
{ loading && <AtLoadMore status={'loading'}/>} |
|
|
|
{loading && <AtLoadMore status={'loading'}/>} |
|
|
|
{ |
|
|
|
{ |
|
|
|
brands.length >= 1 && !loading && |
|
|
|
brands.length >= 1 && !loading && |
|
|
|
<> |
|
|
|
<> |
|
|
|
{brands.map((d) => |
|
|
|
{brands.map((d) => |
|
|
|
<View onClick={() => jumpInfo(d.data.id,d.data.table)} className={styles.box} key={d.data.id}> |
|
|
|
<View onClick={() => jumpInfo(d.data.id, d.data.table)} className={styles.box} key={d.data.id}> |
|
|
|
{ |
|
|
|
{ |
|
|
|
d.data.table === 'brand' && |
|
|
|
d.data.table === 'brand' && |
|
|
|
<> |
|
|
|
<> |
|
|
|
<Img width={128} height={128} src={d.data['@data'].logo} mode='aspectFill' className={styles.image}/> |
|
|
|
<Img width={128} height={128} src={d.data['@data'].logo} mode='aspectFill' className={styles.image} |
|
|
|
<View className={styles.rightBox}> |
|
|
|
errorType='brand'/> |
|
|
|
<View className='font-weight mb-2 font-28'>{d.data.title}</View> |
|
|
|
<View className={styles.rightBox}> |
|
|
|
<View className={styles.desc}>{d.data.content || '暂无品牌简介'}</View> |
|
|
|
<View className='font-weight mb-2 font-28'>{d.data.title}</View> |
|
|
|
</View> |
|
|
|
<View className={styles.desc}>{d.data.content || '暂无品牌简介'}</View> |
|
|
|
</> |
|
|
|
</View> |
|
|
|
} |
|
|
|
</> |
|
|
|
{ |
|
|
|
} |
|
|
|
d.data.table === 'article' && |
|
|
|
{ |
|
|
|
<> |
|
|
|
d.data.table === 'article' && |
|
|
|
<View className={styles.articleLeftBox}> |
|
|
|
<> |
|
|
|
<View className='font-weight mb-2 font-28 lh-40'>{d.data['@data'].title}</View> |
|
|
|
<View className={styles.articleLeftBox}> |
|
|
|
<View className={styles.desc}>{rfc33392time(d.data['@data'].created_at)} {d.data['@data'].page_view}阅读</View> |
|
|
|
<View className='font-weight mb-2 font-28 lh-40'>{d.data['@data'].title}</View> |
|
|
|
</View> |
|
|
|
<View |
|
|
|
<Img width={172} height={128} src={d.data['@data'].logo} mode='aspectFill' className={styles.image}/> |
|
|
|
className={styles.desc}>{rfc33392time(d.data['@data'].created_at)} {d.data['@data'].page_view}阅读</View> |
|
|
|
</> |
|
|
|
</View> |
|
|
|
} |
|
|
|
<Img width={172} height={128} src={d.data['@data'].logo} mode='aspectFill' className={styles.image} |
|
|
|
{ |
|
|
|
errorType='course'/> |
|
|
|
d.data.table === 'video_records' && |
|
|
|
</> |
|
|
|
<> |
|
|
|
} |
|
|
|
<Img width={192} height={192} src={d.data['@data'].url_path} mode='aspectFill' className={styles.image}/> |
|
|
|
{ |
|
|
|
<Image src={play} className={styles.play} mode='aspectFit'/> |
|
|
|
d.data.table === 'video_records' && |
|
|
|
<View className={styles.videoRightBox}> |
|
|
|
<> |
|
|
|
<View className='font-weight mb-2 font-28 lh-40'>{d.data['@data'].title}</View> |
|
|
|
<Img width={192} height={192} src={d.data['@data'].url_path} mode='aspectFill' errorType='health' |
|
|
|
<View className={styles.desc}>{d.data['@data'].introduction}</View> |
|
|
|
className={styles.image}/> |
|
|
|
<View className={`${styles.desc} mt-2`}>播放量: {d.data['@data'].video_view}</View> |
|
|
|
<Image src={play} className={styles.play} mode='aspectFit'/> |
|
|
|
</View> |
|
|
|
<View className={styles.videoRightBox}> |
|
|
|
</> |
|
|
|
<View className='font-weight mb-2 font-28 lh-40'>{d.data['@data'].title}</View> |
|
|
|
} |
|
|
|
<View className={styles.desc}>{d.data['@data'].introduction}</View> |
|
|
|
{ |
|
|
|
<View className={`${styles.desc} mt-2`}>播放量: {d.data['@data'].video_view}</View> |
|
|
|
d.data.table === 'courses' && |
|
|
|
</View> |
|
|
|
<> |
|
|
|
</> |
|
|
|
<Img width={192} height={138} src={d.data['@data'].thumb} mode='aspectFill' className={styles.image}/> |
|
|
|
} |
|
|
|
<View className={styles.courseRightBox}> |
|
|
|
{ |
|
|
|
<View className='font-weight mb-2 font-28 lh-40'>{d.data['@data'].title}</View> |
|
|
|
d.data.table === 'courses' && |
|
|
|
<View className={styles.desc}>课时:{d.data['@data'].class_hour}节 销量：{d.data['@data'].charge}</View> |
|
|
|
<> |
|
|
|
</View> |
|
|
|
<Img width={192} height={138} src={d.data['@data'].thumb} mode='aspectFill' className={styles.image} |
|
|
|
</> |
|
|
|
errorType='course'/> |
|
|
|
} |
|
|
|
<View className={styles.courseRightBox}> |
|
|
|
|
|
|
|
<View className='font-weight mb-2 font-28 lh-40'>{d.data['@data'].title}</View> |
|
|
|
</View> |
|
|
|
<View className={styles.desc}>课时:{d.data['@data'].class_hour}节 |
|
|
|
) |
|
|
|
销量：{d.data['@data'].charge}</View> |
|
|
|
} |
|
|
|
</View> |
|
|
|
<View style={{width: '750rpx', textAlign: 'center', color: '#999'}} className="font-28 mt-3 mb-3">{text}</View> |
|
|
|
</> |
|
|
|
</> |
|
|
|
} |
|
|
|
|
|
|
|
</View> |
|
|
|
|
|
|
|
) |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
<View style={{width: '750rpx', textAlign: 'center', color: '#999'}} |
|
|
|
|
|
|
|
className="font-28 mt-3 mb-3">{text}</View> |
|
|
|
|
|
|
|
</> |
|
|
|
} |
|
|
|
} |
|
|
|
{ !loading && brands.length === 0 && <Empty name='空空如也'/>} |
|
|
|
{!loading && brands.length === 0 && <Empty name='空空如也'/>} |
|
|
|
</ScrollView> |
|
|
|
</ScrollView> |
|
|
|
) |
|
|
|
) |
|
|
|
} |
|
|
|
} |
|
|
|
|
king
