import React, { Component } from 'react';
import './index.scss'
import { Switch, Route } from 'react-router-dom'
import Scores from './scores'
import Exam from './exam'
import SubmitAnswer from "@components/ai-test/submit-answer"
import Analysis from "@components/ai-test/analysis"
import Assist from "@components/ai-test/assist"
import Help from '@components/ai-test/share'
import Report from '@components/ai-test/report'
import storage from 'store2'

class AiTest extends Component {

  examStore = storage.namespace('aiTestExam')


  componentDidMount() {
    window.addEventListener('beforeunload', this.handleBeforeUnload)
  }

  componentWillUnmount() {
    this.handleBeforeUnload()
    window.removeEventListener('beforeunload', this.handleBeforeUnload)
  }

  handleBeforeUnload = () => {
    this.examStore.clearAll()
  }


  render() {
    const {match} = this.props
    return (
      <Switch>
        <Route path={`${match.path}/exam`} render={props => <Exam {...props}/>}/>
        <Route path={`${match.path}/submit`} render={props => <SubmitAnswer {...props}/>}/>
        <Route path={`${match.path}/analysis/:recordId`} render={props => <Analysis {...props}/>}/>
        <Route path={`${match.path}/assist/:assistCode`} render={props => <Assist {...props}/>}/>
        <Route path={`${match.path}/share`} render={props => <Help {...props}/>}/>
        <Route path={`${match.path}/report`} render={props => <Report {...props}/>}/>
        <Route render={(props) => <Scores {...props}/>}/>
      </Switch>
    );
  }
}

export default AiTest;