Jelajahi Sumber

修改提示

lex 1 tahun lalu
induk
melakukan
e1dfc96217

+ 8 - 3
src/components/m-dialog/index.module.less

@@ -3,7 +3,7 @@
     display: inline-block;
     width: 4px;
     height: 14px;
-    background: #ff8057;
+    background: #259CFE;
     border-radius: 2px;
     margin-right: 6px;
   }
@@ -18,17 +18,20 @@
 }
 
 .oDialog {
+
   // margin-top: env(safe-area-inset-top);
   :global {
     .van-dialog__header {
       padding-top: 20px;
     }
+
     .van-dialog__message {
       font-size: 16px;
       color: #333;
       font-weight: 400;
       line-height: 24px;
     }
+
     .van-dialog__cancel,
     .van-dialog__confirm {
       // font-weight: 500;
@@ -36,11 +39,13 @@
       height: 50px;
       line-height: 50px;
     }
+
     .van-dialog__cancel {
       color: #777777;
     }
+
     .van-dialog__confirm {
-      color: #f67146;
+      color: #259CFE;
     }
   }
-}
+}

+ 13 - 14
src/components/m-dialog/index.tsx

@@ -1,6 +1,6 @@
-import { Dialog } from 'vant'
-import { defineComponent, PropType, reactive, watch } from 'vue'
-import styles from './index.module.less'
+import { Dialog } from 'vant';
+import { defineComponent, PropType, reactive, watch } from 'vue';
+import styles from './index.module.less';
 
 export default defineComponent({
   name: 'o-dialog',
@@ -46,15 +46,15 @@ export default defineComponent({
   setup(props, { emit }) {
     const state = reactive({
       show: props.show || false
-    })
+    });
 
     // 监听状态
     watch(
       () => props.show,
       () => {
-        state.show = props.show
+        state.show = props.show;
       }
-    )
+    );
     return () => (
       <Dialog
         class={styles.oDialog}
@@ -69,14 +69,13 @@ export default defineComponent({
         showConfirmButton={props.showConfirmButton}
         showCancelButton={props.showCancelButton}
         onConfirm={() => {
-          emit('update:show', false)
-          emit('confirm')
+          emit('update:show', false);
+          emit('confirm');
         }}
         onCancel={() => {
-          emit('update:show', false)
-          emit('cancel')
-        }}
-      >
+          emit('update:show', false);
+          emit('cancel');
+        }}>
         {{
           title: () => (
             <div class={styles.dialogTitle}>
@@ -86,6 +85,6 @@ export default defineComponent({
           )
         }}
       </Dialog>
-    )
+    );
   }
-})
+});

+ 1 - 3
src/helpers/request.ts

@@ -91,9 +91,7 @@ request.interceptors.response.use(
       }
       if (!(data.code === 403 || data.code === 5000)) {
         clearTimeout(toast);
-        setTimeout(() => {
-          showToast(msg);
-        }, 60);
+        showToast(msg);
       }
       const browserInfo = browser();
       if (data.code === 5000 || data.code === 403) {

TEMPAT SAMPAH
src/views/knowledge-library/images/exam-countdown-bg.png


TEMPAT SAMPAH
src/views/knowledge-library/images/exam-default-bg.png


TEMPAT SAMPAH
src/views/knowledge-library/images/exam-fail-bg.png


TEMPAT SAMPAH
src/views/knowledge-library/images/exam-good-bg.png


TEMPAT SAMPAH
src/views/knowledge-library/images/exam-left-btn.png


TEMPAT SAMPAH
src/views/knowledge-library/images/exam-pass-bg-p.png


TEMPAT SAMPAH
src/views/knowledge-library/images/exam-pass-bg.png


TEMPAT SAMPAH
src/views/knowledge-library/images/exam-right-bg.png


TEMPAT SAMPAH
src/views/knowledge-library/images/exam-right-btn.png


+ 1 - 1
src/views/knowledge-library/index.tsx

@@ -115,7 +115,7 @@ export default defineComponent({
                         router.push({
                           path: '/unit-detail',
                           query: {
-                            detailId: detail.lessonCoursewareDetailId
+                            detailId: detail.lessonCoursewareKnowledgeDetailId
                           }
                         })
                       }>

+ 9 - 3
src/views/knowledge-library/model/answer-list/index.module.less

@@ -6,16 +6,19 @@
     display: flex;
     align-items: center;
     padding: 0 20px 30px;
+
     span {
       display: flex;
       align-items: center;
       font-size: 16px;
       font-weight: 500;
       color: #333333;
-      & + span {
+
+      &+span {
         margin-left: 30px;
       }
     }
+
     i {
       display: inline-block;
       width: 18px;
@@ -28,11 +31,13 @@
 
   .aList {
     margin: 0 10px;
+
     :global {
       .van-grid-item__content {
         padding: 0 0 13px;
       }
     }
+
     span {
       display: inline-flex;
       align-items: center;
@@ -47,7 +52,7 @@
     }
 
     .answered {
-      background: #ff8057;
+      background: #1CACF1;
       color: #fff;
     }
 
@@ -55,9 +60,10 @@
       background-color: #71b0ff;
       color: #fff;
     }
+
     .no {
       background-color: #ff8486;
       color: #fff;
     }
   }
-}
+}

+ 79 - 43
src/views/knowledge-library/model/result-finish/index.module.less

@@ -3,79 +3,115 @@
   font-size: 15px;
 
   .finishContainer {
-    background: url('../../images/exam-pass-bg.png') no-repeat top center;
+    position: relative;
+    background: url('../../images/exam-default-bg.png') no-repeat top center;
     background-size: contain;
-    height: 413px;
+    height: 240px;
+    margin: 0 42px;
   }
+}
 
-  .finishContent {
-    padding-top: 180px;
-    text-align: center;
+.finishTitle {
+  padding-top: 74px;
+  padding-left: 26px;
+  font-size: 20px;
+  font-family: AlimamaShuHeiTi-Bold, AlimamaShuHeiTi;
+  font-weight: bold;
+  color: #0F75BB;
+  line-height: 24px;
 
-    .scoreNums {
-      line-height: 70px;
-      font-size: 60px;
-      font-weight: bold;
-      color: #f67146;
-      span {
-        font-size: 20px;
-        padding-left: 10px;
-      }
-    }
+  span {
+    position: relative;
+    z-index: 1;
 
-    .scoreName {
-      font-size: 20px;
-      font-weight: 600;
-      color: #191919;
-      padding: 10px 0 20px;
-      max-width: 80%;
-      margin-left: 10%;
-      line-height: 28px;
-    }
-    .scoreResult {
-      font-size: 16px;
-      font-weight: 500;
-      color: #f44541;
+    &::after {
+      content: ' ';
+      display: inline-block;
+      position: absolute;
+      left: 0;
+      bottom: 0;
+      width: 100%;
+      height: 9px;
+      background: linear-gradient(270deg, rgba(119, 255, 239, 0.59) 0%, #42CDFF 100%);
+      opacity: 0.5;
+      z-index: -1;
     }
   }
 }
+
+.scoreResult {
+  display: flex;
+  align-items: center;
+  min-height: 76px;
+  padding: 15px 32px 0;
+  font-size: 14px;
+  color: #333333;
+  line-height: 20px;
+}
+
 .finishFail {
   .finishContainer {
     background: url('../../images/exam-fail-bg.png') no-repeat top center;
     background-size: contain;
-    height: 413px;
   }
 }
-.finishPractice {
+
+.finishPass {
+  .finishContainer {
+    background: url('../../images/exam-pass-bg.png') no-repeat top center;
+    background-size: contain;
+  }
+}
+
+.finishGood {
+  .finishContainer {
+    background: url('../../images/exam-good-bg.png') no-repeat top center;
+    background-size: contain;
+  }
+}
+
+.finishCountdown {
   .finishContainer {
-    background: url('../../images/exam-pass-bg-p.png') no-repeat top center;
+    background: url('../../images/exam-countdown-bg.png') no-repeat top center;
     background-size: contain;
-    height: 513px;
   }
 }
 
 .finishBtnGroup {
-  margin-top: 30px;
   display: flex;
   align-items: center;
   justify-content: center;
+  position: absolute;
+  bottom: 0px;
+  left: 0;
+  padding: 0 24px 21px;
+  width: 100%;
+
   .finishLeft,
   .finishRight {
     text-align: center;
-    height: 50px;
-    line-height: 44px;
-    width: 100%;
-    font-size: 18px;
-    font-weight: 500;
+    height: 39px;
+    line-height: 38px;
+    min-width: 111px;
+    width: 111px;
+    font-size: 13px;
+    font-family: STYuanti-SC-Bold, STYuanti-SC;
+    font-weight: bold;
+
   }
+
   .finishLeft {
-    color: #703a17;
-    background: url('../../images/exam-right-bg.png') no-repeat center center;
+    color: #587C98;
+    text-shadow: 0px 1px 1px rgba(255, 255, 255, 0.5);
+    background: url('../../images/exam-left-btn.png') no-repeat center center;
     background-size: contain;
+    margin-right: 16px;
   }
+
   .finishRight {
-    color: #722b0f;
-    background: url('../../images/exam-left-btn.png') no-repeat center center;
+    color: #FFFFFF;
+    text-shadow: 0px 1px 1px #218CD7;
+    background: url('../../images/exam-right-btn.png') no-repeat center center;
     background-size: contain;
   }
-}
+}

+ 56 - 25
src/views/knowledge-library/model/result-finish/index.tsx

@@ -5,25 +5,47 @@ import styles from './index.module.less';
 export default defineComponent({
   name: 'result-mode',
   props: {
+    /** 是否显示确定按钮 */
+    showConfirmButton: {
+      type: Boolean,
+      default: true
+    },
+    /** 确认按钮内容 */
     confirmButtonText: {
       type: String,
-      default: '去练习'
+      default: '确认'
+    },
+    /** 是否显示取消按钮 */
+    showCancelButton: {
+      type: Boolean,
+      default: false
     },
+    /** 取消按钮内容 */
     cancelButtonText: {
       type: String,
-      default: '我知道了'
+      default: '取消'
     },
+    /**  默认 | 不及格 |  及格 |  优秀 |  倒计时 */
     status: {
-      type: String as PropType<'SUCCESS' | 'FAIL' | 'PRACTICE'>,
-      default: 'SUCCESS'
+      type: String as PropType<
+        'DEFAULT' | 'FAIL' | 'PASS' | 'GOOD' | 'COUNTDOWN'
+      >,
+      default: 'DEFAULT'
+    },
+    /** 标题 */
+    title: {
+      type: String,
+      default: '确认退出吗?'
+    },
+    // 内容是否显示html
+    contentHtml: {
+      type: Boolean,
+      default: false
     },
-    result: {
-      type: Object,
-      default: () => ({
-        tips: '恭喜你,测验通过!',
-        score: 0,
-        examName: ''
-      })
+    /** 内容 */
+    content: {
+      type: String,
+      default: ''
     }
   },
   emits: ['close', 'conform'],
@@ -33,30 +55,39 @@ export default defineComponent({
         class={[
           styles.finishResult,
           props.status === 'FAIL' && styles.finishFail,
-          props.status === 'PRACTICE' && styles.finishPractice
+          props.status === 'PASS' && styles.finishPass,
+          props.status === 'GOOD' && styles.finishGood,
+          props.status === 'COUNTDOWN' && styles.finishCountdown
         ]}>
         <div class={styles.finishContainer}>
           <div class={styles.finishContent}>
+            <div class={styles.finishTitle}>
+              <span>{props.title}</span>
+            </div>
             {slots.content ? (
               slots.content()
             ) : (
               <>
-                <div class={styles.scoreNums}>
-                  {props.result.score}
-                  <span>分</span>
-                </div>
-                <div class={styles.scoreName}>{props.result.examName}</div>
-                <div class={styles.scoreResult}>{props.result.tips}</div>
+                {props.contentHtml ? (
+                  <div class={styles.scoreResult} v-html={props.content}></div>
+                ) : (
+                  <div class={styles.scoreResult}>{props.content}</div>
+                )}
               </>
             )}
           </div>
-        </div>
-        <div class={styles.finishBtnGroup}>
-          <div class={styles.finishLeft} onClick={() => emit('close')}>
-            {props.cancelButtonText}
-          </div>
-          <div class={styles.finishRight} onClick={() => emit('conform')}>
-            {props.confirmButtonText}
+
+          <div class={styles.finishBtnGroup}>
+            {props.showCancelButton && (
+              <div class={styles.finishLeft} onClick={() => emit('close')}>
+                {props.cancelButtonText}
+              </div>
+            )}
+            {props.showConfirmButton && (
+              <div class={styles.finishRight} onClick={() => emit('conform')}>
+                {props.confirmButtonText}
+              </div>
+            )}
           </div>
         </div>
       </div>

TEMPAT SAMPAH
src/views/knowledge-library/model/unit-audio/images/icon-play.png


+ 8 - 61
src/views/knowledge-library/practice-mode/index.module.less

@@ -48,67 +48,6 @@
   margin-left: 18px;
 }
 
-.practiceResult {
-  .practiceTitle {
-    font-size: 20px;
-    font-weight: 600;
-    color: #191919;
-    line-height: 28px;
-  }
-
-  .practiceRate {
-    padding-top: 15px;
-    font-size: 60px;
-    // font-family: DINA;
-    font-weight: bold;
-    color: #f67146;
-    line-height: 70px;
-  }
-
-  :global {
-    .van-grid {
-      padding-top: 10px;
-      padding-bottom: 10px;
-      margin-left: 5%;
-      width: 90%;
-    }
-
-    .van-grid-item__content {
-      background-color: transparent;
-    }
-  }
-
-  .title {
-    font-size: 24px;
-    // font-family: DINA;
-    font-weight: bold;
-    color: #333333;
-    line-height: 28px;
-  }
-
-  .name {
-    padding-top: 3px;
-    font-size: 14px;
-    color: #777777;
-    line-height: 20px;
-  }
-
-  .practiceTips {
-    margin-left: 10%;
-    width: 80%;
-    background: linear-gradient(135deg, #fff4da 0%, #ffe6c4 100%);
-    border-radius: 10px;
-    padding: 14px 0;
-    text-align: center;
-    font-size: 15px;
-
-    font-weight: 500;
-    color: #703a17;
-    line-height: 21px;
-    letter-spacing: 1px;
-  }
-}
-
 .btnSection {
   background-color: #fff;
   padding-top: 20px;
@@ -146,4 +85,12 @@
       }
     }
   }
+}
+
+.right {
+  color: #14C295;
+}
+
+.error {
+  color: #FF5A56;
 }

+ 89 - 110
src/views/knowledge-library/practice-mode/index.tsx

@@ -1,13 +1,11 @@
 import {
   ActionSheet,
   Button,
-  Cell,
-  Grid,
-  GridItem,
   Image,
   Popup,
   Swipe,
-  SwipeItem
+  SwipeItem,
+  showLoadingToast
 } from 'vant';
 import {
   computed,
@@ -21,7 +19,6 @@ import {
 import { useRoute, useRouter } from 'vue-router';
 import styles from './index.module.less';
 import iconButtonList from '../images/icon-button-list.png';
-import { state as baseState } from '@/state';
 import MSticky from '@/components/m-sticky';
 import ChoiceQuestion from '../model/choice-question';
 import AnswerList from '../model/answer-list';
@@ -34,7 +31,7 @@ import ResultFinish from '../model/result-finish';
 import { eventUnit, QuestionType } from '../unit';
 import request from '@/helpers/request';
 import { useRect } from '@vant/use';
-import OHeader from '@/components/m-header';
+import MHeader from '@/components/m-header';
 import { useEventListener, useInterval, useWindowScroll } from '@vueuse/core';
 
 export default defineComponent({
@@ -49,14 +46,21 @@ export default defineComponent({
       color: '#fff',
       visiableError: false,
       visiableAnswer: false,
-      visiableResult: false,
+      visiableResult: true,
       id: route.query.id,
       currentIndex: 0,
       questionList: [],
       visiableSure: false,
-      resultInfo: {} as any,
-      resultStatusType: 'SUCCESS', // 'SUCCESS' | 'FAIL'
-      visiableExam: false, // 考试已结束
+      visiableInfo: {
+        show: false,
+        operationType: 'RESULT' as 'RESULT' | 'BACK' | 'CONTINUE',
+        type: 'DEFAULT' as 'DEFAULT' | 'FAIL' | 'PASS' | 'GOOD' | 'COUNTDOWN',
+        content: '',
+        showCancelButton: false,
+        confirmButtonText: '',
+        cancelButtonText: '',
+        title: ''
+      },
       nextStatus: false,
       swipeHeight: 'auto' as any,
       answerAnalysis: '',
@@ -67,9 +71,7 @@ export default defineComponent({
         errorLength: 0, // 错题数
         rate: 0 // 正确率
       },
-      quitStatus: false,
-      dialogMessage: '',
-      dialogStatus: false
+      quitStatus: false
     });
 
     // 计时
@@ -90,14 +92,12 @@ export default defineComponent({
           item.showAnalysis = false; // 默认不显示解析
           item.analysis = {
             message: item.answerAnalysis,
-            topic: true, // 是否显示结果
+            topic: false, // 是否显示结果
             userResult: false // 用户答题对错
           };
           item.userAnswer = []; // 用户答题
         });
         state.questionList = temp.examinationQuestionAdds || [];
-
-        console.log(state.questionList);
       } catch {
         //
       }
@@ -142,7 +142,15 @@ export default defineComponent({
         // 判断是否是最后一题
         if (state.questionList.length === state.currentIndex + 1) {
           eventUnit.emit('unitAudioStop');
-          state.visiableSure = true;
+          // state.visiableSure = true;
+          state.visiableInfo.show = true;
+          state.visiableInfo.title = '练习完成';
+          state.visiableInfo.showCancelButton = true;
+          state.visiableInfo.operationType = 'CONTINUE';
+          state.visiableInfo.cancelButtonText = '再等等';
+          state.visiableInfo.confirmButtonText = '确认完成';
+          state.visiableInfo.content = `确认本次练习的题目都完成了吗?`;
+
           return;
         }
 
@@ -221,6 +229,41 @@ export default defineComponent({
     };
 
     const onConfirmExam = () => {
+      if (state.visiableInfo.operationType === 'RESULT') {
+        onResultPopup();
+      } else if (state.visiableInfo.operationType === 'BACK') {
+      } else if (state.visiableInfo.operationType === 'CONTINUE') {
+      }
+    };
+
+    const onCloseResult = async () => {
+      // state.questionList = [];
+      // await getExamDetails();
+      // setTimeout(async () => {
+      //   swipeRef.value?.swipeTo(0, {
+      //     immediate: true
+      //   });
+      //   state.swipeHeight = 'auto';
+      //   state.answerAnalysis = '';
+      //   state.overResult = {
+      //     time: '00:00', // 时长
+      //     questionLength: 0, // 答题数
+      //     errorLength: 0, // 错题数
+      //     rate: 0 // 正确率
+      //   };
+      //   state.visiableResult = false;
+      //   // 恢复计时
+      //   resume();
+      //   resizeSwipeItemHeight();
+      // }, 100);
+      if (state.visiableInfo.operationType === 'RESULT') {
+      } else if (state.visiableInfo.operationType === 'BACK') {
+      } else if (state.visiableInfo.operationType === 'CONTINUE') {
+      }
+    };
+
+    /** 结果页面弹窗 */
+    const onResultPopup = () => {
       const answerResult = getAnswerResult.value;
       let rate = 0;
 
@@ -243,30 +286,19 @@ export default defineComponent({
       // 重置计时
       pause();
       counter.value = 0;
-      state.visiableResult = true;
-    };
 
-    // 重新练习
-    const onCloseResult = async () => {
-      state.questionList = [];
-      await getExamDetails();
-      setTimeout(async () => {
-        swipeRef.value?.swipeTo(0, {
-          immediate: true
-        });
-        state.swipeHeight = 'auto';
-        state.answerAnalysis = '';
-        state.overResult = {
-          time: '00:00', // 时长
-          questionLength: 0, // 答题数
-          errorLength: 0, // 错题数
-          rate: 0 // 正确率
-        };
-        state.visiableResult = false;
-        // 恢复计时
-        resume();
-        resizeSwipeItemHeight();
-      }, 100);
+      // 60 及格
+      // 85 及以上优秀
+      state.visiableInfo.show = true;
+      state.visiableInfo.title = '已完成';
+      state.visiableInfo.showCancelButton = false;
+      state.visiableInfo.operationType = 'RESULT';
+      state.visiableInfo.confirmButtonText = '确认';
+      state.visiableInfo.content = `<div>您已完成本次测试,答对<span class='${
+        styles.right
+      }'>${answerResult.passCount}</span>,答错<span class='${styles.error}'>${
+        answerResult.count - answerResult.passCount
+      }</span>,正确率${rate}%~</div>`;
     };
 
     // 下一个考点
@@ -320,13 +352,6 @@ export default defineComponent({
 
       resizeSwipeItemHeight();
 
-      if (!baseState.user.data.vipMember) {
-        pause();
-        state.dialogStatus = true;
-        state.dialogMessage = '您暂未开通团练宝,请开通后使用';
-        return;
-      }
-
       // window.history.pushState(null, '', document.URL);
       // window.addEventListener('popstate', onBack, false);
     });
@@ -338,7 +363,7 @@ export default defineComponent({
     return () => (
       <div class={styles.unitDetail}>
         <MSticky position="top">
-          <OHeader
+          <MHeader
             border={false}
             background={state.background}
             color={state.color}
@@ -528,7 +553,7 @@ export default defineComponent({
           safeAreaInsetBottom>
           <AnswerList
             value={state.questionList}
-            lookType={'PRACTICE'}
+            lookType={'ANSWER'}
             onSelect={(item: any) => {
               // 跳转,并且跳过动画
               swipeRef.value?.swipeTo(item, {
@@ -556,56 +581,24 @@ export default defineComponent({
         </Popup>
 
         <Popup
-          v-model:show={state.visiableResult}
+          v-model:show={state.visiableInfo.show}
           closeOnClickOverlay={false}
-          style={{ background: 'transparent', width: '96%' }}>
+          style={{
+            background: 'transparent',
+            width: '100%',
+            maxWidth: '100%',
+            transform: 'translateY(-55%)'
+          }}>
           <ResultFinish
-            status="PRACTICE"
-            confirmButtonText="下一个考点"
-            cancelButtonText="继续练习本考点"
-            onClose={onCloseResult}
+            title={state.visiableInfo.title}
+            showCancelButton={state.visiableInfo.showCancelButton}
+            cancelButtonText={state.visiableInfo.cancelButtonText}
+            confirmButtonText={state.visiableInfo.confirmButtonText}
+            status={state.visiableInfo.type}
+            content={state.visiableInfo.content}
+            contentHtml
             onConform={onConfirmResult}
-            v-slots={{
-              content: () => (
-                <div class={styles.practiceResult}>
-                  <div class={styles.practiceTitle}>本次练习正确率</div>
-                  <div class={styles.practiceRate}>
-                    {state.overResult.rate}%
-                  </div>
-                  <Grid border={false} columnNum={3}>
-                    <GridItem>
-                      <p class={styles.title}>{state.overResult.time}</p>
-                      <p class={styles.name}>练习时长</p>
-                    </GridItem>
-                    <GridItem>
-                      <p class={[styles.title]}>
-                        {state.overResult.questionLength | 0}
-                      </p>
-                      <p class={styles.name}>答题数</p>
-                    </GridItem>
-                    <GridItem>
-                      <p class={styles.title}>
-                        {state.overResult.errorLength | 0}
-                      </p>
-                      <p class={styles.name}>错题数</p>
-                    </GridItem>
-                  </Grid>
-                  {state.overResult.rate >= 100 ? (
-                    <div class={styles.practiceTips}>
-                      你真棒!
-                      <br />
-                      本知识点你已经完全掌握啦!
-                    </div>
-                  ) : (
-                    <div class={styles.practiceTips}>
-                      继续努力!
-                      <br />
-                      争取在测验中获得高分!
-                    </div>
-                  )}
-                </div>
-              )
-            }}
+            onClose={onCloseResult}
           />
         </Popup>
 
@@ -633,20 +626,6 @@ export default defineComponent({
           confirmButtonText="确认退出"
           onConfirm={onAfter}
         />
-
-        <ODialog
-          message={state.dialogMessage}
-          v-model:show={state.dialogStatus}
-          showCancelButton
-          cancelButtonText="返回"
-          onCancel={() => {
-            router.back();
-          }}
-          confirmButtonText="立即开通"
-          onConfirm={() => {
-            router.push('/memberCenter');
-          }}
-        />
       </div>
     );
   }

+ 5 - 3
src/views/knowledge-library/unit-detail.tsx

@@ -18,7 +18,7 @@ export default defineComponent({
       detailId: route.query.detailId,
       background: 'transparent',
       color: '#fff',
-      dataInfo: '' as any
+      dataInfo: {} as any
     });
 
     const getList = async () => {
@@ -66,8 +66,10 @@ export default defineComponent({
         </MSticky>
 
         <div class={[styles.containerSection, styles.woringSection]}>
-          {forms.dataInfo ? (
-            <div class={styles.woringContent} v-html={forms.dataInfo}></div>
+          {forms.dataInfo.desc ? (
+            <div
+              class={styles.woringContent}
+              v-html={forms.dataInfo.desc}></div>
           ) : (
             <div class={styles.woringContent}>
               <MEmpty description="暂无内容" style={{ paddingTop: '40px' }} />

+ 9 - 7
src/views/knowledge-library/wroing-book/woring-stat/index.tsx

@@ -116,19 +116,21 @@ export default defineComponent({
         // LINK('连连看');
         forms.OFTEN_ERROR_QUESTION.forEach((item: any) => {
           if (item.questionType === 'LINK') {
-            lineChartOption.series[0].data = item.num;
+            lineChartOption.series[0].data[0] = item.num;
           } else if (item.questionType === 'RADIO') {
-            lineChartOption.series[1].data = item.num;
+            lineChartOption.series[0].data[1] = item.num;
           } else if (item.questionType === 'SORT') {
-            lineChartOption.series[2].data = item.num;
+            lineChartOption.series[0].data[2] = item.num;
           } else if (item.questionType === 'CHECKBOX') {
-            lineChartOption.series[3].data = item.num;
+            lineChartOption.series[0].data[3] = item.num;
           }
         });
+
         forms.myChart.clear();
         forms.myChart.setOption(lineChartOption);
-      } catch {
+      } catch (e: any) {
         //
+        console.log(e);
       }
     };
 
@@ -279,7 +281,7 @@ export default defineComponent({
               </div>
 
               <div class={styles.knowledgeList}>
-                {forms.OFTEN_ERROR_POINT.forEach((item: any, index: number) => (
+                {forms.OFTEN_ERROR_POINT.map((item: any, index: number) => (
                   <div class={styles.knowledgeItem}>
                     <div class={styles.memo}>
                       {item.pointName}
@@ -294,7 +296,7 @@ export default defineComponent({
                       style={{
                         borderRadius: '10px'
                       }}
-                      percentage={20}
+                      percentage={(item.num / item.totalNum) * 100}
                       strokeWidth={8}
                     />
                   </div>