feat: get user detail info

This commit is contained in:
2025-09-04 20:17:02 +08:00
parent bc26732558
commit a81088615f
4 changed files with 137 additions and 89 deletions

View File

@@ -4,11 +4,11 @@ import { Cell, Avatar, Progress, Popover } from '@nutui/nutui-react-taro'
import Taro, { useRouter, useShareAppMessage, useShareTimeline, useDidShow } from '@tarojs/taro'
// 导入API服务
import DetailService from '../../services/detailService'
import { updateUserProfile } from '../../services/loginService'
import { updateUserProfile, get_user_info } from '../../services/loginService'
import { getCurrentLocation } from '../../utils/locationUtils'
import {
useUserStats,
useUserActions
useUserInfo,
useUserActions,
} from '../../store/userStore'
import img from '../../config/images'
import { getTextColorOnImage } from '../../utils'
@@ -25,6 +25,7 @@ function insertDotInTags(tags: string[]) {
return tags.join('-·-').split('-')
}
// 分享弹窗
const SharePopup = forwardRef(({ id, from }: { id: string, from: string }, ref) => {
const [visible, setVisible] = useState(false)
@@ -90,6 +91,39 @@ const SharePopup = forwardRef(({ id, from }: { id: string, from: string }, ref)
)
})
// 底部操作栏
function StickyButton(props) {
const { handleShare, handleJoinGame, detail } = props
const userInfo = useUserInfo()
const { id } = userInfo
const { publisher_id, status } = detail || {}
const role = Number(publisher_id) === id ? 'ownner' : 'visitor'
console.log(status, role)
return (
<View className="sticky-bottom-bar">
<View className="sticky-bottom-bar-share-and-comment">
<View className='sticky-bottom-bar-share' onClick={handleShare}>
<Image className='sticky-bottom-bar-share-icon' src={img.ICON_DETAIL_SHARE} />
<Text className='sticky-bottom-bar-share-text'></Text>
</View>
<View className='sticky-bottom-bar-share-and-comment-separator' />
<View className='sticky-bottom-bar-comment' onClick={() => { Taro.showToast({ title: 'To be continued', icon: 'none' }) }}>
<Image className='sticky-bottom-bar-comment-icon' src={img.ICON_DETAIL_COMMENT_DARK} />
<Text className='sticky-bottom-bar-comment-text'>32</Text>
</View>
</View>
<View className="sticky-bottom-bar-join-game" onClick={handleJoinGame}>
<Text>🎾</Text>
<Text></Text>
<View className='game-price'>
<Text>¥ 65</Text>
</View>
</View>
</View>
)
}
function Index() {
// 使用Zustand store
// const userStats = useUserStats()
@@ -99,7 +133,9 @@ function Index() {
// const [textColor, setTextColor] = useState<string []>([])
const [detail, setDetail] = useState<any>(null)
const { params } = useRouter()
const [currentLocation, setCurrentLocation] = useState([0, 0])
const { id, autoShare, from } = params
const { fetchUserInfo, updateUserInfo } = useUserActions()
console.log('from', from)
@@ -115,6 +151,7 @@ function Index() {
useDidShow(async () => {
await updateLocation()
await fetchUserInfo()
await fetchDetail()
// calcBgMainColors()
})
@@ -122,7 +159,8 @@ function Index() {
const updateLocation = async () => {
try {
const location = await getCurrentLocation()
await updateUserProfile({ latitude: location.latitude, longitude: location.longitude })
setCurrentLocation([location.latitude, location.longitude])
await updateUserInfo({ latitude: location.latitude, longitude: location.longitude })
console.log('用户位置更新成功')
} catch (error) {
console.error('用户位置更新失败', error)
@@ -130,7 +168,7 @@ function Index() {
}
const fetchDetail = async () => {
const res = await DetailService.getDetail(Number(id))
const res = await DetailService.getDetail(242/* Number(id) */)
if (res.code === 0) {
console.log(res.data)
setDetail(res.data)
@@ -156,8 +194,8 @@ function Index() {
const openMap = () => {
Taro.openLocation({
latitude: detail?.latitude, // 纬度(必填)
longitude: detail?.longitude, // 经度(必填)
latitude: detail?.longitude, // 纬度(必填)
longitude: detail?.latitude, // 经度(必填)
name: '上海体育场', // 位置名(可选)
address: '上海市徐汇区肇嘉浜路128号', // 地址详情(可选)
scale: 15, // 地图缩放级别1-28
@@ -188,6 +226,8 @@ function Index() {
const { title, longitude, latitude } = detail || {}
console.log(longitude, latitude, 2222)
const requirements = [{
title: 'NTRP水平要求',
desc: '2.0 - 4.5 之间',
@@ -245,6 +285,7 @@ function Index() {
},
]
console.log('detail', detail)
return (
<View className='detail-page'>
{/* custom navbar */}
@@ -376,15 +417,20 @@ function Index() {
</View>
{/* venue map */}
<View className='location-map'>
<Map
className='location-map-map'
longitude={longitude}
latitude={latitude}
onError={() => {}}
// hide business msg
showLocation
theme='dark'
/>
{longitude && latitude && (
<Map
className='location-map-map'
longitude={latitude}
latitude={longitude}
markers={[{ id: 1, latitude: longitude, longitude: latitude, iconPath: require('@/static/detail/icon-stark.svg'), width: 16, height: 16 }]}
includePoints={[{ latitude: longitude, longitude: latitude }, { latitude: currentLocation[0], longitude: currentLocation[1] }]}
includePadding={{ left: 50, right: 50, top: 50, bottom: 50 }}
onError={() => {}}
// hide business msg
showLocation
theme='dark'
/>
)}
</View>
</View>
</View>
@@ -565,26 +611,7 @@ function Index() {
</View>
</View>
{/* sticky bottom action bar */}
<View className="sticky-bottom-bar">
<View className="sticky-bottom-bar-share-and-comment">
<View className='sticky-bottom-bar-share' onClick={handleShare}>
<Image className='sticky-bottom-bar-share-icon' src={img.ICON_DETAIL_SHARE} />
<Text className='sticky-bottom-bar-share-text'></Text>
</View>
<View className='sticky-bottom-bar-share-and-comment-separator' />
<View className='sticky-bottom-bar-comment' onClick={() => { Taro.showToast({ title: 'To be continued', icon: 'none' }) }}>
<Image className='sticky-bottom-bar-comment-icon' src={img.ICON_DETAIL_COMMENT_DARK} />
<Text className='sticky-bottom-bar-comment-text'>32</Text>
</View>
</View>
<View className="sticky-bottom-bar-join-game" onClick={handleJoinGame}>
<Text>🎾</Text>
<Text></Text>
<View className='game-price'>
<Text>¥ 65</Text>
</View>
</View>
</View>
<StickyButton handleShare={handleShare} handleJoinGame={handleJoinGame} detail={detail} />
{/* share popup */}
<SharePopup ref={sharePopupRef} id={id as string} from={from as string} />
</View>