parent
39aa8c808c
commit
ed2c5aedb0
@ -1,4 +0,0 @@ |
|||||||
export default definePageConfig({ |
|
||||||
navigationBarTitleText: '文章详情', |
|
||||||
onReachBottomDistance: 30 |
|
||||||
}) |
|
@ -1,28 +0,0 @@ |
|||||||
import {FC, useEffect, useState} from "react"; |
|
||||||
import {View} from "@tarojs/components"; |
|
||||||
import Taro, {useRouter} from "@tarojs/taro"; |
|
||||||
import {ArticleRecord, brandApi} from "@/api"; |
|
||||||
|
|
||||||
|
|
||||||
const article:FC = () => { |
|
||||||
const {id} = useRouter().params as unknown as { id: number} |
|
||||||
const [articleInfo,setArticleInfo] = useState<ArticleRecord>() |
|
||||||
useEffect(() => { |
|
||||||
getData() |
|
||||||
}, [id]) |
|
||||||
|
|
||||||
const getData = async () => { |
|
||||||
try { |
|
||||||
const data = await brandApi.articleInfo(id) |
|
||||||
Taro.setNavigationBarTitle({title:data.title}) |
|
||||||
setArticleInfo(data) |
|
||||||
} catch (e) { |
|
||||||
} |
|
||||||
} |
|
||||||
function helloWorld() { |
|
||||||
const html = articleInfo?.content; |
|
||||||
return <View dangerouslySetInnerHTML={{ __html: html! }}></View> |
|
||||||
} |
|
||||||
return helloWorld() |
|
||||||
} |
|
||||||
export default article |
|
@ -1,4 +0,0 @@ |
|||||||
export default definePageConfig({ |
|
||||||
navigationBarTitleText: '', |
|
||||||
onReachBottomDistance: 30 |
|
||||||
}) |
|
@ -1,65 +0,0 @@ |
|||||||
.swiper{ |
|
||||||
width:750rpx; |
|
||||||
height:600rpx; |
|
||||||
background-color: pink; |
|
||||||
} |
|
||||||
.body{ |
|
||||||
border-radius: 32rpx 32rpx 0 0; |
|
||||||
background-color:cadetblue; |
|
||||||
width: 750rpx; |
|
||||||
box-sizing: border-box; |
|
||||||
display: flex; |
|
||||||
flex-direction: column; |
|
||||||
min-height: 80vh; |
|
||||||
position: absolute; |
|
||||||
top: 520rpx; |
|
||||||
.top{ |
|
||||||
padding:40rpx 30rpx 30rpx 30rpx; |
|
||||||
border-radius: 32rpx; |
|
||||||
background-color: #fff; |
|
||||||
.title{ |
|
||||||
font-size: 32rpx; |
|
||||||
font-weight: bold; |
|
||||||
color: #323635; |
|
||||||
line-height:44rpx; |
|
||||||
} |
|
||||||
} |
|
||||||
.bottom{ |
|
||||||
margin-top: 20rpx; |
|
||||||
flex:1; |
|
||||||
background-color: #fff; |
|
||||||
border-radius: 32rpx 32rpx 0 0; |
|
||||||
width: 100%; |
|
||||||
.box { |
|
||||||
display: flex; |
|
||||||
background-color: #fff; |
|
||||||
border-radius: 16rpx; |
|
||||||
padding: 30rpx; |
|
||||||
box-sizing: border-box; |
|
||||||
} |
|
||||||
.inner{ |
|
||||||
flex:1; |
|
||||||
display: flex; |
|
||||||
padding-bottom: 24rpx; |
|
||||||
border-bottom: 2rpx solid #F5F8F7; |
|
||||||
.image{ |
|
||||||
width: 172rpx; |
|
||||||
height:128rpx; |
|
||||||
background-color: pink; |
|
||||||
border-radius: 8rpx; |
|
||||||
} |
|
||||||
.leftBox{ |
|
||||||
padding-right: 24rpx; |
|
||||||
box-sizing: border-box; |
|
||||||
flex: 1; |
|
||||||
} |
|
||||||
.desc{ |
|
||||||
font-size: 22rpx; |
|
||||||
font-weight: 500; |
|
||||||
color: #909795; |
|
||||||
line-height: 32rpx |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
} |
|
||||||
} |
|
@ -1,4 +0,0 @@ |
|||||||
export default definePageConfig({ |
|
||||||
navigationBarTitleText: '品牌列表', |
|
||||||
onReachBottomDistance: 30 |
|
||||||
}) |
|
@ -1,32 +0,0 @@ |
|||||||
.box { |
|
||||||
display: flex; |
|
||||||
margin-bottom: 20rpx; |
|
||||||
background-color: #fff; |
|
||||||
border-radius: 16rpx; |
|
||||||
padding: 24rpx; |
|
||||||
box-sizing: border-box; |
|
||||||
} |
|
||||||
.image{ |
|
||||||
width: 128rpx; |
|
||||||
height:128rpx; |
|
||||||
background-color: pink; |
|
||||||
border-radius: 8rpx; |
|
||||||
} |
|
||||||
.rightBox{ |
|
||||||
padding-left: 24rpx; |
|
||||||
box-sizing: border-box; |
|
||||||
flex: 1; |
|
||||||
} |
|
||||||
.desc{ |
|
||||||
font-size: 24rpx; |
|
||||||
font-weight: 500; |
|
||||||
color: #909795; |
|
||||||
line-height: 34rpx; |
|
||||||
display: -webkit-box; |
|
||||||
word-break: break-all; |
|
||||||
text-overflow: ellipsis; |
|
||||||
overflow: hidden; |
|
||||||
-webkit-box-orient:vertical; |
|
||||||
-webkit-line-clamp:2; |
|
||||||
} |
|
||||||
|
|
@ -1,58 +0,0 @@ |
|||||||
import {FC, useCallback, useEffect, useState} from "react"; |
|
||||||
import {Image, View} from "@tarojs/components"; |
|
||||||
import {brandApi, BrandRecord} from "@/api"; |
|
||||||
import styles from './list.module.scss' |
|
||||||
import Taro, {useReachBottom} from "@tarojs/taro"; |
|
||||||
import Empty from "@/components/empty/empty"; |
|
||||||
|
|
||||||
const BrandList: FC = () => { |
|
||||||
const [page, setPage] = useState(1) |
|
||||||
const [brands, setBrands] = useState<BrandRecord[]>([]) |
|
||||||
const [total, setTotal] = useState(0) |
|
||||||
|
|
||||||
useEffect(() => { |
|
||||||
getData() |
|
||||||
}, [page]) |
|
||||||
|
|
||||||
const getData = useCallback( async () => { |
|
||||||
try { |
|
||||||
const res = await brandApi.list(1, 10) |
|
||||||
setTotal(res.total) |
|
||||||
setBrands([ |
|
||||||
...res.data |
|
||||||
]) |
|
||||||
} catch (e) { |
|
||||||
} |
|
||||||
}, [page]) |
|
||||||
|
|
||||||
|
|
||||||
function jumpInfo(id: number) { |
|
||||||
Taro.navigateTo({url: `/pages/brand/info/info?id=${id}`}) |
|
||||||
} |
|
||||||
|
|
||||||
useReachBottom(useCallback(() => { |
|
||||||
if (brands?.length < total) { |
|
||||||
setPage(page + 1) |
|
||||||
} |
|
||||||
}, [total, brands])) |
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
return ( |
|
||||||
<View className='p-2'> |
|
||||||
{ |
|
||||||
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}/> |
|
||||||
<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> |
|
||||||
</View>) |
|
||||||
: <Empty name='空空如也'/> |
|
||||||
} |
|
||||||
</View> |
|
||||||
) |
|
||||||
} |
|
||||||
|
|
||||||
export default BrandList |
|
Loading…
Reference in new issue