import Defect from "./../../assets/icon/defect.png";
import Alarm from "./../../assets/icon/alarm.png";
import Finished from "./../../assets/icon/finished.png";
import InputAndOutput from "./../../assets/icon/inputAndOutput.png";
import Num from "./../../assets/icon/num.png";
import Record from "./../../assets/icon/record.png";
import "./index.css";
interface titleProps {
  title: string;
}
function TitleBox(props: titleProps) {
  const filteredTitles = () => {
    switch (props.title) {
      case "left_up":
        return {
          img: Defect,
          title: "产线缺陷汇总",
        };
      case "left_down":
        return {
          img: Record,
          title: "当前产线缺陷",
        };
      case "center_down_left":
        return {
          img: Alarm,
          title: "异常报警",
        };
      case "center_down_right":
        return {
          img: Finished,
          title: "产线成品率",
        };
      case "right_up":
        return {
          img: Num,
          title: "各产线总投入和产出",
        };
      default:
        return {
          img: InputAndOutput,
          title: "各产线投入和产出",
        };
    }
  };
  return (
    <div className="title_box">
      <img src={filteredTitles().img} alt="title" />
      <span>{filteredTitles().title}</span>
    </div>
  );
}
export default TitleBox;