赵忠林
1fa58040f3
- 新增地址类型定义，增强前端地址数据结构 - 新增地址编辑页面，支持地址智能识别和定位选点功能 - 地址编辑支持省市区选择及默认地址设置 - 新增地址列表页面，支持地址展示、删除、编辑和选择功能 - 实现售后申请页面，支持选择售后类型和退款原因 - 售后申请支持商品选择、退款金额计算和凭证上传 - 新增售后详情页面，支持售后状态展示及申请取消 - 优化页面加载和用户交互体验，增加错误提示和权限处理
111 lines
4.0 KiB
TypeScript
111 lines
4.0 KiB
TypeScript
import React, { useState, useEffect } from 'react'
|
||
import { View, Text, ScrollView, Button } from '@tarojs/components'
|
||
import Taro from '@tarojs/taro'
|
||
import { useUser } from '@/hooks/useUser'
|
||
import { useScrollHeight } from '@/hooks/useScrollHeight'
|
||
|
||
definePageConfig({
|
||
navigationBarTitleText: '分销推广',
|
||
})
|
||
|
||
const PromotionPage: React.FC = () => {
|
||
const { user, isLoggedIn } = useUser()
|
||
const [inviteCode, setInviteCode] = useState('')
|
||
const [inviteLink, setInviteLink] = useState('')
|
||
const scrollHeight = useScrollHeight(44)
|
||
|
||
|
||
useEffect(() => {
|
||
if (!isLoggedIn) {
|
||
Taro.navigateTo({ url: '/passport/login' })
|
||
return
|
||
}
|
||
// 生成邀请码和链接
|
||
const code = user?.id?.toString() || ''
|
||
setInviteCode(code)
|
||
setInviteLink(`https://shop-api.websoft.top/invite?ref=${code}`)
|
||
}, [isLoggedIn, user])
|
||
|
||
const handleCopyLink = () => {
|
||
Taro.setClipboardData({
|
||
data: inviteLink,
|
||
success: () => {
|
||
Taro.showToast({ title: '链接已复制', icon: 'success' })
|
||
},
|
||
})
|
||
}
|
||
|
||
const handleShare = () => {
|
||
Taro.showToast({ title: '请点击右上角分享', icon: 'none' })
|
||
}
|
||
|
||
if (!isLoggedIn) {
|
||
return null
|
||
}
|
||
|
||
return (
|
||
<View className='min-h-screen bg-gray-50'>
|
||
<ScrollView scrollY style={{ height: scrollHeight }}>
|
||
{/* 推广卡片 */}
|
||
<View className='mx-3 mt-3 p-4 rounded-xl' style={{ background: 'linear-gradient(135deg, #667eea 0%, #764ba2 100%)' }}>
|
||
<Text className='text-white text-lg font-bold mb-1 block'>我的推广链接</Text>
|
||
<Text className='text-white text-sm opacity-80 mb-3 block'>分享给好友，好友消费您可获得佣金</Text>
|
||
<View className='bg-white rounded-lg p-3'>
|
||
<Text className='text-xs text-gray-500 mb-1 block'>邀请码</Text>
|
||
<Text className='text-base font-bold text-gray-800'>{inviteCode}</Text>
|
||
</View>
|
||
</View>
|
||
|
||
{/* 推广链接 */}
|
||
<View className='mx-3 mt-3 p-4 bg-white rounded-lg'>
|
||
<Text className='text-sm font-medium text-gray-800 mb-2 block'>推广链接</Text>
|
||
<View className='bg-gray-50 rounded-lg p-3 mb-3'>
|
||
<Text className='text-xs text-gray-600 break-all'>{inviteLink}</Text>
|
||
</View>
|
||
<View className='grid grid-cols-2 gap-2'>
|
||
<Button
|
||
className='rounded-full'
|
||
style={{ backgroundColor: '#0e932e' }}
|
||
onClick={handleCopyLink}
|
||
>
|
||
复制链接
|
||
</Button>
|
||
<Button
|
||
className='rounded-full'
|
||
style={{ backgroundColor: '#1989fa' }}
|
||
onClick={handleShare}
|
||
>
|
||
分享好友
|
||
</Button>
|
||
</View>
|
||
</View>
|
||
|
||
{/* 推广说明 */}
|
||
<View className='mx-3 mt-3 p-4 bg-white rounded-lg'>
|
||
<Text className='text-sm font-medium text-gray-800 mb-3 block'>推广规则</Text>
|
||
<View className='flex items-start gap-2 mb-2'>
|
||
<Text className='text-green-500 mt-0'>1.</Text>
|
||
<Text className='text-sm text-gray-600 flex-1'>分享您的专属链接或邀请码给好友</Text>
|
||
</View>
|
||
<View className='flex items-start gap-2 mb-2'>
|
||
<Text className='text-green-500 mt-0'>2.</Text>
|
||
<Text className='text-sm text-gray-600 flex-1'>好友通过您的链接注册并成为会员</Text>
|
||
</View>
|
||
<View className='flex items-start gap-2 mb-2'>
|
||
<Text className='text-green-500 mt-0'>3.</Text>
|
||
<Text className='text-sm text-gray-600 flex-1'>好友在平台消费，您可获得相应佣金分成</Text>
|
||
</View>
|
||
<View className='flex items-start gap-2'>
|
||
<Text className='text-green-500 mt-0'>4.</Text>
|
||
<Text className='text-sm text-gray-600 flex-1'>佣金需在好友订单完成后再申请提现</Text>
|
||
</View>
|
||
</View>
|
||
|
||
<View className='h-6' />
|
||
</ScrollView>
|
||
</View>
|
||
)
|
||
}
|
||
|
||
export default PromotionPage
|