comi-logic/expo-popcore-app
7
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix: bug

Browse Source
This commit is contained in:
imeepos
2026-01-28 17:30:01 +08:00
parent 0399bba83f
commit d6cc74ab00
11 changed files with 439 additions and 375 deletions
Download Patch File Download Diff File Expand all files Collapse all files

332
app/(tabs)/my.tsx
View File

@@ -21,11 +21,12 @@ import { PointsIcon, SearchIcon, SettingsIcon } from '@/components/icon'
import EditProfileDrawer from '@/components/drawer/EditProfileDrawer'
import Dropdown from '@/components/ui/dropdown'
import Toast from '@/components/ui/Toast'
import { signOut , useSession } from '@/lib/auth'
import { signOut, useSession } from '@/lib/auth'
import { useTemplateGenerations, type TemplateGeneration } from '@/hooks'
import { MySkeleton } from '@/components/skeleton/MySkeleton'
import { useUserBalance } from '@/hooks/use-user-balance'
import { KeyboardAwareScrollView } from 'react-native-keyboard-controller'
const { width: screenWidth } = Dimensions.get('window')
const GALLERY_GAP = 2
@@ -173,7 +174,7 @@ export default function My() {
return t('my.languageSwitchEn')
}
}
const settingsOptions = [
{ label: t('my.changePassword'), value: 'changePassword' },
{ label: getLanguageLabel(), value: 'language' },
@@ -182,168 +183,175 @@ export default function My() {
return (
<SafeAreaView style={styles.container} edges={['top', 'bottom']}>
<StatusBar style="light" />
<RNStatusBar barStyle="light-content" />
{/* 顶部积分与设置 */}
<View style={styles.topBar}>
<Pressable
style={styles.pointsPill}
onPress={() => router.push('/membership' as any)}
>
<PointsIcon />
<Text style={styles.pointsPillText}>{balance}</Text>
</Pressable>
<Dropdown
options={settingsOptions}
onSelect={(value) => handleSettingsSelect(value)}
renderTrigger={(selectedOption, isOpen, toggle) => (
<Pressable onPress={toggle}>
<SettingsIcon />
</Pressable>
)}
dropdownStyle={{
minWidth: 160,
right: 10,
backgroundColor: '#2A2A2A80',
<KeyboardAwareScrollView bottomOffset={50}>
<StatusBar style="light" />
<RNStatusBar barStyle="light-content" />
{/* 顶部积分与设置 */}
<View style={styles.topBar}>
<Pressable
style={styles.pointsPill}
onPress={() => router.push('/membership' as any)}
>
<PointsIcon />
<Text style={styles.pointsPillText}>{balance}</Text>
</Pressable>
<Dropdown
options={settingsOptions}
onSelect={(value) => handleSettingsSelect(value)}
renderTrigger={(selectedOption, isOpen, toggle) => (
<Pressable onPress={toggle}>
<SettingsIcon />
</Pressable>
)}
dropdownStyle={{
minWidth: 160,
right: 10,
backgroundColor: '#2A2A2A80',
}}
/>
</View>
{/* 个人信息区 */}
<View style={styles.profileSection}>
<Image
source={session?.user?.image ? { uri: session.user.image } : require('@/assets/images/icon.png')}
style={styles.avatar}
contentFit="cover"
/>
<View style={styles.profileInfo}>
<Text style={styles.profileName}>{profileName}</Text>
<Text style={styles.profileSubTitle}>ID {session?.user?.id?.slice(0, 8) || '--------'}</Text>
</View>
<Pressable
style={styles.editButton}
onPress={() => {
console.log('[my.tsx] Edit Profile button pressed')
setEditDrawerVisible(true)
}}
>
<Text style={styles.editButtonText}>{t('my.editProfile')}</Text>
</Pressable>
</View>
{/* "生成作品" 标题行 */}
<View style={styles.sectionHeader}>
<Text style={styles.sectionTitle}>{t('my.generatedWorks')}</Text>
<Pressable
style={styles.sectionMoreButton}
onPress={() => router.push('/worksList' as any)}
>
<SearchIcon />
</Pressable>
</View>
{/* 作品九宫格 */}
{loading ? (
<MySkeleton />
) : (
<ScrollView
testID="my-scroll-view"
style={styles.scrollView}
contentContainerStyle={styles.scrollContent}
showsVerticalScrollIndicator={false}
onScroll={handleScroll}
scrollEventThrottle={16}
refreshControl={
<RefreshControl
refreshing={refreshing}
onRefresh={onRefresh}
tintColor="#9966FF"
colors={['#9966FF', '#FF6699', '#FF9966']}
progressBackgroundColor="#1C1E22"
progressViewOffset={10}
/>
}
>
<View style={styles.galleryGrid}>
{generations.map((item, index) => (
<Pressable
key={item.id}
style={[
styles.galleryItem,
index % 3 !== 2 && styles.galleryItemMarginRight,
styles.galleryItemMarginBottom,
]}
onPress={() => {
if (item.status === 'completed') {
router.push({
pathname: '/generationRecord' as any,
params: { id: item.id },
})
}
}}
disabled={item.status !== 'completed'}
>
<Image
source={getCoverUrl(item) ? { uri: getCoverUrl(item) } : require('@/assets/images/membership.png')}
style={styles.galleryImage}
contentFit="cover"
/>
{/* 遮罩：非完成状态 */}
{item.status !== 'completed' && (
<View style={styles.generatingOverlay} />
)}
{/* 数量角标：已完成且有结果 */}
{item.status === 'completed' && (item.resultUrl?.length || 0) > 0 && (
<View style={styles.counterBadge}>
<Text style={styles.counterText}>
{item.resultUrl?.length || 1}
</Text>
</View>
)}
{/* 状态角标 */}
{item.status === 'running' && (
<View style={styles.generatingBadge}>
<Text style={styles.generatingBadgeText}>{t('my.generating')}</Text>
</View>
)}
{item.status === 'pending' && (
<View style={styles.generatingBadge}>
<Text style={styles.generatingBadgeText}>{t('my.queuing')}</Text>
</View>
)}
</Pressable>
))}
{/* 加载更多指示器 */}
{loadingMore && (
<View style={styles.loadingMoreContainer}>
<ActivityIndicator size="small" color="#9966FF" />
</View>
)}
{/* 空状态提示 */}
{!loading && generations.length === 0 && (
<View style={styles.emptyState}>
<Text style={styles.emptyStateText}>
{t('my.noWorks')}
</Text>
</View>
)}
</View>
</ScrollView>
)}
{/* 编辑资料抽屉 */}
<EditProfileDrawer
visible={editDrawerVisible}
onClose={() => setEditDrawerVisible(false)}
initialName={profileName}
initialAvatar={session?.user?.image}
onSave={(data) => {
setProfileName(data.name)
}}
/>
</View>
{/* 个人信息区 */}
<View style={styles.profileSection}>
<Image
source={session?.user?.image ? { uri: session.user.image } : require('@/assets/images/icon.png')}
style={styles.avatar}
contentFit="cover"
/>
<View style={styles.profileInfo}>
<Text style={styles.profileName}>{profileName}</Text>
<Text style={styles.profileSubTitle}>ID {session?.user?.id?.slice(0, 8) || '--------'}</Text>
</View>
<Pressable
style={styles.editButton}
onPress={() => setEditDrawerVisible(true)}
>
<Text style={styles.editButtonText}>{t('my.editProfile')}</Text>
</Pressable>
</View>
{/* "生成作品" 标题行 */}
<View style={styles.sectionHeader}>
<Text style={styles.sectionTitle}>{t('my.generatedWorks')}</Text>
<Pressable
style={styles.sectionMoreButton}
onPress={() => router.push('/worksList' as any)}
>
<SearchIcon />
</Pressable>
</View>
{/* 作品九宫格 */}
{loading ? (
<MySkeleton />
) : (
<ScrollView
testID="my-scroll-view"
style={styles.scrollView}
contentContainerStyle={styles.scrollContent}
showsVerticalScrollIndicator={false}
onScroll={handleScroll}
scrollEventThrottle={16}
refreshControl={
<RefreshControl
refreshing={refreshing}
onRefresh={onRefresh}
tintColor="#9966FF"
colors={['#9966FF', '#FF6699', '#FF9966']}
progressBackgroundColor="#1C1E22"
progressViewOffset={10}
/>
}
>
<View style={styles.galleryGrid}>
{generations.map((item, index) => (
<Pressable
key={item.id}
style={[
styles.galleryItem,
index % 3 !== 2 && styles.galleryItemMarginRight,
styles.galleryItemMarginBottom,
]}
onPress={() => {
if (item.status === 'completed') {
router.push({
pathname: '/generationRecord' as any,
params: { id: item.id },
})
}
}}
disabled={item.status !== 'completed'}
>
<Image
source={getCoverUrl(item) ? { uri: getCoverUrl(item) } : require('@/assets/images/membership.png')}
style={styles.galleryImage}
contentFit="cover"
/>
{/* 遮罩：非完成状态 */}
{item.status !== 'completed' && (
<View style={styles.generatingOverlay} />
)}
{/* 数量角标：已完成且有结果 */}
{item.status === 'completed' && (item.resultUrl?.length || 0) > 0 && (
<View style={styles.counterBadge}>
<Text style={styles.counterText}>
{item.resultUrl?.length || 1}
</Text>
</View>
)}
{/* 状态角标 */}
{item.status === 'running' && (
<View style={styles.generatingBadge}>
<Text style={styles.generatingBadgeText}>{t('my.generating')}</Text>
</View>
)}
{item.status === 'pending' && (
<View style={styles.generatingBadge}>
<Text style={styles.generatingBadgeText}>{t('my.queuing')}</Text>
</View>
)}
</Pressable>
))}
{/* 加载更多指示器 */}
{loadingMore && (
<View style={styles.loadingMoreContainer}>
<ActivityIndicator size="small" color="#9966FF" />
</View>
)}
{/* 空状态提示 */}
{!loading && generations.length === 0 && (
<View style={styles.emptyState}>
<Text style={styles.emptyStateText}>
{t('my.noWorks')}
</Text>
</View>
)}
</View>
</ScrollView>
)}
{/* 编辑资料抽屉 */}
<EditProfileDrawer
visible={editDrawerVisible}
onClose={() => setEditDrawerVisible(false)}
initialName={profileName}
initialAvatar={session?.user?.image}
onSave={(data) => {
setProfileName(data.name)
}}
/>
</KeyboardAwareScrollView>
</SafeAreaView>
)
}

22
app/auth.tsx
View File

@@ -4,6 +4,7 @@ import { StatusBar } from 'expo-status-bar'
import { SafeAreaView } from 'react-native-safe-area-context'
import { useRouter } from 'expo-router'
import { LinearGradient } from 'expo-linear-gradient'
import { KeyboardAwareScrollView } from 'react-native-keyboard-controller'
import { AuthForm } from '@/components/blocks/AuthForm'
import { useSession } from '@/lib/auth'
@@ -48,9 +49,15 @@ export default function Auth() {
<StatusBar style="light" />
<RNStatusBar barStyle="light-content" />
<View style={styles.content}>
<AuthForm onSuccess={handleSuccess} />
</View>
<KeyboardAwareScrollView
style={styles.scrollView}
contentContainerStyle={styles.scrollContent}
bottomOffset={50}
>
<View style={styles.content}>
<AuthForm onSuccess={handleSuccess} />
</View>
</KeyboardAwareScrollView>
</SafeAreaView>
</LinearGradient>
)
@@ -66,10 +73,17 @@ const styles = StyleSheet.create({
flex: 1,
backgroundColor: 'transparent',
},
content: {
scrollView: {
flex: 1,
},
scrollContent: {
flexGrow: 1,
justifyContent: 'center',
alignItems: 'center',
paddingHorizontal: 20,
},
content: {
width: '100%',
alignItems: 'center',
},
})

9
app/changePassword.tsx
View File

@@ -3,7 +3,6 @@ import {
View,
Text,
StyleSheet,
ScrollView,
Pressable,
Platform,
TextInput,
@@ -14,6 +13,7 @@ import { SafeAreaView } from 'react-native-safe-area-context'
import { useRouter } from 'expo-router'
import { StatusBar as RNStatusBar } from 'react-native'
import { useTranslation } from 'react-i18next'
import { KeyboardAwareScrollView } from 'react-native-keyboard-controller'
import { LeftArrowIcon } from '@/components/icon'
import { LinearGradient } from 'expo-linear-gradient'
import { useChangePassword } from '@/hooks/use-change-password'
@@ -140,11 +140,10 @@ export default function ChangePasswordScreen() {
<Text style={styles.headerTitle}>{t('changePassword.title')}</Text>
<View style={styles.headerSpacer} />
</View>
<ScrollView
<KeyboardAwareScrollView
style={styles.scrollView}
contentContainerStyle={styles.scrollContent}
showsVerticalScrollIndicator={false}
keyboardShouldPersistTaps="handled"
bottomOffset={50}
>
<View style={styles.form}>
<View style={styles.inputGroup}>
@@ -257,7 +256,7 @@ export default function ChangePasswordScreen() {
</LinearGradient>
</Pressable>
</View>
</ScrollView>
</KeyboardAwareScrollView>
</SafeAreaView>
)
}

125
app/generateVideo.tsx
View File

@@ -8,13 +8,13 @@ import {
Pressable,
StatusBar as RNStatusBar,
Platform,
KeyboardAvoidingView,
} from 'react-native'
import { StatusBar } from 'expo-status-bar'
import { SafeAreaView } from 'react-native-safe-area-context'
import { Image } from 'expo-image'
import { useRouter, useLocalSearchParams } from 'expo-router'
import { useTranslation } from 'react-i18next'
import { KeyboardAwareScrollView } from 'react-native-keyboard-controller'
import { LeftArrowIcon, WhitePointsIcon } from '@/components/icon'
import UploadReferenceImageDrawer from '@/components/drawer/UploadReferenceImageDrawer'
@@ -95,75 +95,69 @@ export default function GenerateVideoScreen() {
translucent
/>
)}
<KeyboardAvoidingView
style={styles.keyboardAvoidingView}
behavior={Platform.OS === 'ios' ? 'padding' : undefined}
keyboardVerticalOffset={Platform.OS === 'ios' ? 0 : 0}
<KeyboardAwareScrollView
style={styles.scrollView}
contentContainerStyle={styles.scrollContent}
bottomOffset={50}
>
<ScrollView
style={styles.scrollView}
contentContainerStyle={styles.scrollContent}
showsVerticalScrollIndicator={false}
keyboardShouldPersistTaps="handled"
>
{/* 顶部导航栏 */}
<View style={styles.header}>
<Pressable
style={styles.backButton}
onPress={() => router.back()}
>
<LeftArrowIcon />
</Pressable>
</View>
{/* 顶部导航栏 */}
<View style={styles.header}>
<Pressable
style={styles.backButton}
onPress={() => router.back()}
>
<LeftArrowIcon />
</Pressable>
</View>
{/* 主要内容区域 */}
<View style={styles.content}>
{/* 模板预览卡片 */}
<View style={styles.templatePreviewCard}>
<View style={styles.templateThumbnailContainer}>
<Image
source={templateDetail?.coverImageUrl || ''}
style={styles.templateThumbnail}
contentFit="cover"
/>
<View style={styles.templateInfo}>
<Text style={styles.templateTitle}>{templateDetail?.title}</Text>
<Text style={styles.templateDescription}>{templateDetail?.description}</Text>
</View>
</View>
{/* 价格标签 */}
<View style={styles.priceTag}>
<WhitePointsIcon />
<Text style={styles.priceText}>{templateDetail?.price || 10}</Text>
{/* 主要内容区域 */}
<View style={styles.content}>
{/* 模板预览卡片 */}
<View style={styles.templatePreviewCard}>
<View style={styles.templateThumbnailContainer}>
<Image
source={templateDetail?.coverImageUrl || ''}
style={styles.templateThumbnail}
contentFit="cover"
/>
<View style={styles.templateInfo}>
<Text style={styles.templateTitle}>{templateDetail?.title}</Text>
<Text style={styles.templateDescription}>{templateDetail?.description}</Text>
</View>
</View>
{/* 动态表单 */}
<View style={styles.formContainer}>
{templateLoading ? (
<View style={styles.loadingContainer}>
<Text style={styles.loadingText}>{t('generateVideo.loading') || '加载中...'}</Text>
</View>
) : formSchema.startNodes && formSchema.startNodes.length > 0 ? (
<DynamicForm
ref={dynamicFormRef}
formSchema={formSchema}
onSubmit={handleFormSubmit}
loading={loading}
onOpenDrawer={handleOpenDrawer}
points={templateDetail?.price}
/>
) : (
<View style={styles.emptyContainer}>
<Text style={styles.emptyText}>
{t('generateVideo.noFormFields') || '暂无可填写的表单项'}
</Text>
</View>
)}
{/* 价格标签 */}
<View style={styles.priceTag}>
<WhitePointsIcon />
<Text style={styles.priceText}>{templateDetail?.price || 10}</Text>
</View>
</View>
</ScrollView>
</KeyboardAvoidingView>
{/* 动态表单 */}
<View style={styles.formContainer}>
{templateLoading ? (
<View style={styles.loadingContainer}>
<Text style={styles.loadingText}>{t('generateVideo.loading') || '加载中...'}</Text>
</View>
) : formSchema.startNodes && formSchema.startNodes.length > 0 ? (
<DynamicForm
ref={dynamicFormRef}
formSchema={formSchema}
onSubmit={handleFormSubmit}
loading={loading}
onOpenDrawer={handleOpenDrawer}
points={templateDetail?.price}
disableScroll
/>
) : (
<View style={styles.emptyContainer}>
<Text style={styles.emptyText}>
{t('generateVideo.noFormFields') || '暂无可填写的表单项'}
</Text>
</View>
)}
</View>
</View>
</KeyboardAwareScrollView>
{/* 图片上传抽屉 */}
<UploadReferenceImageDrawer
@@ -197,9 +191,6 @@ const styles = StyleSheet.create({
flex: 1,
backgroundColor: '#090A0B',
},
keyboardAvoidingView: {
flex: 1,
},
scrollView: {
flex: 1,
backgroundColor: '#090A0B',

98
components/DynamicForm.tsx
View File

@@ -6,12 +6,11 @@ import {
StyleSheet,
Platform,
ActivityIndicator,
ScrollView,
KeyboardAvoidingView,
} from 'react-native'
import { Image } from 'expo-image'
import { useTranslation } from 'react-i18next'
import * as ImagePicker from 'expo-image-picker'
import { KeyboardAwareScrollView } from 'react-native-keyboard-controller'
import { Button } from './ui/button'
import Text from './ui/Text'
@@ -81,10 +80,12 @@ interface DynamicFormProps {
loading?: boolean
onOpenDrawer?: (nodeId: string) => void
points?: number
/** 当外层已有滚动视图时，禁用内部滚动 */
disableScroll?: boolean
}
export const DynamicForm = forwardRef<DynamicFormRef, DynamicFormProps>(
function DynamicForm({ formSchema, onSubmit, loading = false, onOpenDrawer, points }, ref) {
function DynamicForm({ formSchema, onSubmit, loading = false, onOpenDrawer, points, disableScroll = false }, ref) {
const { t } = useTranslation()
const startNodes = formSchema.startNodes || []
@@ -456,55 +457,60 @@ export const DynamicForm = forwardRef<DynamicFormRef, DynamicFormProps>(
)
}
return (
<KeyboardAvoidingView
style={styles.keyboardAvoidingView}
behavior={Platform.OS === 'ios' ? 'padding' : undefined}
keyboardVerticalOffset={0}
>
<ScrollView
style={styles.scrollView}
contentContainerStyle={styles.scrollContent}
showsVerticalScrollIndicator={false}
keyboardShouldPersistTaps="handled"
>
{startNodes.map(renderField)}
const formContent = (
<>
{startNodes.map(renderField)}
<View style={styles.submitButtonContainer}>
<Button
testID="submit-button"
variant="gradient"
onPress={handleSubmit}
disabled={loading}
style={styles.submitButton}
className="px-0"
>
{loading ? (
<ActivityIndicator color="#fff" />
) : (
<View style={styles.submitButtonContent}>
<Text style={styles.submitButtonText}>
{t('dynamicForm.submit') || '提交'}
</Text>
{points !== undefined && points > 0 && (
<View style={styles.pointsContainer}>
<Text style={styles.pointsText}>{points}</Text>
</View>
)}
</View>
)}
</Button>
</View>
</ScrollView>
</KeyboardAvoidingView>
<View style={styles.submitButtonContainer}>
<Button
testID="submit-button"
variant="gradient"
onPress={handleSubmit}
disabled={loading}
style={styles.submitButton}
className="px-0"
>
{loading ? (
<ActivityIndicator color="#fff" />
) : (
<View style={styles.submitButtonContent}>
<Text style={styles.submitButtonText}>
{t('dynamicForm.submit') || '提交'}
</Text>
{points !== undefined && points > 0 && (
<View style={styles.pointsContainer}>
<Text style={styles.pointsText}>{points}</Text>
</View>
)}
</View>
)}
</Button>
</View>
</>
)
// 当外层已有滚动视图时，不使用内部滚动
if (disableScroll) {
return (
<View style={styles.scrollContent}>
{formContent}
</View>
)
}
return (
<KeyboardAwareScrollView
style={styles.scrollView}
contentContainerStyle={styles.scrollContent}
bottomOffset={50}
>
{formContent}
</KeyboardAwareScrollView>
)
}
)
const styles = StyleSheet.create({
keyboardAvoidingView: {
flex: 1,
},
scrollView: {
flex: 1,
},

158
components/drawer/EditProfileDrawer.tsx
View File

@@ -4,21 +4,19 @@ import {
Text,
StyleSheet,
Pressable,
TextInput,
Dimensions,
Platform,
Keyboard,
ScrollView,
ActivityIndicator,
} from 'react-native'
import { Image } from 'expo-image'
import { useSafeAreaInsets } from 'react-native-safe-area-context'
import { useTranslation } from 'react-i18next'
import BottomSheet, { BottomSheetModal, BottomSheetView, BottomSheetBackdrop, BottomSheetScrollView } from '@gorhom/bottom-sheet'
import { BottomSheetModal, BottomSheetBackdrop, BottomSheetTextInput, BottomSheetView } from '@gorhom/bottom-sheet'
import { CloseIcon, AvatarUploadIcon } from '@/components/icon'
import { LinearGradient } from 'expo-linear-gradient'
import { type ImagePickerAsset } from 'expo-image-picker'
import { useUpdateProfile } from '@/hooks'
import { KeyboardAwareScrollView, useKeyboardContext, useKeyboardState } from 'react-native-keyboard-controller'
import { TextInput } from 'react-native-gesture-handler'
interface EditProfileDrawerProps {
@@ -41,13 +39,14 @@ export default function EditProfileDrawer({
const [name, setName] = useState(initialName)
const [avatar, setAvatar] = useState<string | undefined>(initialAvatar)
const [selectedImage, setSelectedImage] = useState<ImagePickerAsset | null>(null)
const insets = useSafeAreaInsets()
const keyboardState = useKeyboardState()
const { loading, pickImage, updateProfile } = useUpdateProfile()
// 增加高度以避免被底部 Tab 栏遮挡，考虑底部安全区域
// 使用百分比让 BottomSheet 在键盘弹出时能够自动调整
const snapPoints = useMemo(() => ['50%'], [])
const snapPoints = useMemo(() => ['80%'], [])
useEffect(() => {
if (visible) {
@@ -56,11 +55,21 @@ export default function EditProfileDrawer({
setName(initialName)
setAvatar(initialAvatar)
setSelectedImage(null)
} else {
bottomSheetRef.current?.dismiss()
}
}, [visible, initialName, initialAvatar])
useEffect(() => {
if (keyboardState && keyboardState.height) {
bottomSheetRef.current?.expand()
} else {
bottomSheetRef.current?.collapse()
}
}, [keyboardState])
const handleSheetChanges = useCallback((index: number) => {
if (index === -1) {
onClose()
@@ -132,48 +141,42 @@ export default function EditProfileDrawer({
keyboardBlurBehavior="restore"
android_keyboardInputMode="adjustResize"
>
<BottomSheetScrollView
style={styles.scrollView}
contentContainerStyle={styles.scrollContent}
keyboardShouldPersistTaps="handled"
showsVerticalScrollIndicator={false}
>
<View style={styles.container}>
{/* 顶部关闭按钮 */}
<Pressable
style={styles.closeButton}
onPress={handleClose}
hitSlop={{ top: 10, bottom: 10, left: 10, right: 10 }}
disabled={loading}
>
<CloseIcon />
</Pressable>
{/* 头像区域 */}
<View style={styles.avatarContainer}>
<View style={styles.avatarWrapper}>
<Image
source={avatar ? { uri: avatar } : require('@/assets/images/icon.png')}
style={styles.avatar}
contentFit="cover"
/>
<Pressable
style={styles.cameraButton}
onPress={handleAvatarPress}
disabled={loading}
>
<View style={styles.cameraIconContainer}>
{loading ? (
<ActivityIndicator size="small" color="#FFFFFF" />
) : (
<AvatarUploadIcon />
)}
</View>
</Pressable>
</View>
<BottomSheetView style={styles.container}>
{/* 顶部关闭按钮 */}
<Pressable
style={styles.closeButton}
onPress={handleClose}
hitSlop={{ top: 10, bottom: 10, left: 10, right: 10 }}
disabled={loading}
>
<CloseIcon />
</Pressable>
{/* 头像区域 */}
<View style={styles.avatarContainer}>
<View style={styles.avatarWrapper}>
<Image
source={avatar ? { uri: avatar } : require('@/assets/images/icon.png')}
style={styles.avatar}
contentFit="cover"
/>
<Pressable
style={styles.cameraButton}
onPress={handleAvatarPress}
disabled={loading}
>
<View style={styles.cameraIconContainer}>
{loading ? (
<ActivityIndicator size="small" color="#FFFFFF" />
) : (
<AvatarUploadIcon />
)}
</View>
</Pressable>
</View>
</View>
{/* 输入框 */}
<TextInput
{/* 输入框 */}
{/* <BottomSheetTextInput
style={styles.input}
value={name}
onChangeText={setName}
@@ -181,32 +184,40 @@ export default function EditProfileDrawer({
placeholderTextColor="#666666"
returnKeyType="done"
onSubmitEditing={handleSave}
blurOnSubmit={true}
editable={!loading}
/>
/> */}
{/* 保存按钮 */}
<Pressable
style={[styles.saveButtonContainer, loading && styles.saveButtonDisabled]}
onPress={handleSave}
disabled={loading || !name.trim()}
android_ripple={{ color: 'rgba(255, 255, 255, 0.1)' }}
<TextInput style={styles.input}
value={name}
onChangeText={setName}
placeholder={t('editProfile.namePlaceholder')}
placeholderTextColor="#666666"
returnKeyType="done"
onSubmitEditing={handleSave}
editable={!loading}></TextInput>
{/* 保存按钮 */}
<Pressable
style={[styles.saveButtonContainer, loading && styles.saveButtonDisabled]}
onPress={handleSave}
disabled={loading || !name.trim()}
android_ripple={{ color: 'rgba(255, 255, 255, 0.1)' }}
>
<LinearGradient
colors={['#9966FF', '#FF6699', '#FF9966']}
start={{ x: 0, y: 0 }}
end={{ x: 1, y: 0 }}
style={styles.saveButton}
>
<LinearGradient
colors={['#9966FF', '#FF6699', '#FF9966']}
start={{ x: 0, y: 0 }}
end={{ x: 1, y: 0 }}
style={styles.saveButton}
>
{loading ? (
<ActivityIndicator size="small" color="#FFFFFF" />
) : (
<Text style={styles.saveButtonText}>{t('editProfile.save')}</Text>
)}
</LinearGradient>
</Pressable>
</View>
</BottomSheetScrollView>
{loading ? (
<ActivityIndicator size="small" color="#FFFFFF" />
) : (
<Text style={styles.saveButtonText}>{t('editProfile.save')}</Text>
)}
</LinearGradient>
</Pressable>
</BottomSheetView>
</BottomSheetModal>
)
}
@@ -222,15 +233,8 @@ const styles = StyleSheet.create({
flex: 1,
backgroundColor: '#1C1E22',
paddingHorizontal: 16,
},
scrollView: {
flex: 1,
},
scrollContent: {
paddingTop: 32,
paddingBottom: Platform.OS === 'ios' ? 25 : 17,
paddingHorizontal: 0,
flexGrow: 1,
},
closeButton: {
position: 'absolute',

11
components/drawer/PointsDrawer.tsx
View File

@@ -110,17 +110,6 @@ export default function PointsDrawer({
<View style={styles.balance}>
<Text style={styles.balanceValue}>{totalPoints}</Text>
</View>
{/* 积分类型细分 */}
<View style={styles.breakdown}>
<Text style={styles.breakdownText}>{t('pointsDrawer.subscriptionPoints')}
<Text style={styles.breakdownTextValue}>{subscriptionPoints}</Text>
</Text>
<View style={styles.breakdownTextSeparator} />
<Text style={styles.breakdownText}>{t('pointsDrawer.topUpPoints')}
<Text style={styles.breakdownTextValue}>{topUpPoints}</Text>
</Text>
</View>
</View>
{/* 底部按钮 */}

2
components/drawer/TopUpDrawer.tsx
View File

@@ -103,7 +103,7 @@ export default function TopUpDrawer({
// 获取余额 store 的方法
const { load: loadBalance, restartPolling } = useUserBalanceStore()
const snapPoints = useMemo(() => [420], [])
const snapPoints = useMemo(() => [500], [])
useEffect(() => {
if (visible) {

8
locales/en-US.json
View File

@@ -222,7 +222,13 @@
"agreementText": "I have read and agree to",
"terms": "Terms of Service",
"privacy": "Privacy Policy",
"agreementAnd": "and"
"agreementAnd": "and",
"alipayNotInstalled": "Alipay SDK not installed",
"createOrderFailed": "Failed to create order",
"paymentSuccess": "Payment successful! Points are being credited...",
"paymentCancelled": "Payment cancelled",
"paymentFailed": "Payment failed, please try again",
"paymentError": "Payment error"
},
"tabs": {
"home": "Home",

8
locales/zh-CN.json
View File

@@ -222,7 +222,13 @@
"agreementText": "我已阅读并同意",
"terms": "服务条款",
"privacy": "隐私协议",
"agreementAnd": "与"
"agreementAnd": "与",
"alipayNotInstalled": "支付宝 SDK 未安装",
"createOrderFailed": "创建订单失败",
"paymentSuccess": "支付成功！积分正在到账中...",
"paymentCancelled": "支付已取消",
"paymentFailed": "支付失败，请重试",
"paymentError": "支付出错"
},
"tabs": {
"home": "首页",

41
stores/editProfileStore.ts Normal file
View File

@@ -0,0 +1,41 @@
import { create } from 'zustand'
interface EditProfileState {
visible: boolean
initialName: string
initialAvatar?: string
onSaveCallback?: (data: { name: string; avatar?: string }) => void
}
interface EditProfileActions {
open: (params: {
initialName?: string
initialAvatar?: string
onSave?: (data: { name: string; avatar?: string }) => void
}) => void
close: () => void
}
type EditProfileStore = EditProfileState & EditProfileActions
export const useEditProfileStore = create<EditProfileStore>((set) => ({
visible: false,
initialName: '',
initialAvatar: undefined,
onSaveCallback: undefined,
open: ({ initialName = '', initialAvatar, onSave }) => {
set({
visible: true,
initialName,
initialAvatar,
onSaveCallback: onSave,
})
},
close: () => {
set({
visible: false,
})
},
}))