import React from "react";
import TopP from "./TopP";
import Left from "./Left";
import Right from "./Right";
import Center from "./Center";
import {useEffect} from 'react';
import {useNavigate} from "react-router-dom";
function LinePage() {
  const navigate = useNavigate();
  useEffect(() => {
    const handleKeyDown = (event:any) => {
      if (event.key === 'ArrowUp') {
        console.log('LDPage向上键被按下');
        navigate('/LD?lineId=1-2');
        // 执行向上键的逻辑
      } else if (event.key === 'ArrowDown') {
        console.log('LDPage向下键被按下');
        // 执行向下键的逻辑
        navigate('/LD?lineId=1-2');
      }
    }
    window.addEventListener('keydown', handleKeyDown);
    return () => {
      window.removeEventListener('keydown', handleKeyDown);
    };
  });
  return (
    <React.Fragment>
      <TopP />
      <div className="block_bottom flex-row">
        <Left />
        <Center />
        <Right />
      </div>
    </React.Fragment>
  );
}
export default LinePage;