refactor: 修复跳转到任务编辑页面的卡顿问题,修复部分类型错误

This commit is contained in:
xudan 2025-07-21 19:03:11 +08:00
parent fdbc629877
commit 02a326e60e
6 changed files with 36 additions and 28 deletions

View File

@ -1,6 +1,5 @@
{
"permissions": {
"defaultMode": "bypassPermissions",
"allow": [
"Bash(npm install:*)",
"Bash(mkdir -p:*)",
@ -8,8 +7,12 @@
"Bash(*:*)",
"Bash(npm uninstall react-native-paper react-native-paper-dropdown)",
"Bash(npm uninstall react-native-paper react-native-paper-dropdown --legacy-peer-deps)",
"Bash(npx react-native start --reset-cache)"
"Bash(npx react-native start --reset-cache)",
"Bash(npm run lint)"
],
"deny": ["WebSearch"]
"deny": [
"WebSearch"
],
"defaultMode": "bypassPermissions"
}
}
}

View File

@ -1,12 +1,11 @@
import React from 'react';
import { StyleSheet, TouchableOpacity } from 'react-native';
import { Card, Text, Chip, useTheme } from '@rneui/themed';
import { Card, Chip } from '@rneui/themed';
import { Task, TaskStatus } from '../types/task';
import Icon from 'react-native-vector-icons/MaterialCommunityIcons';
interface TaskCardProps {
task: Task;
onPress: (id: string) => void;
onPress: (task: Task) => void;
}
const statusColors: Record<TaskStatus, string> = {
@ -17,10 +16,9 @@ const statusColors: Record<TaskStatus, string> = {
};
const TaskCard: React.FC<TaskCardProps> = ({ task, onPress }) => {
const { theme } = useTheme();
return (
<TouchableOpacity onPress={() => onPress(task.id)} style={{ flex: 1, width: '50%' }}>
<TouchableOpacity onPress={() => onPress(task)} style={styles.touchable}>
<Card containerStyle={styles.card}>
<Card.Title style={styles.title}>{task.name}</Card.Title>
<Card.Divider />
@ -34,7 +32,7 @@ const TaskCard: React.FC<TaskCardProps> = ({ task, onPress }) => {
}}
type="outline"
containerStyle={styles.chip}
titleStyle={{ color: statusColors[task.status], fontSize: 12 }}
titleStyle={[styles.chipTitle, { color: statusColors[task.status] }]}
buttonStyle={{ borderColor: statusColors[task.status] }}
/>
</Card>
@ -43,6 +41,10 @@ const TaskCard: React.FC<TaskCardProps> = ({ task, onPress }) => {
};
const styles = StyleSheet.create({
touchable: {
flex: 1,
width: '50%',
},
card: {
margin: 4,
borderRadius: 8,
@ -55,6 +57,9 @@ const styles = StyleSheet.create({
chip: {
alignSelf: 'flex-start',
},
chipTitle: {
fontSize: 12,
},
});
export default TaskCard;

View File

@ -1,6 +1,6 @@
import React, { useState } from 'react';
import { View, StyleSheet, ScrollView, TouchableOpacity } from 'react-native';
import { Input, BottomSheet, ListItem, Text } from '@rneui/themed';
import { StyleSheet, ScrollView, TouchableOpacity } from 'react-native';
import { Input, BottomSheet, ListItem } from '@rneui/themed';
import { Task, RobotAction } from '../types/task';
import {
LOCATIONS,
@ -94,7 +94,7 @@ const TaskForm: React.FC<TaskFormProps> = ({ task, onTaskChange }) => {
{renderDropdown(
'locationBay',
'库位',
task.parameters.locationBay,
task.parameters.locationBay || '',
LOCATIONS_BAYS,
)}

View File

@ -1,5 +1,5 @@
import React from 'react';
import { StyleSheet, Text, View, Button, SafeAreaView } from 'react-native';
import { StyleSheet, View, Button, SafeAreaView } from 'react-native';
export default function HomeScreen() {
return (

View File

@ -9,7 +9,7 @@ import { Task } from '../types/task';
import { Dialog } from '@rneui/themed';
type RootStackParamList = {
TaskEdit: { taskId: string };
TaskEdit: { task: Task };
};
type TaskEditRouteProp = RouteProp<RootStackParamList, 'TaskEdit'>;
@ -17,21 +17,21 @@ type TaskEditRouteProp = RouteProp<RootStackParamList, 'TaskEdit'>;
export default function TaskEditScreen() {
const route = useRoute<TaskEditRouteProp>();
const navigation = useNavigation();
const { taskId } = route.params;
const { task: initialTask } = route.params;
const { getTaskById, updateTask, runTask } = useTasks();
const { updateTask, runTask } = useTasks();
const [task, setTask] = useState<Task | null>(null);
const [originalTask, setOriginalTask] = useState<Task | null>(null);
const [task, setTask] = useState<Task | null>(initialTask);
const [originalTask, setOriginalTask] = useState<Task | null>(initialTask);
const [isModified, setIsModified] = useState(false);
useEffect(() => {
const foundTask = getTaskById(taskId);
if (foundTask) {
setTask(foundTask);
setOriginalTask(foundTask);
if (initialTask) {
setTask(initialTask);
setOriginalTask(initialTask);
}
}, [taskId, getTaskById]);
}, [initialTask]);
const handleTaskChange = (updatedTask: Task) => {
setTask(updatedTask);

View File

@ -7,7 +7,7 @@ import TaskCard from '../components/TaskCard';
type RootStackParamList = {
TaskList: undefined;
TaskEdit: { taskId: string };
TaskEdit: { task: Task };
};
type TaskListNavigationProp = StackNavigationProp<RootStackParamList, 'TaskList'>;
@ -16,15 +16,15 @@ export default function TaskListScreen() {
const { tasks } = useTasks();
const navigation = useNavigation<TaskListNavigationProp>();
const handlePressTask = (taskId: string) => {
navigation.navigate('TaskEdit', { taskId });
const handlePressTask = (task: Task) => {
navigation.navigate('TaskEdit', { task });
};
return (
<View style={styles.container}>
<FlatList
data={tasks}
renderItem={({ item }) => <TaskCard task={item} onPress={handlePressTask} />}
renderItem={({ item }) => <TaskCard task={item} onPress={() => handlePressTask(item)} />}
keyExtractor={item => item.id}
numColumns={2}
contentContainerStyle={styles.list}