Browse Source

修改考试历史、学习积分、积分说明的样式

yellowtaotao 3 years ago
parent
commit
e9c4c9cad6

+ 3 - 1
src/store/index.js

@@ -6,6 +6,7 @@ import exam from "./modules/exam";
 import answer from "./modules/answer";
 import user from "./modules/user";
 import favorite from "./modules/favorite";
+import study from "./modules/study";
 
 Vue.use(Vuex);
 
@@ -52,6 +53,7 @@ export default new Vuex.Store({
     exam,
     answer,
     user,
-    favorite
+    favorite,
+    study
   }
 });

+ 13 - 0
src/store/modules/study.js

@@ -0,0 +1,13 @@
+const user = {
+  state: {
+    isNeedChangeTab: false // 是否需要切换首页tab
+  },
+  mutations: {
+    updateStudyItemStore(state, { field, value }) {
+      state[field] = value;
+    }
+  },
+  actions: {}
+};
+
+export default user;

+ 14 - 1
src/views/home/index.vue

@@ -86,12 +86,25 @@ export default {
   },
   computed: {
     ...mapState({
-      user: state => state.user
+      user: state => state.user,
+      isNeedChangeTab: state => state.study.isNeedChangeTab
     })
   },
   created() {
     this.initFun();
   },
+  watch: {
+    isNeedChangeTab(value) {
+      if (value) {
+        this.activeTabName = 0;
+        this.onChangeTabFun(this.activeTabName);
+        this.$store.commit("updateStudyItemStore", {
+          field: "isNeedChangeTab",
+          value: false
+        });
+      }
+    }
+  },
   methods: {
     // 初始化
     initFun() {

+ 20 - 74
src/views/home/person/exam-history.vue

@@ -3,6 +3,9 @@
     <van-nav-bar title="考试" left-arrow @click-left="onClickLeft" />
     <div class="exam-history-div">
       <div class="exam-history-grades-div">
+        <div class="exam-history-description">
+          考试积分
+        </div>
         <div class="exam-history-grades">
           {{ this.user.userInfo.examPoints }}
         </div>
@@ -50,59 +53,7 @@ export default {
         TWO: 2,
         THREE: 3
       }, // 类型
-      examHistoryList: [],
-      eventList: [
-        {
-          name: "进入应用",
-          rule: "2分/每次进入应用",
-          isFinish: false,
-          getPoints: 2,
-          totaPonits: 6,
-          type: 1
-        },
-        {
-          name: "观看视频",
-          rule: "2分/每有效观看一个视频",
-          isFinish: false,
-          getPoints: 0,
-          totaPonits: 6,
-          type: 1
-        },
-        {
-          name: "发表观点",
-          rule: "2分/每发表一个有效观点",
-          isFinish: false,
-          getPoints: 0,
-          totaPonits: 6,
-          type: 1
-        },
-        {
-          name: "阅读文章",
-          rule: "2分/每有效阅读一篇文章",
-          isFinish: false,
-          getPoints: 0,
-          totaPonits: 6,
-          type: 1
-        },
-        {
-          name: "文章学习时长",
-          rule: "2分/有效阅读文章累计1分钟",
-          isFinish: false,
-          getPoints: 0,
-          totaPonits: 6,
-          type: 2
-        },
-        {
-          name: "基础训练",
-          rule: "2分/每训练一次",
-          isFinish: false,
-          getPoints: 0,
-          totaPonits: 6,
-          type: 3
-        }
-      ],
-      userTotalPonits: 165, // 用户的总积分
-      todayEarnPoints: 6 // 今日已累计的积分
+      examHistoryList: []
     };
   },
   mounted() {
@@ -157,23 +108,6 @@ export default {
         .catch(() => {
           this.$store.commit("toggleLoading", false);
         });
-    },
-    // 操作:点击了去看看、去学习、去训练
-    toManualEarnFun(item) {
-      console.log(item);
-      switch (item.type) {
-        case this.userManualType.ONE:
-          //  TODO..
-          break;
-        case this.userManualType.TWO:
-          //  TODO..
-          break;
-        case this.userManualType.THREE:
-          //  TODO..
-          break;
-        default:
-          break;
-      }
     }
   }
 };
@@ -183,21 +117,29 @@ export default {
 .exam-history-box {
   width: 100%;
   height: 100vh;
-  overflow-y: auto;
-  overflow-x: hidden;
   font-size: 0.6rem;
   background-color: #fff;
   .exam-history-div {
-    padding: 0 0.5rem;
+    width: 100%;
+    overflow-y: auto;
+    padding: 0 1rem;
     .exam-history-grades-div {
       display: flex;
       flex-direction: column;
       justify-content: center;
       align-items: center;
+      padding-top: 1rem;
       .exam-history-grades {
-        margin-top: 1rem;
         font-size: 1rem;
         color: #0088e9;
+        margin-top: 0.5rem;
+      }
+      .exam-history-description {
+        padding: 0.15rem 0.5rem;
+        // border: 1px solid #7cc8ff;
+        // border-radius: 0.25rem;
+        color: #0088e9;
+        font-size: 0.75rem;
       }
     }
     .exam-history-list {
@@ -209,12 +151,16 @@ export default {
         justify-content: space-between;
         align-items: center;
         .exam-history-item-left {
+          margin-right: 0.25rem;
           .exam-history-item-left-title {
             font-weight: bold;
+            word-break: break-all;
+            word-wrap: break-word;
           }
           .exam-history-item-left-percentage {
             display: flex;
             align-items: center;
+            margin-top: 0.5rem;
             .exam-history-item-left-schedule {
               width: 100px;
             }

+ 2 - 2
src/views/home/person/learn-point-rule.vue

@@ -71,8 +71,8 @@ export default {
       align-items: center;
       .learn-point-rule-row-icon {
         width: 3px;
-        height: 0.55rem;
-        background-color: #df371e;
+        height: 0.6rem;
+        background-color: #0088e9;
       }
       .learn-point-rule-row-title {
         font-size: 0.75rem;

+ 3 - 0
src/views/home/person/page-person.vue

@@ -162,6 +162,9 @@ export default {
     },
     // 点击宫格图标
     clickGridIcon(item) {
+      if (!item.to) {
+        return;
+      }
       this.$router.push({
         name: item.to,
         params: { userId: "testuser-zirKBELIlg" }

+ 12 - 6
src/views/home/person/user-manual.vue

@@ -65,7 +65,7 @@ export default {
         {
           name: "今日必答",
           type: "DAILY_QUESTIONS",
-          rule: "2分/每次进入应用",
+          rule: "2分/完成今日必答",
           isFinish: false,
           getPoints: 0,
           totaPonits: 6,
@@ -75,7 +75,7 @@ export default {
         {
           name: "今日必读",
           type: "LEARNING_COMPLETE",
-          rule: "2分/每有效观看一个视频",
+          rule: "2分/每有效阅读一篇必学文章",
           isFinish: false,
           getPoints: 0,
           totaPonits: 6,
@@ -184,6 +184,10 @@ export default {
         this.$router.push({
           name: "home"
         });
+        this.$store.commit("updateStudyItemStore", {
+          field: "isNeedChangeTab",
+          value: true
+        });
       }
     }
   }
@@ -194,19 +198,18 @@ export default {
 .user-manual-box {
   width: 100%;
   height: 100vh;
-  overflow-y: auto;
-  overflow-x: hidden;
   font-size: 0.6rem;
   background-color: #fff;
   .user-manual-div {
-    padding: 0 0.5rem;
+    overflow-y: auto;
+    padding: 0 0.75rem;
     .user-manual-grades-div {
       display: flex;
       flex-direction: column;
       justify-content: center;
       align-items: center;
+      padding-top: 1rem;
       .user-manual-grades {
-        margin-top: 1rem;
         font-size: 1rem;
         color: #0088e9;
       }
@@ -251,10 +254,13 @@ export default {
         .user-manual-item-left {
           .user-manual-item-left-title {
             font-weight: bold;
+            word-break: break-all;
+            word-wrap: break-word;
           }
           .user-manual-item-left-percentage {
             display: flex;
             align-items: center;
+            margin-top: 0.5rem;
             .user-manual-item-left-schedule {
               width: 100px;
             }