修改部分样式

src/styles/vant.scss

@@ -49,6 +49,7 @@
 }
 .van-tabs--line .van-tabs__wrap {
   height: 1.5rem;
+  overflow-x: auto;
 }
 .van-tabs__content .van-tabs__nav {
   .van-tab {

src/views/home/answer/page-answer.vue

@@ -154,7 +154,7 @@ export default {
       justify-content: space-between;
       .answer-practice-item {
         width: 31%;
-        padding: 0.75rem 0.75rem;
+        padding: 0.75rem 0;
         border: 1px solid #e4e8eb;
         border-radius: 4px;
         background-color: #fff;

src/views/home/exam/page-exam-item-detail.vue

@@ -11,7 +11,7 @@
           考试时长：{{ examItemData.examTimeMins }}
         </div>
         <div class="exam-item-detial-describe">
-          考试描述：{{ examItemData.description }}
+          考试描述：<span>{{ examItemData.description }}</span>
         </div>
       </div>
     </div>

src/views/home/index.vue

@@ -83,7 +83,8 @@ export default {
           lastName: "张",
           studyId: "U00000",
           phone: "13060901234",
-          nickName: "小强"
+          nickName: "小强",
+          group: "临时用户"
         }
       });
       this.activeTabName = 0;

src/views/home/learn/page-learn-child.vue

@@ -84,7 +84,6 @@ export default {
     },
     active(val, oldVal) {
       if (val !== oldVal) {
-        console.log("--active--" + this.active);
         this.getContentList();
       }
     }
@@ -100,12 +99,6 @@ export default {
       let path = {
         categoryId: this.learnChildList[this.choosedChildIndex].id
       };
-      console.log(
-        "--active--" +
-          this.active +
-          "--categoryId--" +
-          this.learnChildList[this.choosedChildIndex].id
-      );
       this.$_http
         .get(
           this.$pathParams(
@@ -115,7 +108,6 @@ export default {
         )
         .then(res => {
           this.contentList = res.data;
-          console.log("--child--", this.contentList);
           this.finished = true;
         })
         .catch(() => {
@@ -142,6 +134,7 @@ export default {
       font-size: 0.65rem;
     }
     .contentItemDescription {
+      margin-top: 0.25rem;
       display: flex;
       justify-content: space-between;
       align-items: center;

src/views/home/learn/page-learn-content.vue

@@ -70,7 +70,7 @@
               height="100%"
               round
               alt="cover"
-              :src="item.headerUrl"
+              :src="item.headerUrl || defaultHeadImg"
             />
           </div>
           <div class="learn-content-comment-item-userInfo">
@@ -115,6 +115,7 @@ export default {
       seconds: 0,
       collectImg: require("@/assets/image/learn/collect.png"),
       collectedImg: require("@/assets/image/learn/collected.png"),
+      defaultHeadImg: require("@/assets/image/maleAvatar.jpg"),
       isCollected: false, // 是否被收藏了
       commentList: [], // 评论列表内容
       commentValue: "" // 即将评论的内容
@@ -132,13 +133,13 @@ export default {
   methods: {
     //   查询具体内容
     getContent() {
+      this.$store.commit("toggleLoading", true);
       let path = {
         materialId: this.materialId
       };
       this.$_http
         .get(this.$pathParams(this.$_API.JTXT_GET_MATERIAL_MATERIALID, path))
         .then(res => {
-          console.log("--content--", res.data);
           this.contentObj = res.data;
           // 开始倒计时
           this.seconds = res.data.readTimeInSec;
@@ -163,7 +164,6 @@ export default {
         .get(this.$pathParams(this.$_API.JTXT_GET_MATERIALS_COMMENTS, path))
         .then(res => {
           this.commentList = res.data;
-          console.log("--comment--", res.data);
         })
         .catch(() => {
           this.$store.commit("toggleLoading", false);
@@ -198,7 +198,6 @@ export default {
           params
         )
         .then(res => {
-          console.log("--收藏--", res.data);
           this.isCollected = true;
         })
         .catch(() => {
@@ -224,7 +223,6 @@ export default {
           }
         )
         .then(res => {
-          console.log("--取消收藏--", res.data);
           this.isCollected = false;
         })
         .catch(() => {
@@ -254,7 +252,6 @@ export default {
         )
         .then(res => {
           Toast("发布评论成功");
-          console.log("--评论成功--", res.data);
           //   重新查询评论列表
           this.getCommentListFun();
         })
@@ -286,7 +283,7 @@ export default {
     font-size: 0.65rem;
   }
   .learn-content-body {
-    padding: 0.5rem 0.5rem;
+    padding: 0.5rem 1rem;
     .learn-content-body-title {
       font-size: 0.7rem;
       font-weight: bold;
@@ -298,9 +295,10 @@ export default {
       color: #666;
     }
     .learn-content-body-description {
-      margin-top: 1rem;
+      margin-top: 0.5rem;
       word-break: break-all;
       word-wrap: break-word;
+      letter-spacing: 0.2rem;
     }
     .learn-content-body-time-row {
       margin-top: 1rem;
@@ -346,7 +344,7 @@ export default {
   .learn-content-comment {
     margin-top: 1rem;
     .learn-content-comment-title {
-      padding: 0 0.5rem;
+      padding: 0 1rem;
       display: flex;
       align-items: center;
       height: 1.25rem;
@@ -363,21 +361,21 @@ export default {
     .learn-content-comment-list {
       border-top: 1px solid #e5e5e5;
       margin-top: 0.5rem;
-      padding: 0.5rem 0.5rem;
+      padding: 0.5rem 1rem;
       .learn-content-comment-item {
         width: 100%;
         display: flex;
         justify-content: space-between;
         margin-bottom: 0.5rem;
         .learn-content-comment-item-userHead {
-          width: 1.5rem;
-          height: 1.5rem;
+          width: 1.75rem;
+          height: 1.75rem;
           border-radius: 100%;
           overflow: hidden;
           border: 1px dashed #e5e5e5;
         }
         .learn-content-comment-item-userInfo {
-          width: calc(100% - 2rem);
+          width: calc(100% - 2.25rem);
           padding-bottom: 0.25rem;
           border-bottom: 1px solid #e5e5e5;
           .learn-content-comment-item-name {
@@ -406,7 +404,7 @@ export default {
     height: 2rem;
     border-top: 1px solid #e5e5e5;
     background-color: #f5f5f5;
-    padding: 0.2rem 0.5rem;
+    padding: 0.2rem 1rem;
     display: flex;
     justify-content: space-between;
     align-items: center;

src/views/home/learn/page-learn.vue

@@ -41,7 +41,6 @@ export default {
         .get(this.$_API.JTXT_GET_CATEGORIES)
         .then(res => {
           this.learnRootList = res.data;
-          console.log("--root--" + JSON.stringify(this.learnRootList));
           //   查询子目录
           this.getChildList();
         })
@@ -59,7 +58,6 @@ export default {
         .get(this.$pathParams(this.$_API.JTXT_GET_CATEGORIES_CATEGROYID, path))
         .then(res => {
           this.learnChildList = res.data;
-          console.log("--child--" + JSON.stringify(this.learnChildList));
           //   移除第一个根目录
           this.learnChildList.shift();
         })

src/views/home/person/collection.vue

@@ -8,18 +8,20 @@
       @load="onLoad"
     >
       <van-cell
-        v-for="(item, index) in favorites"
+        v-for="(item, index) in favoritesList"
         :key="index"
         @click="toMaterialDetail(item)"
       >
         <div slot="default" class="contentItemDiv">
           <div>
-            <div class="contentItemTitle">{{ item.name || "学习文章" }}</div>
+            <div class="contentItemTitle">
+              {{ item.name || "学习文章标题" }}
+            </div>
             <div class="contentItemDescription">
-              <div>
-                收藏时间:
-                {{ "2021-01-01" || formateDateTimeFun(item.startTime) }}
-              </div>
+              收藏时间:
+              <span>{{
+                formateDateTimeFun(item.createdTime) || item.createdTime
+              }}</span>
             </div>
           </div>
         </div>
@@ -35,13 +37,12 @@ export default {
   components: {},
   data() {
     return {
-      favorites: [],
+      favoritesList: [],
       loading: false,
       finished: false
     };
   },
-  mounted() {
-    console.log("--收藏--");
+  created() {
     this.getFavorites();
   },
   computed: {
@@ -50,50 +51,59 @@ export default {
     })
   },
   methods: {
+    // 查询：收藏的文字ID列表
     getFavorites() {
+      this.$store.commit("toggleLoading", true);
       let path = {
         userName: this.user.userInfo.userName
       };
       this.$_http
         .get(this.$pathParams(this.$_API.JTXT_GET_USER_FAVORITES, path))
         .then(res => {
-          this.favorites = res.data.materials;
-          console.log("--collection--" + JSON.stringify(this.favorites));
-          this.finished = true;
+          if (res.data.materials) {
+            res.data.materials.forEach((item, index) => {
+              this.getFavoritesDetailFun(
+                item,
+                index + 1 === res.data.materials.length
+              );
+            });
+          } else {
+            this.$store.commit("toggleLoading", false);
+          }
+          this.loading = false;
+        })
+        .catch(() => {
+          this.$store.commit("toggleLoading", false);
+        });
+    },
+    // 查询：单个文章的详情
+    getFavoritesDetailFun(item, isLast) {
+      let path = {
+        materialId: item
+      };
+      this.$_http
+        .get(this.$pathParams(this.$_API.JTXT_GET_MATERIAL_MATERIALID, path))
+        .then(res => {
+          this.favoritesList.push(res.data);
+          if (isLast) {
+            this.finished = true;
+            this.$store.commit("toggleLoading", false);
+          }
         })
         .catch(() => {
           this.$store.commit("toggleLoading", false);
         });
     },
+    onLoad() {},
+    // 操作：返回
     onClickLeft() {
       this.$router.back();
     },
-    onLoad() {},
     toMaterialDetail(item) {
       this.$router.push({
         name: "learn-content",
-        params: { materialId: item }
+        params: { materialId: item.id }
       });
-    },
-    formateDateTimeFun(time) {
-      // 获取当前日期
-      let date = new Date(time);
-      // 获取当前月份
-      let nowMonth = date.getMonth() + 1;
-      // 获取当前是几号
-      let strDate = date.getDate();
-      // 添加分隔符“-”
-      let seperator = "-";
-      // 对月份进行处理，1-9月在前面添加一个“0”
-      if (nowMonth >= 1 && nowMonth <= 9) {
-        nowMonth = "0" + nowMonth;
-      }
-      // 对月份进行处理，1-9号在前面添加一个“0”
-      if (strDate >= 0 && strDate <= 9) {
-        strDate = "0" + strDate;
-      }
-      // 最后拼接字符串，得到一个格式为(yyyy-MM-dd)的日期
-      return date.getFullYear() + seperator + nowMonth + seperator + strDate;
     }
   }
 };
@@ -108,9 +118,11 @@ export default {
       font-weight: bold;
     }
     .contentItemDescription {
-      display: flex;
-      justify-content: space-between;
-      align-items: center;
+      margin-top: 0.25rem;
+      color: #afafaf;
+      span {
+        margin-left: 0.5rem;
+      }
     }
   }
 }

src/views/home/person/page-person.vue

@@ -7,12 +7,16 @@
           <van-image
             class="userHeaderImg"
             fit="cover"
+            round
             :src="maleAvatar"
             :show-error="true"
             :error-icon="maleAvatar"
           />
-          <div class="userName">
-            {{ userInfo.userName }}
+          <div>
+            <div class="userName">
+              {{ userInfo.userName }}
+            </div>
+            <div class="userGroup">组织：{{ userInfo.group }}</div>
           </div>
         </div>
         <div class="userCardLine"></div>
@@ -23,7 +27,6 @@
             <span class="todayScoreNum">{{ todayPoints }}</span>
           </div>
         </div>
-        <div style="height: 1rem"></div>
       </div>
     </div>
     <!-- 积分 -->
@@ -35,16 +38,30 @@
     <!-- 菜单 -->
     <div class="menu-box">
       <div class="menuCard">
-        <van-grid>
+        <!-- <van-grid>
           <van-grid-item
             v-for="(item, index) in menus"
             :key="index"
-            :icon="item.icon"
             :text="item.title"
             @click="clickGridIcon(item)"
-          />
-        </van-grid>
-        <div style="height: 3rem"></div>
+          >
+            <van-image slot="icon" :src="item.src" />
+          </van-grid-item>
+        </van-grid> -->
+        <div
+          :class="{
+            'menu-card-item': true,
+            'menu-card-item-border': index !== 0 && index !== 4
+          }"
+          v-for="(item, index) in menus"
+          :key="index"
+          @click="clickGridIcon(item)"
+        >
+          <div class="menu-card-item-img">
+            <van-image width="100%" height="100%" :src="item.src" />
+          </div>
+          <span class="menu-card-item-title">{{ item.title }}</span>
+        </div>
       </div>
     </div>
   </div>
@@ -70,11 +87,37 @@ export default {
       },
       faceUrl: "",
       menus: [
-        { title: "考试成绩", icon: "photo-o", to: "exam-history" },
-        { title: "收藏", icon: "photo-o", to: "collection" },
-        { title: "排行榜", icon: "photo-o", to: "rank" },
-        { title: "使用手册", icon: "photo-o", to: "user-manual" },
-        { title: "积分兑换", icon: "photo-o", to: "" }
+        {
+          title: "考试成绩",
+          icon: "photo-o",
+          to: "exam-history",
+          src: require("@/assets/image/personal/testScore.png")
+        },
+        {
+          title: "收藏",
+          icon: "photo-o",
+          to: "collection",
+          src: require("@/assets/image/personal/collect.png")
+        },
+        {
+          title: "排行榜",
+          icon: "photo-o",
+          to: "rank",
+          src: require("@/assets/image/personal/leaderboard .png")
+        },
+        {
+          title: "使用手册",
+          icon: "photo-o",
+          to: "user-manual",
+          src: require("@/assets/image/personal/manual.png")
+        },
+        {
+          title: "积分兑换",
+          icon: "photo-o",
+          to: "",
+          src: require("@/assets/image/personal/redeem.png")
+        }
+        // { title: "我要编辑", icon: "photo-o", to: "", src: require("@/assets/image/personal/toEdit.png")  }
       ]
     };
   },
@@ -84,6 +127,7 @@ export default {
     })
   },
   mounted() {
+    console.log(this.userInfo);
     this.getDailyPoints();
     this.getAllPoints();
   },
@@ -97,7 +141,6 @@ export default {
         .get(this.$pathParams(this.$_API.JTXT_GET_USER_DAIYL_POINTS, path))
         .then(res => {
           this.todayPoints = res.data;
-          console.log("--this.todayPoints--" + this.todayPoints);
         })
         .catch(() => {
           this.$store.commit("toggleLoading", false);
@@ -112,7 +155,6 @@ export default {
         .get(this.$pathParams(this.$_API.JTXT_GET_USER_ALL_POINTS, path))
         .then(res => {
           this.allPoints = res.data;
-          console.log("--user--" + this.allPoints);
         })
         .catch(() => {
           this.$store.commit("toggleLoading", false);
@@ -120,7 +162,6 @@ export default {
     },
     // 点击宫格图标
     clickGridIcon(item) {
-      console.log("---click--" + JSON.stringify(item));
       this.$router.push({
         name: item.to,
         params: { userId: "testuser-zirKBELIlg" }
@@ -146,12 +187,6 @@ export default {
       box-shadow: 0 0 4px 2px rgba(139, 163, 198, 0.3);
       -webkit-box-shadow: 0 0 4px 2px rgba(139, 163, 198, 0.3);
       border-radius: 0.1rem;
-      .userHeaderImg {
-        width: 2.5rem;
-        height: 2.5rem;
-        border-radius: 0.1rem;
-        margin-right: 0.5rem;
-      }
       .userCardLine {
         border-bottom: 1px solid #f1f1f1;
         width: 100%;
@@ -161,14 +196,21 @@ export default {
       .userInfo {
         padding: 0.5rem 0;
         display: flex;
-        flex-direction: row;
-        justify-content: flex-start;
-      }
-      .userName {
-        display: flex;
-        flex-direction: row;
-        justify-content: space-between;
+        // justify-content: space-between;
         align-items: center;
+        .userHeaderImg {
+          width: 2.5rem;
+          height: 2.5rem;
+          margin-right: 0.5rem;
+        }
+        .userName {
+          font-size: 0.8rem;
+        }
+        .userGroup {
+          margin-top: 0.5rem;
+          font-size: 0.65rem;
+          color: #333;
+        }
       }
       .flexRowStartCenter {
         display: flex;
@@ -219,10 +261,32 @@ export default {
     .menuCard {
       background-color: #fff;
       width: 100%;
-      padding: 1rem 0.5rem;
+      padding: 1rem 0.5rem 0;
       box-shadow: 0 0 4px 2px rgba(139, 163, 198, 0.3);
       -webkit-box-shadow: 0 0 4px 2px rgba(139, 163, 198, 0.3);
       border-radius: 0.1rem;
+      display: flex;
+      justify-content: space-between;
+      flex-wrap: wrap;
+      .menu-card-item {
+        width: 23%;
+        // height: 3rem;
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        margin-bottom: 1rem;
+        .menu-card-item-img {
+          width: 2.5rem;
+          height: 2.5rem;
+        }
+        .menu-card-item-title {
+          font-size: 0.65rem;
+          margin-top: 0.25rem;
+        }
+      }
+      // .menu-card-item-border {
+      //   border: 1px solid #e6e6e6;
+      // }
     }
   }
 }