import React from 'react';
import { View, Text, StyleSheet, TouchableOpacity } from 'react-native';
import { auth } from '../utils/auth';
import { useNavigation } from '@react-navigation/native';
import { useAuth } from '../context/AuthContext'; // 添加这行

const ProfileScreen = () => {
  const navigation = useNavigation();
  const { setIsLoggedIn } = useAuth(); // 添加这行

  const handleLogout = async () => {
    try {
      await auth.removeToken(); // 清除本地存储的 token
      setIsLoggedIn(false); // 更新登录状态
      // 不需要手动导航，因为 AppNavigator 会根据 isLoggedIn 自动处理导航
    } catch (error) {
      console.error('退出登录失败:', error);
    }
  };

  return (
    <View style={styles.container}>
      <Text style={styles.title}>个人中心</Text>
      
      <TouchableOpacity 
        style={styles.logoutButton} 
        onPress={handleLogout}
      >
        <Text style={styles.logoutText}>退出登录</Text>
      </TouchableOpacity>
    </View>
  );
};

const styles = StyleSheet.create({
  container: {
    flex: 1,
    alignItems: 'center',
    backgroundColor: '#F3FCFF',
  },
  title: {
    fontSize: 20,
    fontWeight: 'bold',
    marginTop: 20,
  },
  logoutButton: {
    position: 'absolute',
    bottom: 40,
    width: '90%',
    height: 44,
    backgroundColor: '#FF4D4F',
    borderRadius: 22,
    justifyContent: 'center',
    alignItems: 'center',
  },
  logoutText: {
    color: '#FFFFFF',
    fontSize: 16,
    fontWeight: '500',
  },
});

export default ProfileScreen;