import { useDispatch } from 'react-redux';
import { useSearchParams } from 'react-router-dom';
import { setInitMsg } from '@/store/slices/room';
import MyInputIcon from '@/assets/img/myInput.png';
import RightBlueIcon from '@/assets/img/rightBlue.png';
import style from './index.module.less';

type Props = {
  toRoom: () => Promise<void>;
};

export default function MyInput({ toRoom }: Props) {
  const dispatch = useDispatch();
  const [searchParams] = useSearchParams()

  const provinceName = searchParams.get('provinceName') || '山东省'
  const subjectGroup = searchParams.get('subjectGroup') || '物/化/史'
  const expectedScore = searchParams.get('expectedScore') || 500

  const handleQuestion = async () => {
    await toRoom();
    dispatch(setInitMsg(`我的高考地点在${provinceName},我选择的科目是${subjectGroup},我的高考分数为${expectedScore}分。我适合哪些学校和专业`));
  };
  const handleReadWorld = async () => {
    await toRoom();
    dispatch(setInitMsg(`这是我的文档地址https://static-data.ycymedu.com/pdf/663640899633221.pdf，读取它。并给出见解`))
  }

  return (
    <div className={style.scoreWrapper}>
      <div className={style.innerWrapper}>
        <div className={style.left}>
          <img src={MyInputIcon} className={style.imgIcon} alt="input-ico" />
          <div className={style.detail}>
            <div className={style.city}>{provinceName}</div>
            <div className={style.subject}>{(subjectGroup as string).split(',').join('/') }</div>
            <div className={style.score}>{expectedScore}分</div>
          </div>
        </div>
        <div className={style.right} onClick={handleQuestion}>
          <span>智能分析</span>
          <img src={RightBlueIcon} alt="right" className={style.rightBlue} />
        </div>
      </div>
      <div onClick={handleReadWorld}>测试阅读文档</div>
    </div>
  );
}
