提交代码
This commit is contained in:
70
src/components/AddCartBar.tsx
Normal file
70
src/components/AddCartBar.tsx
Normal file
@@ -0,0 +1,70 @@
|
||||
import {Headphones, Share} from '@nutui/icons-react-taro'
|
||||
import navTo from "@/utils/common";
|
||||
import Taro, { getCurrentInstance } from '@tarojs/taro';
|
||||
import {getUserInfo} from "@/api/layout";
|
||||
import {useEffect, useState} from "react";
|
||||
import {getCmsArticle} from "@/api/cms/cmsArticle";
|
||||
import {CmsArticle} from "@/api/cms/cmsArticle/model";
|
||||
|
||||
function AddCartBar() {
|
||||
const { router } = getCurrentInstance();
|
||||
const [id, setId] = useState<number>()
|
||||
const [article, setArticle] = useState<CmsArticle>()
|
||||
const [IsLogin, setIsLogin] = useState<boolean>(false)
|
||||
const onPay = () => {
|
||||
if (!IsLogin) {
|
||||
Taro.showToast({title: `请先登录`, icon: 'error'})
|
||||
setTimeout(() => {
|
||||
Taro.switchTab(
|
||||
{
|
||||
url: '/pages/user/user',
|
||||
},
|
||||
)
|
||||
}, 1000)
|
||||
return false;
|
||||
}
|
||||
if (article?.model == 'bm') {
|
||||
navTo('/bszx/bm/bm?id=' + id)
|
||||
}
|
||||
if (article?.model == 'pay') {
|
||||
navTo('/bszx/pay/pay?id=' + id)
|
||||
}
|
||||
}
|
||||
const reload = (id) => {
|
||||
getCmsArticle(id).then(data => {
|
||||
setArticle(data)
|
||||
})
|
||||
getUserInfo().then((data) => {
|
||||
if (data) {
|
||||
setIsLogin(true);
|
||||
Taro.setStorageSync('UserId', data.userId)
|
||||
}
|
||||
}).catch(() => {
|
||||
console.log('未登录')
|
||||
});
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
const id = router?.params.id as number | undefined;
|
||||
setId(id)
|
||||
reload(id);
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<div className={'flex justify-between items-center w-full fixed bottom-0 bg-gray-100 pb-5'}>
|
||||
<div className={'btn flex px-5 items-center gap-4'}>
|
||||
<button className={'item px-4 py-1 bg-white flex items-center gap-2 text-nowrap whitespace-nowrap'} open-type="contact">
|
||||
<Headphones size={16}/>咨询
|
||||
</button>
|
||||
<button className={'item px-4 py-1 bg-white flex items-center gap-2 text-nowrap whitespace-nowrap'} open-type="share"><Share
|
||||
size={16}/>分享
|
||||
</button>
|
||||
</div>
|
||||
<div className={'bg-red-500 py-3 px-10 text-white'} style={{ whiteSpace: 'nowrap'}}
|
||||
onClick={onPay}>{article?.model == 'pay' ? '我要捐款' : '我要报名'}</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
// 监听页面分享事件
|
||||
export default AddCartBar
|
||||
6
src/components/Gap.tsx
Normal file
6
src/components/Gap.tsx
Normal file
@@ -0,0 +1,6 @@
|
||||
function MyGap({height}){
|
||||
return (
|
||||
<div style={{height}} className={'bg-gray-100'}></div>
|
||||
)
|
||||
}
|
||||
export default MyGap;
|
||||
162
src/components/GoodsList.tsx
Normal file
162
src/components/GoodsList.tsx
Normal file
@@ -0,0 +1,162 @@
|
||||
import {Avatar, Cell, Space, Tabs, Button, TabPane, Swiper} from '@nutui/nutui-react-taro'
|
||||
import {useEffect, useState, CSSProperties, useRef} from "react";
|
||||
import {BszxPay} from "@/api/bszx/bszxPay/model";
|
||||
import {InfiniteLoading} from '@nutui/nutui-react-taro'
|
||||
import dayjs from "dayjs";
|
||||
import {pageShopOrder} from "@/api/shop/shopOrder";
|
||||
import {ShopOrder} from "@/api/shop/shopOrder/model";
|
||||
import {copyText} from "@/utils/common";
|
||||
|
||||
const InfiniteUlStyle: CSSProperties = {
|
||||
marginTop: '84px',
|
||||
height: '82vh',
|
||||
width: '100%',
|
||||
padding: '0',
|
||||
overflowY: 'auto',
|
||||
overflowX: 'hidden',
|
||||
}
|
||||
const tabs = [
|
||||
{
|
||||
index: 0,
|
||||
key: '全部',
|
||||
title: '全部'
|
||||
},
|
||||
{
|
||||
index: 1,
|
||||
key: '已上架',
|
||||
title: '已上架'
|
||||
},
|
||||
{
|
||||
index: 2,
|
||||
key: '已下架',
|
||||
title: '已下架'
|
||||
},
|
||||
{
|
||||
index: 3,
|
||||
key: '已售罄',
|
||||
title: '已售罄'
|
||||
},
|
||||
{
|
||||
index: 4,
|
||||
key: '警戒库存',
|
||||
title: '警戒库存'
|
||||
},
|
||||
{
|
||||
index: 5,
|
||||
key: '回收站',
|
||||
title: '回收站'
|
||||
},
|
||||
]
|
||||
|
||||
function GoodsList(props: any) {
|
||||
const [list, setList] = useState<ShopOrder[]>([])
|
||||
const [page, setPage] = useState(1)
|
||||
const [hasMore, setHasMore] = useState(true)
|
||||
const swiperRef = useRef<React.ElementRef<typeof Swiper> | null>(null)
|
||||
const [tabIndex, setTabIndex] = useState<string | number>(0)
|
||||
|
||||
console.log(props.statusBarHeight, 'ppp')
|
||||
const reload = async () => {
|
||||
pageShopOrder({page}).then(res => {
|
||||
let newList: BszxPay[] | undefined = []
|
||||
if (res?.list && res?.list.length > 0) {
|
||||
newList = list?.concat(res.list)
|
||||
setHasMore(true)
|
||||
} else {
|
||||
newList = res?.list
|
||||
setHasMore(false)
|
||||
}
|
||||
setList(newList || []);
|
||||
})
|
||||
}
|
||||
|
||||
const reloadMore = async () => {
|
||||
setPage(page + 1)
|
||||
reload();
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
setPage(2)
|
||||
reload()
|
||||
}, [])
|
||||
|
||||
return (
|
||||
<>
|
||||
<Tabs
|
||||
align={'left'}
|
||||
className={'fixed left-0'}
|
||||
style={{ top: '84px'}}
|
||||
value={tabIndex}
|
||||
onChange={(page) => {
|
||||
swiperRef.current?.to(page)
|
||||
setTabIndex(page)
|
||||
}}
|
||||
>
|
||||
{
|
||||
tabs?.map((item, index) => {
|
||||
return <TabPane key={index} title={item.title}></TabPane>
|
||||
})
|
||||
}
|
||||
</Tabs>
|
||||
<div style={InfiniteUlStyle} id="scroll">
|
||||
<InfiniteLoading
|
||||
target="scroll"
|
||||
hasMore={hasMore}
|
||||
onLoadMore={reloadMore}
|
||||
onScroll={() => {
|
||||
|
||||
}}
|
||||
onScrollToUpper={() => {
|
||||
|
||||
}}
|
||||
loadingText={
|
||||
<>
|
||||
加载中
|
||||
</>
|
||||
}
|
||||
loadMoreText={
|
||||
<>
|
||||
没有更多了
|
||||
</>
|
||||
}
|
||||
>
|
||||
{list?.map(item => {
|
||||
return (
|
||||
<Cell style={{padding: '16px'}}>
|
||||
<Space direction={'vertical'} className={'w-full flex flex-col'}>
|
||||
<div className={'order-no flex justify-between'}>
|
||||
<span className={'text-gray-700 font-bold text-sm'}
|
||||
onClick={() => copyText(`${item.orderNo}`)}>{item.orderNo}</span>
|
||||
<span className={'text-orange-500'}>待付款</span>
|
||||
</div>
|
||||
<div
|
||||
className={'create-time text-gray-400 text-xs'}>{dayjs(item.createTime).format('YYYY年MM月DD日 HH:mm:ss')}</div>
|
||||
<div className={'goods-info'}>
|
||||
<div className={'flex items-center'}>
|
||||
<div className={'flex items-center'}>
|
||||
<Avatar
|
||||
src='34'
|
||||
size={'45'}
|
||||
shape={'square'}
|
||||
/>
|
||||
<div className={'ml-2'}>{item.realName}</div>
|
||||
</div>
|
||||
<div className={'text-gray-400 text-xs'}>{item.totalNum}件商品</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className={' w-full text-right'}>实付金额：￥{item.payPrice}</div>
|
||||
<Space className={'btn flex justify-end'}>
|
||||
<Button size={'small'}>取消订单</Button>
|
||||
<Button size={'small'}>发货</Button>
|
||||
</Space>
|
||||
</Space>
|
||||
</Cell>
|
||||
)
|
||||
})}
|
||||
</InfiniteLoading>
|
||||
</div>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
export default GoodsList
|
||||
31
src/components/Header.tsx
Normal file
31
src/components/Header.tsx
Normal file
@@ -0,0 +1,31 @@
|
||||
import {NavBar} from '@nutui/nutui-react-taro'
|
||||
import {ArrowLeft} from '@nutui/icons-react-taro'
|
||||
import Taro from '@tarojs/taro'
|
||||
|
||||
function Header(props) {
|
||||
return (
|
||||
<>
|
||||
<NavBar
|
||||
style={{
|
||||
background: 'url(https://oss.wsdns.cn/20250413/defb52abb1414429930ae2727d2b8ff6.png)',
|
||||
backgroundSize: 'cover',
|
||||
color: '#fff',
|
||||
}}
|
||||
onBackClick={() => {
|
||||
}}
|
||||
back={
|
||||
<>
|
||||
<div className={'flex items-center'} onClick={() => Taro.navigateBack()}>
|
||||
<ArrowLeft size={14}/>
|
||||
返回
|
||||
</div>
|
||||
</>
|
||||
}
|
||||
>
|
||||
<span className={'text-white'}>{props?.title || '标题'}</span>
|
||||
</NavBar>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
export default Header;
|
||||
156
src/components/OrderList.tsx
Normal file
156
src/components/OrderList.tsx
Normal file
@@ -0,0 +1,156 @@
|
||||
import {Avatar, Cell, Space, Tabs, Button, TabPane} from '@nutui/nutui-react-taro'
|
||||
import {useEffect, useState, CSSProperties} from "react";
|
||||
import {BszxPay} from "@/api/bszx/bszxPay/model";
|
||||
import {InfiniteLoading} from '@nutui/nutui-react-taro'
|
||||
import dayjs from "dayjs";
|
||||
import {pageShopOrder} from "@/api/shop/shopOrder";
|
||||
import {ShopOrder} from "@/api/shop/shopOrder/model";
|
||||
import {copyText} from "@/utils/common";
|
||||
|
||||
const InfiniteUlStyle: CSSProperties = {
|
||||
marginTop: '84px',
|
||||
height: '82vh',
|
||||
width: '100%',
|
||||
padding: '0',
|
||||
overflowY: 'auto',
|
||||
overflowX: 'hidden',
|
||||
}
|
||||
const tabs = [
|
||||
{
|
||||
index: 0,
|
||||
key: '全部',
|
||||
title: '全部'
|
||||
},
|
||||
{
|
||||
index: 1,
|
||||
key: '待付款',
|
||||
title: '待付款'
|
||||
},
|
||||
{
|
||||
index: 2,
|
||||
key: '待发货',
|
||||
title: '待发货'
|
||||
},
|
||||
{
|
||||
index: 3,
|
||||
key: '已收货',
|
||||
title: '已收货'
|
||||
},
|
||||
{
|
||||
index: 4,
|
||||
key: '已完成',
|
||||
title: '已完成'
|
||||
}
|
||||
]
|
||||
|
||||
function OrderList(props: any) {
|
||||
const [list, setList] = useState<ShopOrder[]>([])
|
||||
const [page, setPage] = useState(1)
|
||||
const [hasMore, setHasMore] = useState(true)
|
||||
const [tapIndex, setTapIndex] = useState<string | number>('0')
|
||||
|
||||
console.log(props.statusBarHeight, 'ppp')
|
||||
const reload = async () => {
|
||||
pageShopOrder({page}).then(res => {
|
||||
let newList: BszxPay[] | undefined = []
|
||||
if (res?.list && res?.list.length > 0) {
|
||||
newList = list?.concat(res.list)
|
||||
setHasMore(true)
|
||||
} else {
|
||||
newList = res?.list
|
||||
setHasMore(false)
|
||||
}
|
||||
setList(newList || []);
|
||||
})
|
||||
}
|
||||
|
||||
const reloadMore = async () => {
|
||||
setPage(page + 1)
|
||||
reload();
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
setPage(2)
|
||||
reload()
|
||||
}, [])
|
||||
|
||||
return (
|
||||
<>
|
||||
<Tabs
|
||||
align={'left'}
|
||||
className={'fixed left-0'}
|
||||
style={{ top: '84px'}}
|
||||
tabStyle={{ backgroundColor: 'transparent'}}
|
||||
value={tapIndex}
|
||||
onChange={(paneKey) => {
|
||||
setTapIndex(paneKey)
|
||||
}}
|
||||
>
|
||||
{
|
||||
tabs?.map((item, index) => {
|
||||
return <TabPane key={index} title={item.title}></TabPane>
|
||||
})
|
||||
}
|
||||
</Tabs>
|
||||
<div style={InfiniteUlStyle} id="scroll">
|
||||
<InfiniteLoading
|
||||
target="scroll"
|
||||
hasMore={hasMore}
|
||||
onLoadMore={reloadMore}
|
||||
onScroll={() => {
|
||||
|
||||
}}
|
||||
onScrollToUpper={() => {
|
||||
|
||||
}}
|
||||
loadingText={
|
||||
<>
|
||||
加载中
|
||||
</>
|
||||
}
|
||||
loadMoreText={
|
||||
<>
|
||||
没有更多了
|
||||
</>
|
||||
}
|
||||
>
|
||||
{list?.map(item => {
|
||||
return (
|
||||
<Cell style={{padding: '16px'}}>
|
||||
<Space direction={'vertical'} className={'w-full flex flex-col'}>
|
||||
<div className={'order-no flex justify-between'}>
|
||||
<span className={'text-gray-700 font-bold text-sm'}
|
||||
onClick={() => copyText(`${item.orderNo}`)}>{item.orderNo}</span>
|
||||
<span className={'text-orange-500'}>待付款</span>
|
||||
</div>
|
||||
<div
|
||||
className={'create-time text-gray-400 text-xs'}>{dayjs(item.createTime).format('YYYY年MM月DD日 HH:mm:ss')}</div>
|
||||
<div className={'goods-info'}>
|
||||
<div className={'flex items-center'}>
|
||||
<div className={'flex items-center'}>
|
||||
<Avatar
|
||||
src='34'
|
||||
size={'45'}
|
||||
shape={'square'}
|
||||
/>
|
||||
<div className={'ml-2'}>{item.realName}</div>
|
||||
</div>
|
||||
<div className={'text-gray-400 text-xs'}>{item.totalNum}件商品</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className={' w-full text-right'}>实付金额：￥{item.payPrice}</div>
|
||||
<Space className={'btn flex justify-end'}>
|
||||
<Button size={'small'}>取消订单</Button>
|
||||
<Button size={'small'}>发货</Button>
|
||||
</Space>
|
||||
</Space>
|
||||
</Cell>
|
||||
)
|
||||
})}
|
||||
</InfiniteLoading>
|
||||
</div>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
export default OrderList
|
||||
118
src/components/PayRecord.tsx
Normal file
118
src/components/PayRecord.tsx
Normal file
@@ -0,0 +1,118 @@
|
||||
import {Avatar, Cell, Space} from '@nutui/nutui-react-taro'
|
||||
import {useEffect, useState, CSSProperties} from "react";
|
||||
import {BszxPay} from "@/api/bszx/bszxPay/model";
|
||||
import {getCount, pageBszxPay} from "@/api/bszx/bszxPay";
|
||||
import {InfiniteLoading} from '@nutui/nutui-react-taro'
|
||||
import dayjs from "dayjs";
|
||||
|
||||
const InfiniteUlStyle: CSSProperties = {
|
||||
height: '70vh',
|
||||
width: '100%',
|
||||
padding: '0',
|
||||
overflowY: 'auto',
|
||||
overflowX: 'hidden',
|
||||
}
|
||||
function PayRecord() {
|
||||
const [list, setList] = useState<BszxPay[]>([])
|
||||
const [page, setPage] = useState(1)
|
||||
const [hasMore, setHasMore] = useState(true)
|
||||
const [totalMoney, setTotalMoney] = useState()
|
||||
const [numbers, setNumbers] = useState()
|
||||
const reload = async () => {
|
||||
pageBszxPay({page}).then(res => {
|
||||
let newList: BszxPay[] | undefined = []
|
||||
if (res?.list && res?.list.length > 0) {
|
||||
newList = list?.concat(res.list)
|
||||
setHasMore(true)
|
||||
} else {
|
||||
newList = res?.list
|
||||
setHasMore(false)
|
||||
}
|
||||
setList(newList || []);
|
||||
})
|
||||
getCount().then(res => {
|
||||
setNumbers(res.numbers);
|
||||
setTotalMoney(res.totalMoney);
|
||||
})
|
||||
}
|
||||
|
||||
const reloadMore = async () => {
|
||||
setPage(page + 1)
|
||||
reload();
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
setPage(2)
|
||||
reload()
|
||||
}, [])
|
||||
|
||||
return (
|
||||
<div className={'px-2'}>
|
||||
<Cell>
|
||||
<div className={'flex w-full text-center justify-around'}>
|
||||
<div className={'item py-1'}>
|
||||
<span className={'text-gray-400'}>已筹资金(元)</span>
|
||||
<span className={'text-xl py-1 font-bold'}>￥{totalMoney}元</span>
|
||||
</div>
|
||||
<div className={'item py-1'}>
|
||||
<span className={'text-gray-400'}>爱心人次</span>
|
||||
<span className={'text-xl py-1 font-bold'}>{numbers}次</span>
|
||||
</div>
|
||||
</div>
|
||||
</Cell>
|
||||
<Cell>
|
||||
<ul style={InfiniteUlStyle} id="scroll">
|
||||
<InfiniteLoading
|
||||
target="scroll"
|
||||
hasMore={hasMore}
|
||||
onLoadMore={reloadMore}
|
||||
onScroll={() => {
|
||||
console.log('onScroll')
|
||||
}}
|
||||
onScrollToUpper={() => {
|
||||
console.log('onScrollToUpper')
|
||||
}}
|
||||
loadingText={
|
||||
<>
|
||||
加载中
|
||||
</>
|
||||
}
|
||||
loadMoreText={
|
||||
<>
|
||||
没有更多了
|
||||
</>
|
||||
}
|
||||
>
|
||||
{list?.map(item => {
|
||||
return (
|
||||
<Cell style={{padding: '0'}}>
|
||||
<div className={'flex w-full justify-between items-center'}>
|
||||
<div className={'flex'}>
|
||||
<Space>
|
||||
<Avatar
|
||||
src={item.avatar}
|
||||
/>
|
||||
<div className={'flex flex-col'}>
|
||||
<div className={'real-name text-lg'}>
|
||||
{item.name || '匿名'}
|
||||
</div>
|
||||
<div style={{maxWidth: '240px'}} className={'text-gray-400'}>{item.formName}，{dayjs(item.createTime).format('YYYY-MM-DD HH:mm')}</div>
|
||||
<div className={'text-green-600 my-1'}>心愿：{item.comments}</div>
|
||||
</div>
|
||||
</Space>
|
||||
</div>
|
||||
<div className={'price text-red-500 text-xl font-bold'}>
|
||||
￥{item.price}
|
||||
</div>
|
||||
</div>
|
||||
</Cell>
|
||||
)
|
||||
})}
|
||||
</InfiniteLoading>
|
||||
</ul>
|
||||
</Cell>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default PayRecord
|
||||
42
src/components/Questions.tsx
Normal file
42
src/components/Questions.tsx
Normal file
@@ -0,0 +1,42 @@
|
||||
import {useEffect, useState} from "react";
|
||||
import {pageHjmQuestions} from "@/api/hjm/hjmQuestions";
|
||||
import {HjmQuestions} from "@/api/hjm/hjmQuestions/model";
|
||||
|
||||
/**
|
||||
* 文章终极列表
|
||||
* @constructor
|
||||
*/
|
||||
const Questions = () => {
|
||||
const [list, setList] = useState<HjmQuestions[]>([])
|
||||
|
||||
const reload = () => {
|
||||
pageHjmQuestions({}).then(res => {
|
||||
if (res?.list) {
|
||||
setList(res?.list)
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
reload()
|
||||
}, [])
|
||||
|
||||
return (
|
||||
<div className={'px-3 mb-10'}>
|
||||
<div className={'flex flex-col justify-between items-center bg-white rounded-lg p-4'}>
|
||||
<div className={'bg-white w-full'}>
|
||||
{
|
||||
list.map((item, index) => {
|
||||
return (
|
||||
<div key={index} className={'flex justify-between items-center py-2'}>
|
||||
<div className={'text-sm'}>{item.question}</div>
|
||||
</div>
|
||||
)
|
||||
})
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
export default Questions
|
||||
28
src/components/TabBar.tsx
Normal file
28
src/components/TabBar.tsx
Normal file
@@ -0,0 +1,28 @@
|
||||
import { Tabbar } from '@nutui/nutui-react-taro'
|
||||
import { Home, User } from '@nutui/icons-react-taro'
|
||||
import Taro from '@tarojs/taro'
|
||||
|
||||
function TabBar(){
|
||||
return (
|
||||
<Tabbar
|
||||
fixed
|
||||
onSwitch={(index) => {
|
||||
console.log(index)
|
||||
if(index == 0){
|
||||
Taro.switchTab({ url: '/pages/index/index' })
|
||||
}
|
||||
// if(index == 1){
|
||||
// Taro.navigateTo({ url: '/pages/detail/detail' })
|
||||
// }
|
||||
if(index == 1){
|
||||
Taro.switchTab({ url: '/pages/user/user' })
|
||||
}
|
||||
}}
|
||||
>
|
||||
<Tabbar.Item title="首页" icon={<Home size={18} />} />
|
||||
{/*<Tabbar.Item title="分类" icon={<Date size={18} />} />*/}
|
||||
<Tabbar.Item title="我的" icon={<User size={18} />} />
|
||||
</Tabbar>
|
||||
)
|
||||
}
|
||||
export default TabBar;
|
||||
Reference in New Issue
Block a user