Merge branch 'master' of gitlab.julyedu.com:baiguangyao/mr-julyedu into detail

src/App.js

@@ -4,7 +4,8 @@ import cookie from 'js-cookie'
 import {api} from '@/utils'
 
 //拦截ajax请求，返回mock数据
-import mock from '@/utils/mock'
+/*import mock from '@/utils/mock'
+mock()*/
 
 
 // 默认样式
@@ -14,14 +15,12 @@ import './assets/css/index.scss';
 import './assets/font/iconfont.css';
 
 
-
 export default class App extends Component{
     componentDidMount(){
         //平台信息
         cookie.set('plat', '5')
 
-        //拦截ajax请求，返回mock数据
-        mock()
+
     }
     render(){
         return <Routes/>

src/components/examination/examination.scss

@@ -6,10 +6,12 @@
     display: flex;
     flex-direction: column;
     height: calc(100% - 44px);
+    padding-bottom: 44px;
 
     .topic {
         @include padding;
         font-size: $font_16;
+        line-height: 30px;
     }
 
     .category-tag {
@@ -47,6 +49,7 @@
             margin-bottom: 7px;
             padding-top: $padding;
             padding-bottom: $padding;
+            line-height: 30px;
         }
 
         .alphabet {
@@ -95,9 +98,6 @@
         }
     }
 
-    .saq-content {
-        @include padding;
-    }
 }
 
 @keyframes slideInDown {

src/components/examination/index.js

-import React from 'react'
+import React, { PureComponent } from 'react'
 import './examination.scss'
 import classnames from 'classnames'
 
 import { Tag } from '../../common'
 import OpenApp from './OpenApp'
+import { api } from '@/utils'
 
-const mockData = {
-    id: 2,
-    type: 1,
-    options: [
-        {
-            ans: '频繁模式挖掘',
-            id: 1,
-        },
-        {
-            ans: '分类和预测',
-            id: 2
-        },
-        {
-            ans: '数据预处理',
-            id: 3
-        },
-        {
-            ans: '数据流挖掘',
-            id: 4
-        },
-    ],
-    ans: 2,
-    question: '将原始数据进行集成、变换、维度规约、数值规约是在以下哪个步骤的任务（）'
-}
-
-const answer = '@nishizhen：个人感觉逻辑回归和线性回归首先都是广义的线性回归，\n' +
-    '其次经典线性模型的优化目标函数是最小二乘，而逻辑回归则是似然函数，\n' +
-    '其次经典线性模型的优化目标函数是最小二乘，而逻辑回归则是似然函数，\n' +
-    '其次经典线性模型的优化目标函数是最小二乘，而逻辑回归则是似然函数，\n' +
-    '其次经典线性模型的优化目标函数是最小二乘，而逻辑回归则是似然函数，\n' +
-    '另外线性回归在整个实数域范围内进行预测，敏感度一致，而分类范围，需要在[0,1]。逻辑回归就是一种减小预测范围，将预测值限定为[0,1]间的一种回归模型，因而对于这类问题来说，逻辑回归的鲁棒性比线性回归的要好。\n' +
-    '                        '
-
-const saq = '例子：\n' +
-    ' >>>find_string(\'hello\\nworld\\n\',\'wor\')\n' +
-    '[\'wor\']\n' +
-    '>>>find_string(\'hello\\nworld\\n\',\'l*d\')\n' +
-    '[\'ld\']\n' +
-    '>>>find_string(\'hello\\nworld\\n\',\'o.\')\n' +
-    '[\'or\']\n'
-
-export default class Examination extends React.Component {
+export default class Examination extends PureComponent {
 
     constructor(props) {
         super(props)
         this.state = {
-            isShowAnswer: false
+            isShowAnswer: false,
+            questionData: {}
         }
     }
 
     componentDidMount() {
-        document.getElementsByClassName('tabbar')[0].style.display = 'none';
+        api.get('/m/dailyQuestion')
+            .then(res => {
+                this.setState({
+                    questionData: res.data.data
+                })
+            })
     }
 
     showAnswer = () => {
@@ -64,24 +30,27 @@ export default class Examination extends React.Component {
     }
 
     render() {
+        // let {ques, type_id, options, analysis} = this.state.questionData
+        let {
+            questionData: {
+                ques, type_id, options, analysis
+            },
+            isShowAnswer
+        } = this.state
         return (
             <div className='examination'>
                 <div className="question-container">
                     <div className="topic">
                         <Tag className='category-tag'>深度学习</Tag>
-                        {mockData.question}
+                        {ques}
                     </div>
                     {
-                        mockData.type === 1 ? (
-                            <MultipleChoice className='options' options={mockData.options}
-                                            correct={mockData.ans}
-                                            showCorrect={this.state.isShowAnswer}
-                            />
-                        ) : <SAQ content={saq}/>
-
+                        type_id === 1 && <MultiChoice className='options' options={options}
+                                                         showCorrect={this.state.isShowAnswer}
+                        />
                     }
                     {
-                        !this.state.isShowAnswer &&
+                        !isShowAnswer &&
                         (
                             <div className="show-answer" onClick={this.showAnswer}>
                                 <span>查看解析<i className='iconfont iconiconfront-69'></i></span>
@@ -90,38 +59,30 @@ export default class Examination extends React.Component {
                     }
                 </div>
                 {
-                    this.state.isShowAnswer && <Answer content={answer} isShowAnswer></Answer>
+                    isShowAnswer && <Answer content={analysis} isShowAnswer/>
                 }
-                <OpenApp></OpenApp>
+                <OpenApp/>
             </div>
         )
     }
 }
 
-function MultipleChoice({options, correct, showCorrect}) {
+const MultiChoice = React.memo(({options, showCorrect}) => {
     return (
         <ul className='options'>
             {
                 options.map((item, index) => (
-                    <li key={index} className={classnames('option', {'active': correct === item.id && showCorrect})}>
+                    <li key={index} className={classnames('option', {'active': item.is_ans === 1 && showCorrect})}>
                         <span className="alphabet">{String.fromCharCode(65 + index)}</span>
-                        {item.ans}
+                        {item.des}
                     </li>
                 ))
             }
         </ul>
     )
-}
+})
 
-function SAQ({content}) {
-    return (
-        <p className={'saq-content'}>
-            {content}
-        </p>
-    )
-}
-
-function Answer({content, isShowAnswer}) {
+const Answer = React.memo(({content, isShowAnswer}) => {
     return (
         <div className={classnames('answer', {scale: isShowAnswer})}>
             <p className='legend'>解析</p>
@@ -129,7 +90,5 @@ function Answer({content, isShowAnswer}) {
                 {content}
             </p>
         </div>
-
     )
-}
-
+})

src/components/study/myCourses/index.js

@@ -6,6 +6,7 @@ import { connect } from "react-redux"
 import { fetchCoursesListIfNeeded, switchTab } from "./actions"
 import InfiniteScroll from 'react-infinite-scroller'
 import { debounce } from 'lodash'
+import { Link } from 'react-router-dom'
 
 
 function getStudyTime(seconds) {
@@ -78,20 +79,14 @@ class MyCourses extends PureComponent {
     }
 
     componentDidMount() {
-        console.log('did mount')
         this.props.switchTab(false)
         this.props.fetchCoursesListIfNeeded();
     }
 
     componentWillUnmount(){
-        console.log('will unmount')
         this.props.switchTab(true);
     }
 
-    componentDidUpdate() {
-        console.log('updated')
-    }
-
     loadFunc = debounce(() => {
         if (this.props.courseList.length % 10 === 0) {
             this.props.fetchCoursesListIfNeeded();
@@ -144,7 +139,7 @@ class MyCourses extends PureComponent {
                     <p><i className='iconfont iconfish'/></p>
                     <p className='empty-prompt'>还是咸鱼一条，快去翻身~</p>
                     <p>
-                        <button>去选课</button>
+                        <Link className='select-course' to='/classify'>去选课</Link>
                     </p>
                 </div>
             )

src/components/study/myCourses/my-courses.scss

@@ -83,7 +83,8 @@
         color: $color_666;
     }
 
-    button {
+    .select-course {
+        display: block;
         width: 131px;
         height: 30px;
         border: 1px solid $active;
@@ -91,5 +92,7 @@
         background: transparent;
         color: $active;
         font-size: $font_16;
+        text-align: center;
+        line-height: 30px;
     }
 }
\ No newline at end of file

src/components/study/myCourses/reducers.js

@@ -18,10 +18,14 @@ export default function myCourses(state = initialState, action) {
     switch (action.type) {
         case RECEIVE_MY_COURSES:
             let {courseList, ...rest} = action.payload
-            return {...state, ...rest, courseList: state.courseList.concat(courseList)}
+            return {
+                ...state, ...rest,
+                courseList: Object.keys(courseList).length === 0 ? state.courseList : state.courseList.concat(courseList)
+            }
         case SWITCH_TAB:
             return {...state, switchTab: action.payload}
         case NOMORE_COURSE:
+            return {...state, noMore: true}
         default:
             return state
     }