Merge branch 'feature/yuananting/20210327/test-paper' of…

Merge branch 'feature/yuananting/20210327/test-paper' of https://xmgit.ixm5.cn/xiaomai-cloud-class/xiaomai-cloud-class-web into feature/yuananting/20210327/test-paper

config/webpack.config.js

@@ -663,9 +663,9 @@ module.exports = function (webpackEnv) {
         // The formatter is invoked directly in WebpackDevServerUtils during development
         // The formatter is invoked directly in WebpackDevServerUtils during development
         formatter: isEnvProduction ? typescriptFormatter : undefined,
         formatter: isEnvProduction ? typescriptFormatter : undefined,
       }),
       }),
-      new vConsolePlugin({
-        enable: (process.env.DEPLOY_ENV === 'prod' || process.env.DEPLOY_ENV === 'beta') ? false : true
-      })
+      // new vConsolePlugin({
+      //   enable: (process.env.DEPLOY_ENV === 'prod' || process.env.DEPLOY_ENV === 'beta') ? false : true
+      // })
     ].filter(Boolean),
     ].filter(Boolean),
     // Some libraries import Node modules but don't use them in the browser.
     // Some libraries import Node modules but don't use them in the browser.
     // Tell webpack to provide empty mocks for them so importing them works.
     // Tell webpack to provide empty mocks for them so importing them works.

src/@types/react-app-env.d.ts

@@ -66,4 +66,6 @@ declare module '*.module.css' {
 declare module '*.module.less' {
 declare module '*.module.less' {
   const classes: { readonly [key: string]: string };
   const classes: { readonly [key: string]: string };
   export default classes;
   export default classes;
-}
+}
\ No newline at end of file
+
+declare module '@/components/GraphicsEditor'
\ No newline at end of file

src/components/index.js

@@ -11,6 +11,7 @@ import CheckBox from './CheckBox.tsx';
 import CropperModal from './CropperModal.tsx';
 import CropperModal from './CropperModal.tsx';
 import ImgCutModalNew from './ImgCutModalNew';
 import ImgCutModalNew from './ImgCutModalNew';
 
 
+
 export {
 export {
   SearchBar,
   SearchBar,
   PageControl,
   PageControl,

src/modules/course-manage/components/GraphicsEditor.jsx

@@ -167,10 +167,10 @@ class GraphicsEditor extends React.Component {
 
 
   render() {
   render() {
     const { editorId, textLength } = this.state;
     const { editorId, textLength } = this.state;
-    const { limitLength = 1000, isIntro } = this.props;
+    const { limitLength = 1000, isIntro, maxLimit } = this.props;
     return <div className={`graphics-editor-container${isIntro ? ' introduce' : ''}`}>
     return <div className={`graphics-editor-container${isIntro ? ' introduce' : ''}`}>
       <div className="editor-box" id={`editor${editorId}`}></div>
       <div className="editor-box" id={`editor${editorId}`}></div>
-      <div className="editor-tips">({textLength}/100000)</div>
+      <div className="editor-tips">({textLength}/{maxLimit || 100000})</div>
     </div>
     </div>
   }
   }
 }
 }

src/modules/teach-tool/examination-manager/AddExam.less

@@ -6,4 +6,28 @@
             font-size: 18px;
             font-size: 18px;
         }
         }
     }
     }
+
+    .table{
+        border: 1px solid #e8e8e8;
+        width: 600px;
+        margin-left: 45px;
+        margin-top: -10px;
+        .header,.body-list{
+            background-color: #fafafa;
+            display: flex;
+            
+            .item{
+                width: 16%;
+                box-sizing: border-box;
+                line-height: 32px;
+                text-align: center;
+                &.long{
+                    width: 20%;
+                }
+            }
+        }
+        .body-list{
+            background-color: transparent;
+        }
+    }
 }
 }
\ No newline at end of file

src/modules/teach-tool/examination-manager/AddExam.tsx

 import React, { useState, useRef, useEffect, useContext } from 'react'
 import React, { useState, useRef, useEffect, useContext } from 'react'
 import Breadcrumbs from "@/components/Breadcrumbs";
 import Breadcrumbs from "@/components/Breadcrumbs";
-import { Form, Alert, Input, Button } from 'antd';
+import { Form, Alert, Input, Button, InputNumber, DatePicker } from 'antd';
 import { Route, withRouter } from 'react-router-dom';
 import { Route, withRouter } from 'react-router-dom';
+import moment from 'moment'
+import GraphicsEditor from '../../course-manage/components/GraphicsEditor';
 import SelectPaperModal from './SelectPaperModal'
 import SelectPaperModal from './SelectPaperModal'
 import './AddExam.less';
 import './AddExam.less';
 
 
+const { RangePicker } = DatePicker;
+
 function AddExam(props: any) {
 function AddExam(props: any) {
+    const paperInfoInit: any = { passScore: 60 };
+    const [showModal, setShowModal] = useState(false);
+    const [paperInfo, setPaperInfo] = useState(paperInfoInit);
+    const [paperId, setPaperId] = useState('');
+    const [passRate, setPassRate] = useState(60);//及格线
+    const [startTime, setStartTime] = useState('');
+    const [examEndTime, setExamEndTime] = useState('');
+    const [examName, setExamName] = useState('');
+    const [examDuration, setExamDuration] = useState(0);
+    useEffect(() => {
+        console.log(paperInfo)
+        setPaperId(paperInfo.paperId)
+        setPassRate(paperInfo.passScore)
+
+    }, [paperInfo.paperId])
+
+    function disabledDate(current: any) {
+        // Can not select days before today and today
+        return current && current < moment().startOf('day');
+    }
+
 
 
-    const [showModal, setShowModal] = useState(false)
+    function disabledRangeTime(date: any, type: any) {
+
+        if (moment(date).isSame(moment(), 'day')) {
+            return {
+                disabledHours: () => {
+                    const hours = [];
+                    for (let i = 0; i < moment().hour(); i++) {
+                        hours.push(i);
+                    }
+                    return hours;
+                },
+                disabledMinutes: () => {
+                    const currentMinute = moment().minute();
+                    const currentHour = moment(date).hour();
+                    const minutes = [];
+                    if (currentHour === moment().hour()) {
+                        for (let i = 0; i < currentMinute; i++) {
+                            minutes.push(i);
+                        }
+                    }
+                    return minutes;
+                },
+
+            };
+        }
+        return {
+            disabledHours: () => [],
+            disabledMinutes: () => [],
+            disabledSeconds: () => [],
+        };
+    }
 
 
     return <div className="page examPage">
     return <div className="page examPage">
         <Breadcrumbs navList={"新建考试"} goBack={() => props.history.goBack()} />
         <Breadcrumbs navList={"新建考试"} goBack={() => props.history.goBack()} />
@@ -22,21 +77,105 @@ function AddExam(props: any) {
                     layout="horizontal"
                     layout="horizontal"
                 >
                 >
                     <Form.Item label="考试名称" name="size" required>
                     <Form.Item label="考试名称" name="size" required>
-                        <Input placeholder='请输入试卷名称（40字以内）' style={{ width: 300 }} />
+                  
+                        <Input placeholder='请输入试卷名称（40字以内）' value={examName} onChange={(e) => { 
+                            console.log(e.target.value)
+                            setExamName(e.target.value) }} style={{ width: 300 }} />
                     </Form.Item>
                     </Form.Item>
 
 
                     <Form.Item label="选择试卷" name="size" required>
                     <Form.Item label="选择试卷" name="size" required>
-                        <Button onClick={() => { setShowModal(true) }} >选择试卷</Button>
+                        <span style={{ marginRight: 12, lineHeight: '32px' }}>{paperInfo.paperName}</span>  <Button onClick={() => { setShowModal(true) }} >{paperInfo.paperId ? '重新选择' : '选择试卷'}</Button>
+
+
+                    </Form.Item>
+
+                    {
+                        paperInfo.paperId && <div className="table">
+                            <div className="header">
+                                <div className="item">单选题</div>
+                                <div className="item">多选题</div>
+                                <div className="item">判断题</div>
+                                <div className="item">填空题</div>
+                                <div className="item">不定项选择题</div>
+                                <div className="item">合计</div>
+                            </div>
+                            <div className="body-list">
+                                <div className="item">{paperInfo.singleChoiceCnt || 0}题</div>
+                                <div className="item">{paperInfo.multiChoiceCnt || 0}题</div>
+                                <div className="item">{paperInfo.judgeCnt || 0}题</div>
+                                <div className="item">{paperInfo.gapFillingCnt || 0}题</div>
+                                <div className="item long">{paperInfo.indefiniteChoiceCnt || 0}题</div>
+                                <div className="item">{paperInfo.singleChoiceCnt + paperInfo.multiChoiceCnt + paperInfo.judgeCnt + paperInfo.gapFillingCnt + paperInfo.indefiniteChoiceCnt || 0}题</div>
+                            </div>
+                            <div className="body-list">
+                                <div className="item">{paperInfo.singleChoiceCnt || 0}分</div>
+                                <div className="item">{paperInfo.multiChoiceCnt || 0}分</div>
+                                <div className="item">{paperInfo.judgeCnt || 0}分</div>
+                                <div className="item">{paperInfo.gapFillingCnt || 0}分</div>
+                                <div className="item long">{paperInfo.indefiniteChoiceCnt || 0}分</div>
+                                <div className="item">{paperInfo.totalScore || 0}分</div>
+                            </div>
+                        </div>
+                    }
+
+
+                    <Form.Item label="及格线" name="size" required>
+                        <InputNumber value={passRate} onChange={(value: any) => { setPassRate(value) }} style={{ width: 100 }} />
+                        <span style={{ marginLeft: 4 }}>%
+                        </span>
+                        <span style={{ marginLeft: 20, color: "#999" }}>
+                            {`  总分(${paperInfo.totalScore || 0})*及格线（${passRate || 0}%）=及格分数（${parseInt(((paperInfo.totalScore || 0) * (passRate || 0)) as any / 100 + '')}）`}</span>
                     </Form.Item>
                     </Form.Item>
 
 
+                    <Form.Item label="考试有效期" name="size" required>
+                        {/* <RangePicker
+                            ranges={{
+                                '近七天': [moment(), moment().add(6, 'day').endOf('day')],
+                                '近1个月': [moment(), moment().add(1, 'month').endOf('day')],
+                                '近3个月': [moment(), moment().add(3, 'month').endOf('day')],
+                            }}
+                            disabledDate={disabledDate}
+                            // value={[
+                            //     startTime ? moment(Number(startTime)) : null,
+                            //     examEndTime ? moment(Number(examEndTime)) : null
+                            // ]}
+                            disabledTime={disabledRangeTime}
+                            showTime
+                            format="YYYY/MM/DD HH:mm"
+                            onChange={(date: any) => {
+                                setStartTime(date && date[0]?.startOf('day').valueOf());
+                                setExamEndTime(date && date[1]?.endOf('day').valueOf());
 
 
+                            }}
+                        /> */}
+                    </Form.Item>
+                    <Form.Item label="开始时长" name="size" required>
+                        <InputNumber value={examDuration} max={1440} min={1} onChange={(value: any) => { setExamDuration(value) }} style={{ width: 100 }} />
+                        <span style={{ marginLeft: 4 }}>分钟
+                        </span>
+                        <span style={{ marginLeft: 20, color: "#999" }}>
+                            {` 时长不能超过1440分钟（24小时）`}</span>
+                    </Form.Item>
 
 
+                    <Form.Item label="开始时长" name="size" required>
+                        <GraphicsEditor
+               
+                            isIntro={true}
+                            detail={{
+                                content: ''
+                            }}
+                            onChange={(val:any) => {  }}
+                        />
+                    </Form.Item>
                 </Form>
                 </Form>
             </div>
             </div>
 
 
         </div>
         </div>
         {
         {
-            showModal && <SelectPaperModal close={() => { setShowModal(false) }}></SelectPaperModal>
+            showModal && <SelectPaperModal onSelect={(info: any) => {
+                console.log(info, 'jkhjkhjk')
+                setPaperInfo(info)
+            }} paperInfo={paperInfo} close={() => { setShowModal(false) }}></SelectPaperModal>
         }
         }
 
 
     </div>
     </div>

src/modules/teach-tool/examination-manager/Index.tsx

@@ -208,7 +208,7 @@ function ExaminationManager(props: any) {
                                 onChange={(date: any) => {
                                 onChange={(date: any) => {
                                     const _query = { ...query }
                                     const _query = { ...query }
                                     _query.examStartTime = date && date[0]?.startOf('day').valueOf();
                                     _query.examStartTime = date && date[0]?.startOf('day').valueOf();
-                                    _query.examEndTime = date && date[0]?.endOf('day').valueOf();
+                                    _query.examEndTime = date && date[1]?.endOf('day').valueOf();
                                     setQuery(_query);
                                     setQuery(_query);
 
 
                                 }} />
                                 }} />
@@ -224,7 +224,7 @@ function ExaminationManager(props: any) {
                                 onChange={(date: any) => {
                                 onChange={(date: any) => {
                                     const _query = { ...query }
                                     const _query = { ...query }
                                     _query.createStartTime = date && date[0]?.startOf('day').valueOf();
                                     _query.createStartTime = date && date[0]?.startOf('day').valueOf();
-                                    _query.createEndTime = date && date[0]?.endOf('day').valueOf();
+                                    _query.createEndTime = date && date[1]?.endOf('day').valueOf();
                                     setQuery(_query);
                                     setQuery(_query);
 
 
                                 }} />
                                 }} />

src/modules/teach-tool/examination-manager/SelectPaperModal.tsx

 import React, { useState, useRef, useEffect, useContext } from 'react'
 import React, { useState, useRef, useEffect, useContext } from 'react'
-import { Modal } from 'antd';
+import { message, Modal } from 'antd';
 import { withRouter } from 'react-router-dom';
 import { withRouter } from 'react-router-dom';
 import ExaminationPaperContent from '../examination-paper/ExaminationPaperContent'
 import ExaminationPaperContent from '../examination-paper/ExaminationPaperContent'
 import './AddExam.less';
 import './AddExam.less';
+import user from '@/common/js/user';
 
 
 function SelectPaperModal(props: any) {
 function SelectPaperModal(props: any) {
 
 
-    const [item, setItem] = useState({paperId:''});
+    const [item, setItem] = useState(props.paperInfo);
+    const itemRef = useRef({})
 
 
     useEffect(() => {
     useEffect(() => {
-        console.log(item)
+        itemRef.current = item
+        console.log(item, 'khjkhjkhjk')
     }, [item])
     }, [item])
 
 
     return <Modal
     return <Modal
         width={900}
         width={900}
         title="选择试卷"
         title="选择试卷"
         visible={true}
         visible={true}
-        onOk={() => { }
+        onOk={() => {
+            props.onSelect(itemRef.current);
+            props.close();
+        }
         }
         }
         onCancel={() => { props.close() }}
         onCancel={() => { props.close() }}
     >
     >

src/modules/teach-tool/examination-paper/components/ExaminationPaperContent.jsx

@@ -254,7 +254,7 @@ class ExaminationPaperContent extends Component {
     this.setState({
     this.setState({
       selectedRowKeys
       selectedRowKeys
     })
     })
-    this.props.onSelect(selectedRows)
+    this.props.onSelect(selectedRows[0] || {})
   }
   }
 
 
   render() {
   render() {