Browse Source

feat: PortalPage layout beta v2
issue: 首页展开逻辑始终不完美,待修

Damon 4 years ago
parent
commit
fa6beb720e

BIN
src/assets/infoCard.png


+ 1 - 0
src/components/CoderCard.vue

@@ -91,6 +91,7 @@ export default {
   border-radius: 8px;
   height: calc(100% - 14px);
   position: relative;
+  border: 1px solid #cccccc;
 }
 
 .coder:hover {

+ 3 - 3
src/components/CourseCard.vue

@@ -47,7 +47,7 @@ export default {
         return "OVER";
       } else if (new Date(this.courseVO.startTime) > new Date()) {
         return "NOT_STARTED";
-      } else if (this.examVO.finished) {
+      } else if (this.courseVO.finished) {
         return "FINISHED";
       } else {
         return "RUNNING";
@@ -80,11 +80,11 @@ export default {
   border-radius: 4px;
   height: calc(100% - 10px);
   position: relative;
+  border: 1px solid #cccccc;
 }
 
 .course-card:hover {
   cursor: pointer;
-  border: 1px solid #aaaaaa;
 }
 
 .image {
@@ -126,7 +126,7 @@ export default {
 }
 
 .description {
-  background-color: #f8f8f8;
+  background-color: #f6f6f6;
   margin-top: 10px;
   border-radius: 8px;
   padding: 10px;

+ 2 - 1
src/components/EvalCard.vue

@@ -102,6 +102,7 @@ export default {
   border-radius: 8px;
   height: calc(100% - 14px);
   position: relative;
+  border: 1px solid #cccccc;
 }
 
 .eval:hover {
@@ -131,7 +132,7 @@ export default {
 }
 
 .comment {
-  background-color: #f8f8f8;
+  background-color: #f6f6f6;
   color: #777777;
   margin-top: 10px;
   border-radius: 8px;

+ 4 - 3
src/views/PortalPage/PortalPage.vue

@@ -35,7 +35,7 @@
     </div>
 
     <div>
-      <el-card id="portal-course-card-main" ref="portalCourseCardBodyMain">
+      <el-card id="portal-course-card-main" ref="portalCourseCardBodyMain" :style="{height: courseRowHeight + 'px'}">
         <div class="portal-card-title">
           <div class="portal-card-title-main">精选课程</div>
           <ElButton plain type="primary" @click="toCourse">查看全部课程</ElButton>
@@ -199,6 +199,7 @@ export default {
         } else if (document.body.clientWidth < 992) {
           this.cardRowLength = 2;
         }
+        this.courseRowHeight = 640;
       } else if (scrollTop < 5) {
         this.extending = false;
         if (document.body.clientWidth >= 1200) {
@@ -208,11 +209,11 @@ export default {
         } else if (document.body.clientWidth < 992) {
           this.cardRowLength = 1;
         }
+        this.courseRowHeight = 360;
       }
-      this.courseRowHeight = this.$refs.portalCourseCardBodyMain.$el.clientHeight;
       this.testRowHeight = this.$refs.portalTestCardBodyMain.$el.clientHeight;
     },
-    changeTestPane(tab, event) {
+    changeTestPane() {
       const that = this;
       this.$nextTick(() => {
         that.handleResize();

+ 0 - 1
src/views/PortalPage/components/InfoCard.vue

@@ -74,7 +74,6 @@ export default {
   justify-content: space-around;
   align-items: center;
   border-radius: 4px;
-  background-color: #fff;
 }
 
 #info-card-circle {

+ 1 - 0
src/views/PortalPage/components/MyCourseCard.vue

@@ -77,6 +77,7 @@ export default {
 .body {
   margin-bottom: 8px;
   position: relative;
+  border: 1px solid #cccccc;
 }
 
 .body:hover {

+ 1 - 0
src/views/PortalPage/components/MyTestCard.vue

@@ -134,6 +134,7 @@ export default {
 .body {
   position: relative;
   margin-bottom: 8px;
+  border: 1px solid #cccccc;
 }
 
 .body:hover {