-
-
+
+ {/*
*/}
+ {/*
*/}
+
-
- {/* {currentKeyMap === 0 &&
} */}
- {currentKeyMap === 0 &&
}
- {currentKeyMap === 1 &&
}
+
- )
- }
+
+
+
+
+
+ {currentKeyMap === 0 && }
+ {currentKeyMap === 1 && }
+
+
+
+ )
}
+
+export default PersonalCenter
diff --git a/src/views/personal-center/index.less b/src/views/personal-center/index.less
index 9c0577e..f039835 100644
--- a/src/views/personal-center/index.less
+++ b/src/views/personal-center/index.less
@@ -1,7 +1,6 @@
.personal-center-box {
margin: 0 auto;
width: 1439px;
- // padding: 20px 50px;
border-radius: 5px;
overflow: auto;
.personal-center-introduction {
@@ -11,10 +10,12 @@
margin-bottom: 10px;
display: flex;
justify-content: space-between;
+ align-items: center;
.personal-center-introduction-detail {
margin-left: 50px;
- padding-top: 20px;
+ // padding-top: 20px;
display: flex;
+ align-items: center;
.personal-center-introduction-detail-headImg {
margin-right: 20px;
align-items: center;
@@ -34,8 +35,8 @@
}
.personal-center-introduction-result {
margin-right: 50px;
- padding-top: 30px;
display: flex;
+ align-items: center;
.personal-center-introduction-result-item {
text-align: center;
padding-right: 10px;
@@ -54,7 +55,7 @@
overflow-y: auto;
border-radius: 3px;
width: 300px;
- height: 720px;
+ min-height: 320px;
}
.personal-center-content-right {
background-color: #fff;
diff --git a/src/views/practise/practice-analytic/components/answer-analysis/index.jsx b/src/views/practise/practice-analytic/components/answer-analysis/index.jsx
new file mode 100644
index 0000000..03209c5
--- /dev/null
+++ b/src/views/practise/practice-analytic/components/answer-analysis/index.jsx
@@ -0,0 +1,216 @@
+import req from '@utils/request'
+import { Spin } from 'antd'
+import React, { Component } from 'react'
+import { ApiName, IdKeyLetterKey } from '../../constant'
+import './index.less'
+
+export default class AnswerAnalysis extends Component {
+ constructor(props) {
+ super(props)
+ this.state = {
+ subjectList: [], // 题目列表
+ subjectName: '',
+ optionList: [], // 选项列表
+ labelNames: '', // 标签列表
+ respondAnswer: [], // 你的答案
+ subjectParse: '', // 解析
+ correctAnswer: [], // 正确答案
+ currentIndex: 0, // 当前选中的下标
+ isLoading: false
+ }
+ }
+
+ componentDidMount() {
+ this.getScoreDetail()
+ }
+
+ /**
+ * 答案解析-获得题目列表
+ */
+ getScoreDetail = () => {
+ const { practiceId } = this.props
+ let params = {
+ practiceId: practiceId
+ }
+ req({
+ method: 'post',
+ data: params,
+ url: ApiName.getScoreDetail
+ })
+ .then(res => {
+ if (res?.data && res?.data?.length > 0) {
+ this.setState(
+ {
+ subjectList: res.data
+ },
+ () => {
+ this.getSubjectDetail(0, res.data[0])
+ }
+ )
+ }
+ })
+ .catch(err => console.log(err))
+ }
+
+ /**
+ * 答案解析-获得答案详情
+ * @param {*} index 当前index
+ * @param {*} subjectItem 当前item
+ */
+ getSubjectDetail = (index, subjectItem) => {
+ const { practiceId } = this.props
+ let params = {
+ practiceId: practiceId,
+ subjectId: subjectItem.subjectId,
+ subjectType: subjectItem.subjectType
+ }
+ JDreq({
+ method: 'post',
+ data: params,
+ url: ApiName.getSubjectDetail
+ })
+ .then(res => {
+ if (res.data) {
+ let respondAnswer = res.data.respondAnswer
+ let optionList = []
+ res.data.optionList.forEach(element => {
+ let obj = {
+ isCorrect: element.isCorrect,
+ optionContent: element.optionContent,
+ optionType: element.optionType,
+ isAnswer: 0
+ }
+ if (respondAnswer.includes(element.optionType)) {
+ obj.isAnswer = 1
+ }
+ optionList.push(obj)
+ })
+ this.setState({
+ isLoading: false,
+ currentIndex: index,
+ subjectName: res.data.subjectName,
+ optionList: optionList, // 选项列表
+ labelNames: res.data.labelNames, // 标签列表
+ respondAnswer: respondAnswer, // 你的答案
+ subjectParse: res.data.subjectParse, // 解析
+ correctAnswer: res.data.correctAnswer // 正确答案
+ })
+ }
+ })
+ .catch(err => console.log(err))
+ }
+
+ onChangeOption = (index, item) => () => {
+ let { currentIndex } = this.state
+ if (index === currentIndex) {
+ return
+ }
+ this.getSubjectDetail(index, item)
+ }
+
+ render() {
+ const {
+ subjectList,
+ subjectName,
+ optionList,
+ labelNames,
+ respondAnswer,
+ subjectParse,
+ correctAnswer,
+ currentIndex,
+ isLoading
+ } = this.state
+ const isRight = correctAnswer.join('') !== respondAnswer.join('')
+ return (
+
+
+ {subjectList?.length > 0 && (
+
+
每题得分
+
+ {subjectList.map((item, index) => {
+ return (
+
+ {index + 1}
+
+ )
+ })}
+
+
+ )}
+
+
{currentIndex + 1}
+
{subjectName}
+
+
+ 正确答案：
+ {correctAnswer?.length > 0
+ ? correctAnswer.map((item, index) => {
+ return {IdKeyLetterKey[item] + ' '}
+ })
+ : '空'}
+ 你的答案：
+ {respondAnswer?.length > 0
+ ? respondAnswer.map((item, index) => {
+ return {IdKeyLetterKey[item] + ' '}
+ })
+ : '空'}
+
+ ({isRight ? '错误' : '正确'})
+
+
+ {optionList?.length > 0 && (
+
+ {optionList.map((item, index) => {
+ return (
+
+ )
+ })}
+
+ )}
+ {labelNames?.length > 0 && (
+
+
本题知识点
+
+ {labelNames.map((item, index) => {
+ return (
+
+ {item}
+
+ )
+ })}
+
+
+ )}
+ {!!subjectParse && (
+
+
参考解析
+
{subjectParse}
+
+ )}
+
+ )
+ }
+}
diff --git a/src/views/practise/practice-analytic/components/answer-analysis/index.less b/src/views/practise/practice-analytic/components/answer-analysis/index.less
new file mode 100644
index 0000000..c2d0e6b
--- /dev/null
+++ b/src/views/practise/practice-analytic/components/answer-analysis/index.less
@@ -0,0 +1,146 @@
+.answer-analysis-box {
+ padding-bottom: 30px;
+ // 分页
+ .answer-analysis-paging {
+ padding: 20px 30px;
+ background-color: #fff;
+ border-bottom: 1px solid #ededed;
+ .answer-analysis-paging-tip {
+ margin-bottom: 20px;
+ color: #666;
+ font-size: 14px;
+ }
+ .answer-analysis-paging-list {
+ display: flex;
+ flex-wrap: wrap;
+ .answer-analysis-paging-item {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ margin-right: 4px;
+ margin-bottom: 20px;
+ width: 32px;
+ height: 32px;
+ font-size: 14px;
+ color: white;
+ cursor: pointer;
+ transition: all 0.3s;
+ &:hover {
+ margin-top: -6px;
+ margin-bottom: -6px;
+ height: 44px;
+ }
+ }
+ // 选中
+ .answer-analysis-paging-item-active {
+ margin-top: -6px;
+ margin-bottom: -6px;
+ height: 44px;
+ }
+ // 答错
+ .answer-analysis-error {
+ background-color: #ff431e;
+ }
+ // 答对
+ .answer-analysis-rigth {
+ background-color: rgba(60, 110, 238, 1);
+ }
+ }
+ }
+ // 题名
+ .answer-analysis-name {
+ display: flex;
+ align-items: center;
+ padding: 20px 30px;
+ font-size: 14px;
+ background-color: #fff;
+ border-bottom: 1px solid #ededed;
+ .answer-analysis-name-num {
+ padding: 5px 7px;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ min-width: 30px;
+ color: #fff;
+ font-weight: 400;
+ border-radius: 50%;
+ background-color: rgba(60, 110, 238, 1);
+ }
+ .answer-analysis-name-text {
+ margin-left: 10px;
+ }
+ }
+ // 答案
+ .answer-analysis-answer {
+ padding: 20px 30px;
+ }
+ // 选项
+ .answer-analysis-option-list {
+ display: flex;
+ flex-direction: column;
+ padding: 0 30px;
+ .answer-analysis-option-item {
+ padding: 10px;
+ margin-bottom: 20px;
+ font-size: 14px;
+ border-radius: 6px;
+ border: 1px solid #d4d4d4;
+ background: #fff;
+ }
+ // 正确
+ .answer-analysis-option-item-rigth {
+ border-color: rgba(60, 110, 238, 1);
+ }
+ // 错误
+ .answer-analysis-option-item-error {
+ border-color: #ff431e;
+ }
+ }
+ // 知识点
+ .answer-analysis-points {
+ padding: 0 30px 20px;
+ font-size: 14px;
+ background-color: rgba(60, 110, 238, 0.08);
+ .answer-analysis-points-tip {
+ margin-bottom: 20px;
+ padding-top: 20px;
+ color: rgb(102, 102, 102);
+ }
+ .answer-analysis-points-list {
+ display: flex;
+ justify-content: flex-start;
+ align-items: center;
+ .answer-analysis-points-item {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ margin-right: 4px;
+ padding: 0 8px;
+ height: 22px;
+ color: #999;
+ font-size: 12px;
+ background-color: #fff;
+ border: 1px solid #ddd;
+ border-radius: 12px;
+ &:hover {
+ color: rgba(60, 110, 238, 1);
+ border-color: rgba(60, 110, 238, 1);
+ }
+ }
+ }
+ }
+ // 解析
+ .answer-analysis-parse {
+ padding: 0 30px 20px;
+ font-size: 14px;
+ background-color: #fff;
+ .answer-analysis-parse-tip {
+ margin-bottom: 20px;
+ padding-top: 20px;
+ color: rgb(102, 102, 102);
+ }
+ .answer-analysis-parse-text {
+ color: #333;
+ }
+ }
+}
diff --git a/src/views/practise/practice-analytic/components/assessment-report/index.jsx b/src/views/practise/practice-analytic/components/assessment-report/index.jsx
new file mode 100644
index 0000000..df625a7
--- /dev/null
+++ b/src/views/practise/practice-analytic/components/assessment-report/index.jsx
@@ -0,0 +1,148 @@
+import req from '@utils/request'
+
+import AnalysisAtlas from '@components/analysis-atlas'
+import { splicingQuery } from '@utils'
+import { Button, Spin } from 'antd'
+import React, { Component } from 'react'
+import { ApiName, ModuleName } from '../../constant'
+import RecommendList from '../recommend-list'
+import './index.less'
+
+class AssessmentReport extends Component {
+ constructor(props) {
+ super(props)
+ this.state = {
+ correctSubject: '3',
+ recommendSetList: [],
+ skill: [],
+ title: '测试试卷',
+ isLoading: false
+ }
+ }
+
+ componentDidMount() {
+ this.getReport()
+ }
+
+ /**
+ * 答案解析-获得评估报告
+ */
+ getReport = async () => {
+ const { practiceId } = this.props
+ let params = {
+ practiceId: practiceId
+ }
+ await req({
+ method: 'post',
+ data: params,
+ url: ApiName.getReport
+ })
+ .then(res => {
+ if (res?.data) {
+ let list = res.data.skill || []
+ let len = res.data.skill.length
+ if (len === 1) {
+ let l1 = [
+ { name: res.data.skill[0].name + ' ', star: res.data.skill[0].star },
+ {
+ name: ' ' + res.data.skill[0].name + ' ',
+ star: res.data.skill[0].star
+ }
+ ]
+ list = list.concat(l1)
+ } else if (len === 2) {
+ let l1 = [{ name: res.data.skill[1].name + ' ', star: res.data.skill[1].star }]
+ list = list.concat(l1)
+ }
+ this.setState({
+ isLoading: false,
+ title: res.data.title,
+ correctSubject: res.data.correctSubject,
+ recommendSetList: res.data.recommendSetList,
+ skill: list
+ })
+ }
+ })
+ .catch(err => console.log(err))
+ }
+
+ /**
+ * 练习其他技能
+ */
+ onChangePracticeOther = () => {
+ this.props.history.push('/practice-questions')
+ }
+
+ /**
+ * 查看答案解析
+ */
+ onChangeAnswerAnalysis = () => {
+ this.props.onHandleAnswerAnalysis && this.props.onHandleAnswerAnalysis(ModuleName.analysis)
+ }
+
+ /**
+ * 点击推荐套题
+ * @param {*} setId
+ * @returns
+ */
+ onChangeSetId = setId => {
+ this.props.history.push(
+ splicingQuery('/practice-details', {
+ setId
+ })
+ )
+ }
+
+ render() {
+ const { correctSubject, recommendSetList, skill, title, isLoading } = this.state
+ return (
+
+
+
+
+ {/*
+
+ 得分：12
+
*/}
+
试卷：{title}
+
正确题数：{correctSubject}
+
+
+
+
+ {recommendSetList?.length > 0 && (
+
+ )}
+
+
+
+
+ )
+ }
+}
+
+export default AssessmentReport
diff --git a/src/views/practise/practice-analytic/components/assessment-report/index.less b/src/views/practise/practice-analytic/components/assessment-report/index.less
new file mode 100644
index 0000000..99cc5d5
--- /dev/null
+++ b/src/views/practise/practice-analytic/components/assessment-report/index.less
@@ -0,0 +1,63 @@
+.assessment-report-box {
+ .assessment-report-top {
+ display: flex;
+ padding: 30px 24px;
+ background-color: #fff;
+ .assessment-report-main {
+ flex: 1;
+ padding: 20px 0 20px 16px;
+ // // 得分
+ // .assessment-report-defen {
+ // display: flex;
+ // align-items: center;
+ // margin-bottom: 20px;
+ // color: #888;
+ // .assessment-report-defen-icon {
+ // margin-right: 4px;
+ // width: 28px;
+ // height: 28px;
+ // }
+ // }
+ .assessment-report-item {
+ margin-bottom: 20px;
+ font-size: 16px;
+ font-weight: 600;
+ }
+ // 再练一套
+ .assessment-report-submit {
+ height: 40px;
+ border-color: rgba(60, 110, 238, 1);
+ background-color: rgba(60, 110, 238, 1);
+ }
+ }
+ // 图谱
+ .assessment-report-tupu {
+ flex: 1;
+ padding: 20px 0 20px 30px;
+ border-left: 1px solid #ddd;
+ .assessment-report-tupu-tip {
+ margin-bottom: 20px;
+ color: #888;
+ font-size: 16px;
+ }
+ .assessment-report-tupu-content {
+ margin: 0 auto;
+ width: 200px;
+ height: 200px;
+ }
+ }
+ }
+ // 查看答案解析
+ .assessment-report-answer-analysis {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ margin: 30px 0;
+ .assessment-report-answer-btn {
+ width: 260px;
+ height: 40px;
+ border-color: rgba(60, 110, 238, 1);
+ background-color: rgba(60, 110, 238, 1);
+ }
+ }
+}
diff --git a/src/views/practise/practice-analytic/components/recommend-list/index.jsx b/src/views/practise/practice-analytic/components/recommend-list/index.jsx
new file mode 100644
index 0000000..7bbebb8
--- /dev/null
+++ b/src/views/practise/practice-analytic/components/recommend-list/index.jsx
@@ -0,0 +1,39 @@
+import { debounce } from '@utils'
+import React from 'react'
+import { RecommendBackImg } from '../../constant'
+import './index.less'
+
+export default function RecommendList(props) {
+ const { recommendSetList } = props
+ /**
+ * 点击推荐套题
+ * @param {*} setId
+ * @returns
+ */
+ const onChangeSetId = setId =>
+ debounce(() => {
+ props.onHandleSetId && props.onHandleSetId(setId)
+ })
+ return (
+
+
根据本次练习，为你推荐以下内容
+
+ {recommendSetList.map((item, index) => {
+ return (
+
+
{item.setName}
+
热度指数：{item.setHeat}
+
+ )
+ })}
+
+
+ )
+}
diff --git a/src/views/practise/practice-analytic/components/recommend-list/index.less b/src/views/practise/practice-analytic/components/recommend-list/index.less
new file mode 100644
index 0000000..e50655f
--- /dev/null
+++ b/src/views/practise/practice-analytic/components/recommend-list/index.less
@@ -0,0 +1,64 @@
+// 推荐
+.assessment-report-recommend {
+ margin-top: 30px;
+ padding: 30px 40px;
+ background-color: #fff;
+ .assessment-report-recommend-tip {
+ position: relative;
+ margin-bottom: 30px;
+ margin-left: 16px;
+ font-size: 16px;
+ color: #333;
+ &:before {
+ content: '';
+ position: absolute;
+ left: -16px;
+ top: 8px;
+ width: 8px;
+ height: 8px;
+ background: rgba(255, 158, 32, 1);
+ }
+ }
+ // 推荐列表
+ .assessment-report-recommend-list {
+ display: flex;
+ .recommend-item {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: space-between;
+ margin-right: 10px;
+ padding: 20px;
+ width: 220px;
+ height: 130px;
+ border-radius: 10px;
+ background-size: 100% 100%;
+ background-repeat: no-repeat;
+ cursor: pointer;
+ transition: all 0.5s;
+ &:hover {
+ box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.08);
+ }
+ .recommend-item-name {
+ display: flex;
+ justify-content: flex-start;
+ margin-bottom: 10px;
+ width: 100%;
+ color: #fff;
+ font-size: 16px;
+ overflow: hidden;
+ text-overflow: ellipsis; //省略
+ display: -webkit-box;
+ -webkit-line-clamp: 2;
+ -webkit-box-orient: vertical;
+ }
+ .recommend-item-heat {
+ display: flex;
+ justify-content: flex-end;
+ width: 100%;
+ color: #fff;
+ font-size: 14px;
+ }
+ }
+ }
+}
diff --git a/src/views/practise/practice-analytic/constant.js b/src/views/practise/practice-analytic/constant.js
new file mode 100644
index 0000000..33f1814
--- /dev/null
+++ b/src/views/practise/practice-analytic/constant.js
@@ -0,0 +1,53 @@
+export const ModuleName = {
+ /**
+ * 评估报告
+ */
+ assessment: 'assessment',
+ /**
+ * 答案解析
+ */
+ analysis: 'analysis',
+};
+
+export const ImgObj = {
+ defen: 'https://img10.360buyimg.com/imagetools/jfs/t1/197806/1/18639/2369/61a095a8E09f4e860/493d753073a4a9fa.png',
+};
+
+export const ApiName = {
+ /**
+ * 获得评价
+ */
+ getReport: '/admin/practice/detail/getReport',
+ /**
+ * 答案详情
+ */
+ getSubjectDetail: '/admin/practice/detail/getSubjectDetail',
+ /**
+ * 获得题号
+ */
+ getScoreDetail: 'admin/practice/detail/getScoreDetail',
+};
+
+/**
+ * id对应字母
+ */
+export const IdKeyLetterKey = {
+ 1: 'A',
+ 2: 'B',
+ 3: 'C',
+ 4: 'D',
+ 5: 'E',
+ 6: 'F',
+ 7: 'G',
+ 8: 'H',
+};
+
+/**
+ * 推荐对应的背景图
+ */
+export const RecommendBackImg = {
+ 0: 'https://img11.360buyimg.com/imagetools/jfs/t1/202713/11/17151/312/61a5dea1E5623fea6/2922d716cae01b28.png',
+ 1: 'https://img10.360buyimg.com/imagetools/jfs/t1/142359/35/22866/2975/61a5dea0E3fcd563c/78ee45555dd19cda.png',
+ 2: 'https://img13.360buyimg.com/imagetools/jfs/t1/161380/34/26207/1078/61a5dea0E7824463e/4e18f74e8c6439ad.png',
+ 3: 'https://img14.360buyimg.com/imagetools/jfs/t1/160815/15/27226/880/61a5e1e6E152b08b7/fb698b8321d08246.png',
+};
diff --git a/src/views/practise/practice-analytic/index.jsx b/src/views/practise/practice-analytic/index.jsx
new file mode 100644
index 0000000..d32348a
--- /dev/null
+++ b/src/views/practise/practice-analytic/index.jsx
@@ -0,0 +1,69 @@
+import { Tabs } from 'antd'
+import React, { Component } from 'react'
+import AnswerAnalysis from './components/answer-analysis'
+import AssessmentReport from './components/assessment-report'
+import { ModuleName } from './constant'
+import './index.less'
+const { TabPane } = Tabs
+
+const practiceAnalyticTabList = [
+ { tab: '评估报告', key: ModuleName.assessment },
+ { tab: '答案解析', key: ModuleName.analysis }
+]
+export default class PracticeAnalytic extends Component {
+ constructor(props) {
+ super(props)
+ this.state = { currentKey: ModuleName.assessment }
+ }
+
+ /**
+ * 切换card tab
+ * @param {*} key
+ */
+ onTabChange = key => {
+ this.setState({ currentKey: key })
+ }
+
+ render() {
+ const { currentKey } = this.state
+ console.log(this.props)
+ // const urlParams = queryParse(this.props.location.search)
+ // if (!urlParams.practiceId) {
+ // return null
+ // }
+ return (
+
+
{
+ this.onTabChange(key, 'key')
+ }}
+ >
+ {practiceAnalyticTabList.map(item => {
+ return
+ })}
+
+ {currentKey == ModuleName.assessment ? (
+
{
+ this.onTabChange(key, 'key')
+ }}
+ practiceId={1}
+ />
+ ) : (
+
+ )}
+
+ )
+ }
+}
diff --git a/src/views/practise/practice-analytic/index.less b/src/views/practise/practice-analytic/index.less
new file mode 100644
index 0000000..2d8d1dd
--- /dev/null
+++ b/src/views/practise/practice-analytic/index.less
@@ -0,0 +1,20 @@
+.practice-analytic-box {
+ margin: 0 auto;
+ width: 1430px;
+ border: 1px solid #e0e0e0;
+ overflow-y: auto;
+ .ant-tabs.ant-tabs-card .ant-tabs-card-bar .ant-tabs-tab {
+ background-color: #fff;
+ border-radius: 0;
+ border: none;
+ }
+ .ant-tabs.ant-tabs-card .ant-tabs-card-bar .ant-tabs-tab-active {
+ color: #fff;
+ background-color: #1890ff;
+ }
+ // 将body背景重置作为灰色
+ .ant-card-body {
+ background-color: #f3f4f6;
+ padding: 0;
+ }
+}
diff --git a/src/views/practise/practice-details/components/practice-action/index.jsx b/src/views/practise/practice-details/components/practice-action/index.jsx
new file mode 100644
index 0000000..8791f20
--- /dev/null
+++ b/src/views/practise/practice-details/components/practice-action/index.jsx
@@ -0,0 +1,79 @@
+import { debounce } from '@utils'
+import { Button } from 'antd'
+import React, { Fragment } from 'react'
+import { ImgObj, mark } from '../../constant'
+import './index.less'
+
+export default function PracticeAction(props) {
+ const { isLast, isMark } = props
+
+ /**
+ * 标记一下
+ * @returns
+ */
+ const onChangeMark = debounce(() => {
+ props.onHandleMark && props.onHandleMark()
+ })
+
+ /**
+ * 交卷
+ * @returns
+ */
+ const onChangeOver = debounce(() => {
+ props.onHandleOver && props.onHandleOver()
+ })
+
+ /**
+ * 提前交卷
+ * @returns
+ */
+ const onChangeAdvanceOver = debounce(() => {
+ props.onHandleAdvanceOver && props.onHandleAdvanceOver()
+ })
+
+ /**
+ * 下一题
+ * @returns
+ */
+ const onChangeNext = debounce(() => {
+ props.onHandleNext && props.onHandleNext()
+ })
+
+ return (
+
+
+
+
+
+ {mark[isMark]}
+
+
+
+
+ {isLast ? (
+
+ ) : (
+
+ )}
+
+ {!isLast && (
+
+
+
+ )}
+
+
*交卷即可查看全部答案和解析
+
+ )
+}
diff --git a/src/views/practise/practice-details/components/practice-action/index.less b/src/views/practise/practice-details/components/practice-action/index.less
new file mode 100644
index 0000000..de85f09
--- /dev/null
+++ b/src/views/practise/practice-details/components/practice-action/index.less
@@ -0,0 +1,42 @@
+// 标记/提前交卷/交卷/下一题
+.practice-action-box {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ font-size: 14px;
+ .practice-action-list {
+ display: flex;
+ // 标记
+ .practice-action-item {
+ margin-right: 30px;
+ line-height: 20px;
+ cursor: pointer;
+ .action-mark-icon {
+ margin-right: 4px;
+ width: 20px;
+ height: 20px;
+ }
+ }
+ // 按钮
+ .practice-action-button {
+ margin: 0 15px;
+ .action-button-advance-submit {
+ background-color: #ff6547;
+ border-color: #ff6547;
+ color: white;
+ }
+ .action-button-submit {
+ background-color: rgba(60, 110, 238, 1);
+ border-color: rgba(60, 110, 238, 1);
+ color: white;
+ }
+ }
+ }
+}
+// 提示
+.practice-action-tips {
+ margin-top: 10px;
+ color: #888;
+ font-size: 14px;
+ text-align: right;
+}
diff --git a/src/views/practise/practice-details/components/practice-advance/index.jsx b/src/views/practise/practice-details/components/practice-advance/index.jsx
new file mode 100644
index 0000000..4e78f43
--- /dev/null
+++ b/src/views/practise/practice-details/components/practice-advance/index.jsx
@@ -0,0 +1,36 @@
+import { Modal } from 'antd'
+import React from 'react'
+import { ImgObj } from '../../constant'
+import './index.less'
+
+export default function PracticeAdvance(props) {
+ const { isShowModalBox } = props
+ const onSubmitModal = () => {
+ props.onHandleSubmitModal && props.onHandleSubmitModal()
+ }
+ const onCancelModal = () => {
+ props.onHandleCancelModal && props.onHandleCancelModal()
+ }
+ return (
+
+
+
+
+
+
+ 你还有部分题目未完成，交卷即可查看试卷全部答案及解析，是否立即交卷？
+
+
+ )
+}
diff --git a/src/views/practise/practice-details/components/practice-advance/index.less b/src/views/practise/practice-details/components/practice-advance/index.less
new file mode 100644
index 0000000..ae58e2e
--- /dev/null
+++ b/src/views/practise/practice-details/components/practice-advance/index.less
@@ -0,0 +1,21 @@
+.practice-advance-box {
+ .practice-advance {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ padding: 28px 0;
+ .practice-advance-img {
+ width: 80px;
+ height: 80px;
+ .practice-advance-icon {
+ width: 100%;
+ height: 100%;
+ }
+ }
+ .practice-advance-text {
+ margin: 10px;
+ padding: 0 50px;
+ text-align: center;
+ }
+ }
+}
diff --git a/src/views/practise/practice-details/components/practice-paging/index.jsx b/src/views/practise/practice-details/components/practice-paging/index.jsx
new file mode 100644
index 0000000..104591b
--- /dev/null
+++ b/src/views/practise/practice-details/components/practice-paging/index.jsx
@@ -0,0 +1,50 @@
+import { AppstoreOutlined } from '@ant-design/icons'
+import { debounce } from '@utils'
+import React, { Fragment } from 'react'
+import './index.less'
+
+export default function PracticePaging(props) {
+ const { subjectList, singleLength, multipleLength, judgeLength } = props
+ const onChangePaging = index =>
+ debounce(() => {
+ props.onHandlePaging && props.onHandlePaging(index)
+ })
+ return (
+
+ {subjectList?.length > 0 && (
+
+
+
答题卡
+
+
+ 单选题{singleLength}道 ｜ 多选题{multipleLength}道 ｜ 判断题
+ {judgeLength}道
+
+
+
+ {subjectList.map((item, index) => {
+ return (
+
0
+ ? 'practice-paging-item-answer'
+ : 'practice-paging-item-unactive'
+ } `}
+ onClick={onChangePaging(index)}
+ >
+ {index + 1}
+
+ )
+ })}
+
+
+ )
+}
diff --git a/src/views/practise/practice-details/components/practice-paging/index.less b/src/views/practise/practice-details/components/practice-paging/index.less
new file mode 100644
index 0000000..f8b8767
--- /dev/null
+++ b/src/views/practise/practice-details/components/practice-paging/index.less
@@ -0,0 +1,70 @@
+.practice-paging-box {
+ padding: 20px;
+ border-top: 1px dashed #ddd;
+ .practice-paging-tips {
+ display: flex;
+ justify-content: space-between;
+ margin-bottom: 10px;
+ font-size: 16px;
+ color: #666;
+ .practice-paging-tip {
+ padding: 5px 10px;
+ font-size: 14px;
+ background: #f2f2f2;
+ }
+ }
+
+ .practice-paging-list {
+ display: flex;
+ flex-wrap: wrap;
+ .practice-paging-item {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ margin-right: 10px;
+ width: 40px;
+ height: 40px;
+ font-size: 16px;
+ cursor: pointer;
+ &:hover {
+ color: white;
+ background-color: rgba(60, 110, 238, 1);
+ }
+ }
+ // 未选中
+ .practice-paging-item-unactive {
+ color: #dce4ec;
+ &:after {
+ background: #aaa;
+ }
+ }
+ // 选中
+ .practice-paging-item-active {
+ color: white;
+ background-color: rgba(60, 110, 238, 1);
+ &:after {
+ background: #fff;
+ }
+ }
+ // 有答案
+ .practice-paging-item-answer {
+ color: rgba(60, 110, 238, 1);
+ &:after {
+ background: rgba(60, 110, 238, 1);
+ }
+ }
+ // 被标记
+ .practice-paging-item-mark {
+ position: relative;
+ &:after {
+ content: '';
+ position: absolute;
+ right: 3px;
+ top: 3px;
+ width: 4px;
+ height: 4px;
+ border-radius: 50%;
+ }
+ }
+ }
+}
diff --git a/src/views/practise/practice-details/constant.js b/src/views/practise/practice-details/constant.js
new file mode 100644
index 0000000..d2bf18a
--- /dev/null
+++ b/src/views/practise/practice-details/constant.js
@@ -0,0 +1,43 @@
+export const mark = {
+ 0: '标记一下',
+ 1: '已标记',
+};
+
+export const collection = {
+ 0: '未收藏',
+ 1: '已收藏',
+};
+
+export const quetionsType = {
+ 1: '单选题',
+ 2: '多选题',
+ 3: '判断题',
+};
+
+export const ApiName = {
+ /**
+ * 获取练习题目
+ */
+ getSubjects: '/admin/practice/set/getSubjects',
+
+ /**
+ * 获取练习题目详情
+ */
+ getPracticeSubject: '/admin/practice/set/getPracticeSubject',
+
+ /**
+ * 交卷
+ */
+ submitSubject: '/admin/practice/detail/submit',
+};
+
+export const ImgObj = {
+ stop: 'https://img10.360buyimg.com/imagetools/jfs/t1/206561/1/10729/2819/619f783cE77dd49ed/54eb1fc4b3144a97.png',
+ run: 'https://img11.360buyimg.com/imagetools/jfs/t1/161735/6/25253/2598/619f783cEa897a673/fbf4e8c05d40feb5.png',
+ info: 'https://img13.360buyimg.com/imagetools/jfs/t1/217399/4/5733/2641/619f7b91E0894649e/2f6353fe0d35fb46.png',
+ questionMark:
+ 'https://img12.360buyimg.com/imagetools/jfs/t1/201809/8/16630/2674/61a04963E92475548/ede8a7f006113cae.png',
+ mark: 'https://img12.360buyimg.com/imagetools/jfs/t1/207329/30/11079/2474/61a70ad0E64730d1c/ed75ee746fb33926.png',
+ advanceTip:
+ 'https://img11.360buyimg.com/imagetools/jfs/t1/161028/16/25609/6746/61a08d83E06659dfa/e6418acdab948134.png',
+};
diff --git a/src/views/practise/practice-details/index.jsx b/src/views/practise/practice-details/index.jsx
new file mode 100644
index 0000000..6aa434a
--- /dev/null
+++ b/src/views/practise/practice-details/index.jsx
@@ -0,0 +1,511 @@
+import Timer from '@components/timerCom/FlipClock'
+import { getCurrentTime, splicingQuery } from '@utils'
+import req from '@utils/request'
+import { Checkbox, Modal, Radio } from 'antd'
+import _ from 'lodash'
+import React, { Component } from 'react'
+import PracticeAction from './components/practice-action'
+import PracticeAdvance from './components/practice-advance'
+import PracticePaging from './components/practice-paging'
+import { ApiName, ImgObj, quetionsType } from './constant'
+import './index.less'
+
+export default class PracticeDetails extends Component {
+ constructor(props) {
+ super(props)
+ this.state = {
+ isMark: 0, // 是否标记
+ isCollection: 0,
+ currentActive: '',
+ subjectList: [], // 总题目列表
+ subjectObject: {}, //题目
+ currentIndex: 0,
+ isShowAdvanOverceBox: false,
+ isShowStopBox: false
+ }
+ }
+
+ timerRef = React.createRef()
+ subjectTitle = ''
+ singleLength = 0
+ multipleLength = 0
+ judgeLength = 0
+ setId = ''
+
+ componentDidMount() {
+ // const urlParams = queryParse(this.props.location.search)
+ // this.setId = urlParams.setId
+ this.getSubjectList()
+ this.timerRef.current.run()
+ // window.addEventListener('beforeunload', this.listener);
+ }
+
+ componentWillUnmount() {
+ // window.addEventListener('beforeunload', this.listener);
+ }
+
+ //监听屏幕刷新，关闭默认事件，界面没有动，不会拦截
+ listener = ev => {
+ ev.preventDefault()
+ ev.returnValue = ''
+ }
+
+ /**
+ * 获得题目列表
+ */
+ getSubjectList = () => {
+ let params = {
+ setId: this.setId
+ }
+ this.subjectTitle = '热门题目练习'
+ this.singleLength = 1
+ this.multipleLength = 1
+ this.judgeLength = 1
+ const list = [
+ {
+ subjectType: 1,
+ subjectId: 1
+ },
+ {
+ subjectType: 2,
+ subjectId: 2
+ },
+ {
+ subjectType: 3,
+ subjectId: 3
+ }
+ ]
+ this.setState({
+ subjectList: [...list]
+ })
+ _.set(list, [0, 'active'], true)
+ this.getPracticeSubject(list[0], list, 0, [])
+ // req({
+ // method: 'post',
+ // data: params,
+ // url: ApiName.getSubjects
+ // })
+ // .then(res => {
+ // if (res.data && res.data?.subjectList?.length > 0) {
+ // let list = res.data.subjectList
+ // this.singleLength =
+ // list?.length > 0 ? list.filter(item => item.subjectType === 1).length : 0
+ // this.multipleLength =
+ // list?.length > 0 ? list.filter(item => item.subjectType === 2).length : 0
+ // this.judgeLength =
+ // list?.length > 0 ? list.filter(item => item.subjectType === 3).length : 0
+ // this.subjectTitle = res.data?.title || '' // 总题目列表
+ // this.getPracticeSubject(list[0], list, 0, [])
+ // }
+ // })
+ // .catch(err => console.log(err))
+ }
+
+ /**
+ * 获得题目详情
+ * @param {*} item 选择的项
+ * @param {*} subjectList 题目列表
+ * @param {*} index 选择的下标
+ * @param {*} activeList 选中的列表
+ * @param {*} isMark 是否被标记
+ */
+ getPracticeSubject = (item, subjectList, index, activeList, isMark = 0) => {
+ let params = {
+ subjectId: item.subjectId,
+ subjectType: item.subjectType
+ }
+
+ const optionList =
+ item.subjectType === 3
+ ? [
+ {
+ optionContent: '正确',
+ optionType: 1
+ },
+ {
+ optionContent: '错误',
+ optionType: 0
+ }
+ ]
+ : [
+ {
+ optionType: 1,
+ optionContent: '
题目答案1
'
+ },
+ {
+ optionType: 2,
+ optionContent: '
题目答案2
'
+ },
+ {
+ optionType: 3,
+ optionContent: '
题目答案3
'
+ }
+ ]
+
+ return this.setState({
+ currentIndex: index,
+ currentActive: item.subjectType === 2 ? activeList : activeList[0],
+ subjectObject: {
+ subjectName: '题干内容',
+ subjectType: item.subjectType,
+ optionList,
+ // subjectList: subjectList,
+ // currentIndex: index,
+ // currentActive: item.sub??jectType === 2 ? activeList : activeList[0],
+ isMark: isMark
+ }
+ })
+ req({
+ method: 'post',
+ data: params,
+ url: ApiName.getPracticeSubject
+ })
+ .then(res => {
+ if (res.data) {
+ let subjectObject = res.data
+ if (item.subjectType === 3) {
+ subjectObject.optionList = [
+ {
+ optionContent: '正确',
+ optionType: 1
+ },
+ {
+ optionContent: '错误',
+ optionType: 0
+ }
+ ]
+ }
+ this.setState({
+ subjectObject: res.data,
+ subjectList: subjectList,
+ currentIndex: index,
+ currentActive: item.subjectType === 2 ? activeList : activeList[0],
+ isMark: isMark
+ })
+ }
+ })
+ .catch(err => console.log(err))
+ }
+
+ /**
+ * 选择单选
+ * @param {*} e
+ * @returns
+ */
+ onChangeRadio = e => () => {
+ let { currentIndex, subjectList } = this.state
+ _.set(subjectList, [currentIndex, 'activeList'], [e])
+ this.setState({
+ currentActive: e,
+ subjectList
+ })
+ }
+
+ /**
+ * 选择多选
+ * @param {*} e
+ * @returns
+ */
+ onChangeCheck = e => {
+ let { currentIndex, subjectList } = this.state
+ _.set(subjectList, [currentIndex, 'activeList'], e)
+ this.setState({
+ currentActive: e,
+ subjectList
+ })
+ }
+
+ /**
+ * 暂停计时
+ */
+ onChangeStop = () => {
+ this.setState({ isShowStopBox: true })
+ this.timerRef.current.stop()
+ }
+
+ /**
+ * 标记一下
+ */
+ onChangeMark = () => {
+ let { currentIndex, subjectList, subjectObject } = this.state
+ let flag = 1
+ if (subjectList[currentIndex]?.isMark) {
+ flag = 0
+ }
+ _.set(subjectList, [currentIndex, 'isMark'], flag)
+ this.setState({
+ subjectList,
+ isMark: flag,
+ subjectObject
+ })
+ }
+
+ /**
+ * 选择答题卡
+ * @param {*} index
+ * @param {*} item
+ * @returns
+ */
+ onChangePaging = index => {
+ let { currentIndex } = this.state
+ // 如果点击当前题目，直接return
+ if (currentIndex === index) {
+ return
+ }
+ this.changeData(index)
+ }
+
+ /**
+ * 交卷
+ */
+ onChangeOver = () => {
+ const { subjectList } = this.state
+ let answerDetails = []
+ subjectList.forEach(item => {
+ let obj = {
+ subjectId: item.subjectId,
+ subjectType: item.subjectType,
+ answerContents: []
+ }
+ if (item?.activeList && item?.activeList?.length > 0) {
+ obj.answerContents = item.activeList
+ }
+ answerDetails.push(obj)
+ })
+ let params = {
+ setId: this.setId,
+ timeUse: this.timerRef.current.getUseTime(),
+ submitTime: getCurrentTime(),
+ answerDetails: answerDetails
+ }
+ req({
+ method: 'post',
+ data: params,
+ url: ApiName.submitSubject
+ })
+ .then(res => {
+ if (res.data && res.data.practiceId) {
+ //关闭定时器
+ this.timerRef.current.end()
+ this.props.history.replace(
+ splicingQuery('/practice-analytic', {
+ practiceId: res.data.practiceId
+ })
+ )
+ }
+ })
+ .catch(err => console.log(err))
+ }
+
+ /**
+ * 提前交卷弹框-直接交卷
+ */
+ onHandleSubmitModal = () => {
+ this.onChangeOver()
+ }
+
+ /**
+ * 提前交卷弹框-继续做题
+ */
+ onHandleCancelModal = () => {
+ this.setState({ isShowAdvanOverceBox: false })
+ }
+
+ /**
+ * 提前交卷
+ */
+ onChangeAdvanceOver = () => {
+ this.setState({
+ isShowAdvanOverceBox: true
+ })
+ }
+
+ /**
+ * 下一题
+ * @returns
+ */
+ onChangeNext = () => {
+ let { currentIndex } = this.state
+ currentIndex += 1
+ this.changeData(currentIndex)
+ }
+
+ /**
+ * 改变数据
+ * @param {*} index 当前点击下标
+ */
+ changeData = index => {
+ let { subjectList } = this.state
+ let subObj = subjectList[index]
+ let activeList = [] // 多选 选中的答案项
+ let isMark = 0 // 是否被标记
+
+ // 将其他item设置为未选中
+ subjectList.forEach(item => {
+ item.active = false
+ })
+ _.set(subjectList, [index, 'active'], true)
+
+ // if当前选择的有选答案，则直接显示出来
+ if (subObj?.activeList?.length > 0) {
+ activeList = subObj?.activeList
+ }
+
+ // if当前已被标记，则直接显示出来
+ if (subObj?.isMark == 1) {
+ isMark = 1
+ }
+
+ this.getPracticeSubject(subObj, subjectList, index, activeList, isMark)
+ }
+
+ /**
+ * 暂停弹框-继续做题
+ */
+ onChangeSubmitModal = () => {
+ this.timerRef.current.run()
+ this.setState({ isShowStopBox: false })
+ }
+
+ /**
+ * 暂停弹框-再次再做
+ */
+ onChangeCancelModal = () => {
+ this.props.history.goBack()
+ }
+
+ render() {
+ const {
+ isMark,
+ isCollection,
+ currentIndex,
+ currentActive,
+ subjectList,
+ subjectObject,
+ isShowAdvanOverceBox,
+ isShowStopBox
+ } = this.state
+ const isLast = currentIndex === subjectList?.length - 1
+ // 获得已答的题目个数
+ const noAnswerNum =
+ subjectList.filter(item => item.activeList && item.activeList.length > 0).length || 0
+ return (
+
+
+
+
{this.subjectTitle}
+
+
+
+
+
+
+
+
+
+ {currentIndex + 1}/{subjectList?.length}
+
+
+
[{quetionsType[subjectObject.subjectType]}]
+
+
+
+
{subjectObject.subjectName}
+ {subjectObject.subjectType === 2 ? (
+
+ {subjectObject?.optionList?.length > 0 &&
+ subjectObject?.optionList.map(item => {
+ return (
+
+
+
+ )
+ })}
+
+ ) : (
+
+ {subjectObject?.optionList?.length > 0 &&
+ subjectObject?.optionList.map(item => {
+ return (
+
+
+
+ )
+ })}
+
+ )}
+
+
+
+
+
+
+
+
+
+ 休息一下吧！共{subjectList?.length}道题，还剩
+ {subjectList?.length - noAnswerNum}道没做哦～
+
+
+ )
+ }
+}
diff --git a/src/views/practise/practice-details/index.less b/src/views/practise/practice-details/index.less
new file mode 100644
index 0000000..bc306b5
--- /dev/null
+++ b/src/views/practise/practice-details/index.less
@@ -0,0 +1,107 @@
+.details-container {
+ width: 1439px;
+ margin: 0 auto;
+ overflow: auto;
+ background-color: #ffffff;
+ flex-direction: column;
+ margin-bottom: 20px;
+ border: 1px solid #e0e0e0;
+ border-radius: 3px;
+ .container-box {
+ background-color: #ffffff;
+ .container-box-title {
+ padding: 20px;
+ border-bottom: 1px solid #eee;
+ display: flex;
+ justify-content: space-between;
+ .title-title {
+ font-size: 20px;
+ vertical-align: middle;
+ overflow: hidden;
+ // text-overflow: ellipsis;
+ // white-space: nowrap;
+ // word-wrap: normal;
+ max-width: 1000px;
+ }
+ .title-time {
+ display: flex;
+ align-items: center;
+ .title-timer-img {
+ margin: -4px 10px 0 0;
+ width: 30px;
+ height: 30px;
+ .title-timer-icon {
+ width: 100%;
+ height: 100%;
+ }
+ }
+ }
+ }
+ .details-question-number {
+ padding: 20px;
+ display: flex;
+ .question-number-number {
+ background-color: #e5e5e5;
+ padding: 0 5px;
+ border-radius: 5px;
+ font-size: 16px;
+ }
+ .question-number-mark {
+ margin: 0 8px;
+ width: 24px;
+ height: 24px;
+ }
+ .question-number-type {
+ background-color: #fff;
+ line-height: 1.5;
+ font-size: 16px;
+ border-radius: 3px;
+ }
+ }
+ .practice-main {
+ background-color: #fff;
+ padding: 20px;
+ padding: 10px 20px 20px;
+ .practice-text {
+ margin-bottom: 20px;
+ .practice-question {
+ margin-bottom: 20px;
+ font-size: 14px;
+ line-height: 1.6;
+ }
+ .practice-answer-list {
+ width: 100%;
+ .practice-answer-item {
+ display: flex;
+ align-items: center;
+ margin-bottom: 20px;
+ padding: 12px 20px 13px;
+ word-break: break-all;
+ border: 1px solid #d4d4d4;
+ background-color: #fff;
+ border-radius: 4px;
+ &:hover {
+ cursor: pointer;
+ color: #1890ff;
+ background: #f3f3f3;
+ text-decoration: none;
+ }
+ }
+ .practice-answer-item-active {
+ color: #1890ff;
+ text-decoration: none;
+ border-color: #1890ff;
+ }
+ .ant-checkbox-wrapper + .ant-checkbox-wrapper {
+ margin-left: 0;
+ }
+ }
+ }
+ }
+ }
+}
+.details-container-box-info {
+ margin-right: 10px;
+ width: 36px;
+ height: 36px;
+}
diff --git a/src/views/practise/practice-details/index1.jsx b/src/views/practise/practice-details/index1.jsx
new file mode 100644
index 0000000..2a11830
--- /dev/null
+++ b/src/views/practise/practice-details/index1.jsx
@@ -0,0 +1,485 @@
+import Timer from '@components/timerCom/FlipClock'
+import req from '@utils/request'
+import { Checkbox, Modal, Radio } from 'antd'
+import _ from 'lodash'
+import React, { useEffect, useState } from 'react'
+import { useNavigate } from 'react-router-dom'
+import PracticeAction from './components/practice-action'
+import PracticeAdvance from './components/practice-advance'
+import PracticePaging from './components/practice-paging'
+import { ApiName, ImgObj, quetionsType } from './constant'
+import './index.less'
+
+const PracticeDetails = props => {
+ const navigate = useNavigate()
+
+ const [isMark, setIsMark] = useState(0) // 是否标记
+ const [currentActive, setCurrentActive] = useState('')
+ const [subjectList, setSubjectList] = useState([])
+ const [subjectObject, setSubjectObject] = useState({})
+ const [currentIndex, setCurrentIndex] = useState(0)
+ const [isShowAdvanOverceBox, setIsShowAdvanOverceBox] = useState(false)
+ const [isShowStopBox, setIsShowStopBox] = useState(false)
+
+ const timerRef = React.createRef()
+ let subjectTitle = ''
+ let singleLength = 0
+ let multipleLength = 0
+ let judgeLength = 0
+ const setId = ''
+
+ const isLast = currentIndex === subjectList?.length - 1
+
+ /**
+ * 获得题目列表
+ */
+ const getSubjectList = () => {
+ let params = {
+ setId: setId
+ }
+ subjectTitle = '热门题目练习'
+ singleLength = 1
+ multipleLength = 1
+ judgeLength = 1
+ const list = [
+ {
+ subjectType: 1,
+ subjectId: 1,
+ active: true
+ },
+ {
+ subjectType: 2,
+ subjectId: 2
+ },
+ {
+ subjectType: 3,
+ subjectId: 3
+ }
+ ]
+ setSubjectList([...list])
+ // _.set(list, [0, 'active'], true)
+ getPracticeSubject(list[0], list, 0, [])
+ // req({
+ // method: 'post',
+ // data: params,
+ // url: ApiName.getSubjects
+ // })
+ // .then(res => {
+ // if (res.data && res.data?.subjectList?.length > 0) {
+ // let list = res.data.subjectList
+ // singleLength =
+ // list?.length > 0 ? list.filter(item => item.subjectType === 1).length : 0
+ // multipleLength =
+ // list?.length > 0 ? list.filter(item => item.subjectType === 2).length : 0
+ // judgeLength =
+ // list?.length > 0 ? list.filter(item => item.subjectType === 3).length : 0
+ // subjectTitle = res.data?.title || '' // 总题目列表
+ // getPracticeSubject(list[0], list, 0, [])
+ // }
+ // })
+ // .catch(err => console.log(err))
+ }
+
+ useEffect(() => {
+ timerRef.current.run()
+ getSubjectList()
+ }, [])
+
+ /**
+ * 获得题目详情
+ * @param {*} item 选择的项
+ * @param {*} subjectList 题目列表
+ * @param {*} index 选择的下标
+ * @param {*} activeList 选中的列表
+ * @param {*} isMark 是否被标记
+ */
+ const getPracticeSubject = (item, subjectList, index, activeList, isMark = 0) => {
+ let params = {
+ subjectId: item.subjectId,
+ subjectType: item.subjectType
+ }
+
+ const optionList =
+ item.subjectType === 3
+ ? [
+ {
+ optionContent: '正确',
+ optionType: 1
+ },
+ {
+ optionContent: '错误',
+ optionType: 0
+ }
+ ]
+ : [
+ {
+ optionType: 1,
+ optionContent: '
题目答案1
'
+ },
+ {
+ optionType: 2,
+ optionContent: '
题目答案2
'
+ },
+ {
+ optionType: 3,
+ optionContent: '
题目答案3
'
+ }
+ ]
+ setCurrentActive(item.subjectType === 2 ? activeList : activeList[0])
+ setCurrentIndex(index)
+ setSubjectObject({
+ subjectName: '题干内容',
+ subjectType: item.subjectType,
+ optionList,
+ // subjectList: subjectList,
+ // currentIndex: index,
+ // currentActive: item.sub??jectType === 2 ? activeList : activeList[0],
+ isMark: isMark
+ })
+
+ return
+ req({
+ method: 'post',
+ data: params,
+ url: ApiName.getPracticeSubject
+ })
+ .then(res => {
+ if (res.data) {
+ let subjectObject = res.data
+ if (item.subjectType === 3) {
+ subjectObject.optionList = [
+ {
+ optionContent: '正确',
+ optionType: 1
+ },
+ {
+ optionContent: '错误',
+ optionType: 0
+ }
+ ]
+ }
+ setState({
+ subjectObject: res.data,
+ subjectList: subjectList,
+ currentIndex: index,
+ currentActive: item.subjectType === 2 ? activeList : activeList[0],
+ isMark: isMark
+ })
+ }
+ })
+ .catch(err => console.log(err))
+ }
+
+ /**
+ * 选择单选
+ * @param {*} e
+ * @returns
+ */
+ const onChangeRadio = e => () => {
+ const list = [...subjectList]
+ _.set(list, [currentIndex, 'activeList'], [e])
+ setCurrentActive(e)
+ setSubjectList([...list])
+ }
+
+ /**
+ * 选择多选
+ * @param {*} e
+ * @returns
+ */
+ const onChangeCheck = e => {
+ // let { currentIndex, subjectList } = state
+ const list = [...subjectList]
+ _.set(list, [currentIndex, 'activeList'], e)
+ setCurrentActive(e)
+ setSubjectList([...list])
+ }
+
+ /**
+ * 暂停计时
+ */
+ const onChangeStop = () => {
+ // setState({ isShowStopBox: true })
+ setIsShowStopBox(true)
+ timerRef.current.stop()
+ }
+
+ /**
+ * 标记一下
+ */
+ const onChangeMark = () => {
+ const list = [...subjectList]
+ let flag = 1
+ if (list[currentIndex]?.isMark) {
+ flag = 0
+ }
+ _.set(list, [currentIndex, 'isMark'], flag)
+ setSubjectList([...list])
+ setIsMark(flag)
+ }
+
+ /**
+ * 选择答题卡
+ * @param {*} index
+ * @param {*} item
+ * @returns
+ */
+ const onChangePaging = index => {
+ // 如果点击当前题目，直接return
+ if (currentIndex === index) {
+ return
+ }
+ changeData(index)
+ }
+
+ /**
+ * 交卷
+ */
+ const onChangeOver = () => {
+ timerRef.current.end()
+ navigate('/practice-analytic/1', { replace: true })
+ // const list = [...subjectList]
+ // let answerDetails = []
+ // list.forEach(item => {
+ // let obj = {
+ // subjectId: item.subjectId,
+ // subjectType: item.subjectType,
+ // answerContents: []
+ // }
+ // if (item?.activeList && item?.activeList?.length > 0) {
+ // obj.answerContents = item.activeList
+ // }
+ // answerDetails.push(obj)
+ // })
+ // let params = {
+ // setId: setId,
+ // timeUse: timerRef.current.getUseTime(),
+ // submitTime: getCurrentTime(),
+ // answerDetails: answerDetails
+ // }
+ // req({
+ // method: 'post',
+ // data: params,
+ // url: ApiName.submitSubject
+ // })
+ // .then(res => {
+ // if (res.data && res.data.practiceId) {
+ // //关闭定时器
+ // timerRef.current.end()
+ // props.history.replace(
+ // splicingQuery('/practice-analytic', {
+ // practiceId: res.data.practiceId
+ // })
+ // )
+ // }
+ // })
+ // .catch(err => console.log(err))
+ }
+
+ /**
+ * 提前交卷弹框-直接交卷
+ */
+ const onHandleSubmitModal = () => {
+ onChangeOver()
+ }
+
+ /**
+ * 提前交卷弹框-继续做题
+ */
+ const onHandleCancelModal = () => {
+ setIsShowAdvanOverceBox(false)
+
+ // setState({ isShowAdvanOverceBox: false })
+ }
+
+ /**
+ * 提前交卷
+ */
+ const onChangeAdvanceOver = () => {
+ setIsShowAdvanOverceBox(true)
+ // setState({
+ // isShowAdvanOverceBox: true
+ // })
+ }
+
+ /**
+ * 下一题
+ * @returns
+ */
+ const onChangeNext = () => {
+ // let { currentIndex } = state
+ // currentIndex += 1
+ setCurrentIndex(currentIndex + 1)
+ changeData(currentIndex + 1)
+ }
+
+ /**
+ * 改变数据
+ * @param {*} index 当前点击下标
+ */
+ const changeData = index => {
+ // let { subjectList } = state
+ const list = [...subjectList]
+ let subObj = list[index]
+ let activeList = [] // 多选 选中的答案项
+ let isMark = 0 // 是否被标记
+
+ // 将其他item设置为未选中
+ list.forEach(item => {
+ item.active = false
+ })
+ _.set(list, [index, 'active'], true)
+
+ // if当前选择的有选答案，则直接显示出来
+ if (subObj?.activeList?.length > 0) {
+ activeList = subObj?.activeList
+ }
+
+ // if当前已被标记，则直接显示出来
+ if (subObj?.isMark == 1) {
+ isMark = 1
+ }
+
+ getPracticeSubject(subObj, list, index, activeList, isMark)
+ }
+
+ /**
+ * 暂停弹框-继续做题
+ */
+ const onChangeSubmitModal = () => {
+ timerRef.current.run()
+ setIsShowStopBox(false)
+ // setState({ isShowStopBox: false })
+ }
+
+ /**
+ * 暂停弹框-再次再做
+ */
+ const onChangeCancelModal = () => {
+ // props.history.goBack()
+ navigate(-1)
+ }
+
+ const noAnswerNum =
+ subjectList.filter(item => item.activeList && item.activeList.length > 0).length || 0
+
+ return (
+
+
+
+
{subjectTitle}
+
+
+
+
+
+
+
+
+
+ {currentIndex + 1}/{subjectList?.length}
+
+
+
[{quetionsType[subjectObject.subjectType]}]
+
+
+
+
{subjectObject.subjectName}
+ {subjectObject.subjectType === 2 ? (
+
+ {subjectObject?.optionList?.length > 0 &&
+ subjectObject?.optionList.map(item => {
+ return (
+
+
+
+ )
+ })}
+
+ ) : (
+
+ {subjectObject?.optionList?.length > 0 &&
+ subjectObject?.optionList.map(item => {
+ return (
+
+
+
+ )
+ })}
+
+ )}
+
+
+
+
+
+
+
+
+
+ 休息一下吧！共{subjectList?.length}道题，还剩
+ {subjectList?.length - noAnswerNum}道没做哦～
+
+
+ )
+}
+export default PracticeDetails
diff --git a/src/views/practise/practice-questions/components/front-end/index.jsx b/src/views/practise/practice-questions/components/front-end/index.jsx
new file mode 100644
index 0000000..d7d923d
--- /dev/null
+++ b/src/views/practise/practice-questions/components/front-end/index.jsx
@@ -0,0 +1,236 @@
+import { debounce, splicingQuery } from '@utils'
+import req from '@utils/request'
+import { Button, Card, Checkbox, Descriptions, Spin } from 'antd'
+import _ from 'lodash'
+import React, { Component, Fragment } from 'react'
+import { ApiName } from '../../constant'
+import './index.less'
+
+const CheckboxGroup = Checkbox.Group
+class FrontEnd extends Component {
+ constructor(props) {
+ super(props)
+ this.state = {
+ tabList: [],
+ secondCategoryList: [],
+ isShowSpin: false,
+ currentKey: '', //当前的大类id
+ difficulty: 1
+ }
+ }
+ allCategoryMap = {}
+ selectList = []
+
+ componentDidMount() {
+ this.getSpecialPracticeContent()
+ }
+
+ /**
+ * 获取菜单对应的内容
+ */
+ getSpecialPracticeContent() {
+ const { menuId, menuType } = this.props
+ let params = {
+ menuId: menuId,
+ menuType: menuType
+ }
+ req({
+ method: 'post',
+ data: params,
+ url: ApiName.getSpecialPracticeContent
+ })
+ .then(res => {
+ if (res.data && res.data?.length > 0) {
+ let tabList = res.data.map(item => {
+ return {
+ tab: item.primaryCategoryName,
+ key: item.primaryCategoryId
+ }
+ })
+ res.data.forEach(item => {
+ this.allCategoryMap[item.primaryCategoryId] = item.categoryList
+ })
+
+ this.setState({
+ currentKey: tabList[0].key,
+ tabList: tabList,
+ secondCategoryList: this.allCategoryMap[res.data[0].primaryCategoryId],
+ isShowSpin: false
+ })
+ } else {
+ this.setState({
+ tabList: [],
+ secondCategoryList: [],
+ isShowSpin: false
+ })
+ }
+ })
+ .catch(err => console.log(err))
+ }
+
+ /**
+ * 生成setId接口
+ */
+ addPractice = debounce(() => {
+ const { menuId } = this.props
+ let params = {
+ difficulty: menuId,
+ assembleIds: this.selectList
+ }
+ req({
+ method: 'post',
+ data: params,
+ url: '/admin/practice/set/addPractice'
+ })
+ .then(res => {
+ if (res.data) {
+ this.props.history.push(
+ splicingQuery('/practice-details', {
+ setId: res.data.setId
+ })
+ )
+ }
+ })
+ .catch(err => console.log(err))
+ })
+
+ /**
+ * 复选框-选中/未选中
+ * @param {*} index 二级分类下标
+ * @returns
+ */
+ onChange = index => list => {
+ let { secondCategoryList } = this.state
+ _.set(secondCategoryList, [index, 'activeList'], list)
+ this.setState({ secondCategoryList })
+ this.getAssembleIdList(secondCategoryList)
+ }
+
+ /**
+ * 切换一级分类
+ * @param {*} key
+ */
+ onTabChange = debounce(key => {
+ let { secondCategoryList } = this.state
+ // 切换一级大类时，将activeList全重置为空
+ secondCategoryList.forEach(item => {
+ item.activeList = []
+ })
+ this.getAssembleIdList([])
+ this.setState({
+ currentKey: key,
+ secondCategoryList: this.allCategoryMap[key]
+ })
+ })
+
+ /**
+ * 获取选中的assembleId列表
+ * @param {*} list
+ */
+ getAssembleIdList = list => {
+ let activeList = []
+ list.forEach(item => {
+ if (item.activeList && item.activeList?.length !== 0) {
+ activeList = _.concat(activeList, item.activeList)
+ }
+ })
+ this.selectList = activeList
+ }
+
+ /**
+ * 全选
+ * @param {*} index 二级分类下标
+ * @returns
+ */
+ onCheckAllChange = index => e => {
+ let { secondCategoryList } = this.state
+ let activeList = []
+ if (e.target.checked) {
+ activeList = secondCategoryList[index].labelList.map(item => item.assembleId)
+ }
+ _.set(secondCategoryList, [index, 'activeList'], activeList)
+ this.setState({ secondCategoryList })
+ this.getAssembleIdList(secondCategoryList)
+ }
+
+ render() {
+ const { secondCategoryList, isShowSpin, currentKey, tabList } = this.state
+ return (
+
+ {tabList?.length > 0 && (
+
+
{
+ this.onTabChange(key, 'key')
+ }}
+ >
+
+ {secondCategoryList?.length > 0 &&
+ secondCategoryList.map((secondItem, secondIndex) => {
+ let labelList = secondItem.labelList.map(item => {
+ return {
+ label: item.labelName,
+ value: item.assembleId
+ }
+ })
+ return (
+
+
+
+ {secondItem.categoryName}
+
+
+
+ 全选
+
+
+
+ )
+ })}
+
+
+
+
+
+ )
+ }
+}
+
+export default FrontEnd
diff --git a/src/views/practise/practice-questions/components/front-end/index.less b/src/views/practise/practice-questions/components/front-end/index.less
new file mode 100644
index 0000000..c300d3a
--- /dev/null
+++ b/src/views/practise/practice-questions/components/front-end/index.less
@@ -0,0 +1,24 @@
+.front-box {
+ .ant-descriptions-title {
+ display: flex;
+ justify-content: space-between;
+ font-size: 18px;
+ color: rgba(51, 51, 51, 0.7);
+ }
+ .ant-checkbox-wrapper {
+ font-size: 14px;
+ color: rgba(51, 51, 51, 0.5);
+ }
+ .box{
+ display: flex;
+ width: 1439px;
+ .box1{
+ flex: 1;
+ }
+ .box2{
+ flex: 1;
+ // float: right;
+ text-align: right;
+ }
+ }
+}
diff --git a/src/views/practise/practice-questions/components/front-end/index1.tsx b/src/views/practise/practice-questions/components/front-end/index1.tsx
new file mode 100644
index 0000000..b5384ba
--- /dev/null
+++ b/src/views/practise/practice-questions/components/front-end/index1.tsx
@@ -0,0 +1,90 @@
+import req from '@utils/request'
+import { Card, Checkbox, Descriptions } from 'antd'
+import { useEffect, useState } from 'react'
+
+const apiName = {
+ /**
+ * 查询大类
+ */
+ queryPrimaryCategory: '/category/queryPrimaryCategory',
+
+ // 查询分类及标签
+ queryCategoryAndLabel: '/category/queryCategoryAndLabel'
+}
+
+const PracticeHome = () => {
+ const [primaryList, setPrimaryList] = useState
[]>([])
+ const [cateAndLabelList, setCateAndLabelList] = useState[]>([])
+ const [currentPrimaryId, setCurrentPrimaryId] = useState()
+
+ const queryPrimaryList = () => {
+ req({
+ method: 'post',
+ url: apiName.queryPrimaryCategory,
+ data: { categoryType: 1 }
+ })
+ .then((res: Record) => {
+ if (res.data && res.data.length > 0) {
+ setCurrentPrimaryId(res.data[0].id)
+ setPrimaryList([...res.data].map(t => ({ tab: t.categoryName, key: t.id })))
+ }
+ })
+ .catch(err => {
+ console.log(err)
+ })
+ }
+
+ useEffect(() => {
+ queryPrimaryList()
+ }, [])
+
+ const getCategoryAndLabel = () => {
+ req({
+ method: 'post',
+ url: apiName.queryCategoryAndLabel,
+ data: { id: currentPrimaryId }
+ })
+ .then(res => {
+ if (res.data && res.data.length > 0) {
+ res.data = res.data.map(item => {
+ return {
+ ...item,
+ children: item.labelDTOList.map(t => ({ label: t.labelName, value: t.id }))
+ }
+ })
+ setCateAndLabelList([...res.data])
+ }
+ })
+ .catch(err => {
+ console.log(err)
+ })
+ }
+
+ useEffect(() => {
+ if (currentPrimaryId) {
+ getCategoryAndLabel()
+ }
+ }, [currentPrimaryId])
+
+ return (
+
+
+ {cateAndLabelList.map(item => {
+ return (
+ 全选}>
+
+
+
+
+ )
+ })}
+
+
+ )
+}
+
+export default PracticeHome
diff --git a/src/views/practise/practice-questions/components/paper-end/index.jsx b/src/views/practise/practice-questions/components/paper-end/index.jsx
new file mode 100644
index 0000000..4ba4718
--- /dev/null
+++ b/src/views/practise/practice-questions/components/paper-end/index.jsx
@@ -0,0 +1,155 @@
+// import req from '@utils/request'
+import { Card, Input, Pagination, Spin, Tooltip } from 'antd'
+import React, { useState } from 'react'
+import { useNavigate } from 'react-router-dom'
+
+import './index.less'
+
+const { Search } = Input
+
+const tabList = [
+ {
+ key: '0',
+ tab: '默认'
+ }
+ // {
+ // key: '1',
+ // tab: '最新'
+ // },
+ // {
+ // key: '2',
+ // tab: '最热'
+ // }
+]
+
+const PaperView = props => {
+ const navigate = useNavigate()
+
+ const [spinning, setSpinning] = useState(false)
+ const [paperList, setPaperList] = useState([
+ {
+ setId: 1,
+ setName: '测试试卷',
+ setHeat: 1,
+ setDesc: '描述'
+ }
+ ])
+ const [orderType, setOrderType] = useState(0)
+ const [setId, setSetId] = useState(0)
+ const [pageInfo, setPageInfo] = useState({
+ total: 0,
+ pageIndex: 1
+ })
+ const [searchText, setSearchText] = useState('')
+ const getPreSetContent = () => {
+ // const { menuId, menuType } = this.props
+ // const { orderType, searchText } = this.state
+ // let params = {
+ // menuId: menuId,
+ // menuType: menuType,
+ // orderType: orderType,
+ // pageInfo: {
+ // pageIndex: this.pageIndex,
+ // pageSize: 8
+ // },
+ // setName: searchText
+ // }
+ // req({
+ // method: 'post',
+ // data: params,
+ // url: 'admin/practice/set/getPreSetContent'
+ // })
+ // .then(res => {
+ // if (res.data.pageList && res.data.pageList?.length > 0) {
+ // this.setState({
+ // paperList: res.data.pageList,
+ // total: res.data.pageInfo.total,
+ // isShowSpin: false,
+ // setId: res.data.pageList.setId
+ // })
+ // }
+ // })
+ // .catch(err => console.log(err))
+ }
+
+ const onTabChange = key => {
+ setOrderType(key)
+ }
+
+ const onChangePagination = pageIndex => {
+ setPageInfo({
+ ...pageInfo,
+ pageIndex
+ })
+ }
+
+ const handleJump = setId => navigate('/practice-detail/' + setId)
+
+ const onSearch = value => {
+ setSearchText(value)
+ }
+
+ return (
+
+ {/*
+
+
*/}
+
+
+
+
+ {paperList?.length > 0 &&
+ paperList.map((item, index) => {
+ return (
+
handleJump(item.setId)}
+ key={`paperList_${index}`}
+ >
+
{item.setName}
+
+ 热度指数：{item.setHeat}
+
+
+
+ {item.setDesc}
+
+
+
+ )
+ })}
+
+
+
+ {pageInfo.total > 8 && (
+
+ )}
+
+
+
+
+
+
+ {/* {this.currentKeyFirstMenuType == 0 ? (
+
+ ) : (
+
+ )} */}
+
+
+
- 录入成功！贡献榜火力值 + 1
-
- ),
- closable: false,
- maskClosable: false,
- icon: ' ',
- onOk: this.onAgainSuccessModal,
- onCancel: this.onGoHomeSuccessModal,
- okText: '再录一题',
- cancelText: '去首页',
- className: 'questions-success-modal-confirm',
- });
- };
-
- /**
- * 录入成功弹框-再来一题
- */
- onAgainSuccessModal = () => {
- this.onCancel();
- };
-
- /**
- * 录入成功弹框-去首页
- */
- onGoHomeSuccessModal = () => {
- window.location.href = '/question-bank';
- };
-
- /**
- * 分类选择
- * @param {*} e
- */
- onChangeRankLabel = (firstCategoryValue, secondCategoryValue, thirdCategoryValue) => {
- this.firstCategoryValue = firstCategoryValue; // 一级分类的值
- this.secondCategoryValue = secondCategoryValue; // 二级分类的值
- this.thirdCategoryValue = thirdCategoryValue; // 三级标签的值
- let isDisabledSubmit = this.checkData();
- this.setState({
- isDisabledSubmit,
- });
- };
-
- /**
- * 职级选择
- * @param {*} list
- */
- handleChangeRank = (list) => {
- this.rankId = list[0].categoryId;
- let isDisabledSubmit = this.checkData();
- this.setState({
- isDisabledSubmit,
- });
- };
-
- render() {
- const { subjectName, isDisabledSubmit, isSubmit, isShowModalBox } = this.state;
- const { questionsType } = this.props;
- // this.successModalConfirm();
-
- return (
-
-
-
-
-
题目答案：
- {this.reanderAnser()}
-
-
-
- );
- };
+ /**
+ * 校验是否支持点击按钮
+ * @returns
+ */
+ checkData = () => {
+ const { subjectName } = this.state
+ let isDisabledSubmit = false
+ if (
+ !!!subjectName ||
+ !!!this.subjectAnswer ||
+ !!!this.firstCategoryValue ||
+ this.secondCategoryValue.length <= 0
+ // ||
+ // this.thirdCategoryValue.length <= 0
+ ) {
+ isDisabledSubmit = true
+ }
+ return isDisabledSubmit
+ }
+
+ /**
+ * 取消
+ */
+ onCancel = () => {
+ this.subjectAnswer = '' // 答案
+ this.rankId = 1
+ this.firstCategoryValue = ''
+ this.secondCategoryValue = []
+ this.thirdCategoryValue = []
+ this.repeatInfo = {}
+ this.kindEditor.current.onClear()
+ this.rankLabelBox.current.initRankLabel()
+ this.setState({
+ subjectName: '',
+ isShowModalBox: false,
+ isSubmit: true // 是否支持提交
+ })
+ }
+
+ /**
+ * 重复率弹框-确认录入
+ */
+ onSubmitRepeatModal = debounce(
+ () => {
+ let params = {
+ docId: this.repeatInfo.repeatDocId
+ }
+ req({
+ method: 'post',
+ data: params,
+ url: apiName.addRepeatInterviewSubject
+ })
+ .then(res => {
+ if (res.data) {
+ this.successModalConfirm()
+ } else {
+ message.info('请再次确认')
+ }
+ })
+ .catch(err => {
+ console.log(err)
+ message.error('请再次确认')
+ })
+ },
+ 300,
+ true
+ )
+
+ /**
+ * 重复率弹框-取消录入
+ */
+ onCancelRepeatModal = () => {
+ this.repeatInfo = {}
+ this.setState({
+ isShowModalBox: false
+ })
+ }
+
+ /**
+ * 录入成功的弹框
+ */
+ successModalConfirm = () => {
+ Modal.confirm({
+ title: (
+
+ 录入成功！贡献榜火力值 + 1
+
+ ),
+ closable: false,
+ maskClosable: false,
+ icon: ' ',
+ onOk: this.onAgainSuccessModal,
+ onCancel: this.onGoHomeSuccessModal,
+ okText: '再录一题',
+ cancelText: '去首页',
+ className: 'questions-success-modal-confirm'
+ })
+ }
+
+ /**
+ * 录入成功弹框-再来一题
+ */
+ onAgainSuccessModal = () => {
+ this.onCancel()
+ }
+
+ /**
+ * 录入成功弹框-去首页
+ */
+ onGoHomeSuccessModal = () => {
+ window.location.href = '/question-bank'
+ }
+
+ /**
+ * 分类选择
+ * @param {*} e
+ */
+ onChangeRankLabel = (firstCategoryValue, secondCategoryValue, thirdCategoryValue) => {
+ this.firstCategoryValue = firstCategoryValue // 一级分类的值
+ this.secondCategoryValue = secondCategoryValue // 二级分类的值
+ this.thirdCategoryValue = thirdCategoryValue // 三级标签的值
+ let isDisabledSubmit = this.checkData()
+ this.setState({
+ isDisabledSubmit
+ })
+ }
+
+ /**
+ * 职级选择
+ * @param {*} list
+ */
+ handleChangeRank = list => {
+ this.rankId = list[0].categoryId
+ let isDisabledSubmit = this.checkData()
+ this.setState({
+ isDisabledSubmit
+ })
+ }
+
+ render() {
+ const { subjectName, isDisabledSubmit, isSubmit, isShowModalBox } = this.state
+ const { questionsType } = this.props
+ // this.successModalConfirm();
+
+ return (
+ //
+
+
+
+
题目答案：
+ {this.reanderAnser()}
+
+
+
+ )
+ }
}
-
diff --git a/src/views/upload-questions/components/judge-questions/index.jsx b/src/views/upload-questions/components/judge-questions/index.jsx
index 680c394..2c3db2d 100644
--- a/src/views/upload-questions/components/judge-questions/index.jsx
+++ b/src/views/upload-questions/components/judge-questions/index.jsx
@@ -1,327 +1,312 @@
-import React, { Component, Fragment } from 'react';
-import { Input, Modal, message, Spin } from 'antd';
-import req from '@utils/request';
-import { debounce } from '@utils';
-import RankLabelBox from '../rank-label-box';
-import OptionInputBox from '../option-input-box';
-import RepeatContentBox from '../repeat-content-box';
-import { apiName } from '../../constant';
-import './index.less';
+import { debounce } from '@utils'
+import req from '@utils/request'
+import { Input, Modal, Spin, message } from 'antd'
+import React, { Component, Fragment, createRef } from 'react'
+import { apiName } from '../../constant'
+import OptionInputBox from '../option-input-box'
+import RankLabelBox from '../rank-label-box'
+import RepeatContentBox from '../repeat-content-box'
+import './index.less'
export default class JudgeQuestions extends Component {
- constructor(props) {
- super(props);
- this.state = {
- subjectName: '', // 题目
- isDisabledSubmit: true, //是否禁止输入
- isShowModalBox: false, // 是否展示重复率弹框
- isSubmit: true, // 是否支持提交
- };
+ constructor(props) {
+ super(props)
+ this.state = {
+ subjectName: '', // 题目
+ isDisabledSubmit: true, //是否禁止输入
+ isShowModalBox: false, // 是否展示重复率弹框
+ isSubmit: true // 是否支持提交
}
- rankLabelBox = RankLabelBox | null;
- optionInputBox = OptionInputBox | null;
- currentActive = []; // 当前选中的项
- scoreValue = ''; // 分数
- subjectAnalysis = ''; //试题解析
- rankId = 1; //职级
- firstCategoryValue = ''; // 一级分类的值
- secondCategoryValue = []; // 二级分类的值
- thirdCategoryValue = []; // 三级标签的值
- repeatInfo = {}; // 重复率
+ }
+ // rankLabelBox = RankLabelBox | null
+ rankLabelBox = createRef()
+ optionInputBox = OptionInputBox | null
+ currentActive = [] // 当前选中的项
+ scoreValue = '' // 分数
+ subjectAnalysis = '' //试题解析
+ rankId = 1 //职级
+ firstCategoryValue = '' // 一级分类的值
+ secondCategoryValue = [] // 二级分类的值
+ thirdCategoryValue = [] // 三级标签的值
+ repeatInfo = {} // 重复率
- /**
- * 输入题目
- * @param {*} e
- */
- onChangeSubjectName = (e) => {
- let str = e.target.value.trim();
- this.setState(
- {
- subjectName: str,
- },
- () => {
- this.rankLabelBox.getThirdCategoryList();
- let isDisabledSubmit = this.checkData();
- this.setState({
- isDisabledSubmit,
- });
- }
- );
- };
-
- /**
- * 一次确认录入
- */
- onSubmit = debounce(() => {
- const { subjectName, isDisabledSubmit, isSubmit } = this.state;
- if (isDisabledSubmit || !isSubmit) {
- return;
- }
+ /**
+ * 输入题目
+ * @param {*} e
+ */
+ onChangeSubjectName = e => {
+ let str = e.target.value.trim()
+ this.setState(
+ {
+ subjectName: str
+ },
+ () => {
+ // this.rankLabelBox.getThirdCategoryList();
+ let isDisabledSubmit = this.checkData()
this.setState({
- isSubmit: false,
- });
- let params = {
- subjectName: subjectName,
- difficulty: this.rankId,
- subjectType: 3,
- subjectScore: this.scoreValue,
- subjectParse: this.subjectAnalysis,
- isCorrect: this.currentActive[0],
- categoryIds: this.secondCategoryValue,
- labelIds: this.thirdCategoryValue,
- };
- console.log('判断录入 ----', params);
- req({
- method: 'post',
- data: params,
- url: apiName.addInterviewSubject,
+ isDisabledSubmit
})
- .then((res) => {
- this.repeatInfo = {};
- if (res.data && res.data.insertStatus) {
- this.setState(
- {
- isSubmit: true,
- },
- () => {
- this.successModalConfirm();
- }
- );
- } else if (!res.data.insertStatus) {
- this.repeatInfo = {
- repeatDocId: res.data.docId, // 重复题目id
- repeatRate: res.data.repeatRate, // 重复率
- repeatIsCorrect: res.data.isCorrect, // 答案
- repeatSubjectName: res.data.subjectName, // 重复题目
- repeatSetterErp: res.data.subjectSetterErp, // 出题人erp
- repeatSetterName: res.data.subjectSetterName, // 出题人姓名
- };
- this.setState({
- isShowModalBox: true,
- isSubmit: true,
- });
- }
- })
- .catch((err) => {
- this.setState({
- isSubmit: true,
- });
- console.log(err);
- });
- });
+ }
+ )
+ }
- /**
- * 校验是否支持点击按钮
- * @returns
- */
- checkData = () => {
- const { subjectName } = this.state;
- let isDisabledSubmit = false;
- if (
- !!!subjectName ||
- this.currentActive?.length <= 0 ||
- !!!this.firstCategoryValue ||
- this.secondCategoryValue.length <= 0 ||
- this.thirdCategoryValue.length <= 0 ||
- !!!this.scoreValue
- ) {
- isDisabledSubmit = true;
- }
- return isDisabledSubmit;
- };
-
- /**
- * 取消
- */
- onCancel = () => {
- this.currentActive = []; // 选项列表
- this.scoreValue = ''; // 分数
- this.subjectAnalysis = ''; //试题解析
- this.rankId = 1;
- this.firstCategoryValue = ''; // 一级分类的值
- this.secondCategoryValue = []; // 二级分类的值
- this.thirdCategoryValue = []; // 三级标签的值
- this.repeatInfo = {};
- this.rankLabelBox.initRankLabel();
- this.optionInputBox.handleClearOption();
- this.setState({
- subjectName: '',
- isShowModalBox: false,
- isSubmit: true, // 是否支持提交
- });
- };
-
- /**
- * 重复率弹框-确认录入
- */
- onSubmitRepeatModal = debounce(
- () => {
- let params = {
- docId: this.repeatInfo.repeatDocId,
- };
- req({
- method: 'post',
- data: params,
- url: apiName.addRepeatInterviewSubject,
- })
- .then((res) => {
- if (res.data) {
- this.successModalConfirm();
- } else {
- message.info('请再次确认');
- }
- })
- .catch((err) => {
- console.log(err);
- message.error('请再次确认');
- });
- },
- 300,
- true
- );
-
- /**
- * 重复率弹框-取消录入
- */
- onCancelRepeatModal = () => {
- this.repeatInfo = {};
- this.setState({
- isShowModalBox: false,
- });
- };
-
- /**
- * 录入成功的弹框
- */
- successModalConfirm = () => {
- Modal.confirm({
- title: (
-
- 录入成功！贡献榜火力值 + 1
-
- ),
- closable: false,
- maskClosable: false,
- icon: ' ',
- onOk: this.onAgainSuccessModal,
- onCancel: this.onGoHomeSuccessModal,
- okText: '再录一题',
- cancelText: '去首页',
- className: 'questions-success-modal-confirm',
- });
- };
-
- /**
- * 录入成功弹框-再来一题
- */
- onAgainSuccessModal = () => {
- this.onCancel();
- };
-
- /**
- * 录入成功弹框-去首页
- */
- onGoHomeSuccessModal = () => {
- // this.onCancel();
- window.location.href = '/cms-supplier/question-bank';
- };
-
- /**
- * 分类选择
- * @param {*} e
- */
- onChangeRankLabel = (firstCategoryValue, secondCategoryValue, thirdCategoryValue) => {
- this.firstCategoryValue = firstCategoryValue; // 一级分类的值
- this.secondCategoryValue = secondCategoryValue; // 二级分类的值
- this.thirdCategoryValue = thirdCategoryValue; // 三级标签的值
- let isDisabledSubmit = this.checkData();
- this.setState({
- isDisabledSubmit,
- });
- };
-
- /**
- * 职级选择
- * @param {*} list
- */
- handleChangeRank = (list) => {
- this.rankId = list[0];
- let isDisabledSubmit = this.checkData();
- this.setState({
- isDisabledSubmit,
- });
- };
- /**
- * 选项操作
- * @param {*} currentActive 选项列表
- * @param {*} scoreValue 分值
- * @param {*} subjectAnalysis 解析
- */
- handleChangeOption = (currentActive, scoreValue, subjectAnalysis) => {
- this.currentActive = currentActive;
- this.scoreValue = scoreValue;
- this.subjectAnalysis = subjectAnalysis;
- let isDisabledSubmit = this.checkData();
- this.setState({
- isDisabledSubmit,
- });
- };
-
- render() {
- const { subjectName, isDisabledSubmit, isSubmit, isShowModalBox } = this.state;
- const { questionsType } = this.props;
- return (
-
-
-
-
题目名称：
-
this.onChangeSubjectName(e)}
- />
-
+ 录入成功！贡献榜火力值 + 1
+
+ ),
+ closable: false,
+ maskClosable: false,
+ icon: ' ',
+ onOk: this.onAgainSuccessModal,
+ onCancel: this.onGoHomeSuccessModal,
+ okText: '再录一题',
+ cancelText: '去首页',
+ className: 'questions-success-modal-confirm'
+ })
+ }
+
+ /**
+ * 录入成功弹框-再来一题
+ */
+ onAgainSuccessModal = () => {
+ this.onCancel()
+ }
+
+ /**
+ * 录入成功弹框-去首页
+ */
+ onGoHomeSuccessModal = () => {
+ window.location.href = '/question-bank'
+ }
+
+ /**
+ * 分类选择
+ * @param {*} e
+ */
+ onChangeRankLabel = (firstCategoryValue, secondCategoryValue, thirdCategoryValue) => {
+ this.firstCategoryValue = firstCategoryValue // 一级分类的值
+ this.secondCategoryValue = secondCategoryValue // 二级分类的值
+ this.thirdCategoryValue = thirdCategoryValue // 三级标签的值
+ let isDisabledSubmit = this.checkData()
+ this.setState({
+ isDisabledSubmit
+ })
+ }
+
+ /**
+ * 职级选择
+ * @param {*} list
+ */
+ handleChangeRank = list => {
+ this.rankId = list[0]
+ let isDisabledSubmit = this.checkData()
+ this.setState({
+ isDisabledSubmit
+ })
+ }
+ /**
+ * 选项操作
+ * @param {*} currentActive 选项列表
+ * @param {*} scoreValue 分值
+ * @param {*} subjectAnalysis 解析
+ */
+ handleChangeOption = (currentActive, scoreValue, subjectAnalysis) => {
+ this.currentActive = currentActive
+ this.scoreValue = scoreValue
+ this.subjectAnalysis = subjectAnalysis
+ let isDisabledSubmit = this.checkData()
+ this.setState({
+ isDisabledSubmit
+ })
+ }
+
+ render() {
+ const { subjectName, isDisabledSubmit, isSubmit, isShowModalBox } = this.state
+ const { questionsType } = this.props
+ return (
+
+
+
+
题目名称：
+
this.onChangeSubjectName(e)}
+ />
+
- 录入成功！贡献榜火力值 + 1
-
- ),
- closable: false,
- maskClosable: false,
- icon: ' ',
- onOk: this.onAgainSuccessModal,
- onCancel: this.onGoHomeSuccessModal,
- okText: '再录一题',
- cancelText: '去首页',
- className: 'questions-success-modal-confirm',
- });
- };
-
- /**
- * 录入成功弹框-再来一题
- */
- onAgainSuccessModal = () => {
- this.onCancel();
- };
-
- /**
- * 录入成功弹框-去首页
- */
- onGoHomeSuccessModal = () => {
- // this.onCancel();
- window.location.href = '/cms-supplier/question-bank';
- };
-
- /**
- * 分类选择
- * @param {*} e
- */
- onChangeRankLabel = (firstCategoryValue, secondCategoryValue, thirdCategoryValue) => {
- this.firstCategoryValue = firstCategoryValue; // 一级分类的值
- this.secondCategoryValue = secondCategoryValue; // 二级分类的值
- this.thirdCategoryValue = thirdCategoryValue; // 三级标签的值
- let isDisabledSubmit = this.checkData();
- this.setState({
- isDisabledSubmit,
- });
- };
-
- /**
- * 职级选择
- * @param {*} list
- */
- handleChangeRank = (list) => {
- this.rankId = list[0];
- let isDisabledSubmit = this.checkData();
- this.setState({
- isDisabledSubmit,
- });
- };
-
- /**
- * 选项操作
- * @param {*} currentActive 选项列表
- * @param {*} scoreValue 分值
- * @param {*} subjectAnalysis 解析
- */
- handleChangeOption = (currentActive, scoreValue, subjectAnalysis) => {
- this.currentActive = currentActive;
- this.scoreValue = scoreValue;
- this.subjectAnalysis = subjectAnalysis;
- let isDisabledSubmit = this.checkData();
- this.setState({
- isDisabledSubmit,
- });
- };
-
- render() {
- const { subjectName, isDisabledSubmit, isSubmit, isShowModalBox } = this.state;
- const { questionsType } = this.props;
- return (
-
-
-
-
题目名称：
-
this.onChangeSubjectName(e)}
- />
-
+ 录入成功！贡献榜火力值 + 1
+
+ ),
+ closable: false,
+ maskClosable: false,
+ icon: ' ',
+ onOk: this.onAgainSuccessModal,
+ onCancel: this.onGoHomeSuccessModal,
+ okText: '再录一题',
+ cancelText: '去首页',
+ className: 'questions-success-modal-confirm'
+ })
+ }
+
+ /**
+ * 录入成功弹框-再来一题
+ */
+ onAgainSuccessModal = () => {
+ this.onCancel()
+ }
+
+ /**
+ * 录入成功弹框-去首页
+ */
+ onGoHomeSuccessModal = () => {
+ window.location.href = '/question-bank'
+ }
+
+ /**
+ * 分类选择
+ * @param {*} e
+ */
+ onChangeRankLabel = (firstCategoryValue, secondCategoryValue, thirdCategoryValue) => {
+ this.firstCategoryValue = firstCategoryValue // 一级分类的值
+ this.secondCategoryValue = secondCategoryValue // 二级分类的值
+ this.thirdCategoryValue = thirdCategoryValue // 三级标签的值
+ let isDisabledSubmit = this.checkData()
+ this.setState({
+ isDisabledSubmit
+ })
+ }
+
+ /**
+ * 职级选择
+ * @param {*} list
+ */
+ handleChangeRank = list => {
+ this.rankId = list[0]
+ let isDisabledSubmit = this.checkData()
+ this.setState({
+ isDisabledSubmit
+ })
+ }
+
+ /**
+ * 选项操作
+ * @param {*} currentActive 选项列表
+ * @param {*} scoreValue 分值
+ * @param {*} subjectAnalysis 解析
+ */
+ handleChangeOption = (currentActive, scoreValue, subjectAnalysis) => {
+ this.currentActive = currentActive
+ this.scoreValue = scoreValue
+ this.subjectAnalysis = subjectAnalysis
+ let isDisabledSubmit = this.checkData()
+ this.setState({
+ isDisabledSubmit
+ })
+ }
+
+ render() {
+ const { subjectName, isDisabledSubmit, isSubmit, isShowModalBox } = this.state
+ const { questionsType } = this.props
+ return (
+
+
+
+
题目名称：
+
this.onChangeSubjectName(e)}
+ />
+
{listLen > showDeleteLength && (
- ![]()
+
)}
-
{
- this.kindEditor = ref
- }}
- bodyHeight={145}
- borderRadius={12}
- onChange={this.onChangeEditor(index)}
- cashBackText={isShowTip ? '' : item.label}
- />
+
{isJudge
diff --git a/src/views/upload-questions/components/question-editor/index.jsx b/src/views/upload-questions/components/question-editor/index.jsx
index 370bbc8..6d6e82d 100644
--- a/src/views/upload-questions/components/question-editor/index.jsx
+++ b/src/views/upload-questions/components/question-editor/index.jsx
@@ -1,77 +1,82 @@
import '@wangeditor/editor/dist/css/style.css' // 引入 css
-import React, {
- useState, useEffect, forwardRef,
- useImperativeHandle,
-} from 'react'
import { Editor, Toolbar } from '@wangeditor/editor-for-react'
-
+import React, { forwardRef, useEffect, useImperativeHandle, useState } from 'react'
// 当前菜单排序和分组
function MyEditor(props, ref) {
- // editor 实例
- const [editor, setEditor] = useState(null)
+ // editor 实例
+ const [editor, setEditor] = useState(null)
+ // 编辑器内容
+ const [html, setHtml] = useState('
')
- // 编辑器内容
- const [html, setHtml] = useState('
')
+ // 工具栏配置
+ const toolbarConfig = {
+ excludeKeys: ['group-image', 'group-video']
+ }
+ // 编辑器配置
+ const editorConfig = {
+ placeholder: '请输入内容...'
+ }
- // 工具栏配置
- const toolbarConfig = {
- excludeKeys: [
- 'group-image', 'group-video'
- ]
+ const changeValue = html => {
+ setHtml(html)
+ props.onChange(html)
+ }
+
+ const onClear = () => setHtml('')
+
+ /**
+ * 回现代码
+ */
+ const onCashBack = () => {
+ let { cashBackText } = props
+ if (!!!cashBackText) {
+ return
}
+ setHtml(`${cashBackText}`)
+ // editor.fo;
+ }
- // 编辑器配置
- const editorConfig = {
- placeholder: '请输入内容...',
+ // 此处注意useImperativeHandle方法的的第一个参数是目标元素的ref引用
+ useImperativeHandle(ref, () => ({
+ // onCallback 就是暴露给父组件的方法
+ onClear,
+ onCashBack
+ }))
+
+ // 及时销毁 editor ，重要！
+ useEffect(() => {
+ return () => {
+ if (editor == null) return
+ editor.destroy()
+ setEditor(null)
}
+ }, [editor])
-
- const changeValue = (html) => {
- setHtml(html)
- props.onChange(html)
- }
-
- const onClear = () => setHtml('')
- // 此处注意useImperativeHandle方法的的第一个参数是目标元素的ref引用
- useImperativeHandle(ref, () => ({
- // onCallback 就是暴露给父组件的方法
- onClear
- }));
-
- // 及时销毁 editor ，重要！
- useEffect(() => {
- return () => {
- if (editor == null) return
- editor.destroy()
- setEditor(null)
- }
- }, [editor])
-
- return (
- <>
-
-
- changeValue(editor.getHtml())}
- mode="default"
- style={{ height: '300px', overflowY: 'scroll' }}
- />
-
-
- )
+ return (
+ <>
+
+
+ changeValue(editor.getHtml())}
+ mode='default'
+ style={{ height: '300px', overflowY: 'scroll' }}
+ />
+
+
+ )
}
-export default forwardRef(MyEditor)
\ No newline at end of file
+export default forwardRef(MyEditor)
diff --git a/src/views/upload-questions/components/repeat-content-box/index.jsx b/src/views/upload-questions/components/repeat-content-box/index.jsx
index 009252d..11cf8af 100644
--- a/src/views/upload-questions/components/repeat-content-box/index.jsx
+++ b/src/views/upload-questions/components/repeat-content-box/index.jsx
@@ -1,234 +1,190 @@
-import React, { Fragment } from 'react';
-import { Modal, Tooltip } from 'antd';
-import { letterList, judgeList } from '../../constant';
-import './index.less';
+import { Modal, Tooltip } from 'antd'
+import React, { Fragment } from 'react'
+import { judgeList, letterList } from '../../constant'
+import './index.less'
export default function RepeatContentBox(props) {
- const { isShowModalBox, repeatInfo, repeatQuestionsType } = props;
- // const { isShowModalBox, repeatQuestionsType } = props;
- // const repeatInfo = {
- // repeatSubjectName:
- // 'Chrome如Chrome如何支持小于12px的字？Chrome如何支持小于12px的字？Chrome如何支持小于12px的字？Chrome如何支持小于12px的字？何支持小于12px的字？',
- // repeatSubjectAnswe:
- // 'Chrome如何支持小于12px的字？Chrome如何支持小于12px的字？Chrome如何支持小于12px的字？Chrome如何支持小于12px的字？Chrome如何支持小于12px的字？Chrome如何支持小于12px的字？',
- // repeatSetterErp: 'suchunping3',
- // repeatSetterName: '苏春萍',
- // };
+ const { isShowModalBox, repeatInfo, repeatQuestionsType } = props
+ /**
+ * 确认录入
+ */
+ const onSubmitRepeatModal = e => {
+ props.handleSubmitRepeatModal && props.handleSubmitRepeatModal()
+ }
+ /**
+ * 取消录入
+ */
+ const onCancelRepeatModal = () => {
+ props.handleCancelRepeatModal && props.handleCancelRepeatModal()
+ }
- // const repeatInfo = {
- // repeatSubjectName:
- // 'Chrome如Chrome如何支持小于12px的字？Chrome如何支持小于12px的字？Chrome如何支持小于12px的字？Chrome如何支持小于12px的字？何支持小于12px的字？',
- // repeatOptionList: [
- // {
- // isCorrect: '',
- // optionContent: 'Chrome如何支持小于12px的字？Chrome如何支持小于12px的',
- // optionType: 1,
- // },
- // {
- // isCorrect: '',
- // optionContent: 'Chrome如何支持小于12px的字？Chrome如何支持小于12px的',
- // optionType: 2,
- // },
- // {
- // isCorrect: 1,
- // optionContent: 'Chrome如何支持小于12px的字？Chrome如何支持小于12px的',
- // optionType: 3,
- // },
- // ],
- // repeatSetterErp: 'suchunping3',
- // repeatSetterName: '苏春萍',
- // };
- /**
- * 确认录入
- */
- const onSubmitRepeatModal = (e) => {
- props.handleSubmitRepeatModal && props.handleSubmitRepeatModal();
- };
- /**
- * 取消录入
- */
- const onCancelRepeatModal = () => {
- props.handleCancelRepeatModal && props.handleCancelRepeatModal();
- };
+ const renderRepeat = (type, repeatInfo) => {
+ switch (type) {
+ case 1:
+ return renderBriefQuestions(repeatInfo)
+ case 2:
+ case 3:
+ return renderSelectQuestions(type, repeatInfo)
+ case 4:
+ return renderJudgeQuestions(repeatInfo)
+ }
+ }
- const renderRepeat = (type, repeatInfo) => {
- switch (type) {
- case 1:
- return renderBriefQuestions(repeatInfo);
- case 2:
- case 3:
- return renderSelectQuestions(type, repeatInfo);
- case 4:
- return renderJudgeQuestions(repeatInfo);
- }
- };
+ /**
+ * 展示重复内容-问答型
+ * @returns
+ */
+ const renderBriefQuestions = repeatInfo => {
+ return (
+
+
+
问答题
+
{repeatInfo.repeatSubjectName}
+
+
+
+
来自
+
+ {repeatInfo.repeatSetterName}
+
+
+
+ )
+ }
- /**
- * 展示重复内容-问答型
- * @returns
- */
- const renderBriefQuestions = (repeatInfo) => {
- return (
-
-
-
问答题
-
{repeatInfo.repeatSubjectName}
-
-
-
-
来自
-
- {repeatInfo.repeatSetterName}
-
-
-
- );
- };
-
- /**
- * 展示重复内容-单选/多选
- * @returns
- */
- const renderSelectQuestions = (type, repeatInfo) => {
- // 过滤获得正确选项
- let repeatRightKey = repeatInfo?.repeatOptionList?.filter((item) => item.isCorrect === 1);
- return (
-
-
-
{type === 2 ? '单选题' : '多选题'}
-
{repeatInfo.repeatSubjectName}
-
- {repeatInfo?.repeatOptionList?.length > 0 && (
-
-
选项内容
-
- {repeatInfo.repeatOptionList.map((item, index) => {
- return (
-
- {/*
+ /**
+ * 展示重复内容-单选/多选
+ * @returns
+ */
+ const renderSelectQuestions = (type, repeatInfo) => {
+ // 过滤获得正确选项
+ let repeatRightKey = repeatInfo?.repeatOptionList?.filter(item => item.isCorrect === 1)
+ return (
+
+
+
{type === 2 ? '单选题' : '多选题'}
+
{repeatInfo.repeatSubjectName}
+
+ {repeatInfo?.repeatOptionList?.length > 0 && (
+
+
选项内容
+
+ {repeatInfo.repeatOptionList.map((item, index) => {
+ return (
+
+ {/*
{letterList[item.optionType]}
*/}
-
-
- );
- })}
-
-
- )}
- {repeatRightKey?.length > 0 && (
-
-
答案
-
- {repeatRightKey.map((item, index) => {
- return (
-
- {letterList[item.optionType]}{' '}
-
- );
- })}
-
-
- )}
- {!!repeatInfo.repeatSubjectAnswe && (
-
- )}
-
-
来自
-
- {repeatInfo.repeatSetterName}
-
-
+
+
+ )
+ })}
- );
- };
-
- /**
- * 展示重复内容-判断
- * @returns
- */
- const renderJudgeQuestions = (repeatInfo) => {
- return (
-
-
-
判断题
-
{repeatInfo.repeatSubjectName}
-
-
-
答案
-
- {judgeList[repeatInfo.repeatIsCorrect]}
-
-
- {!!repeatInfo.repeatSubjectAnswe && (
-
- )}
-
-
来自
-
- {repeatInfo.repeatSetterName}
-
-
+
+ )}
+ {repeatRightKey?.length > 0 && (
+
+
答案
+
+ {repeatRightKey.map((item, index) => {
+ return {letterList[item.optionType]}
+ })}
- );
- };
+
+ )}
+ {!!repeatInfo.repeatSubjectAnswe && (
+
+ )}
+
+
来自
+
+ {repeatInfo.repeatSetterName}
+
+
+
+ )
+ }
+ /**
+ * 展示重复内容-判断
+ * @returns
+ */
+ const renderJudgeQuestions = repeatInfo => {
return (
-
-
- {repeatInfo.repeatRate || '10%'}
-
- 重复率
-
- }
- onOk={onSubmitRepeatModal}
- onCancel={onCancelRepeatModal}
- okText="确认录入"
- cancelText="取消录入">
- {renderRepeat(repeatQuestionsType, repeatInfo)}
-
- );
+
+
+
判断题
+
{repeatInfo.repeatSubjectName}
+
+
+
答案
+
{judgeList[repeatInfo.repeatIsCorrect]}
+
+ {!!repeatInfo.repeatSubjectAnswe && (
+
+ )}
+
+
来自
+
+ {repeatInfo.repeatSetterName}
+
+
+
+ )
+ }
+
+ return (
+
+
+ {repeatInfo.repeatRate || '10%'}
+
+ 重复率
+
+ }
+ onOk={onSubmitRepeatModal}
+ onCancel={onCancelRepeatModal}
+ okText='确认录入'
+ cancelText='取消录入'
+ >
+ {renderRepeat(repeatQuestionsType, repeatInfo)}
+
+ )
}
diff --git a/src/views/upload-questions/components/single-questions/index.jsx b/src/views/upload-questions/components/single-questions/index.jsx
index 01f3b54..951f64a 100644
--- a/src/views/upload-questions/components/single-questions/index.jsx
+++ b/src/views/upload-questions/components/single-questions/index.jsx
@@ -1,338 +1,365 @@
-import React, { Component, Fragment } from 'react';
-import { Input, Modal, message, Spin } from 'antd';
-import _ from 'lodash';
-import req from '@utils/request';
-import { debounce } from '@utils';
-import KindEditor from '../kind-editor';
-import RankLabelBox from '../rank-label-box';
-import OptionInputBox from '../option-input-box';
-import RepeatContentBox from '../repeat-content-box';
-import { apiName } from '../../constant';
-import './index.less';
-const defalutLabel = '请使用富文本编辑器输入选项内容';
+import { debounce } from '@utils'
+import req from '@utils/request'
+import { Input, Modal, Spin, message } from 'antd'
+import React, { Component, Fragment, createRef } from 'react'
+import { apiName } from '../../constant'
+import OptionInputBox from '../option-input-box'
+import RankLabelBox from '../rank-label-box'
+import RepeatContentBox from '../repeat-content-box'
+import './index.less'
+const defalutLabel = '请使用富文本编辑器输入选项内容'
export default class SingleQuestions extends Component {
- constructor(props) {
- super(props);
- this.state = {
- subjectName: '', // 题目
- isDisabledSubmit: true, //是否禁止输入
- isShowModalBox: false, // 是否展示重复率弹框
- isSubmit: true, // 是否支持提交
- };
+ constructor(props) {
+ super(props)
+ this.state = {
+ subjectName: '', // 题目
+ isDisabledSubmit: true, //是否禁止输入
+ isShowModalBox: false, // 是否展示重复率弹框
+ isSubmit: true // 是否支持提交
}
- kindEditor = KindEditor | null;
- rankLabelBox = RankLabelBox | null;
- optionInputBox = OptionInputBox | null;
+ }
+ rankLabelBox = createRef()
- currentActive = []; // 选项列表
- scoreValue = ''; // 分数
- subjectAnalysis = ''; //试题解析
- rankId = 1; //职级
- subjectAnswer = ''; // 选项内容
+ optionInputBox = OptionInputBox | null
- firstCategoryValue = ''; // 一级分类的值
- secondCategoryValue = []; // 二级分类的值
- thirdCategoryValue = []; // 三级标签的值
- repeatInfo = {}; // 重复率
+ currentActive = [] // 选项列表
+ scoreValue = '' // 分数
+ subjectAnalysis = '' //试题解析
+ rankId = 1 //职级
+ subjectAnswer = '' // 选项内容
- /**
- * 输入题目
- * @param {*} e
- */
- onChangeSubjectName = (e) => {
- let str = e.target.value.trim();
- this.setState(
- {
- subjectName: str,
- },
- () => {
- this.rankLabelBox.getThirdCategoryList();
- let isDisabledSubmit = this.checkData();
- this.setState({
- isDisabledSubmit,
- });
- }
- );
- };
+ firstCategoryValue = '' // 一级分类的值
+ secondCategoryValue = [] // 二级分类的值
+ thirdCategoryValue = [] // 三级标签的值
+ repeatInfo = {} // 重复率
- /**
- * 一次确认录入
- */
- onSubmit = debounce(() => {
- const { subjectName, isDisabledSubmit, isSubmit } = this.state;
- if (isDisabledSubmit || !isSubmit) {
- return;
- }
+ /**
+ * 输入题目
+ * @param {*} e
+ */
+ onChangeSubjectName = e => {
+ let str = e.target.value.trim()
+ this.setState(
+ {
+ subjectName: str
+ },
+ () => {
+ // this.rankLabelBox.getThirdCategoryList();
+ let isDisabledSubmit = this.checkData()
this.setState({
- isSubmit: false,
- });
- let params = {
- subjectName: subjectName,
- difficulty: this.rankId,
- subjectType: 1,
- subjectScore: this.scoreValue,
- subjectParse: this.subjectAnalysis,
- categoryIds: this.secondCategoryValue,
- labelIds: this.thirdCategoryValue,
- optionList: this.currentActive,
- };
- console.log('单选题录入 ----', params);
- req({
- method: 'post',
- data: params,
- url: apiName.addInterviewSubject,
+ isDisabledSubmit
})
- .then((res) => {
- this.repeatInfo = {};
- if (res.data && res.data.insertStatus) {
- this.setState(
- {
- isSubmit: true,
- },
- () => {
- this.successModalConfirm();
- }
- );
- } else if (!res.data.insertStatus) {
- this.repeatInfo = {
- repeatDocId: res.data.docId, // 重复题目id
- repeatRate: res.data.repeatRate, // 重复率
- repeatSubjectName: res.data.subjectName, // 重复题目
- repeatOptionList: res.data.optionList, // 重复列表项
- repeatSetterErp: res.data.subjectSetterErp, // 出题人erp
- repeatSetterName: res.data.subjectSetterName, // 出题人姓名
- };
- this.setState({
- isShowModalBox: true,
- isSubmit: true,
- });
- }
- })
- .catch((err) => {
- this.setState({
- isSubmit: true,
- });
- console.log(err);
- });
- });
+ }
+ )
+ }
- /**
- * 校验是否支持点击按钮
- * @returns
- */
- checkData = () => {
- const { subjectName } = this.state;
- let list = this.currentActive.filter((item) => item.optionContent === defalutLabel);
- let isDisabledSubmit = false;
- if (
- !!!subjectName ||
- list.length > 0 ||
- !!!this.firstCategoryValue ||
- this.secondCategoryValue.length <= 0 ||
- this.thirdCategoryValue.length <= 0 ||
- !!!this.scoreValue
- ) {
- isDisabledSubmit = true;
- }
- return isDisabledSubmit;
- };
-
- /**
- * 取消
- */
- onCancel = () => {
- this.currentActive = []; // 选项列表
- this.scoreValue = ''; // 分数
- this.subjectAnalysis = ''; //试题解析
- this.rankId = 1;
- this.subjectAnswer = ''; // 选项内容
- this.firstCategoryValue = ''; // 一级分类的值
- this.secondCategoryValue = []; // 二级分类的值
- this.thirdCategoryValue = []; // 三级标签的值
- this.kindEditor && this.kindEditor.onClear();
- this.rankLabelBox.initRankLabel();
- this.optionInputBox.handleClearOption();
- this.repeatInfo = {};
- this.setState({
- subjectName: '',
- isShowModalBox: false,
- isSubmit: true, // 是否支持提交
- });
- };
-
- /**
- * 重复率弹框-确认录入
- */
- onSubmitRepeatModal = debounce(
- () => {
- let params = {
- docId: this.repeatInfo.repeatDocId,
- };
- req({
- method: 'post',
- data: params,
- url: apiName.addRepeatInterviewSubject,
- })
- .then((res) => {
- if (res.data) {
- this.successModalConfirm();
- } else {
- message.info('请再次确认');
- }
- })
- .catch((err) => {
- console.log(err);
- message.error('请再次确认');
- });
- },
- 300,
- true
- );
-
- /**
- * 重复率弹框-取消录入
- */
- onCancelRepeatModal = () => {
- this.repeatInfo = {};
- this.setState({
- isShowModalBox: false,
- });
- };
-
- /**
- * 录入成功的弹框
- */
- successModalConfirm = () => {
- Modal.confirm({
- title: (
-
- 录入成功！贡献榜火力值 + 1
-
- ),
- closable: false,
- maskClosable: false,
- icon: ' ',
- onOk: this.onAgainSuccessModal,
- onCancel: this.onGoHomeSuccessModal,
- okText: '再录一题',
- cancelText: '去首页',
- className: 'questions-success-modal-confirm',
- });
- };
-
- /**
- * 录入成功弹框-再来一题
- */
- onAgainSuccessModal = () => {
- this.onCancel();
- };
-
- /**
- * 录入成功弹框-去首页
- */
- onGoHomeSuccessModal = () => {
- window.location.href = '/cms-supplier/question-bank';
- };
-
- /**
- * 分类选择
- * @param {*} e
- */
- onChangeRankLabel = (firstCategoryValue, secondCategoryValue, thirdCategoryValue) => {
- this.firstCategoryValue = firstCategoryValue; // 一级分类的值
- this.secondCategoryValue = secondCategoryValue; // 二级分类的值
- this.thirdCategoryValue = thirdCategoryValue; // 三级标签的值
- let isDisabledSubmit = this.checkData();
- this.setState({
- isDisabledSubmit,
- });
- };
-
- /**
- * 职级选择
- * @param {*} list
- */
- handleChangeRank = (list) => {
- this.rankId = list[0];
- let isDisabledSubmit = this.checkData();
- this.setState({
- isDisabledSubmit,
- });
- };
-
- /**
- * 选项操作
- * @param {*} currentActive 选项列表
- * @param {*} scoreValue 分值
- * @param {*} subjectAnalysis 解析
- */
- handleChangeOption = (currentActive, scoreValue, subjectAnalysis) => {
- this.currentActive = currentActive;
- this.scoreValue = scoreValue;
- this.subjectAnalysis = subjectAnalysis;
- let isDisabledSubmit = this.checkData();
- this.setState({
- isDisabledSubmit,
- });
- };
-
- render() {
- const { subjectName, isDisabledSubmit, isSubmit, isShowModalBox } = this.state;
- const { questionsType } = this.props;
- return (
-
-
-
-
题目名称：
-
this.onChangeSubjectName(e)}
- />
-
- );
+ /**
+ * 一次确认录入
+ */
+ onSubmit = debounce(() => {
+ const { subjectName, isDisabledSubmit, isSubmit } = this.state
+ if (isDisabledSubmit || !isSubmit) {
+ return
}
-}
+ if (!isSubmit) {
+ return
+ }
+ if (!!!subjectName) {
+ message.warning('请输入题目名称')
+ return
+ }
+ if (!this.currentActive.length) {
+ message.warning('请录入答案')
+ return
+ }
+ if (!!!this.firstCategoryValue) {
+ message.warning('请选择一级分类')
+ return
+ }
+ if (this.secondCategoryValue.length <= 0) {
+ message.warning('请选择二级分类')
+ return
+ }
+ if (this.thirdCategoryValue.length <= 0) {
+ message.warning('请选择三级标签')
+ return
+ }
+ this.setState({
+ isSubmit: false
+ })
+ let params = {
+ subjectName: subjectName,
+ subjectDifficult: this.rankId,
+ subjectType: 1,
+ subjectScore: this.scoreValue,
+ subjectParse: this.subjectAnalysis,
+ categoryIds: this.secondCategoryValue.filter(item => item.active).map(t => t.id),
+ labelIds: this.thirdCategoryValue.filter(item => item.active).map(t => t.id),
+ optionList: this.currentActive
+ }
+ req({
+ method: 'post',
+ data: params,
+ url: apiName.add
+ })
+ .then(res => {
+ // this.repeatInfo = {}
+ // if (res.data && res.data.insertStatus) {
+ // this.setState(
+ // {
+ // isSubmit: true
+ // },
+ // () => {
+ // this.successModalConfirm()
+ // }
+ // )
+ // } else if (!res.data.insertStatus) {
+ // this.repeatInfo = {
+ // repeatDocId: res.data.docId, // 重复题目id
+ // repeatRate: res.data.repeatRate, // 重复率
+ // repeatSubjectName: res.data.subjectName, // 重复题目
+ // repeatOptionList: res.data.optionList, // 重复列表项
+ // repeatSetterErp: res.data.subjectSetterErp, // 出题人erp
+ // repeatSetterName: res.data.subjectSetterName // 出题人姓名
+ // }
+ // this.setState({
+ // isShowModalBox: true,
+ // isSubmit: true
+ // })
+ // }
+ this.setState(
+ {
+ isSubmit: true
+ },
+ () => {
+ this.successModalConfirm()
+ }
+ )
+ })
+ .catch(err => {
+ this.setState({
+ isSubmit: true
+ })
+ console.log(err)
+ })
+ })
+ /**
+ * 校验是否支持点击按钮
+ * @returns
+ */
+ checkData = () => {
+ const { subjectName } = this.state
+ let list = this.currentActive.filter(item => item.optionContent === defalutLabel)
+ let isDisabledSubmit = false
+ if (
+ !!!subjectName ||
+ list.length > 0 ||
+ !!!this.firstCategoryValue ||
+ this.secondCategoryValue.length <= 0 ||
+ this.thirdCategoryValue.length <= 0 ||
+ !!!this.scoreValue
+ ) {
+ isDisabledSubmit = true
+ }
+ return isDisabledSubmit
+ }
+
+ /**
+ * 取消
+ */
+ onCancel = () => {
+ this.currentActive = [] // 选项列表
+ this.scoreValue = '' // 分数
+ this.subjectAnalysis = '' //试题解析
+ this.rankId = 1
+ this.subjectAnswer = '' // 选项内容
+ this.firstCategoryValue = '' // 一级分类的值
+ this.secondCategoryValue = [] // 二级分类的值
+ this.thirdCategoryValue = [] // 三级标签的值
+ this.rankLabelBox.current.initRankLabel()
+ this.optionInputBox.handleClearOption()
+ this.repeatInfo = {}
+ this.setState({
+ subjectName: '',
+ isShowModalBox: false,
+ isSubmit: true // 是否支持提交
+ })
+ }
+
+ /**
+ * 重复率弹框-确认录入
+ */
+ onSubmitRepeatModal = debounce(
+ () => {
+ let params = {
+ docId: this.repeatInfo.repeatDocId
+ }
+ req({
+ method: 'post',
+ data: params,
+ url: apiName.addRepeatInterviewSubject
+ })
+ .then(res => {
+ if (res.data) {
+ this.successModalConfirm()
+ } else {
+ message.info('请再次确认')
+ }
+ })
+ .catch(err => {
+ console.log(err)
+ message.error('请再次确认')
+ })
+ },
+ 300,
+ true
+ )
+
+ /**
+ * 重复率弹框-取消录入
+ */
+ onCancelRepeatModal = () => {
+ this.repeatInfo = {}
+ this.setState({
+ isShowModalBox: false
+ })
+ }
+
+ /**
+ * 录入成功的弹框
+ */
+ successModalConfirm = () => {
+ Modal.confirm({
+ title: (
+
+ 录入成功！贡献榜火力值 + 1
+
+ ),
+ closable: false,
+ maskClosable: false,
+ icon: ' ',
+ onOk: this.onAgainSuccessModal,
+ onCancel: this.onGoHomeSuccessModal,
+ okText: '再录一题',
+ cancelText: '去首页',
+ className: 'questions-success-modal-confirm'
+ })
+ }
+
+ /**
+ * 录入成功弹框-再来一题
+ */
+ onAgainSuccessModal = () => {
+ this.onCancel()
+ }
+
+ /**
+ * 录入成功弹框-去首页
+ */
+ onGoHomeSuccessModal = () => {
+ window.location.href = '/question-bank'
+ }
+
+ /**
+ * 分类选择
+ * @param {*} e
+ */
+ onChangeRankLabel = (firstCategoryValue, secondCategoryValue, thirdCategoryValue) => {
+ this.firstCategoryValue = firstCategoryValue // 一级分类的值
+ this.secondCategoryValue = secondCategoryValue // 二级分类的值
+ this.thirdCategoryValue = thirdCategoryValue // 三级标签的值
+ let isDisabledSubmit = this.checkData()
+ this.setState({
+ isDisabledSubmit
+ })
+ }
+
+ /**
+ * 职级选择
+ * @param {*} list
+ */
+ handleChangeRank = list => {
+ this.rankId = list[0]
+ let isDisabledSubmit = this.checkData()
+ this.setState({
+ isDisabledSubmit
+ })
+ }
+
+ /**
+ * 选项操作
+ * @param {*} currentActive 选项列表
+ * @param {*} scoreValue 分值
+ * @param {*} subjectAnalysis 解析
+ */
+ handleChangeOption = (currentActive, scoreValue, subjectAnalysis) => {
+ this.currentActive = currentActive
+ this.scoreValue = scoreValue
+ this.subjectAnalysis = subjectAnalysis
+ let isDisabledSubmit = this.checkData()
+ this.setState({
+ isDisabledSubmit
+ })
+ }
+
+ render() {
+ const { subjectName, isDisabledSubmit, isSubmit, isShowModalBox } = this.state
+ const { questionsType } = this.props
+ return (
+
+
+
+
题目名称：
+
this.onChangeSubjectName(e)}
+ />
+
+ )
+ }
+}
diff --git a/src/views/upload-questions/components/single-questions/index.less b/src/views/upload-questions/components/single-questions/index.less
index 6a5986f..5c92650 100644
--- a/src/views/upload-questions/components/single-questions/index.less
+++ b/src/views/upload-questions/components/single-questions/index.less
@@ -1,53 +1,53 @@
.single-questions-container {
- width: 1000px;
+ // width: 1000px;
+ display: flex;
+ align-items: center;
+ padding: 0 24px;
+ padding-top: 36px;
+ // label名字title
+ .single-questions-title {
display: flex;
align-items: center;
- padding: 0 24px;
- padding-top: 36px;
- // label名字title
- .single-questions-title {
- display: flex;
- align-items: center;
- justify-content: flex-end;
- width: 140px;
- line-height: 40px;
- font-size: 16px;
- color: rgba(51, 51, 51, 1);
- &:before {
- display: inline-block;
- margin-right: 4px;
- margin-top: 1px;
- color: #f5222d;
- font-size: 16px;
- content: '*';
- }
+ justify-content: flex-end;
+ width: 140px;
+ line-height: 40px;
+ font-size: 16px;
+ color: rgba(51, 51, 51, 1);
+ &:before {
+ display: inline-block;
+ margin-right: 4px;
+ margin-top: 1px;
+ color: #f5222d;
+ font-size: 16px;
+ content: '*';
}
+ }
}
.single-questions-btns-container {
+ display: flex;
+ justify-content: flex-end;
+ align-items: center;
+ margin: 20px auto;
+ width: 952px;
+ .single-questions-btn {
display: flex;
- justify-content: flex-end;
align-items: center;
- margin: 20px auto;
- width: 952px;
- .single-questions-btn {
- display: flex;
- align-items: center;
- justify-content: center;
- width: 150px;
- height: 40px;
- font-size: 16px;
- cursor: pointer;
- border: 1px solid #d9d9d9;
- border-radius: 10px;
- }
- .single-questions-submit {
- margin-left: 40px;
- background-color: #4390f7;
- color: #fff;
- border: 1px solid #4390f7;
- }
- .single-questions-disabled-submit {
- opacity: 0.5;
- }
+ justify-content: center;
+ width: 150px;
+ height: 40px;
+ font-size: 16px;
+ cursor: pointer;
+ border: 1px solid #d9d9d9;
+ border-radius: 10px;
+ }
+ .single-questions-submit {
+ margin-left: 40px;
+ background-color: #4390f7;
+ color: #fff;
+ border: 1px solid #4390f7;
+ }
+ .single-questions-disabled-submit {
+ opacity: 0.5;
+ }
}
diff --git a/src/views/upload-questions/components/upload-left-layout/index.jsx b/src/views/upload-questions/components/upload-left-layout/index.jsx
index c5f4308..b7533cf 100644
--- a/src/views/upload-questions/components/upload-left-layout/index.jsx
+++ b/src/views/upload-questions/components/upload-left-layout/index.jsx
@@ -1,27 +1,29 @@
-import React from 'react';
-import { Affix } from 'antd';
-import { RightOutlined } from '@ant-design/icons';
-import './index.less';
+import { RightOutlined } from '@ant-design/icons'
+import { Affix } from 'antd'
+import React from 'react'
+import './index.less'
export default function UploadLeftLayout(props) {
- return (
-
-
- {props.layoutList.map((item, index) => {
- return (
-
{
- props.onChange(index);
- }}
- key={`upload_left_layout_${item.id}`}>
- {item.title}
-
-
- );
- })}
+ return (
+
+
+ {props.layoutList.map((item, index) => {
+ return (
+
{
+ props.onChange(index)
+ }}
+ key={`upload_left_layout_${item.id}`}
+ >
+ {item.title}
+
-
- );
+ )
+ })}
+
+ )
}
diff --git a/src/views/upload-questions/components/upload-left-layout/index.less b/src/views/upload-questions/components/upload-left-layout/index.less
index 206c7cc..9a855a5 100644
--- a/src/views/upload-questions/components/upload-left-layout/index.less
+++ b/src/views/upload-questions/components/upload-left-layout/index.less
@@ -18,6 +18,7 @@
background: rgba(255, 255, 255, 1);
border: 1px solid rgba(208, 212, 222, 1);
border-radius: 12px;
+ cursor: pointer;
}
.upload-left-layout-item-active {
color: rgba(60, 110, 238, 1);
diff --git a/src/views/upload-questions/constant.js b/src/views/upload-questions/constant.js
index b1bb51d..8a8aabd 100644
--- a/src/views/upload-questions/constant.js
+++ b/src/views/upload-questions/constant.js
@@ -2,143 +2,142 @@
* API名称
*/
export const apiName = {
- /**
- * 获取一级
- */
- queryPrimaryCategory: '/category/queryPrimaryCategory',
+ /**
+ * 获取一级
+ */
+ queryPrimaryCategory: '/category/queryPrimaryCategory',
+ // 查询二级分类
+ queryCategoryByPrimary: 'category/queryCategoryByPrimary',
- // 查询二级分类
- queryCategoryByPrimary: 'category/queryCategoryByPrimary',
+ // 根据一级分类查询标签
+ queryLabelByCategoryId: '/label/queryLabelByCategoryId',
- // 根据一级分类查询标签
- queryLabelByCategoryId: '/label/queryLabelByCategoryId',
-
- // 新增简答
- add: '/add',
- /**
- * 新增题目
- */
- addInterviewSubject: '/admin/question/subject/add',
- /**
- * 新增重复题目
- */
- addRepeatInterviewSubject: '/admin/question/subject/addRepeatSubject',
-};
+ // 新增简答
+ add: '/add',
+ /**
+ * 新增题目
+ */
+ addInterviewSubject: '/admin/question/subject/add',
+ /**
+ * 新增重复题目
+ */
+ addRepeatInterviewSubject: '/admin/question/subject/addRepeatSubject'
+}
/**
* 模块类型
*/
export const ModuleType = {
- default: 'default',
- second: 'second',
- third: 'third',
-};
+ default: 'default',
+ second: 'second',
+ third: 'third'
+}
/**
* 导入职级对应的星
*/
export const starList = [
- {
- categoryId: 1,
- categoryName: '初级',
- active: true,
- },
- {
- categoryId: 2,
- categoryName: '中级',
- },
- {
- categoryId: 3,
- categoryName: '高级',
- },
- {
- categoryId: 4,
- categoryName: '资深',
- },
- {
- categoryId: 5,
- categoryName: '专家',
- },
-];
+ {
+ categoryId: 1,
+ categoryName: '初级',
+ active: true
+ },
+ {
+ categoryId: 2,
+ categoryName: '中级'
+ },
+ {
+ categoryId: 3,
+ categoryName: '高级'
+ },
+ {
+ categoryId: 4,
+ categoryName: '资深'
+ },
+ {
+ categoryId: 5,
+ categoryName: '专家'
+ }
+]
/**
* 模块类型
*/
export const uploadLayout = [
- {
- id: 1,
- title: '简答题',
- active: true,
- },
- // {
- // id: 2,
- // title: '单选题',
- // active: false,
- // },
- // {
- // id: 3,
- // title: '多选题',
- // active: false,
- // },
- // {
- // id: 4,
- // title: '判断题',
- // active: false,
- // },
-];
+ {
+ id: 1,
+ title: '简答题',
+ active: true
+ },
+ {
+ id: 2,
+ title: '单选题',
+ active: false
+ },
+ {
+ id: 3,
+ title: '多选题',
+ active: false
+ },
+ {
+ id: 4,
+ title: '判断题',
+ active: false
+ }
+]
/**
* 数组索引对应字母
*/
export const optionLetter = {
- 0: {
- label: 'A',
- value: 1,
- },
- 1: {
- label: 'B',
- value: 2,
- },
- 2: {
- label: 'C',
- value: 3,
- },
- 3: {
- label: 'D',
- value: 4,
- },
- 4: {
- label: 'E',
- value: 5,
- },
- 5: {
- label: 'F',
- value: 6,
- },
- 6: {
- label: 'G',
- value: 7,
- },
-};
+ 0: {
+ label: 'A',
+ value: 1
+ },
+ 1: {
+ label: 'B',
+ value: 2
+ },
+ 2: {
+ label: 'C',
+ value: 3
+ },
+ 3: {
+ label: 'D',
+ value: 4
+ },
+ 4: {
+ label: 'E',
+ value: 5
+ },
+ 5: {
+ label: 'F',
+ value: 6
+ },
+ 6: {
+ label: 'G',
+ value: 7
+ }
+}
/**
* 字母id对应字母
*/
export const letterList = {
- 1: 'A',
- 2: 'B',
- 3: 'C',
- 4: 'D',
- 5: 'E',
- 6: 'F',
- 7: 'G',
-};
+ 1: 'A',
+ 2: 'B',
+ 3: 'C',
+ 4: 'D',
+ 5: 'E',
+ 6: 'F',
+ 7: 'G'
+}
/**
* 正确/错误
*/
export const judgeList = {
- 0: '错误',
- 1: '正确',
-};
+ 0: '错误',
+ 1: '正确'
+}
diff --git a/src/views/upload-questions/index.less b/src/views/upload-questions/index.less
index e3af76d..98f2236 100644
--- a/src/views/upload-questions/index.less
+++ b/src/views/upload-questions/index.less
@@ -2,9 +2,9 @@
position: relative;
margin: 0 auto;
width: 1439px;
- overflow-y: auto;
+ // overflow-y: auto;
border-radius: 5px;
- height: calc(100vh - 100px);
+ // height: calc(100vh - 100px);
.ant-card-head {
position: sticky;
top: 0;
@@ -14,7 +14,4 @@
z-index: 10;
background-color: #fff;
}
- .ant-card-body {
- display: flex;
- }
}
diff --git a/src/views/upload-questions/index.tsx b/src/views/upload-questions/index.tsx
index 5090e98..2fcb1c2 100644
--- a/src/views/upload-questions/index.tsx
+++ b/src/views/upload-questions/index.tsx
@@ -2,16 +2,9 @@ import req from '@utils/request'
import { Card, message } from 'antd'
import { useEffect, useState } from 'react'
import { useNavigate } from 'react-router-dom'
-import BatchleBox from './pages/batch-box'
import SingleBox from './pages/single-box'
import './index.less'
-const tabList = [
- {
- key: 'singleBox',
- tab: '单题录入'
- }
-]
const UploadQuestions = () => {
const [currentKey, setCurrentKey] = useState('singleBox')
const navigate = useNavigate()
@@ -41,23 +34,18 @@ const UploadQuestions = () => {
})
}, [])
- const contentList = {
- singleBox:
,
- batchBox:
- }
-
return (
{
setCurrentKey(key)
}}
>
- {contentList[currentKey]}
+
)
diff --git a/src/views/upload-questions/pages/batch-box/index.jsx b/src/views/upload-questions/pages/batch-box/index.jsx
deleted file mode 100644
index cd2acaa..0000000
--- a/src/views/upload-questions/pages/batch-box/index.jsx
+++ /dev/null
@@ -1,12 +0,0 @@
-import React, { Component } from 'react';
-import './index.less';
-export default class BatchBox extends Component {
- constructor(props) {
- super(props);
- this.state = {};
- }
-
- render() {
- return
批量上传
;
- }
-}
diff --git a/src/views/upload-questions/pages/batch-box/index.less b/src/views/upload-questions/pages/batch-box/index.less
deleted file mode 100644
index db9425c..0000000
--- a/src/views/upload-questions/pages/batch-box/index.less
+++ /dev/null
@@ -1,7 +0,0 @@
-.upload-batch-questions-box {
- margin: 0 auto;
- width: 1000px;
- display: flex;
- border-radius: 5px;
- border: 1px solid #3d3d3d;
-}
diff --git a/src/views/upload-questions/pages/single-box/index.jsx b/src/views/upload-questions/pages/single-box/index.jsx
index c755dd3..c9b1c34 100644
--- a/src/views/upload-questions/pages/single-box/index.jsx
+++ b/src/views/upload-questions/pages/single-box/index.jsx
@@ -1,9 +1,10 @@
+import { RightOutlined } from '@ant-design/icons'
+import { Button, Space } from 'antd'
import React, { Component } from 'react'
import BriefQuestions from '../../components/brief-questions'
import JudgeQuestions from '../../components/judge-questions'
import MultipleQuestions from '../../components/multiple-questions'
import SingleQuestions from '../../components/single-questions'
-import UploadLeftLayout from '../../components/upload-left-layout'
import { uploadLayout } from '../../constant'
import './index.less'
@@ -40,16 +41,6 @@ export default class SingleBox extends Component {
})
}
- render() {
- const { currentIndex, layoutList } = this.state
- return (
-
-
-
{this.changeReander(currentIndex)}
-
- )
- }
-
changeReander = i => {
switch (i) {
case 0:
@@ -62,4 +53,32 @@ export default class SingleBox extends Component {
return
}
}
+
+ render() {
+ const { currentIndex, layoutList } = this.state
+ return (
+
+ {/*
*/}
+
+
+ {layoutList.map((item, index) => {
+ return (
+
+ )
+ })}
+
+
+
{this.changeReander(currentIndex)}
+
+ )
+ }
}
diff --git a/src/views/upload-questions/pages/single-box/index.less b/src/views/upload-questions/pages/single-box/index.less
index 02bdc8e..d76fa9c 100644
--- a/src/views/upload-questions/pages/single-box/index.less
+++ b/src/views/upload-questions/pages/single-box/index.less
@@ -1,29 +1,33 @@
.ant-modal-body {
- padding: 12px 24px 0;
+ padding: 12px 24px 0;
}
.upload-questions-modular {
- display: flex;
- flex-direction: column;
- margin: 0 auto;
- margin-left: 35px;
- background: rgba(249, 250, 252, 1);
- border: 2px solid rgba(240, 240, 240, 1);
- border-radius: 12px;
+ // display: flex;
+ // flex-direction: column;
+ margin: 0 auto;
+ margin-left: 35px;
+ background: rgba(249, 250, 252, 1);
+ border: 2px solid rgba(240, 240, 240, 1);
+ border-radius: 12px;
+ height: calc(100vh - 220px);
+ overflow-y: scroll;
+ width: 100%;
+ // flex: 1 0 auto;
}
.questions-success-modal-confirm {
- width: 300px;
- // 录入成功弹框
- .ant-modal-confirm-btns {
- display: flex;
- justify-content: center;
- width: 100%;
- .ant-btn {
- width: 100px;
- border-radius: 18px;
- }
- .ant-btn-primary {
- background: rgba(60, 110, 238, 1);
- margin-left: 60px;
- }
+ width: 300px;
+ // 录入成功弹框
+ .ant-modal-confirm-btns {
+ display: flex;
+ justify-content: center;
+ width: 100%;
+ .ant-btn {
+ width: 100px;
+ border-radius: 18px;
}
+ .ant-btn-primary {
+ background: rgba(60, 110, 238, 1);
+ margin-left: 60px;
+ }
+ }
}
diff --git a/src/views/user-info/index.tsx b/src/views/user-info/index.tsx
index 968b6db..24aa29a 100644
--- a/src/views/user-info/index.tsx
+++ b/src/views/user-info/index.tsx
@@ -1,8 +1,9 @@
-import Head from '@/imgs/head.jpg'
import { LoadingOutlined, PlusOutlined } from '@ant-design/icons'
+import { saveUserInfo } from '@features/userInfoSlice.ts'
import req from '@utils/request'
import { Button, Card, Col, Form, Input, Radio, Row, Upload, message } from 'antd'
import { memo, useEffect, useState } from 'react'
+import { useDispatch } from 'react-redux'
import './index.less'
@@ -54,6 +55,8 @@ const UserInfo = () => {
const userInfoStorage = localStorage.getItem('userInfo')
const { loginId = '', tokenValue = '' } = userInfoStorage ? JSON.parse(userInfoStorage) : {}
+ const dispatch = useDispatch()
+
const [form] = Form.useForm()
const [editFlag, setEditFlag] = useState(false)
const [loading, setLoading] = useState(false)
@@ -73,6 +76,7 @@ const UserInfo = () => {
).then(res => {
if (res?.success && res?.data) {
setUserInfo(res.data)
+ setAvatar(res.data.avatar || '')
form.setFieldsValue(res.data)
}
})
@@ -87,7 +91,6 @@ const UserInfo = () => {
const onFinish = () => {
setLoading(true)
const values = form.getFieldsValue()
- // return console.log(values)
if (!Object.values(values).filter(Boolean).length && !avatar) {
setLoading(false)
return
@@ -108,10 +111,13 @@ const UserInfo = () => {
'/auth'
)
.then(res => {
+ dispatch(saveUserInfo(params))
+ setUserInfo(params)
+ setAvatar(params.avatar || '')
if (res.success) {
message.success('更新成功')
setTimeout(() => {
- getUserInfo()
+ // getUserInfo()
setLoading(false)
setEditFlag(false)
}, 500)
@@ -126,7 +132,6 @@ const UserInfo = () => {
}
const handleChange = ({ file }) => {
- // console.log(info)
if (file.status === 'done' && file.response.success && file.response.data) {
setAvatar(file.response.data)
}
@@ -174,7 +179,12 @@ const UserInfo = () => {
) : (
- 
+ {userInfo.avatar ? (
+ 
+ ) : (
+
+ )}
+ {/* */}
)}
diff --git a/vite.config.ts b/vite.config.ts
index b50f907..e039ff2 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -25,7 +25,9 @@ export default ({ mode }) => {
'@utils': path.resolve(__dirname, 'src/utils'),
'@components': path.resolve(__dirname, 'src/components'),
'@imgs': path.resolve(__dirname, 'src/imgs'),
- '@constants': path.resolve(__dirname, 'src/constants')
+ '@constants': path.resolve(__dirname, 'src/constants'),
+ '@store': path.resolve(__dirname, 'src/store'),
+ '@features': path.resolve(__dirname, 'src/store/features')
}
},
plugins: [react()],