76 lines
1.8 KiB
TypeScript
76 lines
1.8 KiB
TypeScript
import React, { useState } from 'react'
|
|
import { View, Text, Image } from '@tarojs/components'
|
|
import Taro from '@tarojs/taro'
|
|
import img from '@/config/images'
|
|
import './index.scss'
|
|
import PublishMenu from '../PublishMenu'
|
|
export type currentPageType = 'games' | 'message' | 'personal'
|
|
|
|
const GuideBar = (props) => {
|
|
const { currentPage } = props
|
|
|
|
const guideItems = [
|
|
{
|
|
code: 'list',
|
|
text: '球局',
|
|
},
|
|
{
|
|
code: 'message',
|
|
text: '消息',
|
|
},
|
|
{
|
|
code: 'personal',
|
|
text: '我的',
|
|
},
|
|
]
|
|
|
|
const handlePublish = () => {
|
|
Taro.navigateTo({
|
|
url: '/pages/publishBall/index',
|
|
})
|
|
}
|
|
|
|
const handlePageChange = (code: string) => {
|
|
if (code === currentPage) {
|
|
return
|
|
}
|
|
|
|
let url = `/pages/${code}/index`
|
|
if (code === 'personal') {
|
|
url = '/pages/userInfo/myself/index'
|
|
}
|
|
Taro.redirectTo({
|
|
url: url,
|
|
}).then(() => {
|
|
Taro.pageScrollTo({
|
|
scrollTop: 0,
|
|
duration: 300,
|
|
})
|
|
})
|
|
}
|
|
|
|
return (
|
|
<View className='guide-bar-container'>
|
|
<View className='guide-bar'>
|
|
{/* guide area on the left */}
|
|
<View className='guide-bar-pages'>
|
|
{guideItems.map((item) => (
|
|
<View
|
|
className={`guide-bar-pages-item ${currentPage === item.code ? 'guide-bar-pages-item-active' : ''}`}
|
|
onClick={() => handlePageChange(item.code)}
|
|
>
|
|
<Text>{item.text}</Text>
|
|
</View>
|
|
))}
|
|
</View>
|
|
{/* publish button on the right */}
|
|
{/* <View className='guide-bar-publish' onClick={handlePublish}>
|
|
<Image className='guide-bar-publish-icon' src={img.ICON_GUIDE_BAR_PUBLISH} />
|
|
</View> */}
|
|
<PublishMenu />
|
|
</View>
|
|
</View>
|
|
)
|
|
}
|
|
|
|
export default GuideBar |