ai测试

src/components/ai-test/exam/index.js

@@ -7,7 +7,8 @@ import storage from 'store2'
 import Navigation from "@components/ai-test/common/navigation"
 import { differenceInSeconds, differenceInMinutes, differenceInHours, differenceInDays, lightFormat } from "date-fns";
 import { isEmpty } from 'lodash'
-
+import { connect } from 'react-redux'
+import { matchPath } from 'react-router-dom'
 
 class Exam extends Component {
 
@@ -30,10 +31,23 @@ class Exam extends Component {
   }
 
   componentDidMount() {
+    const {user, history} = this.props
+    if (user.hasError) {
+      return history.push('/passport')
+    }
     if (this.store.get('submitted')) {
       this.store.remove('submitted')
       this.props.history.replace('/ai-test')
     }
+    this.unlisten = history.listen((location) => {
+      const match = matchPath(location.pathname, {
+        path: '/ai-test',
+      })
+      if (match.isExact) {
+        this.store.clearAll()
+      }
+      this.unlisten && this.unlisten()
+    })
     this.getQuestions()
   }
 
@@ -202,4 +216,7 @@ class Exam extends Component {
   }
 }
 
-export default Exam;
\ No newline at end of file
+export default connect(
+  ({user}) => ({user}),
+  null,
+)(Exam);
\ No newline at end of file

src/components/ai-test/index.js

@@ -8,8 +8,27 @@ 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 (

src/components/ai-test/scores/index.js

@@ -12,15 +12,20 @@ class Scores extends Component {
 
   store = storage.namespace('aiTestEntry')
 
+
   state = {
-    tabs: [
+    selfTabs: [
       {title: '当前成绩'},
       {title: '今日最佳'},
       {title: '本月最佳'},
     ],
     rankList: [],
+    rankListTabs: [
+      {title: '日榜'},
+      {title: '周榜'},
+      {title: '总榜'},
+    ],
     isExpandRankList: false,
-    type: 2,
     icons: [
       require('./rank-1.png'),
       require('./rank-2.png'),
@@ -42,7 +47,7 @@ class Scores extends Component {
 
   componentDidMount() {
     this.getInitialData()
-    this.getRankList()
+    this.getRankList(null, 0)
     this.getUserScores(0)
     this.getUserAddress()
   }
@@ -73,8 +78,8 @@ class Scores extends Component {
       })
   }
 
-  getRankList = () => {
-    http.get(`${API.home}/sys/at/ranks/${this.state.type}`)
+  getRankList = (tab, type) => {
+    http.get(`${API.home}/sys/at/ranks/${type}`)
       .then(res => {
         const {code, msg, data} = res.data
         if (code === 200) {
@@ -151,8 +156,9 @@ class Scores extends Component {
 
   render() {
     const {
-      tabs,
+      selfTabs,
       rankList,
+      rankListTabs,
       icons,
       isExpandRankList,
       isShowRule,
@@ -178,13 +184,12 @@ class Scores extends Component {
           }}>规则</a>
         </div>
         {
-          userScore.rank !== '-' &&
           <div className="score-list">
-            <Tabs tabs={tabs} tabBarUnderlineStyle={{display: 'none'}} onChange={(tab, i) => {
+            <Tabs tabs={selfTabs} tabBarUnderlineStyle={{display: 'none'}} onChange={(tab, i) => {
               this.getUserScores(i)
             }}>
               {
-                tabs.map((tab, index) => {
+                selfTabs.map((tab, index) => {
                   return <div className={'tab-content'} key={index}>
                     <table>
                       <thead>
@@ -231,7 +236,10 @@ class Scores extends Component {
             </div>
           </div>
           <div className="list">
-            <table>
+            <Tabs tabs={rankListTabs} tabBarUnderlineStyle={{display: 'none'}} onChange={this.getRankList}>
+              {
+                rankListTabs.map((item, index) => {
+                  return <table key={index}>
                     <thead>
                     <tr>
                       <th>名次</th>
@@ -266,6 +274,9 @@ class Scores extends Component {
                     }
                     </tbody>
                   </table>
+                })
+              }
+            </Tabs>
             {
               !isExpandRankList ?
                 <div className="expand" onClick={() => {

src/components/ai-test/scores/index.scss

@@ -139,12 +139,13 @@
     .head {
       height: 68px;
       padding-top: 12px;
-      background-color: $blue-bg;
       text-align: center;
+      color: #fff;
+      margin-bottom: 15px;
+
 
       div:nth-child(1) {
         font-size: 18px;
-        color: #0E75E6;
         margin-bottom: 5px;
       }
 
@@ -152,7 +153,7 @@
         position: relative;
 
         span {
-          color: #666;
+          color: #E5F5FF;
           font-size: 12px;
         }
 
@@ -163,17 +164,17 @@
           transform: translateY(-50%);
           text-decoration: underline;
           font-size: 14px;
-          color: #077EE8;
+          color: #fff;
         }
       }
     }
 
     .list {
       background: #fff;
-      padding-top: 11px;
 
       table {
         width: 100%;
+        margin-top: 10px;
         border-collapse: collapse;
         border-spacing: 0;
         border: none;