From 2a049f380e09bf8af7c6de4089846d9d1965f4d8 Mon Sep 17 00:00:00 2001 From: yujialong <479214531@qq.com> Date: Thu, 22 Aug 2024 18:32:20 +0800 Subject: [PATCH] =?UTF-8?q?=E9=80=89=E9=A2=98?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/assets/images/empty.svg | 1 + src/pages/testPaper/detail/auto.vue | 419 +++++++++++++++++++------- src/pages/testPaper/detail/manual.vue | 113 +++---- src/styles/common.scss | 5 + 4 files changed, 372 insertions(+), 166 deletions(-) create mode 100644 src/assets/images/empty.svg diff --git a/src/assets/images/empty.svg b/src/assets/images/empty.svg new file mode 100644 index 0000000..01ac22e --- /dev/null +++ b/src/assets/images/empty.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/pages/testPaper/detail/auto.vue b/src/pages/testPaper/detail/auto.vue index 7d9eb57..6994b99 100644 --- a/src/pages/testPaper/detail/auto.vue +++ b/src/pages/testPaper/detail/auto.vue @@ -58,23 +58,79 @@

题库

- - + + + +
+ +

暂无数据

+
-

知识点框架

- - - - - {{ data.name }} - - + + + +
+ +

暂无数据

+
@@ -86,16 +142,14 @@

-
+
- 题库：{{ item.quesBank.name }} + 题库：{{ item.quesBank.questionBankName }}
- - {{ tag.name }} - + {{ tag.name }}
@@ -133,21 +187,34 @@ export default { questionTypes: QuesConst.questionTypes, quesVisible: false, difficult: '', + searchTimer: null, + curQuesBank: {}, + quesBankTypeVal: [], + quesBankTypes: [], quesBankKeyword: '', - knowledgeKeyword: '', - searchTimer: null, - key: 1, + + quesAllCheck: false, quesBanks: [], + pageQuesBank: 1, + pageSizeQuesBank: 10, + totalQuesBank: 0, + + knowledgeKeyword: '', + knowledgeTypeVal: [], + knowledgeTypes: [], + knowledgeCheck: false, knowledges: [], - checked: [], + pageKn: 1, + pageSizeKn: 10, + totalKn: 0, + checked: [], list: [], years: ['暂无年份', '2024', '2023', '2022', '2021', '2020', '2019', '2018', '2017', '2016', '更早'], yearAll: true, yearCheck: [], submiting: false, - diaTop: 0, }; }, computed: { @@ -174,73 +241,124 @@ export default { } }, mounted () { - console.log(5555, window.innerHeight) - const height = (window.innerHeight - 600) / 2 - this.diaTop = (height > 0 ? height : 0) + 'px' + }, methods: { // 初始化 init () { this.yearCheck = this.years this.handleQuesList() + this.getQuesBankType() this.getQuesBank() this.difficult = this.$parent.form.difficult this.difficult && this.difficultChange(this.difficult) }, + // 获取题库分类 + async getQuesBankType () { + try { + const { data } = await this.$post(this.api.getAllQuestionBankCategories, { + createSource: 1, + status: 1, + }) + this.handleList(data) + this.quesBankTypes = data + } catch (e) { } + }, // 获取题库 async getQuesBank () { try { - const { list } = await this.$post(this.api.questionBankStructureLevel, { - keyword: this.quesBankKeyword, - createSource: 1, + const type = this.quesBankTypeVal + const res = await this.$post(this.api.questionBankList, { status: 1, + pageNum: this.pageQuesBank, + pageSize: this.pageSizeQuesBank, + questionCategoryId: type.length ? type[type.length - 1] : '', + name: this.quesBankKeyword + }) + this.quesBanks = res.message.records + this.totalQuesBank = res.message.total + } catch (e) { } + }, + // 切换页码 + currentChangeQuesBank (val) { + this.pageQuesBank = val + this.getQuesBank() + }, + // 题目多选回调 + questionBankClick (item) { + this.curQuesBank = item + this.knowledgeCheck = false + this.getKnowledgeType() + this.getKnowledge() + }, + + // 处理树形 + handleList (list) { + list.map(e => { + if (e.children && e.children.length) { + this.handleList(e.children) + } else { + delete e.children + } + }) + }, + // 获取知识点分类 + async getKnowledgeType () { + try { + const { data } = await this.$post(this.api.classificationTreeStructure, { + createSource: 1, + questionBankId: this.curQuesBank.id, }) - this.quesBanks = list + this.handleList(data) + this.knowledgeTypes = data } catch (e) { } }, // 获取知识点 async getKnowledge () { try { - const id = this.$refs.quesBank.getCurrentKey() - if (id) { - const { data } = await this.$post(this.api.TreeStructure, { - createSource: 1, - questionBankId: id, - keyword: this.knowledgeKeyword, - }) - this.knowledges = data - } + const type = this.knowledgeTypeVal + const res = await this.$post(this.api.knowledgeHierarchyList, { + pageNum: this.pageKn, + pageSize: this.pageSizeKn, + questionBankId: this.curQuesBank.id, + knowledgePointCategoryId: type.length ? type[type.length - 1] : '', + name: this.knowledgeKeyword, + }) + this.knowledges = res.message.records + this.totalKn = res.message.total } catch (e) { } }, - // 题库勾选回调 - quesBankCheck (data, checked) { - // debugger - if (checked) { - // this.$refs.quesBank.setCurrentKey(data.id) - this.getKnowledge() - } - this.$refs.knowledge.setCheckedNodes(checked ? this.knowledges : []) + // 切换页码 + currentChangeKn (val) { + this.pageKn = val + this.getKnowledge() + }, + // 知识点全选回调 + knowledgeAllCheckChange (val) { + this.knowledges.map(e => { + e.check = val + this.knowledgeChange(val, e) + }) }, // 知识点勾选回调 - knowledgeCheck (data, checked) { - // 选中的是知识点才需要显示在最右边 - if (data.type) { - const checkQues = this.$refs.quesBank.getCurrentNode() - const ques = this.checked.find(e => e.quesBank.id === checkQues.id) - // 已选中的题库数组里有该题库，则往该题库的知识点数组里 - if (ques) { - const i = ques.knowledges.findIndex(e => e.id === data.id) - if (checked && i === -1) { - ques.knowledges.push(data) - } else if (!checked && i >= 0) { - ques.knowledges.splice(i, 1) - } - } else { - this.checked.push({ - quesBank: checkQues, - knowledges: [data] - }) + knowledgeChange (checked, data) { + const checkQues = this.curQuesBank + const index = this.checked.findIndex(e => e.quesBank.id === checkQues.id) + // 已选中的题库数组里有该题库，则往该题库的知识点数组里 + if (index !== -1) { + const ques = this.checked[index] + const i = ques.knowledges.findIndex(e => e.id === data.id) + if (checked && i === -1) { + ques.knowledges.push(data) + } else if (!checked && i >= 0) { + ques.knowledges.splice(i, 1) } + ques.knowledges.length || this.checked.splice(index, 1) + } else { + this.checked.push({ + quesBank: checkQues, + knowledges: [data] + }) } }, // 处理大纲列表 @@ -257,25 +375,36 @@ export default { type: 'warning', closeOnClickModal: false, }) + this.knowledges.map(e => e.check = false) this.checked = [] - // this.$nextTick(() => { - // this.$refs.knowledge.setCheckedKeys([]) - // }) + this.knowledgeCheck = false } catch (e) { } }, // 删除题库 - delQuesBank (i) { - const k = this.$refs.knowledge - this.checked[i].knowledges.map(e => { - k.setChecked(e.id, false, true) - }) - // this.checked.splice(i, 1) + async delQuesBank (i) { + try { + await this.$confirm(`确认要移除吗？`, '提示', { + confirmButtonText: '确定', + cancelButtonText: '取消', + type: 'warning', + closeOnClickModal: false, + }) + const k = this.knowledges + this.checked[i].knowledges.map(e => { + const cur = k.findIndex(n => n.id === e.id) + if (cur !== -1) k[cur].check = false + }) + this.checked.splice(i, 1) + this.knowledgeCheck = false + } catch (e) { } }, // 删除知识点 - delKnowledge (i, j, item) { - this.$refs.knowledge.setChecked(item.knowledges[j].id, false) + delKnowledge (i, j, item, k) { + const cur = this.knowledges.findIndex(e => e.id === k.id) + if (cur !== -1) this.knowledges[cur].check = false item.knowledges.splice(j, 1) item.knowledges.length || this.checked.splice(i, 1) // 知识点清空了则把该题库删除 + this.knowledgeCheck = false }, // 获取模板列表 async getList () { @@ -428,48 +557,114 @@ export default { .el-drawer__header { margin-bottom: 20px; } -} -.overflow { - height: calc(100vh - 147px); - padding: 0 20px; - overflow: auto; -} + .overflow { + height: calc(100vh - 147px); + padding: 0 20px; + overflow: auto; + } -.wrap { - display: flex; - margin-top: 20px; - border: 1px solid #eee; - .item { - width: 30%; - max-height: calc(100vh - 190px); - padding: 15px; - border-right: 1px solid #eee; - overflow: auto; + .wrap { + display: flex; + margin-top: 20px; + border: 1px solid #eee; + + .filter { + margin-bottom: 15px; + + li { + display: flex; + align-items: center; + } - &:last-child { - width: 40%; - border-right: 0; + label { + margin-right: 10px; + font-size: 14px; + color: #333; + white-space: nowrap; + } } - } - .total { - font-size: 16px; - color: #333; - } + .item { + width: 30%; + height: calc(100vh - 190px); + padding: 15px; + border-right: 1px solid #eee; + overflow: auto; - .clear { - display: inline-flex; - align-items: center; - font-size: 14px; - color: #8b8b8b; - cursor: pointer; - } + &:last-child { + width: 40%; + border-right: 0; + } + } - .knowledges { - padding-left: 44px; - margin-top: 10px; + .total { + font-size: 16px; + color: #333; + } + + .clear { + display: inline-flex; + align-items: center; + font-size: 14px; + color: #8b8b8b; + cursor: pointer; + } + + .knowledges { + padding-left: 44px; + margin-top: 10px; + } + + + .line { + display: flex; + padding: 5px 0; + color: #333; + + &.able-check { + cursor: pointer; + + &:hover { + background-color: #f5f5f5; + } + + &.active { + background-color: #e5e5e5; + } + } + } + + .serial { + width: 32px; + margin: 0 12px; + text-align: center; + white-space: nowrap; + + &.first { + margin-left: 0; + } + } + + .stem { + max-width: calc(100% - 71px); + @include ellipsis; + } + + .checked-stem { + max-width: 165px; + @include ellipsis; + } + + .check-left { + display: inline-flex; + align-items: center; + } + + .action-icon { + font-size: 14px; + } } } \ No newline at end of file diff --git a/src/pages/testPaper/detail/manual.vue b/src/pages/testPaper/detail/manual.vue index dc37b2f..2abc082 100644 --- a/src/pages/testPaper/detail/manual.vue +++ b/src/pages/testPaper/detail/manual.vue @@ -1,7 +1,7 @@ \ No newline at end of file diff --git a/src/styles/common.scss b/src/styles/common.scss index e20ccd2..7d917f5 100644 --- a/src/styles/common.scss +++ b/src/styles/common.scss @@ -432,4 +432,9 @@ white-space: normal; vertical-align: top; } +} +.empty { + font-size: 14px; + text-align: center; + color: #a3a3a3; } \ No newline at end of file