This commit is contained in:
Jake Kasper
2025-09-05 11:20:40 -04:00
parent 12a74b4828
commit da612539e6

View File

@@ -49,6 +49,9 @@ const Watering = () => {
const [selectedSprinklerId, setSelectedSprinklerId] = useState(''); const [selectedSprinklerId, setSelectedSprinklerId] = useState('');
const [selectedPointId, setSelectedPointId] = useState(null); const [selectedPointId, setSelectedPointId] = useState(null);
const selectedPoint = useMemo(()=> points.find(p=> p.id===selectedPointId), [points, selectedPointId]); const selectedPoint = useMemo(()=> points.find(p=> p.id===selectedPointId), [points, selectedPointId]);
const sortedPoints = useMemo(() => {
return [...points].sort((a,b) => (Number(a.sequence||0)) - (Number(b.sequence||0)) || (Number(a.id)-Number(b.id)));
}, [points]);
const [editForm, setEditForm] = useState(null); const [editForm, setEditForm] = useState(null);
const [satellite, setSatellite] = useState(false); const [satellite, setSatellite] = useState(false);
const [rename, setRename] = useState(''); const [rename, setRename] = useState('');
@@ -332,13 +335,13 @@ const Watering = () => {
<div className="card"> <div className="card">
<div className="font-medium mb-2">Plan Points</div> <div className="font-medium mb-2">Plan Points</div>
<ul className="text-sm space-y-1 max-h-64 overflow-auto"> <ul className="text-sm space-y-1 max-h-64 overflow-auto">
{points.map(pt => ( {sortedPoints.map((pt, idx) => (
<li key={pt.id} <li key={pt.id}
className={(pt.id===selectedPointId? 'bg-blue-50 ' : '') + 'rounded px-2 py-1 hover:bg-gray-50 cursor-pointer flex items-center gap-2 justify-between'} className={(pt.id===selectedPointId? 'bg-blue-50 ' : '') + 'rounded px-2 py-1 hover:bg-gray-50 cursor-pointer flex items-center gap-2 justify-between'}
onClick={()=> onSelectPoint(pt)}> onClick={()=> onSelectPoint(pt)}>
<span className="flex items-center gap-2"> <span className="flex items-center gap-2">
<span style={{backgroundColor: pointColor(pt)}} className="inline-block w-3 h-3 rounded-full"></span> <span style={{backgroundColor: pointColor(pt)}} className="inline-block w-3 h-3 rounded-full"></span>
<span className="font-mono text-xs">#{pt.sequence}</span> <span className="font-mono text-xs">#{idx+1}</span>
<span className="text-xs">{Number(pt.lat).toFixed(5)}, {Number(pt.lng).toFixed(5)}</span> <span className="text-xs">{Number(pt.lat).toFixed(5)}, {Number(pt.lng).toFixed(5)}</span>
</span> </span>
<span className="text-[11px] text-gray-600"> <span className="text-[11px] text-gray-600">