diff --git a/src/components/TaskForm.tsx b/src/components/TaskForm.tsx index 7fa6fc7..bc3e3bc 100644 --- a/src/components/TaskForm.tsx +++ b/src/components/TaskForm.tsx @@ -1,26 +1,80 @@ -import React, { useState } from 'react'; +import React, { useState, useRef, useEffect } from 'react'; import { StyleSheet, ScrollView, TouchableOpacity } from 'react-native'; import { Input, BottomSheet, ListItem } from '@rneui/themed'; import { Task, RobotAction } from '../types/task'; -import { - LOCATIONS, - ROBOT_ACTIONS, - PAYLOADS, - LOCATIONS_BAYS, -} from '../data/mockData'; +import { LOCATIONS, ROBOT_ACTIONS, PAYLOADS } from '../data/mockData'; interface TaskFormProps { task: Task; onTaskChange: (updatedTask: Task) => void; + onLocationBayChange?: (task: Task) => void; // 库位变化时的回调 } -const TaskForm: React.FC = ({ task, onTaskChange }) => { +const TaskForm: React.FC = ({ + task, + onTaskChange, + onLocationBayChange, +}) => { const [isVisible, setIsVisible] = useState(false); const [currentField, setCurrentField] = useState(''); const [currentItems, setCurrentItems] = useState< { label: string; value: string }[] >([]); + // 创建库位输入框的ref + const locationBayInputRef = useRef(null); + // 用于防抖的ref + const debounceTimerRef = useRef(null); + // 保存上一次的库位值,用于检测变化 + const previousLocationBayRef = useRef( + task.parameters.locationBay || '', + ); + + // 组件挂载时自动聚焦到库位输入框 + useEffect(() => { + const timer = setTimeout(() => { + if (locationBayInputRef.current) { + locationBayInputRef.current.focus(); + } + }, 100); + + return () => clearTimeout(timer); + }, []); + + // 监听库位值变化,自动触发运行任务 + useEffect(() => { + const currentLocationBay = task.parameters.locationBay || ''; + const previousLocationBay = previousLocationBayRef.current; + + // 只有当库位值真正发生变化且不为空时才触发 + if ( + currentLocationBay !== previousLocationBay && + currentLocationBay.trim() !== '' + ) { + // 清除之前的防抖定时器 + if (debounceTimerRef.current) { + clearTimeout(debounceTimerRef.current); + } + + // 设置新的防抖定时器,500ms后触发 + debounceTimerRef.current = setTimeout(() => { + if (onLocationBayChange) { + onLocationBayChange(task); + } + }, 500); + } + + // 更新上一次的库位值 + previousLocationBayRef.current = currentLocationBay; + + // 清理函数 + return () => { + if (debounceTimerRef.current) { + clearTimeout(debounceTimerRef.current); + } + }; + }, [task.parameters.locationBay, task, onLocationBayChange]); + const handleParamChange = (field: string, value: string | RobotAction) => { const updatedTask = { ...task, @@ -91,12 +145,17 @@ const TaskForm: React.FC = ({ task, onTaskChange }) => { ROBOT_ACTIONS, )} {renderDropdown('payload', '载荷', task.parameters.payload, PAYLOADS)} - {renderDropdown( - 'locationBay', - '库位', - task.parameters.locationBay || '', - LOCATIONS_BAYS, - )} + + {/* 库位字段改为普通输入框 */} + handleParamChange('locationBay', text)} + showSoftInputOnFocus={false} + autoFocus={false} + placeholder="请输入库位" + /> ({ - label: `AP-${i + 1}`, - value: `AP-${i + 1}`, + label: `AP-${i + 1}`, + value: `AP-${i + 1}`, })); export const ROBOT_ACTIONS: { label: string; value: RobotAction }[] = [ @@ -16,38 +16,48 @@ export const ROBOT_ACTIONS: { label: string; value: RobotAction }[] = [ ]; export const LOCATIONS_BAYS = Array.from({ length: 100 }, (_, i) => ({ - label: `AS2_2_${String(i + 1).padStart(3, '0')}`, - value: `AS2_2_${String(i + 1).padStart(3, '0')}`, + label: `AS2_2_${String(i + 1).padStart(3, '0')}`, + value: `AS2_2_${String(i + 1).padStart(3, '0')}`, })); export const PAYLOADS = [ - { label: '满料架-A1', value: '满料架-A1' }, - { label: '空料架-B2', value: '空料架-B2' }, - { label: '空料架-C3', value: '空料架-C3' }, - { label: '空车', value: '空车' }, + { label: '满料架-A1', value: '满料架-A1' }, + { label: '空料架-B2', value: '空料架-B2' }, + { label: '空料架-C3', value: '空料架-C3' }, + { label: '空车', value: '空车' }, ]; -const getRandomElement = (arr: T[]): T => arr[Math.floor(Math.random() * arr.length)]; +const getRandomElement = (arr: T[]): T => + arr[Math.floor(Math.random() * arr.length)]; export const MOCK_TASKS: Task[] = Array.from({ length: 15 }, (_, i) => { - const startLocation = getRandomElement(LOCATIONS); - const endLocation = getRandomElement(LOCATIONS.filter(l => l.value !== startLocation.value)); - const robotAction = getRandomElement(ROBOT_ACTIONS); - const payload = getRandomElement(PAYLOADS); - const statusOptions: Task['status'][] = ['IDLE', 'RUNNING', 'COMPLETED', 'ERROR']; - const status = getRandomElement(statusOptions); + const startLocation = getRandomElement(LOCATIONS); + const endLocation = getRandomElement( + LOCATIONS.filter(l => l.value !== startLocation.value), + ); + const robotAction = getRandomElement(ROBOT_ACTIONS); + const payload = getRandomElement(PAYLOADS); + const statusOptions: Task['status'][] = [ + 'IDLE', + 'RUNNING', + 'COMPLETED', + 'ERROR', + ]; + const status = getRandomElement(statusOptions); - return { - id: uuidv4(), - name: `任务 ${i + 1}: 从 ${startLocation.label} 到 ${endLocation.label}`, - status: status, - createdAt: new Date(new Date().getTime() - Math.random() * 1000 * 60 * 60 * 24).toISOString(), - parameters: { - startLocation: startLocation.value, - endLocation: endLocation.value, - robotAction: robotAction.value, - payload: payload.value, - locationBay: getRandomElement(LOCATIONS_BAYS).value, - }, - }; + return { + id: uuidv4(), + name: `任务 ${i + 1}: 从 ${startLocation.label} 到 ${endLocation.label}`, + status: status, + createdAt: new Date( + new Date().getTime() - Math.random() * 1000 * 60 * 60 * 24, + ).toISOString(), + parameters: { + startLocation: startLocation.value, + endLocation: endLocation.value, + robotAction: robotAction.value, + payload: payload.value, + locationBay: '', // 库位初始值为空 + }, + }; }); diff --git a/src/screens/TaskEditScreen.tsx b/src/screens/TaskEditScreen.tsx index ba05cf7..bffdb6d 100644 --- a/src/screens/TaskEditScreen.tsx +++ b/src/screens/TaskEditScreen.tsx @@ -32,7 +32,6 @@ export default function TaskEditScreen() { } }, [initialTask]); - const handleTaskChange = (updatedTask: Task) => { setTask(updatedTask); if (!isModified) { @@ -48,35 +47,48 @@ export default function TaskEditScreen() { Alert.alert('已保存', `任务 "${task.name}" 已被保存。`); } }; - + const handleRun = () => { - if(task) { - runTask(task.id); - navigation.goBack(); + if (task) { + runTask(task.id); + navigation.goBack(); } - } + }; const handleUndo = () => { - setTask(originalTask); - setIsModified(false); - } + setTask(originalTask); + setIsModified(false); + }; const handleRestore = () => { setTask(originalTask); setIsModified(false); - } + }; + + // 处理库位变化,自动运行任务 + const handleLocationBayChange = (updatedTask: Task) => { + console.log( + '库位已变化,自动运行任务:', + updatedTask.parameters.locationBay, + ); + runTask(updatedTask.id); + }; if (!task) { return ( - - - + + + ); } return ( - +