| | |
| | | <template> |
| | | <div class="temp-book" @mouseup="handleMouseUp"> |
| | | <pageHeader></pageHeader> |
| | | <pageContent></pageContent> |
| | | </div> |
| | | </template> |
| | | |
| | | <script> |
| | | import examinations from "./components/examinations/index.vue"; |
| | | import { getPublicImage } from "@/assets/js/middleGround/tool"; |
| | | import pageHeader from "./header/index.vue"; |
| | | import pageContent from "./content/index.vue"; |
| | | export default { |
| | | name: "temp-book", |
| | | components: { |
| | | pageHeader, |
| | | pageContent, |
| | | examinations, |
| | | }, |
| | | data() { |
| | | return { |
| | | type: "option", |
| | | idPathList: [], |
| | | cardList: [], |
| | | }; |
| | | return {}; |
| | | }, |
| | | mounted() { |
| | | this.getBookInfo(); |
| | | }, |
| | | methods: { |
| | | getBookInfo() { |
| | | let query = { |
| | | path: "*", |
| | | queryType: "*", |
| | | productId: this.config.bookId, |
| | | favoriteTypes: "FavoriteBookCity", |
| | | itemFields: { |
| | | "SysType=": "CmsFolder", |
| | | }, |
| | | coverSize: { |
| | | height: 300, |
| | | }, |
| | | fields: { |
| | | seriesName: [], |
| | | author: [], |
| | | isbn: [], |
| | | publicationDate: [], |
| | | bookClassification: [], |
| | | paperPrice: [], |
| | | JDLink: [], |
| | | tmallLink: [], |
| | | dangdangLink: [], |
| | | weidianLink: [], |
| | | content: [], |
| | | authorIntroduction: [], |
| | | // isApplyPaperBook: [], |
| | | // isApplyEBook: [], |
| | | isApplyBook: [], |
| | | isSell: [], |
| | | pdf: [], |
| | | protectedEpub: [], |
| | | probationPage: [], //pdf试读页数 |
| | | freeEpubPage: [], //epub试读百分比 |
| | | }, |
| | | }; |
| | | this.MG.store.getProductDetail(query).then((res) => { |
| | | console.log("图书信息", res.datas.cmsDatas[0].datas); |
| | | const testData = res.datas.cmsDatas[0].datas.find( |
| | | (item) => item.refCode == "questionBank" |
| | | ); |
| | | this.getResourceData(testData); |
| | | }); |
| | | }, |
| | | getResourceData(type) { |
| | | let query = { |
| | | path: "*", |
| | | queryType: "*", |
| | | productId: this.config.bookId, |
| | | cmsPath: type.productLinkPath, |
| | | itemFields: { |
| | | SysType: "CmsFolder", |
| | | // 资源类型,试读文件,是否允许下载等参数 |
| | | selectType: [], |
| | | freeFile: [], |
| | | file: [], |
| | | protectedFile: [], |
| | | resourcesClassification: [], |
| | | isDownload: [], |
| | | jsek_resourceBrief: [], |
| | | jsek_link: [], |
| | | jsek_questionBank: [], |
| | | }, |
| | | pading: { |
| | | start: 0, |
| | | size: 999, |
| | | }, |
| | | }; |
| | | this.MG.store |
| | | .getProductDetail(query) |
| | | .then(async (res) => { |
| | | if (type.refCode == "questionBank") { |
| | | const data = res.datas.cmsDatas[0].datas.filter( |
| | | (item) => item.refCode == "jsek_questionBank" |
| | | ); |
| | | if (data.length) return this.getResourceData(data[0]); |
| | | } |
| | | if (type.refCode == "jsek_questionBank") { |
| | | const testDataList = res.datas.cmsDatas[0].datas; |
| | | if (testDataList.length > 0) { |
| | | // console.log("题目列表", testDataList); |
| | | this.$store.commit("setTestList", testDataList); |
| | | // this.getIdPathList(testDataList[1]) |
| | | } else { |
| | | console.log("暂无资源"); |
| | | } |
| | | } |
| | | }) |
| | | .catch((e) => { |
| | | console.log(e); |
| | | }); |
| | | }, |
| | | getIdPathList(data) { |
| | | let query = { |
| | | path: "*", |
| | | queryType: "*", |
| | | productId: this.config.bookId, |
| | | cmsPath: data.productLinkPath, |
| | | pading: { |
| | | start: 0, |
| | | size: 999, |
| | | }, |
| | | }; |
| | | this.MG.store.getProductDetail(query).then((res) => { |
| | | console.log("题目", res.datas.cmsDatas[0].datas); |
| | | this.$data.idPathList = res.datas.cmsDatas[0].datas; |
| | | this.getQuestionList(); |
| | | }); |
| | | }, |
| | | // 获取题库题目 |
| | | getQuestionList(oldData) { |
| | | // 清空正确题数记录 |
| | | let flag = 0; |
| | | for (let index = 0; index < this.$data.idPathList.length; index++) { |
| | | const pathitem = this.$data.idPathList[index]; |
| | | const pathList = this.$data.cardList; |
| | | pathList.push({ |
| | | path: pathitem.productLinkPath, |
| | | catalogName: pathitem.name, |
| | | infoList: [], |
| | | }); |
| | | this.$data.cardList = pathList; |
| | | // 获取题目 |
| | | let query = { |
| | | path: "*", |
| | | queryType: "*", |
| | | productId: this.config.bookId, |
| | | cmsPath: pathitem.productLinkPath, |
| | | itemFields: { |
| | | Embedded_QuestionBank_Stem: [], |
| | | Embedded_QuestionBank_AnalysisCon: [], |
| | | Embedded_QuestionBank_Answer: [], |
| | | Embedded_QuestionBank_Option: [], |
| | | Embedded_QuestionBank_QuestionType: [], |
| | | Embedded_QuestionBank_StemStyle: [], |
| | | Embedded_QuestionBank_OptionStyle: [], |
| | | Embedded_QuestionBank_KnowledgePoint: [], |
| | | Embedded_QuestionBank_Difficulty: [], |
| | | }, |
| | | pading: { |
| | | start: 0, |
| | | size: 999, |
| | | }, |
| | | }; |
| | | this.MG.store.getProductDetail(query).then((res) => { |
| | | let oldList; |
| | | if (oldData) { |
| | | // 提交过,存在答题记录 |
| | | oldList = oldData.find( |
| | | (item) => item.path == pathitem.productLinkPath |
| | | ).infoList; |
| | | this.setData({ |
| | | submitStatus: true, |
| | | }); |
| | | } |
| | | res.datas.cmsDatas[0].datas.forEach((item, index) => { |
| | | let oldObj = ""; |
| | | if (oldList) |
| | | oldObj = oldList.find((oldItem) => oldItem.id == item.id); |
| | | let questionObj = { |
| | | // num: index, // 题号 |
| | | id: item.id, |
| | | type: pathitem.name, |
| | | stem: |
| | | item.Embedded_QuestionBank_QuestionType == "completion" |
| | | ? JSON.parse(item.Embedded_QuestionBank_Stem) |
| | | .stemTxt.replaceAll("<vacancy>", ",input,") |
| | | .split(",") |
| | | : JSON.parse(item.Embedded_QuestionBank_Stem), // 题干 |
| | | answer: item.Embedded_QuestionBank_Answer, // 答案 |
| | | option: item.Embedded_QuestionBank_Option |
| | | ? JSON.parse(item.Embedded_QuestionBank_Option) |
| | | : "", // 选择题选项 |
| | | analysisCon: item.Embedded_QuestionBank_AnalysisCon, // 解析 |
| | | questionType: item.Embedded_QuestionBank_QuestionType, // 题型 |
| | | optionStyle: item.Embedded_QuestionBank_OptionStyle, // 选项显示类型 |
| | | stemStyle: item.Embedded_QuestionBank_StemStyle, // 题干显示类型 |
| | | difficulty: item.Embedded_QuestionBank_Difficulty |
| | | ? 4 - item.Embedded_QuestionBank_Difficulty |
| | | : 0, // 难度等级 |
| | | userAnswer: oldObj |
| | | ? oldObj.userAnswer |
| | | : item.Embedded_QuestionBank_QuestionType == "completion" || |
| | | item.Embedded_QuestionBank_QuestionType == "multipleChoice" |
| | | ? [] |
| | | : "", |
| | | isUserAnswer: oldObj |
| | | ? this.isHaveAnswer(oldObj.userAnswer) |
| | | : false, |
| | | isRight: oldObj ? oldObj.isRight : null, |
| | | isComplete: oldObj ? oldObj.isComplete : false, |
| | | isCollect: false, |
| | | isUnfold: "", // 控制解析的折叠面板是否展开 |
| | | }; |
| | | // 多选和填空答案肯为数组,要转换JSON格式 |
| | | if ( |
| | | questionObj.questionType == "completion" || |
| | | questionObj.questionType == "multipleChoice" |
| | | ) { |
| | | try { |
| | | questionObj.answer = JSON.parse(questionObj.answer).toString(); |
| | | } catch (error) { |
| | | questionObj.answer = item.Embedded_QuestionBank_Answer; |
| | | } |
| | | } |
| | | // 填空题改造 |
| | | if (questionObj.questionType == "completion") { |
| | | let index = 0; |
| | | for (let i = 0; i < questionObj.stem.length; i++) { |
| | | const item = questionObj.stem[i]; |
| | | if (item == "input") { |
| | | questionObj.stem[i] = { |
| | | num: index, |
| | | data: "input", |
| | | }; |
| | | if (!oldObj) questionObj.userAnswer[index] = ""; |
| | | index++; |
| | | } |
| | | } |
| | | } |
| | | // 题干富文本处理 |
| | | if (questionObj.stemStyle == "RichText") { |
| | | // questionObj.option.txt = '' |
| | | questionObj.stem.stemTxt = questionObj.stem.stemTxt |
| | | .replace( |
| | | /\<img/gi, |
| | | '<img style="max-width: 300rpx !important;object-fit: contain;" class="stem-rich-img" ' |
| | | ) |
| | | .replace(/\<p/gi, '<p class="stem-rich-p"') |
| | | .replace("../file", app.config.requestCtx + "/file"); |
| | | } |
| | | // 选项富文本处理 |
| | | if ( |
| | | questionObj.optionStyle == "RichText" && |
| | | (questionObj.questionType == "singleChoice" || |
| | | questionObj.questionType == "judge" || |
| | | questionObj.questionType == "multipleChoice") |
| | | ) { |
| | | questionObj.option.forEach((item) => { |
| | | if (item.txt) |
| | | item.txt = item.txt |
| | | .replace(/\<img/gi, '<img class="option-rich-img"') |
| | | .replace(/\<p/gi, '<p class="stem-rich-p"') |
| | | .replace("../file", app.config.requestCtx + "/file"); |
| | | }); |
| | | } |
| | | // 解析富文本处理 |
| | | if ( |
| | | questionObj.analysisCon && |
| | | typeof questionObj.analysisCon == "string" |
| | | ) { |
| | | questionObj.analysisCon = questionObj.analysisCon.replace( |
| | | /\<img/gi, |
| | | '<img style="max-width: 300rpx !important;object-fit: contain;" class="stem-rich-img" ' |
| | | ); |
| | | } |
| | | // 听力题修改 |
| | | // if (questionObj.questionType == 'singleChoice') { |
| | | // const src = this.extractSourceSrc(questionObj.stem.stemTxt) |
| | | // if (src) { |
| | | // questionObj.src = src |
| | | // questionObj.stem.stemTxt = this.removeVideoAndAudioTags(questionObj.stem.stemTxt) |
| | | // } |
| | | // } |
| | | // 获取图片 |
| | | if ( |
| | | questionObj.stemStyle == "Image" || |
| | | questionObj.stemStyle == "TxtAndImage" |
| | | ) { |
| | | questionObj.stem.stemImage = getPublicImage( |
| | | questionObj.stem.stemImage, |
| | | 150 |
| | | ); |
| | | } |
| | | if ( |
| | | questionObj.optionStyle == "Image" || |
| | | questionObj.optionStyle == "TxtAndImage" |
| | | ) { |
| | | questionObj.option.forEach((optionItem) => { |
| | | if (optionItem.img) |
| | | optionItem.img = getPublicImage(optionItem.img, 150); |
| | | }); |
| | | } |
| | | // 客观题总分赋值 |
| | | if (questionObj.questionType !== "shortAnswer") { |
| | | // this.setData({ |
| | | // subjectiveGrade: this.data.subjectiveGrade + 2, |
| | | // }); |
| | | } |
| | | // 旧数据里 题目正确 记录正确数量 |
| | | if (questionObj.isRight) { |
| | | // this.setData({ |
| | | // correctNum: this.data.correctNum + 1, |
| | | // }); |
| | | } |
| | | if ( |
| | | pathitem.name == "判断题" || |
| | | pathitem.name == "填空题" || |
| | | pathitem.name == "多选题" || |
| | | pathitem.name == "单选题" || |
| | | pathitem.name == "听力题" |
| | | ) { |
| | | if (oldObj) { |
| | | // this.setData({ |
| | | // subjectiveTotal: this.data.subjectiveTotal + 1, |
| | | // }); |
| | | } |
| | | } |
| | | // cardList赋值 |
| | | let cardIndex = this.$data.cardList.findIndex( |
| | | (item) => item.path == pathitem.productLinkPath |
| | | ); |
| | | let infoList = this.$data.cardList[cardIndex].infoList; |
| | | infoList.push(questionObj); |
| | | // this.setData({ |
| | | // [`cardList[${cardIndex}].infoList`]: infoList, |
| | | // }); |
| | | this.$data.cardList[cardIndex].infoList = infoList; |
| | | flag++; |
| | | let questionList = []; |
| | | let grade = 0; |
| | | const cardUpdatedList = this.$data.cardList; |
| | | // if (flag == this.data.idPathList.length) { |
| | | cardUpdatedList.forEach((aitem) => { |
| | | aitem.infoList.forEach((bitem, bindex) => { |
| | | questionList.push(bitem); |
| | | bitem.number = bindex + 1; |
| | | bitem.score = 2; |
| | | }); |
| | | }); |
| | | // this.setData({ |
| | | // questionDataList: questionList, |
| | | // cardList: cardUpdatedList, |
| | | // }); |
| | | this.$data.cardList = cardUpdatedList; |
| | | console.log("题目呢", this.$data.cardList); |
| | | }); |
| | | }); |
| | | } |
| | | }, |
| | | |
| | | mounted() {}, |
| | | methods: { |
| | | getParentWithClass(element, className) { |
| | | while (element.parentElement) { |
| | | element = element.parentElement; |
| | |
| | | } |
| | | } |
| | | }, |
| | | |
| | | handleMouseUp(e) { |
| | | const txt = window.getSelection()?.toString(); |
| | | const node = window.getSelection(); |
| | | let html = node.anchorNode.parentNode.parentNode.parentNode; |
| | | let nextHtml = html.firstChild.innerHTML; |
| | | let pageHtml = this.getParentWithClass(node.anchorNode,'page-box') |
| | | if (txt) { |
| | | console.log(pageHtml); |
| | | } |
| | | if (html) { |
| | | const page = html.getAttribute("page"); |
| | | console.log("page", page,this.$actions); |
| | | this.$actions.setGlobalState({ |
| | | aa:page |
| | | }) |
| | | |
| | | const selection = ( |
| | | this.container ? this.container : window |
| | | ).getSelection(); |
| | | const txt = selection.toString(); |
| | | if (selection.type != "none" && txt) { |
| | | let node = selection.anchorNode.parentNode; |
| | | let pageHtml = this.getParentWithClass( |
| | | selection.anchorNode, |
| | | "page-box" |
| | | ); |
| | | let chapterDom = this.getParentWithClass( |
| | | selection.anchorNode, |
| | | "chapter" |
| | | ); |
| | | let chapterNum; |
| | | if (chapterDom) chapterNum = chapterDom.getAttribute("num"); |
| | | if (pageHtml) { |
| | | const page = pageHtml.getAttribute("page"); |
| | | // 监听选中文本事件,并触发父层方法 |
| | | if (this.$store.state.qiankun.windowSelection) { |
| | | this.$store.state.qiankun.windowSelection({ |
| | | chapterNum, |
| | | txt, |
| | | page, |
| | | x: e.x, |
| | | y: e.y, |
| | | }); |
| | | } |
| | | } |
| | | } else { |
| | | if (this.$store.state.qiankun.windowSelection) { |
| | | this.$store.state.qiankun.windowSelection({ |
| | | chapterNum: "", |
| | | txt: "", |
| | | page: "", |
| | | x: e.x, |
| | | y: e.y, |
| | | }); |
| | | } |
| | | } |
| | | }, |
| | | }, |
| | | }; |
| | | </script> |
| | | |
| | | <style lang="less" scoped></style> |
| | | <style lang="less"> |
| | | @import "../assets/main.less"; |
| | | </style> |