学习助手调整

src/components/MxCondition/condition-object/condition-wrong-subject.js

@@ -0,0 +1,21 @@
+import conditionObjectBase from '../condition-object-base.js'
+import {
+  wrongSubjects,
+} from "@/api/webApi/webQue.js";
+export default {
+  ...conditionObjectBase,
+  key: 'wrongSubject',
+  title: '科目',
+  getList: function(param) {
+    return new Promise((resolve, reject) => {
+      wrongSubjects().then(res => resolve(res.data))
+        .catch(e => reject(e))
+    })
+  },
+  getCode: function(item) {
+    return item
+  },
+  getLabel: function(item) {
+    return item
+  }
+}

src/components/MxCondition/condition-object/condition-wrong-type.js

@@ -0,0 +1,23 @@
+import conditionObjectBase from '../condition-object-base.js'
+import {
+  wrongTypes,
+} from "@/api/webApi/webQue.js";
+export default {
+  ...conditionObjectBase,
+  key: 'wrongType',
+  title: '题型',
+  dependentKeys: ['wrongSubject'],
+  getList: function(param) {
+    return new Promise((resolve, reject) => {
+      wrongTypes({
+        subjectName:param.wrongSubject }).then(res => resolve(res.data))
+        .catch(e => reject(e))
+    })
+  },
+  getCode: function(item) {
+    return item
+  },
+  getLabel: function(item) {
+    return item
+  }
+}

src/views/career/zhiyuan/gkmc.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="gkmc">
-    <div class="top">
+    <div class="gkmc_top">
       <img
         src="@/assets/images/career/img_bg.png"
         style="width: 100%; margin: 20px 0"
@@ -59,17 +59,17 @@ export default {
 
 <style lang="scss" scoped>
 .gkmc {
-  .top {
+  .gkmc_top {
     position: relative;
   }
 
-  .top .desc {
+  .gkmc_top .desc {
     position: absolute;
     top: 43px;
     left: 43px;
   }
 
-  .top .desc p:first-child {
+  .gkmc_top .desc p:first-child {
     font-size: 36px;
     font-family: PingFangSC-Semibold, PingFang SC;
     font-weight: 600;
@@ -78,7 +78,7 @@ export default {
     margin-bottom: 32px;
   }
 
-  .top .desc p:last-child {
+  .gkmc_top .desc p:last-child {
     font-size: 16px;
     font-family: PingFangSC-Regular, PingFang SC;
     font-weight: 400;

src/views/questioncenter/LearnHelper.vue

@@ -4,265 +4,19 @@
       <div class="tab">
         <div
           class="tab_item"
-          :class="tabActive == 0 ? 'tab_active' : ''"
-          @click="switchTab(0)"
+          v-for="item in  tabList"
+          :class="tabActive == item.value ? 'tab_active' : ''"
+          @click="switchTab(item.value)"
         >
-          收藏夹
-        </div>
-        <div
-          class="tab_item"
-          :class="tabActive == 1 ? 'tab_active' : ''"
-          @click="switchTab(1)"
-        >
-          错题本
-        </div>
-        <div
-          class="tab_item"
-          :class="tabActive == 2 ? 'tab_active' : ''"
-          @click="switchTab(2)"
-        >
-          学习记录
-        </div>
-      </div>
-      <div class="radio_contianer" v-show="tabActive == 1">
-        <div style="margin-bottom: 16px">
-          <span>科目</span>
-          <el-radio-group
-            v-model="form.worngSubjectName"
-            size="mini"
-            @change="toggleWrongSub"
-          >
-            <el-radio-button
-              :label="item"
-              v-for="(item, index) in wrongSubject"
-              :key="index"
-              >{{ item }}</el-radio-button
-            >
-          </el-radio-group>
-        </div>
-        <div style="margin-bottom: 16px">
-          <span>题型</span>
-          <el-radio-group
-            v-model="form.wrongType"
-            size="mini"
-            @change="toggleWrongType"
-          >
-            <el-radio-button
-              :label="item"
-              v-for="(item, index) in wrongTypes"
-              :key="index"
-              >{{ item }}</el-radio-button
-            >
-          </el-radio-group>
+          {{ item.label }}
         </div>
       </div>
     </el-card>
     <!-- 收藏夹 -->
     <collect v-if="tabActive == 0"></collect>
-<!--    <div class="shoucan_content" v-show="tabActive == 0">-->
-<!--      &lt;!&ndash; 试题收藏 &ndash;&gt;-->
-<!--      <div class="topic" v-show="form.type == 'question'">-->
-<!--        &lt;!&ndash; 题目 &ndash;&gt;-->
-<!--        <div class="paper_questions" id="collect-question">-->
-<!--          <div-->
-<!--            class="que_item"-->
-<!--            v-for="(item, index) in collectQue"-->
-<!--            :key="item.id"-->
-<!--          >-->
-<!--            <div class="que_content" style="display: flex">-->
-<!--              <div>{{ index + 1 }}.</div>-->
-<!--              <div v-html="item.title"></div>-->
-<!--            </div>-->
-<!--            <div class="option" v-if="item.optionA">-->
-<!--              <div style="margin-right: 5px">A:</div>-->
-<!--              <div v-html="item.optionA"></div>-->
-<!--            </div>-->
-<!--            <div class="option" v-if="item.optionB">-->
-<!--              <div style="margin-right: 5px">B:</div>-->
-<!--              <div v-html="item.optionB"></div>-->
-<!--            </div>-->
-<!--            <div class="option" v-if="item.optionC">-->
-<!--              C:-->
-<!--              <div v-html="item.optionC"></div>-->
-<!--            </div>-->
-<!--            <div class="option" v-if="item.optionD">-->
-<!--              <div style="margin-right: 5px">D:</div>-->
-<!--              <div v-html="item.optionD"></div>-->
-<!--            </div>-->
-<!--            <div class="que_footer">-->
-<!--              <div class="spans">-->
-<!--                <span class="id">ID: {{ item.id }}</span>-->
-<!--                <span>题型： {{ item.qtpye }}</span>-->
-<!--                <span>难度： 一般</span>-->
-<!--              </div>-->
-<!--              <div class="operation">-->
-<!--                <div class="shoucan">-->
-<!--                  <div-->
-<!--                    v-show="item.collect"-->
-<!--                    @click="toCancelCollectQue(item)"-->
-<!--                    style="display: flex; align-items: center"-->
-<!--                  >-->
-<!--                    <img-->
-<!--                      src="@/assets/images/icon_shoucang_s.png"-->
-<!--                      style="margin-right: 8px"-->
-<!--                    />-->
-<!--                    <span>已收藏</span>-->
-<!--                  </div>-->
-<!--                  <div-->
-<!--                    v-show="!item.collect"-->
-<!--                    @click="toCollectQue(item)"-->
-<!--                    style="display: flex; align-items: center"-->
-<!--                  >-->
-<!--                    <img-->
-<!--                      src="@/assets/images/icon_shoucang_n.png"-->
-<!--                      style="margin-right: 8px"-->
-<!--                    />-->
-<!--                    <span>收藏</span>-->
-<!--                  </div>-->
-<!--                </div>-->
-<!--                <div class="detail" @click="viewDetail(index)">-->
-<!--                  <img src="@/assets/images/icon_chakan.png" alt="" />-->
-<!--                  <span>查看解析>></span>-->
-<!--                </div>-->
-<!--                <div class="addQue">-->
-<!--                  <i-->
-<!--                    class="el-icon-shopping-cart-2"-->
-<!--                    style="margin-right: 5px"-->
-<!--                  ></i>-->
-<!--                  <span>加入选题</span>-->
-<!--                </div>-->
-<!--              </div>-->
-<!--            </div>-->
-<!--            <div-->
-<!--              class="parse"-->
-<!--              v-show="item.createTime"-->
-<!--              v-html="item.parse"-->
-<!--            ></div>-->
-<!--          </div>-->
-<!--        </div>-->
-<!--      </div>-->
-<!--      &lt;!&ndash; 试卷收藏 &ndash;&gt;-->
-<!--      <div class="exam" v-show="form.type == 'paper'">-->
-<!--        <div class="paper_container">-->
-<!--          <div class="paper_item" v-for="item in collectPaper" :key="item.id">-->
-<!--            <div class="tit">-->
-<!--              <div>{{ item.papername }}</div>-->
-<!--              <div class="viewCount">-->
-<!--                <img src="@/assets/images/icon_eye.png" alt="" />-->
-<!--                <span>{{item.readNum}}人已预览</span>-->
-<!--              </div>-->
-<!--            </div>-->
-<!--            <div class="opera">-->
-<!--              <div class="view" @click="toPreView(item.id, item.papername)">-->
-<!--                <img-->
-<!--                  style="margin-right: 8px"-->
-<!--                  src="@/assets/images/icon_view.png"-->
-<!--                  alt=""-->
-<!--                />-->
-<!--                <span>预览</span>-->
-<!--              </div>-->
-<!--              <div class="download">下载</div>-->
-<!--              <div>-->
-<!--                <img-->
-<!--                  src="@/assets/images/icon_shoucang_s.png"-->
-<!--                  alt=""-->
-<!--                  style="margin-right: 8px"-->
-<!--                />-->
-<!--                <span>已收藏</span>-->
-<!--              </div>-->
-<!--            </div>-->
-<!--          </div>-->
-<!--        </div>-->
-<!--      </div>-->
-<!--      &lt;!&ndash; 分页 &ndash;&gt;-->
-<!--      <div style="display: flex; justify-content: center; margin-top: 92px">-->
-<!--        <el-pagination-->
-<!--          layout="prev, pager, next"-->
-<!--          :total="total"-->
-<!--          :current-page="pageNum"-->
-<!--          :page-size="pageSize"-->
-<!--          @prev-click="prev"-->
-<!--          @next-click="next"-->
-<!--        >-->
-<!--        </el-pagination>-->
-<!--      </div>-->
-<!--    </div>-->
     <!-- 错题本 -->
-    <div class="mis_content" v-show="tabActive == 1">
-      <div class="topic">
-        <!-- 题目 -->
-        <div class="paper_questions" id="wrong-question">
-          <div
-            class="que_item"
-            v-for="(item, index) in wrongQues"
-            :key="item.id"
-          >
-            <div class="que_content" style="display: flex">
-              <div>{{ index + 1 }}.</div>
-              <div v-html="item.title"></div>
-            </div>
-            <div class="option" v-if="item.optionA">
-              <div style="margin-right: 5px">A:</div>
-              <div v-html="item.optionA"></div>
-            </div>
-            <div class="option" v-if="item.optionB">
-              <div style="margin-right: 5px">B:</div>
-              <div v-html="item.optionB"></div>
-            </div>
-            <div class="option" v-if="item.optionC">
-              C:
-              <div v-html="item.optionC"></div>
-            </div>
-            <div class="option" v-if="item.optionD">
-              <div style="margin-right: 5px">D:</div>
-              <div v-html="item.optionD"></div>
-            </div>
-            <div class="que_footer">
-              <div class="spans">
-                <span>题型： {{ item.qtpye }}</span>
-                <span>难度： 一般</span>
-              </div>
-              <div class="operation">
-                <div class="delete" style="display: flex; align-items: center">
-                  <div
-                    style="margin-right: 24px; cursor: pointer display: flex;align-items: center;"
-                    @click="toDeleteWrongQue(item.id, index)"
-                  >
-                    <img
-                      src="@/assets/images/icon_wrong.png"
-                      style="margin-right: 8px"
-                    />
-                    <span>删除错题</span>
-                  </div>
-                </div>
-                <div class="detail" @click="viewWrongDetail(index)">
-                  <img src="@/assets/images/icon_chakan.png" alt="" />
-                  <span>查看解析>></span>
-                </div>
-              </div>
-            </div>
-            <div
-              class="parse"
-              v-show="item.createTime"
-              v-html="item.parse"
-            ></div>
-          </div>
-        </div>
-      </div>
-      <!-- 错题分页 -->
-      <div style="display: flex; justify-content: center; margin-top: 92px">
-        <el-pagination
-          layout="prev, pager, next"
-          :total="wrongForm.total"
-          :current-page="wrongForm.pageNum"
-          :page-size="wrongForm.pageSize"
-          @prev-click="wrongPrev"
-          @next-click="wrongNext"
-        >
-        </el-pagination>
-      </div>
-    </div>
-    <!-- 学习记录 -->
+    <mistake v-if="tabActive == 1"></mistake>
+     <!-- 学习记录 -->
     <div class="record_content" v-show="tabActive == 2">
       <div class="record_contian">
         <div class="tit">数据统计（总）</div>
@@ -428,15 +182,8 @@
 </template>
 <script>
 import Collect from './components/collect'
+import Mistake from './components/mistake'
 import {
-  favSubjects,
-  favQueTypes,
-  favQuestions,
-  favPapers,
-  wrongSubjects,
-  wrongTypes,
-  wrongQuestions,
-  deleteWrongQuestion,
   summary,
   questionStatsByDay,
   videoStatsBySubject,
@@ -461,10 +208,24 @@ var myChart3;
 var myChart4;
 var flag = 1;
 export default {
-  components: {Collect},
+  components: {Collect,Mistake},
   data() {
     return {
       tabActive: 0,
+      tabList: [
+        {
+          label:'收藏夹',
+          value:0
+        },
+        {
+          label:'错题本',
+          value:1
+        },
+        {
+          label:'学习记录',
+          value:2
+        }
+      ],
       dateYears: [2021, 2020],
       dateMonth: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12],
       dateWeek: [1, 2, 3, 4, 5],
@@ -483,17 +244,9 @@ export default {
       queTypes: [],
       collectQue: [],
       collectPaper: [],
-      wrongSubject: [],
-      wrongTypes: [],
       pageSize: 10,
       pageNum: 1,
       total: 0,
-      wrongQues: [],
-      wrongForm: {
-        total: 0,
-        pageSize: 10,
-        pageNum: 1,
-      },
       learnInfo: {},
       dateForm: {
         year: date.getFullYear(),
@@ -722,17 +475,14 @@ export default {
     this.tabActive = this.$route.query.tabActive
       ? this.$route.query.tabActive
       : 0;
-    if (this.tabActive == 1) {
-      this.switchTab(1);
-    } else if (this.tabActive == 2) {
-      this.switchTab(2);
-    }
+
+      this.switchTab(this.tabActive);
   },
   methods: {
     switchTab(index) {
       this.tabActive = index;
       if (this.tabActive == 1) {
-        this.getWrongSubject();
+
       } else if (this.tabActive == 2 && flag == 1) {
         let queCountChart = document.getElementById("echarts_quecount");
         myChart1 = echarts.init(queCountChart);
@@ -756,99 +506,6 @@ export default {
         this.searchData();
       }
     },
-    //  错题涉及的题型
-    getWrongTypes() {
-      wrongTypes({ subjectName: this.form.worngSubjectName }).then((res) => {
-        if (res.data.length > 0) {
-          this.form.wrongType = res.data[0];
-        }
-        this.wrongTypes = res.data;
-        this.wrongForm.pageNum;
-        this.getWrongQuestions();
-      });
-    },
-    //  错题涉及的科目
-    getWrongSubject() {
-      wrongSubjects().then((res) => {
-        if (res.data.length > 0) {
-          this.form.worngSubjectName = res.data[0];
-        }
-        this.wrongSubject = res.data;
-        this.getWrongTypes();
-      });
-    },
-    // 错题列表
-    getWrongQuestions() {
-      wrongQuestions({
-        subjectName: this.form.worngSubjectName,
-        qtype: this.form.wrongType,
-        pageSize: this.wrongForm.pageSize,
-        pageNum: this.wrongForm.pageNum,
-      }).then((res) => {
-        this.wrongQues = res.rows;
-        this.wrongForm.total = res.total;
-        this.$nextTick(_=>this.mxGlobal.MathQueue('wrong-question'))
-        console.log(res);
-      });
-    },
-    // 收藏的问题列表
-    getFavQuestions() {
-      favQuestions({
-        subjectName: this.form.subjectName,
-        qtype: this.form.qtype,
-        pageNum: this.pageNum,
-        pageSize: this.pageSize,
-      }).then((res) => {
-        this.total = res.total;
-        this.collectQue = res.rows;
-        this.$nextTick(_=>this.mxGlobal.MathQueue('collect-question'))
-        console.log(res);
-      });
-    },
-    viewWrongDetail(index) {
-      if (this.wrongQues[index].createTime) {
-        this.wrongQues[index].createTime = false;
-      } else {
-        this.wrongQues[index].createTime = true;
-      }
-    },
-    prev() {
-      this.pageNum = this.pageNum - 1;
-      if (this.form.type == "question") {
-        this.getFavQuestions();
-      } else {
-      }
-    },
-    next() {
-      this.pageNum = this.pageNum + 1;
-      if (this.form.type == "question") {
-        this.getFavQuestions();
-      } else {
-        this.getFavPapers();
-      }
-    },
-    toDeleteWrongQue(id, index) {
-      this.wrongQues.splice(index, 1);
-      deleteWrongQuestion({ questionId: id }).then((res) => {
-        this.msgSuccess("删除成功");
-        console.log(res);
-      });
-    },
-    toggleWrongType() {
-      this.wrongForm.pageNum = 1;
-      this.getWrongQuestions();
-    },
-    toggleWrongSub() {
-      this.getWrongTypes();
-    },
-    wrongNext() {
-      this.wrongForm.pageNum++;
-      this.getWrongQuestions();
-    },
-    wrongPrev() {
-      this.wrongForm.pageNum--;
-      this.getWrongQuestions();
-    },
     getSummary() {
       summary().then((res) => {
         this.learnInfo = res.data;

src/views/questioncenter/components/collect.vue

@@ -2,14 +2,15 @@
   <div class="shoucan_content">
     <!-- 筛选   -->
     <div class="radio_contianer">
-      <div class="mt15" >
+      <div class="mt15">
         <span class="mr8">类型</span>
         <el-radio-group v-model="form.type" size="mini" @change="toggleType">
           <el-radio-button
             :label="item.type"
             v-for="item in types"
             :key="item.type"
-          >{{ item.name }}</el-radio-button
+          >{{ item.name }}
+          </el-radio-button
           >
         </el-radio-group>
       </div>
@@ -24,7 +25,8 @@
             :label="item"
             v-for="(item, index) in subjects"
             :key="index"
-          >{{ item }}</el-radio-button
+          >{{ item }}
+          </el-radio-button
           >
         </el-radio-group>
       </div>
@@ -39,7 +41,8 @@
             :label="item"
             v-for="(item, index) in queTypes"
             :key="index"
-          >{{ item }}</el-radio-button
+          >{{ item }}
+          </el-radio-button
           >
         </el-radio-group>
       </div>
@@ -106,16 +109,9 @@
                 </div>
               </div>
               <div class="detail" @click="viewDetail(index)">
-                <img src="@/assets/images/icon_chakan.png" alt="" />
+                <img src="@/assets/images/icon_chakan.png" alt=""/>
                 <span>查看解析>></span>
               </div>
-              <div class="addQue">
-                <i
-                  class="el-icon-shopping-cart-2"
-                  style="margin-right: 5px"
-                ></i>
-                <span>加入选题</span>
-              </div>
             </div>
           </div>
           <div
@@ -133,8 +129,8 @@
           <div class="tit">
             <div>{{ item.papername }}</div>
             <div class="viewCount">
-              <img src="@/assets/images/icon_eye.png" alt="" />
-              <span>{{item.readNum}}人已预览</span>
+              <img src="@/assets/images/icon_eye.png" alt=""/>
+              <span>{{ item.readNum }}人已预览</span>
             </div>
           </div>
           <div class="opera">
@@ -172,44 +168,48 @@
   </div>
 </template>
 <script>
-import { favPapers, favQuestions, favQueTypes, favSubjects, queCancelCollect, queCollect } from '@/api/webApi/webQue'
+import MxCondition from '@/components/MxCondition/mx-condition'
+import { favSubjects,favQueTypes,favQuestions  } from '@/api/webApi/webQue.js'
 
 export default {
+  components: {
+    MxCondition,
+  },
   created() {
     this.getSubjects()
   },
   data() {
     return {
       form: {
-        type: "question",
-        subjectName: "",
-        wrongType: "",
+        type: 'question',
+        subjectName: '',
+        wrongType: ''
       },
-      pageForm:{
-        total:0,
-        pageSize:10,
-        pageNum:1,
+      pageForm: {
+        total: 0,
+        pageSize: 10,
+        pageNum: 1
       },
       types: [
-        { type: "question", name: "试题收藏" },
-        { type: "paper", name: "试卷收藏" },
+        { type: 'question', name: '试题收藏' },
+        { type: 'paper', name: '试卷收藏' }
       ],
       subjects: [],
       queTypes: [],
       collectQue: [],
-      collectPaper: [],
+      collectPaper: []
     }
   },
   methods: {
-    onChangePage(){
+    onChangePage() {
       this.getFavQuestions()
     },
     toggleSub() {
-      this.pageForm.pageNum == 1;
-      if (this.form.type == "paper") {
-        this.getFavPapers();
+      this.pageForm.pageNum == 1
+      if (this.form.type == 'paper') {
+        this.getFavPapers()
       } else {
-        this.getFavQue();
+        this.getFavQue()
       }
     },
     // 收藏的问题列表
@@ -218,242 +218,270 @@ export default {
         subjectName: this.form.subjectName,
         qtype: this.form.qtype,
         pageNum: this.pageForm.pageNum,
-        pageSize: this.pageForm.pageSize,
+        pageSize: this.pageForm.pageSize
       }).then((res) => {
-        this.pageForm.total = res.total;
-        this.collectQue = res.rows;
-        this.$nextTick(_=>this.mxGlobal.MathQueue('collect-question'))
-        console.log(res);
-      });
+        this.pageForm.total = res.total
+        this.collectQue = res.rows
+        this.$nextTick(_ => this.mxGlobal.MathQueue('collect-question'))
+        console.log(res)
+      })
     },
     // 跳转到预览页面
     toPreView(paperId, paperName) {
       this.$router.push({
-        path: "/question-center/bestPaper/preview",
-        query: { paperId, paperName },
-      });
+        path: '/question-center/bestPaper/preview',
+        query: { paperId, paperName }
+      })
     },
     toggleType(e) {
-      this.form.type = e;
-      this.getSubjects();
+      this.form.type = e
+      this.getSubjects()
     },
     toCollectQue(item) {
       queCollect({ questionId: item.id }).then((res) => {
-        item.collect = !item.collect;
-        this.msgSuccess("收藏成功");
-        console.log(res);
-      });
+        item.collect = !item.collect
+        this.msgSuccess('收藏成功')
+        console.log(res)
+      })
     },
     toCancelCollectQue(item) {
       queCancelCollect({ questionId: item.id }).then((res) => {
-        item.collect = !item.collect;
-        this.msgSuccess("取消收藏成功");
-        console.log(res);
-      });
+        item.collect = !item.collect
+        this.msgSuccess('取消收藏成功')
+        console.log(res)
+      })
     },
     toggleQueType() {
-      this.pageForm.pageNum = 1;
-      this.getFavQuestions();
+      this.pageForm.pageNum = 1
+      this.getFavQuestions()
     },
     viewDetail(index) {
       if (this.collectQue[index].createTime) {
-        this.collectQue[index].createTime = false;
+        this.collectQue[index].createTime = false
       } else {
-        this.collectQue[index].createTime = true;
+        this.collectQue[index].createTime = true
       }
     },
     // 收藏涉及的学科
     getSubjects() {
       favSubjects({ type: this.form.type }).then((res) => {
-        console.log(res);
-        this.form.subjectName = res.data[0];
-        this.subjects = res.data;
-        if (this.form.type == "question") {
-          this.getFavQue();
-        } else if (this.form.type == "paper") {
-          this.getFavPapers();
+        console.log(res)
+        this.form.subjectName = res.data[0]
+        this.subjects = res.data
+        if (this.form.type == 'question') {
+          this.getFavQue()
+        } else if (this.form.type == 'paper') {
+          this.getFavPapers()
         }
-      });
+      })
     },
     // 收藏涉及的题型
     getFavQue() {
       favQueTypes({ subjectName: this.form.subjectName }).then((res) => {
-        this.form.qtype = res.data[0];
-        this.queTypes = res.data;
-        this.getFavQuestions();
-      });
+        this.form.qtype = res.data[0]
+        this.queTypes = res.data
+        this.getFavQuestions()
+      })
     },
     // 收藏涉及的试卷
     getFavPapers() {
       favPapers({
         subjectName: this.form.subjectName,
         pageNum: this.pageForm.pageNum,
-        pageSize: this.pageForm.pageSize,
+        pageSize: this.pageForm.pageSize
       }).then((res) => {
-        console.log(res);
-        this.pageForm.total = res.total;
-        this.collectPaper = res.rows;
-      });
-    },
+        console.log(res)
+        this.pageForm.total = res.total
+        this.collectPaper = res.rows
+      })
+    }
   }
 }
 </script>
-<style  lang="scss">
-  .radio_contianer > div {
-    margin-bottom: 16px;
-    display: flex;
-    justify-content: flex-start;
-    align-items: center;
-  }
-  .option {
-    padding-left: 33px;
-    display: flex;
-    margin-bottom: 10px;
-  }
-  .radio_contianer > div > span {
-    flex-shrink: 0;
-    font-size: 14px;
-    font-family: PingFangSC-Regular, PingFang SC;
-    font-weight: 400;
-    color: #232323;
-    line-height: 20px;
-    height: 20px;
-    width: 50px;
-  }
-  .parse {
-    padding: 0 30px;
-  }
-  .que_item {
-    border-radius: 1px;
-    border: 1px solid #dedede;
-    margin-bottom: 8px;
-  }
-  .que_content {
-    padding: 12px 24px 0 33px;
-    font-size: 14px;
-    font-family: PingFangSC-Medium, PingFang SC;
-    font-weight: 500;
-    color: #4c4c4c;
-    line-height: 27px;
-    margin-bottom: 40px;
-  }
-  .que_footer {
-    border-top: 1px solid #dedede;
-    padding-left: 33px;
-    overflow: hidden;
-    padding-bottom: 23px;
-    padding-top: 21px;
-  }
-  .que_footer .spans {
-    float: left;
-    font-size: 12px;
-    font-family: PingFangSC-Regular, PingFang SC;
-    font-weight: 400;
-    color: #979797;
-    line-height: 20px;
-  }
-  .que_footer .spans > span {
-    margin-right: 20px;
-  }
-  .operation {
-    display: flex;
-    align-items: center;
-    font-size: 14px;
-    font-family: PingFangSC-Regular, PingFang SC;
-    font-weight: 400;
-    color: #47c6a2;
-    line-height: 20px;
-    justify-content: flex-end;
-  }
-  .operation > div {
-    display: flex;
-    align-items: center;
-    cursor: pointer;
-  }
-  .operation .shoucan {
-    margin-right: 46px;
-  }
-  .operation .detail span {
-    border-radius: 1px;
-    border-bottom: 1px solid #47c6a2;
-  }
-  .operation .detail {
-    margin-right: 32px;
-  }
-  .operation > div > img {
-    margin-right: 10px;
-  }
-  .operation .addQue {
-    padding: 7px;
-    border-radius: 4px;
-    border: 1px solid #979797;
-    margin-right: 24px;
-  }
-  .paper_item {
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    padding-right: 30px;
-    margin-bottom: 40px;
-  }
-  .paper_item .tit {
-    font-size: 16px;
-    font-family: PingFangSC-Medium, PingFang SC;
-    font-weight: 500;
-    color: #343434;
-    line-height: 22px;
-  }
-  .paper_item .viewCount {
-    margin-top: 16px;
-    color: #9f9f9f;
-    font-size: 14px;
-    display: flex;
-    align-items: center;
-  }
-  .paper_item .viewCount img {
-    margin-right: 9px;
-  }
-  .paper_item .opera {
-    display: flex;
-    justify-content: space-between;
-  }
-  .paper_item .opera > div {
-    cursor: pointer;
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-  }
-  .paper_item .opera .view {
-    color: #47c6a2;
-    border-radius: 4px;
-    border: 1px solid #47c6a2;
-    padding: 6px 12px;
+<style lang="scss">
+.radio_contianer > div {
+  margin-bottom: 16px;
+  display: flex;
+  justify-content: flex-start;
+  align-items: center;
+}
+
+.option {
+  padding-left: 33px;
+  display: flex;
+  margin-bottom: 10px;
+}
+
+.radio_contianer > div > span {
+  flex-shrink: 0;
+  font-size: 14px;
+  font-family: PingFangSC-Regular, PingFang SC;
+  font-weight: 400;
+  color: #232323;
+  line-height: 20px;
+  height: 20px;
+  width: 50px;
+}
+
+.parse {
+  padding: 0 30px;
+}
+
+.que_item {
+  border-radius: 1px;
+  border: 1px solid #dedede;
+  margin-bottom: 8px;
+}
+
+.que_content {
+  padding: 12px 24px 0 33px;
+  font-size: 14px;
+  font-family: PingFangSC-Medium, PingFang SC;
+  font-weight: 500;
+  color: #4c4c4c;
+  line-height: 27px;
+  margin-bottom: 40px;
+}
+
+.que_footer {
+  border-top: 1px solid #dedede;
+  padding-left: 33px;
+  overflow: hidden;
+  padding-bottom: 23px;
+  padding-top: 21px;
+}
+
+.que_footer .spans {
+  float: left;
+  font-size: 12px;
+  font-family: PingFangSC-Regular, PingFang SC;
+  font-weight: 400;
+  color: #979797;
+  line-height: 20px;
+}
+
+.que_footer .spans > span {
+  margin-right: 20px;
+}
+
+.operation {
+  display: flex;
+  align-items: center;
+  font-size: 14px;
+  font-family: PingFangSC-Regular, PingFang SC;
+  font-weight: 400;
+  color: #47c6a2;
+  line-height: 20px;
+  justify-content: flex-end;
+}
+
+.operation > div {
+  display: flex;
+  align-items: center;
+  cursor: pointer;
+}
+
+.operation .shoucan {
+  margin-right: 46px;
+}
+
+.operation .detail span {
+  border-radius: 1px;
+  border-bottom: 1px solid #47c6a2;
+}
+
+.operation .detail {
+  margin-right: 32px;
+}
+
+.operation > div > img {
+  margin-right: 10px;
+}
+
+.operation .addQue {
+  padding: 7px;
+  border-radius: 4px;
+  border: 1px solid #979797;
+  margin-right: 24px;
+}
+
+.paper_item {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding-right: 30px;
+  margin-bottom: 40px;
+}
+
+.paper_item .tit {
+  font-size: 16px;
+  font-family: PingFangSC-Medium, PingFang SC;
+  font-weight: 500;
+  color: #343434;
+  line-height: 22px;
+}
+
+.paper_item .viewCount {
+  margin-top: 16px;
+  color: #9f9f9f;
+  font-size: 14px;
+  display: flex;
+  align-items: center;
+}
+
+.paper_item .viewCount img {
+  margin-right: 9px;
+}
+
+.paper_item .opera {
+  display: flex;
+  justify-content: space-between;
+}
+
+.paper_item .opera > div {
+  cursor: pointer;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+}
+
+.paper_item .opera .view {
+  color: #47c6a2;
+  border-radius: 4px;
+  border: 1px solid #47c6a2;
+  padding: 6px 12px;
+}
+
+.paper_item .opera .download {
+  border-radius: 4px;
+  border: 1px solid #47c6a2;
+  padding: 6px 22px;
+  background: #47c6a2;
+  color: white;
+  margin: 0 24px;
+}
+
+.paper_item .opera > div:last-child {
+  color: #47c6a2;
+}
+
+::v-deep {
+  .radio_contianer .el-radio-button__inner {
+    border-left: 1px solid #dcdfe6;
   }
-  .paper_item .opera .download {
-    border-radius: 4px;
-    border: 1px solid #47c6a2;
-    padding: 6px 22px;
-    background: #47c6a2;
-    color: white;
-    margin: 0 24px;
+
+  .radio_contianer .el-radio-button .el-radio-button__inner {
+    border-radius: 16px;
+    margin-bottom: 5px;
   }
-  .paper_item .opera > div:last-child {
-    color: #47c6a2;
+
+  .radio_contianer .el-radio-button:first-child:last-child .el-radio-button__inner {
+    border-radius: 16px;
   }
-  ::v-deep{
-    .radio_contianer .el-radio-button__inner {
-      border-left: 1px solid #dcdfe6;
-    }
-    .radio_contianer .el-radio-button .el-radio-button__inner {
-      border-radius: 16px;
-      margin-bottom: 5px;
-    }
-    .radio_contianer .el-radio-button:first-child:last-child .el-radio-button__inner {
-      border-radius: 16px;
-    }
-    .radio_contianer .el-radio-button {
-      margin-right: 8px;
-    }
+
+  .radio_contianer .el-radio-button {
+    margin-right: 8px;
   }
+}
 
 </style>

src/views/questioncenter/components/mistake.vue

@@ -0,0 +1,145 @@
+<template>
+  <div class="mistake">
+    <mx-condition ref="condition" :query-params="queryParams" :requireFields="requireFields"  @query="handleQuery"
+                  @invalid="handleInvalidQuery"></mx-condition>
+    <div class="topic">
+      <!-- 题目 -->
+      <div class="paper_questions" id="wrong-question">
+        <div
+          class="que_item"
+          v-for="(item, index) in wrongList"
+          :key="item.id"
+        >
+          <div class="que_content" style="display: flex">
+            <div>{{ index + 1 }}.</div>
+            <div v-html="item.title"></div>
+          </div>
+          <div class="option" v-if="item.optionA">
+            <div style="margin-right: 5px">A:</div>
+            <div v-html="item.optionA"></div>
+          </div>
+          <div class="option" v-if="item.optionB">
+            <div style="margin-right: 5px">B:</div>
+            <div v-html="item.optionB"></div>
+          </div>
+          <div class="option" v-if="item.optionC">
+            C:
+            <div v-html="item.optionC"></div>
+          </div>
+          <div class="option" v-if="item.optionD">
+            <div style="margin-right: 5px">D:</div>
+            <div v-html="item.optionD"></div>
+          </div>
+          <div class="que_footer">
+            <div class="spans">
+              <span>题型： {{ item.qtpye }}</span>
+              <span>难度： 一般</span>
+            </div>
+            <div class="operation">
+              <div class="delete" style="display: flex; align-items: center">
+                <div
+                  style="margin-right: 24px; cursor: pointer; display: flex;align-items: center;"
+                  @click="toDeleteWrongQue(item.id, index)"
+                >
+                  <img
+                    src="@/assets/images/icon_wrong.png"
+                    style="margin-right: 8px"
+                  />
+                  <span>删除错题</span>
+                </div>
+              </div>
+              <div class="detail" @click="viewWrongDetail(index)">
+                <img src="@/assets/images/icon_chakan.png" alt="" />
+                <span>查看解析>></span>
+              </div>
+            </div>
+          </div>
+          <div
+            class="parse"
+            v-show="item.createTime"
+            v-html="item.parse"
+          ></div>
+        </div>
+      </div>
+    </div>
+    <!-- 错题分页 -->
+    <pagination
+      v-show="total > 0"
+      :total="total"
+      :page.sync="pageForm.pageNum"
+      :limit.sync="pageForm.pageSize"
+      :page-size="10"
+      @pagination="onChangePage"
+    />
+  </div>
+</template>
+<script>
+import { deleteWrongQuestion, wrongQuestions } from '@/api/webApi/webQue'
+import MxCondition from '@/components/MxCondition/mx-condition'
+
+export  default {
+  components:{
+    MxCondition
+  },
+  data() {
+    return {
+      pageForm:{
+        pageSize:10,
+        pageNum:1
+      },
+      requireFields: ['wrongSubject', 'wrongType'],
+      wrongList:[],
+      queryParams:{
+        wrongSubject:'',
+        wrongType:'',
+      },
+      total:0
+    }
+  },
+  methods:{
+    viewWrongDetail(index) {
+      if (this.wrongList[index].createTime) {
+        this.wrongList[index].createTime = false;
+      } else {
+        this.wrongList[index].createTime = true;
+      }
+    },
+    onChangePage(page) {
+      this.pageForm.pageSize = page.limit
+      this.pageForm.pageNum = page.page
+      this.getWrongQuestions();
+    },
+    handleQuery() {
+      this.getWrongQuestions()
+    },
+    toDeleteWrongQue(id, index) {
+      this.wrongList.splice(index, 1);
+      deleteWrongQuestion({ questionId: id }).then((res) => {
+        this.msgSuccess("删除成功");
+        console.log(res);
+      });
+    },
+    getWrongQuestions() {
+      wrongQuestions({
+        subjectName: this.queryParams.wrongSubject,
+        qtype: this.queryParams.wrongType,
+        pageSize: this.pageForm.pageSize,
+        pageNum: this.pageForm.pageNum,
+      }).then((res) => {
+        this.wrongList = res.rows;
+        this.total = res.total;
+        this.$nextTick(_=>this.mxGlobal.MathQueue('wrong-question'))
+      });
+    },
+    handleInvalidQuery() {
+
+    }
+  }
+}
+</script>
+<style scoped>
+.mistake{
+  padding: 20px;
+  background: #fff;
+}
+</style>