import React from "react";
import intl from "react-intl-universal";

import '../../lanhuapp/common.css';
import "../../lanhuapp/index.css";
import "../style/standard.css"
import RightDownTableDay from "./RightDown/RightDownTableDay";
import RightDownTableWeek from "./RightDown/RightDownTableWeek";
import RightDownTableMonth from "./RightDown/RightDownTableMonth";
import {useAppSelector} from "../../store/hooks";
import {selectChangeLangAndCss} from "../../store/ChangeLangAndCss";

function RightDown() {
  const Css = useAppSelector(selectChangeLangAndCss);
  return (
    <div className="box_40 flex-col fineWin">
      <div className="fineWin-footer"/>

      <div className="image-text_16 flex-row justify-between">
        <div className="group_27 flex-col"/>
        <span className="text-group_2">{intl.get('InputAndOutputTable')}</span>
      </div>

      <div className="group_63_2 flex-row">
        <div className="box_4 flex-col"/>
        <span className={Css.text_34}>{intl.get('ThisDay')}</span>
        <div className="box_5 flex-col"/>
      </div>

      <div className="rightDownTableArea">
        <RightDownTableDay/>
      </div>

      <div className="group_63_2 flex-row">
        <div className="box_4 flex-col"/>
        <span className={Css.text_34}>{intl.get('ThisWeek')}</span>
        <div className="box_5 flex-col"/>
      </div>

      <div className="rightDownTableArea">
        <RightDownTableWeek/>
      </div>

      <div className="group_63_2 flex-row">
        <div className="box_4 flex-col"/>
        <span className={Css.text_34}>{intl.get('ThisMonth')}</span>
        <div className="box_5 flex-col"/>
      </div>

      <div className="rightDownTableArea">
        <RightDownTableMonth/>
      </div>

    </div>
  );
}

export default RightDown;