提交

src/assets/styles/portal-index.scss

@@ -12,7 +12,7 @@
 .portal-title-one{
     font-size: 24px;
     font-family: FZLTCHJW--GB1-0, FZLTCHJW--GB1;
-    font-weight: 500;
+    font-weight: 600;
     color: #000000;
     line-height: 28px;
 }
@@ -74,6 +74,15 @@
 .blue-three{
     color: #00C6FF;
 }
+.pink-one{
+    color: #EB0000;
+}
+.pink-tow{
+    color: #FC2152;
+}
+.pink-three{
+    color: #EE4685;
+}
 .list-bg{
     background: url('/images/qa-box.png') no-repeat 100% / 100%;
     // background: linear-gradient(180deg, #C3DEF8 0%, #FFFFFF 37%);
@@ -81,4 +90,7 @@
 .list-bg1{
   background: url('/images/list-or.png') no-repeat 100% / 100%;
 }
+.list-bg2{
+  background: url('/images/list-pink.png') no-repeat 100% / 100%;
+}
 

src/components/PortalHeader.vue

@@ -236,6 +236,12 @@ export default {
 </script>
 
 <style scoped rel="stylesheet/scss" lang="scss">
+  ::v-deep .el-input__inner{
+    border-radius: 20px;
+    border: 1px solid #333333;
+    border-right: none;
+    background: rgba(255,255,255,0.12);
+  }
 ::v-deep .el-badge__content.is-fixed {
   right: 10px;
 }
@@ -244,14 +250,8 @@ export default {
   // margin: 0 87px;
   height: 72px;
   display: flex;
-  // align-items: center;
   background: rgba(255,255,255,0.12);
-  // background-color: #ffffff;
+  backdrop-filter: blur(10px);
-  // border-bottom: 1px solid #f0f0f0;
-  // line-height: 56px;
-  //width: 100%;
-
-  // padding: 5px 0px 0px;
 }
 .portal-top-nav {
   width: 100%;
@@ -316,15 +316,17 @@ export default {
   border-radius: 0;
 }
 ::v-deep .el-input-group__append {
-  padding: 0px 5px;
+  // padding: 0px 5px;
-  color: #fff;
+  // color: #fff;
-  background: #588afc;
+  // background: #588afc;
-  border: 1px solid #588afc;
+  border: 1px solid #333333;
-  border-radius: 0;
+  border-radius: 0 20px 20px 0;
+  border-left: none;
 
 }
  .input-with-select-btn {
-  font-size: 25px !important;
+  font-size:18px !important;
+  color: #333333 !important;
   margin: 0 !important;
   padding: 0 !important;
 }

src/views/portal/course/Index.vue

@@ -114,13 +114,25 @@
             <span class="pag-text-msg" v-else-if="moreState == 3">没有更多数据了</span>
           </div>
         </div>
-        <div style="width: 245px;margin-left: 5px;">
+        <div style="width: 410px;">
           <div>
             <div id="fixd-box">
             <div v-if="identity == 2 || identity == 3 || identity == 5">
               <el-button style="width: 100%;margin-bottom:15px;height: 37px;border-radius: 0;" type="primary" @click="toNeedCourse">做课程</el-button>
             </div>
-               <el-card class="ranking-card" >
+            <div class="ranking-card portal-right-box list-bg">
+                <p class="portal-title-one" style="padding-bottom:12px">好评榜</p>
+                <ul>
+                  <li style="cursor: pointer;margin-top:30px;" class="title-line-ellipsis" v-for="(item, index) in scorelist" :key="index">
+                    <span class="portal-right-text blue-one" v-if="index==0">0{{index+1}}.</span>
+                    <span class="portal-right-text blue-tow" v-if="index==1">0{{index+1}}.</span>
+                    <span class="portal-right-text blue-three" v-if="index==2">0{{index+1}}.</span>
+                    <span class="portal-right-text" v-if="index>2">0{{index+1}}.</span>
+                    <span class="portal-title-desc" style="font-size: 14px;">{{ item.name }}</span>
+                  </li>
+                </ul>
+              </div>
+               <!-- <el-card class="ranking-card" >
               <div slot="header">
                 <span style="font-size: 14px;font-weight: 600;color: #333333;">好评榜</span>
               </div>
@@ -134,17 +146,15 @@
                     <img v-if="index===2" :src="`${webBaseUrl}/images/third.png`"/>
                     <span style="margin-left: 10px" v-if="index!=2&&index!=0&&index!=1">{{index+1}}</span>
                   </el-col>
-                  <!-- <el-tooltip :enterable="false" @click.native="jumpRouter(item)" effect="light" :content="item.name" placement="bottom" :visible-arrow="false" popper-class="text-tooltip"> -->
                         <div v-bind:title="item.name" @click="jumpRouter(item)">
                         <el-col :span="15" style="cursor: pointer;" class="title-line-ellipsis"> {{ item.name }}</el-col>
                         </div>
 
-                  <!-- </el-tooltip> -->
                 </el-row>
               </div>
-            </el-card>
+            </el-card> -->
-                <div style="height: 10px;"></div>
+                <!-- <div style="height: 10px;"></div> -->
-            <el-card class="ranking-card">
+            <!-- <el-card class="ranking-card">
               <div slot="header">
                 <span style="font-size: 14px;font-weight: 600;color: #333333;">人气榜</span>
               </div>
@@ -158,38 +168,36 @@
                     <img v-if="index===2" :src="`${webBaseUrl}/images/third.png`"/>
                     <span style="margin-left: 10px" v-if="index!=2&&index!=0&&index!=1">{{index+1}}</span>
                   </el-col>
-                  <!-- <el-tooltip :enterable="false" @click.native="jumpRouter(item)" effect="light" :content="item.name" placement="bottom" :visible-arrow="false" popper-class="text-tooltip"> -->
                         <div :title="item.name" @click="jumpRouter(item)">
                         <el-col :span="15" style="cursor: pointer;" class="title-line-ellipsis"> {{ item.name }}</el-col>
                         </div>
-
-                  <!-- </el-tooltip> -->
                 </el-row>
               </div>
-            </el-card>
+            </el-card> -->
-            <div style="height: 10px;"></div>
+            <div style="margin-top:26px" class="ranking-card portal-right-box list-bg1">
-            <el-card class="ranking-card">
+                <p class="portal-title-one" style="padding-bottom:12px">人气榜</p>
-              <div slot="header">
+                <ul>
-                <span style="font-size: 14px;font-weight: 600;color: #333333;">热度榜</span>
+                  <li style="cursor: pointer;margin-top:30px;" v-for="(item, index) in ankingList" :key="index">
+                    <span class="portal-right-text orange-one" v-if="index==0">0{{index+1}}.</span>
+                    <span class="portal-right-text orange-tow" v-if="index==1">0{{index+1}}.</span>
+                    <span class="portal-right-text orange-three" v-if="index==2">0{{index+1}}.</span>
+                    <span class="portal-right-text" v-if="index>2">0{{index+1}}.</span>
+                    <span class="portal-title-desc" style="font-size: 14px;">{{ item.name }}</span>
+                  </li>
+                </ul>
               </div>
-              <div style="padding-bottom:10px">
+              <div style="margin-top:26px" class="ranking-card portal-right-box list-bg2">
-                <el-row class="ranking-title">
+                <p class="portal-title-one" style="padding-bottom:12px">热度榜</p>
-                </el-row>
+                <ul>
-                <el-row class="ranking-title bacolor" v-for="(item, index) in hotList" :key="index">
+                  <li style="cursor: pointer;margin-top:30px;" v-for="(item, index) in hotList" :key="index">
-                  <el-col :span="6" style="height:34px">
+                    <span class="portal-right-text pink-one" v-if="index==0">0{{index+1}}.</span>
-                    <img v-if="index===0" :src="`${webBaseUrl}/images/first.png`"/>
+                    <span class="portal-right-text pink-tow" v-if="index==1">0{{index+1}}.</span>
-                    <img v-if="index===1" :src="`${webBaseUrl}/images/second.png`"/>
+                    <span class="portal-right-text pink-three" v-if="index==2">0{{index+1}}.</span>
-                    <img v-if="index===2" :src="`${webBaseUrl}/images/third.png`"/>
+                    <span class="portal-right-text" v-if="index>2">0{{index+1}}.</span>
-                    <span style="margin-left: 10px" v-if="index!=2&&index!=0&&index!=1">{{index+1}}</span>
+                    <span class="portal-title-desc" style="font-size: 14px;">{{ item.courseName }}</span>
-                  </el-col>
+                  </li>
-                  <!-- <el-tooltip :enterable="false" @click.native="jumpRouter2(item)" effect="light" :content="item.courseName" placement="bottom" :visible-arrow="false" popper-class="text-tooltip"> -->
+                </ul>
-                        <div :title="item.courseName" @click="jumpRouter2(item)">
-                        <el-col :span="15" style="cursor: pointer;" class="title-line-ellipsis"> {{ item.courseName }}</el-col>
               </div>
-                  <!-- </el-tooltip> -->
-                </el-row>
-              </div>
-            </el-card>
             </div>
 
           </div>