浏览代码

Merge branch 'dev/v1.2.16_wmh' of jianyu/jy-docs into feature/v1.2.16

wenmenghao 10 月之前
父节点
当前提交
95907edc38
共有 2 个文件被更改,包括 288 次插入484 次删除
  1. 1 3
      jydocs-pc/src/App.vue
  2. 287 481
      jydocs-pc/src/views/Home.vue

+ 1 - 3
jydocs-pc/src/App.vue

@@ -63,7 +63,6 @@ export default {
     background-color: #fff;
   }
 }
-<<<<<<< HEAD
 .in-app.docs-app{
   width: 100%;
   min-width: 1012px !important;
@@ -72,7 +71,7 @@ export default {
     width: auto !important;
     min-width: auto !important;
   }
-=======
+}
 ::-webkit-scrollbar {
   /*滚动条整体样式*/
   width: 8px;
@@ -82,6 +81,5 @@ export default {
   /*滚动条里面小方块*/
   border-radius: 3px;
   background-color: #e0e0e0;
->>>>>>> master
 }
 </style>

+ 287 - 481
jydocs-pc/src/views/Home.vue

@@ -1,31 +1,21 @@
 <template>
   <div class="pages--home">
-    <div class="top-search-group flex-c-c center">
-      <div class="centerBox">
+      <div class="top-search-group flex-c-c center">
+        <div class="centerBox">
         <h1>剑鱼文库,上亿级文档资料库</h1>
         <search-input @submit="goSubmit" :btnText="in_Iframe?'搜 索':''" :leftIconshow="in_Iframe"></search-input>
       </div>
-    </div>
-    <div class="group-content">
+      </div>
       <div class="center-contentbox">
       <div class="new-group">
-        <div class="new-list-group must-bottom">
-          <div class="top-list-group">
-          <div class="flex-r-c">
-          <div class="title-group flex-r-c center left">
-            <h5 style="font-size: 24px;line-height: 36px;">热门文档</h5>
-            <!-- <i class="el-icon-jy-Frame"></i> -->
-          </div>
-<<<<<<< HEAD
-        </div>
-          <div class="word-model">
-            <div class="word-model-content" :class="{ 'launch-alone': !launchActive }">
-              <div class="word-model-list" @click="onSetWordModel(item)" :class="{ 'active': item.active }"
-                v-for="(item, index) in wordModel" :key="index">
-                {{ item.value }}
-=======
-
           <div class="new-list-group must-bottom">
+            <div class="top-list-group">
+            <div class="flex-r-c">
+              <div class="title-group flex-r-c center left">
+                  <h5 style="font-size: 24px;line-height: 36px;">热门文档</h5>
+                  <!-- <i class="el-icon-jy-Frame"></i> -->
+              </div>
+            </div>
             <div class="word-model">
               <div class="word-model-content" :class="{'launch-alone': !launchActive}">
                 <div class="word-model-list" @click="onSetWordModel(item)" :class="{'active': item.active}" v-for="(item, index) in wordModel" :key="index">
@@ -40,92 +30,77 @@
             <div class="word-file-main">
               <div class="word-file-list" @click="goContent(item)" v-for="(item, index) in wordFileList" :key="index">
                 <div class="mini-img-group">
-                  <img :src="item.img" alt="" @error="handleError">
+                  <img :src="item.img" alt="" class="mini-img" @error="handleError">
                   <i class="word-type" :class="'el-icon-jy-' + item.type" ></i>
                   <span class="type-tag" :class="item.productType === 2 ? 'boutique' : 'free'">{{item.productType === 2 ? '付费精品' : '会员免费'}}</span>
                 </div>
                 <div class="word-file-name">{{ item.title }}</div>
->>>>>>> master
               </div>
             </div>
-            <div class="word-model-more" @click="launchActive = !launchActive">
-              <span>{{ launchActive ? '收起' : '展开' }}</span>
-              <i :class="`el-icon-arrow-${launchActive ? 'up' : 'down'}`"></i>
             </div>
-          </div>
-          <div class="word-file-main">
-            <div class="word-file-list" @click="goContent(item)" v-for="(item, index) in wordFileList" :key="index">
-              <div class="mini-img-group">
-                <img :src="item.img" alt="" @error="handleError">
-                <i class="word-type" :class="'el-icon-jy-' + item.type"></i>
-                <span v-if="item.productType === 1" class="word-vip-mark">会员免费</span>
-              </div>
-              <div class="word-file-name">{{ item.title }}</div>
+            <!-- 文库会员广告位 -->
+            <div class="word-file-ad" v-if="jyPcDocMember && jyPcDocMember.length" :style="{height: in_Iframe?adHeight:'80px'}">
+              <el-carousel  :height="in_Iframe?adHeight:'80px'">
+                <el-carousel-item v-for="(item, index) in jyPcDocMember" :key="index">
+                  <img @click.prevent="onDocLink(item)" :src="item.s_pic" :alt="item.s_remark">
+                </el-carousel-item>
+              </el-carousel>
             </div>
-          </div>
-        </div>
-          <!-- 文库会员广告位 -->
-          <div class="word-file-ad" v-if="jyPcDocMember && jyPcDocMember.length" :style="{height: in_Iframe?adHeight:'80px'}">
-            <el-carousel :height="in_Iframe?adHeight:'80px'">
-              <el-carousel-item v-for="(item, index) in jyPcDocMember" :key="index">
-                <img @click.prevent="onDocLink(item)" :src="item.s_pic" :alt="item.s_remark">
-              </el-carousel-item>
-            </el-carousel>
-          </div>
-          <!-- 文库推荐广告位 -->
-          <div class="word-recommend-ad" v-if="jyPcDocRecommend && jyPcDocRecommend.length">
-            <div class="word-recommend-ad-list" @click.stop="onDocLink(item)" v-for="(item, index) in jyPcDocRecommend"
-              :key="index">
-              <img :src="item.s_pic" :alt="item.s_remark">
+            <!-- 文库推荐广告位 -->
+            <div class="word-recommend-ad" v-if="jyPcDocRecommend && jyPcDocRecommend.length">
+              <div class="word-recommend-ad-list" @click.stop="onDocLink(item)" v-for="(item, index) in jyPcDocRecommend" :key="index">
+                <img :src="item.s_pic" :alt="item.s_remark">
+              </div>
             </div>
           </div>
-        </div>
       </div>
 
       <div class="hot-down-group">
-        <div class="flex-r-c">
-          <div class="title-group flex-r-c center left">
-            <h5>会员免费文档</h5>
-            <i class="el-icon-jy-Frame-1"></i>
+          <div class="flex-r-c">
+              <div class="title-group flex-r-c center left">
+                  <h5>会员免费文档</h5>
+                  <i class="el-icon-jy-Frame-1"></i>
+              </div>
           </div>
-        </div>
 
-        <div class="new-list-group flex-r-c">
-          <div class="flex flex-c-c">
-            <div class="list-item flex-r-c" v-for="item in hotList1" :key="item.id" @click="goContent(item)">
-              <div class="flex flex-r-c center left">
-                <i :class="'el-icon-jy-' + item.type" />
-                <div class="flex">
-                  <div class="van-ellipsis">{{ item.title }}</div>
+          <div class="new-list-group flex-r-c">
+            <div class="flex flex-c-c">
+              <div class="list-item flex-r-c" v-for="item in hotList1" :key="item.id" @click="goContent(item)">
+                <div class="flex flex-r-c center left">
+                  <i :class="'el-icon-jy-' + item.type" />
+                  <div class="flex">
+                    <div class="van-ellipsis">{{item.title}}</div>
+                  </div>
                 </div>
-              </div>
-              <div class="right-info flex-r-c center right">
-                <!-- <i class="el-icon-jy-iconJianYu" />
+                <div class="right-info flex-r-c center right">
+                  <!-- <i class="el-icon-jy-iconJianYu" />
                   <span>{{item.money}}</span> -->
+                </div>
               </div>
             </div>
-          </div>
-          <div class="flex flex-c-c">
-            <div class="list-item flex-r-c" v-for="item in hotList2" :key="item.id" @click="goContent(item)">
-              <div class="flex flex-r-c center left">
-                <i :class="'el-icon-jy-' + item.type" />
-                <div class="flex">
-                  <div class="van-ellipsis">{{ item.title }}</div>
+            <div class="flex flex-c-c">
+              <div class="list-item flex-r-c" v-for="item in hotList2" :key="item.id" @click="goContent(item)">
+                <div class="flex flex-r-c center left">
+                  <i :class="'el-icon-jy-' + item.type" />
+                  <div class="flex">
+                    <div class="van-ellipsis">{{item.title}}</div>
+                  </div>
                 </div>
-              </div>
-              <div class="right-info flex-r-c center right">
-                <!-- <i class="el-icon-jy-iconJianYu" />
+                <div class="right-info flex-r-c center right">
+                  <!-- <i class="el-icon-jy-iconJianYu" />
                   <span>{{item.money}}</span> -->
+                </div>
               </div>
             </div>
           </div>
-        </div>
       </div>
       <div class="bottom-group">
-        <selected-recommend :options="pageData.keep" @click="goContent"></selected-recommend>
+      <selected-recommend
+        :options="pageData.keep"
+        @click="goContent"
+      ></selected-recommend>
+      </div>
       </div>
-    </div>
-    </div>
   </div>
 </template>
 
@@ -205,11 +180,8 @@ export default {
       jyPcDocMember: [], // 文库会员广告位
       docsWordList: [],
       launchActive: false,
-<<<<<<< HEAD
+      canFold: false,
       in_Iframe: false
-=======
-      canFold: false
->>>>>>> master
     }
   },
   created () {
@@ -375,14 +347,10 @@ export default {
       getSearchTag().then(data => {
         const res = data.data
         if (res && res.error_code === 0) {
-<<<<<<< HEAD
-          this.wordModel = res.data.map((item, index) => ({ value: item, active: index === 0 }))
-=======
           this.wordModel = res.data.map((item, index) => ({ value: item, active: index === 0 ? true : false }))
           this.$nextTick(() => {
             this.checkIsOneRow()
           })
->>>>>>> master
           const localList = this.getLocalData(this.wordModel[0].value)
           if (localList && localList.length) {
             this.wordFileList = localList.map((v) => formatData(v))
@@ -433,15 +401,15 @@ export default {
 }
 </script>
 <style lang="scss">
-.page--docs--index.view_index {
-  .page-container {
-    background-image: url("~@/assets/images/wenkuBanner.png");
-    background-repeat: no-repeat;
-    background-color: #fff;
-    background-size: 100% 310px;
+  .page--docs--index.view_index {
+    .page-container {
+      background-image: url("~@/assets/images/wenkuBanner.png");
+      background-repeat: no-repeat;
+      background-color: #fff;
+      background-size: 100% 310px;
+    }
   }
-}
-.page--docs--index.view_index.in-iframe {
+  .page--docs--index.view_index.in-iframe {
     .page-container {
        background:rgb(242, 242, 244) !important;
        background-image: none;
@@ -449,438 +417,228 @@ export default {
 }
 </style>
 <style scoped lang="scss">
-.pages--home {
-  padding-bottom: 40px;
-  box-sizing: border-box;
-
-  @include diy-icon('iconJianYu', 24, 24);
-
-  @include diy-icon('pdf', 24);
-  @include diy-icon('word', 24);
-  @include diy-icon('excel', 24);
-  @include diy-icon('ppt', 24);
-  @include diy-icon('txt', 24);
-
-  .group-content {
-    padding-top: 1px;
-  }
-  .center-contentbox{
-    margin: auto;
-  }
-
-  .list-item {
-    cursor: pointer;
-    padding: 18px 0;
+  .pages--home {
+    padding-bottom: 40px;
     box-sizing: border-box;
-    border-bottom: 1px solid #ececec;
-
-    &:hover {
-      color: #2CB7CA;
-    }
-
-    &:last-child {
-      border-bottom-color: transparent;
-    }
-
-    i {
-      flex-shrink: 0;
-      margin-right: 4px;
-    }
 
-    .flex {
-      min-width: 0;
-    }
+    @include diy-icon('iconJianYu', 24, 24);
 
-    .right-info {
-      margin-left: 4px;
-      flex-shrink: 0;
-      color: #1D1D1D;
-      font-family: Microsoft YaHei;
-      font-size: 16px;
-      letter-spacing: 0px;
-      text-align: right;
-    }
+    @include diy-icon('pdf', 24);
+    @include diy-icon('word', 24);
+    @include diy-icon('excel', 24);
+    @include diy-icon('ppt', 24);
+    @include diy-icon('txt', 24);
+    .center-contentbox{
+      padding-top: 1px;
+    margin: auto;
   }
-
-  .card-item {
-    cursor: pointer;
-    justify-content: flex-start;
-    padding: 8px 16px 12px 0;
-    box-sizing: border-box;
-
-    &:hover {
-      .title-text {
-        color: #2ABED1;
+    .list-item {
+      cursor: pointer;
+      padding: 18px 0;
+      box-sizing: border-box;
+      border-bottom: 1px solid #ececec;
+      &:hover {
+        color: #2CB7CA;
       }
-    }
-
-    .money-group {
-      margin-top: 8px;
-      font-size: 14px;
-      line-height: 22px;
-      color: #999999;
-    }
-
-    .mini-img-group {
-      flex-shrink: 0;
-      position: relative;
-      border-radius: 4px;
-      border: 1px solid #ececec;
-      width: 100px;
-      height: 124px;
-      margin-right: 12px;
-      overflow: hidden;
-      display: flex;
-      flex-direction: row;
-      align-items: center;
-      justify-content: center;
-
-      img {
-        width: 100%;
+      &:last-child {
+        border-bottom-color: transparent;
       }
 
       i {
-        position: absolute;
-        right: 0;
-        bottom: 0;
+        flex-shrink: 0;
+        margin-right: 4px;
       }
-    }
-
-    .info-text-group {
-      span {
-        display: inline-block;
-
-        &:last-child {
-          &::after {
-            content: unset;
-          }
-        }
-
-        &::after {
-          content: "|";
-          padding: 0 8px;
-          color: #ececec;
-        }
+      .flex {
+        min-width: 0;
+      }
+      .right-info {
+        margin-left: 4px;
+        flex-shrink: 0;
+        color: #1D1D1D;
+        font-family: Microsoft YaHei;
+        font-size: 16px;
+        letter-spacing: 0px;
+        text-align: right;
       }
     }
-
-    .info-text {
-      font-family: Microsoft YaHei;
-      font-style: normal;
-      font-weight: normal;
-      font-size: 14px;
-      line-height: 24px;
-      color: #999999;
-    }
-
-    .red-text {
-      color: #FF3A20;
-      font-family: Microsoft YaHei;
-      font-style: normal;
-      font-weight: normal;
-      font-size: 18px;
-      line-height: 28px;
-    }
-
-    .title-text {
-      font-family: Microsoft YaHei;
-      font-style: normal;
-      font-weight: normal;
-      font-size: 16px;
-      line-height: 24px;
-      color: #1D1D1D;
-    }
-  }
-
-  .van-ellipsis {
-    overflow: hidden;
-    white-space: nowrap;
-    text-overflow: ellipsis;
-  }
-
-  .van-multi-ellipsis--l2 {
-    display: -webkit-box;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    -webkit-line-clamp: 2;
-    -webkit-box-orient: vertical;
-  }
-  .hot-keep-group {
     .card-item {
-      width: 279px;
-      overflow: hidden;
-    }
-  }
-
-}
-
-@include diy-icon('search', 24);
-@include diy-icon('Frame', 24);
-@include diy-icon('Frame-1', 24);
-
-.new-group {
-  margin-top: 54px;
-
-  .flex-c-c {
-    padding-right: 24px;
-    box-sizing: border-box;
-
-    &+.flex-c-c {
-      padding-right: 0;
-      padding-left: 24px;
-    }
-  }
-}
-
-.hot-down-group {
-  border-radius: 12px;
-  background: radial-gradient(circle at 50% 50%, #FAEACD 0%, #FFF8EA 100%);
-  background-image: url("~@/assets/images/dateGetBg.png");
-  background-repeat: no-repeat;
-
-  background-size: 100% 100%;
-  width: 100%;
-  height: auto;
-  padding: 24px;
-  padding-bottom: 34px;
-  box-sizing: border-box;
-  margin-top: 40px;
-
-  .title-group h5 {
-    color: #863700;
-  }
-
-  .new-list-group {
-    background-color: white;
-    border-radius: 8px;
-
-    .flex-c-c {
-      padding: 20px;
-      box-sizing: border-box;
-    }
-  }
-}
-
-.title-group {
-  margin-bottom: 16px;
-
-  h5 {
-    color: #1D1D1D;
-    font-family: Microsoft YaHei;
-    font-size: 18px;
-    font-weight: 400;
-    line-height: 28px;
-    letter-spacing: 0px;
-    text-align: left;
-    margin-right: 9px;
-  }
-}
-
-.top-search-group {
-  width: 100%;
-  height: 246px;
-  background-color: transparent;
-  margin: 0 auto;
-
-  h1 {
-    color: #1D1D1D;
-    font-family: Microsoft YaHei;
-    font-weight: 300;
-    font-size: 40px;
-    line-height: normal;
-    letter-spacing: 0px;
-    text-align: center;
-    margin: 42px 0 24px;
-  }
-}
-
-.new-list-group {
-  .word-file-main {
-    display: flex;
-    justify-content: flex-start;
-    margin-top: 10px;
-
-    .word-file-list {
-      margin-left: 16px;
-      width: 136px;
-      height: 240px;
       cursor: pointer;
+      justify-content: flex-start;
+      padding: 8px 16px 12px 0;
+      box-sizing: border-box;
 
-      &:first-child {
-        margin-left: 0;
+      &:hover {
+        .title-text {
+          color: #2ABED1;
+        }
       }
 
+      .money-group {
+        margin-top: 8px;
+        font-size: 14px;
+        line-height: 22px;
+        color: #999999;
+      }
       .mini-img-group {
+        flex-shrink: 0;
         position: relative;
-
-        .word-type {
-          position: absolute;
-          right: 4px;
-          bottom: 2px;
+        border-radius: 4px;
+        border: 1px solid #ececec;
+        width: 100px;
+        height: 124px;
+        margin-right: 12px;
+        overflow: hidden;
+        display: flex;
+        flex-direction: row;
+        align-items: center;
+        justify-content: center;
+        img {
+          width: 100%;
         }
-
-        .word-vip-mark {
+        i {
           position: absolute;
-          left: 0;
-          top: 0;
-          padding: 2px 5px;
-          font-size: 11px;
-          line-height: 14px;
-          color: #fff;
-          border-radius: 4px 0px 9px 0px;
-          background: linear-gradient(to right, #FF7C32 0%, #F33838 100%);
+          right: 0;
+          bottom: 0;
         }
-
-        &>img {
-          width: 100%;
-          height: 184px;
-          border: 1px solid #ECECEC;
-          border-radius: 4px;
+      }
+      .info-text-group {
+        span {
+          display: inline-block;
+          &:last-child {
+            &::after {
+              content: unset;
+            }
+          }
+          &::after {
+            content: "|";
+            padding: 0 8px;
+            color: #ececec;
+          }
         }
       }
-
-      .word-file-name {
-        display: -webkit-box;
-        -webkit-line-clamp: 2;
-        /* 控制显示的行数 */
-        -webkit-box-orient: vertical;
-        margin-top: 8px;
-        overflow: hidden;
-        text-overflow: ellipsis;
-        word-break: break-all;
+      .info-text {
+        font-family: Microsoft YaHei;
+        font-style: normal;
+        font-weight: normal;
+        font-size: 14px;
+        line-height: 24px;
+        color: #999999;
+      }
+      .red-text {
+        color: #FF3A20;
+        font-family: Microsoft YaHei;
+        font-style: normal;
+        font-weight: normal;
+        font-size: 18px;
+        line-height: 28px;
+      }
+      .title-text {
+        font-family: Microsoft YaHei;
+        font-style: normal;
+        font-weight: normal;
         font-size: 16px;
         line-height: 24px;
         color: #1D1D1D;
       }
     }
-  }
 
-  .word-file-ad {
-    margin-top: 20px;
-    height: 80px;
-    border-radius: 8px;
-    overflow: hidden;
-    cursor: pointer;
+    .van-ellipsis {
+      overflow: hidden;
+      white-space: nowrap;
+      text-overflow: ellipsis;
+    }
 
-    .el-carousel {
-      img {
-        width: 100%;
-        height: 100%;
-      }
+    .van-multi-ellipsis--l2 {
+      display: -webkit-box;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      -webkit-line-clamp: 2;
+      -webkit-box-orient: vertical;
 
-      ::v-deep {
-        .el-carousel__indicator {
-          padding: 10px;
-        }
+    }
 
-        .el-carousel__button {
-          width: 6px;
-          height: 6px;
-        }
+    .hot-keep-group {
+      .card-item {
+        width: 279px;
+        overflow: hidden;
       }
     }
-  }
-
-  .word-recommend-ad {
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    margin-top: 20px;
-    height: 160px;
 
-    .word-recommend-ad-list {
-      width: 285px;
-      height: 100%;
-      border-radius: 8px;
-      overflow: hidden;
-      cursor: pointer;
-      &>img {
-        width: 100%;
-        height: 100%;
+  }
+    @include diy-icon('search', 24);
+    @include diy-icon('Frame', 24);
+    @include diy-icon('Frame-1', 24);
+
+    .new-group {
+        margin-top: 54px;
+      .flex-c-c {
+        padding-right: 24px;
+        box-sizing: border-box;
+        & + .flex-c-c {
+          padding-right: 0;
+          padding-left: 24px;
+        }
       }
     }
-  }
 
-  .word-model {
-    display: flex;
-    justify-content: space-between;
+    .hot-down-group {
+        border-radius: 12px;
+        background: radial-gradient(circle at 50% 50%, #FAEACD 0%, #FFF8EA 100%);
+        background-image: url("~@/assets/images/dateGetBg.png");
+        background-repeat: no-repeat;
 
-    .word-model-content {
-      flex: 1;
-      display: flex;
-      flex-wrap: wrap;
-
-      .word-model-list {
-        margin: 0 10px 10px 0;
-        padding: 2px 8px;
-        color: #686868;
-        font-size: 14px;
-        border-radius: 4px;
-        line-height: 22px;
-        cursor: pointer;
-
-        &.active {
-          background: #2ABED1;
-          color: #fff;
+        background-size: 100% 100%;
+        width: 100%;
+        height: auto;
+        padding: 24px;
+        padding-bottom: 34px;
+        box-sizing: border-box;
+        margin-top: 40px;
+
+      .title-group h5 {
+          color: #863700;
         }
-      }
 
-      &.launch-alone {
-        height: 26px;
-        overflow: hidden;
-      }
+        .new-list-group {
+            background-color: white;
+            border-radius: 8px;
+          .flex-c-c {
+            padding: 20px;
+            box-sizing: border-box;
+          }
+        }
     }
 
-    .word-model-more {
-      width: 44px;
-      font-size: 14px;
-      line-height: 22px;
-      color: #1D1D1D;
-      cursor: pointer;
+    .title-group {
+        margin-bottom: 16px;
+        h5 {
+            color: #1D1D1D;
+            font-family: Microsoft YaHei;
+            font-size: 18px;
+            font-weight: 400;
+            line-height: 28px;
+            letter-spacing: 0px;
+            text-align: left;
+            margin-right: 9px;
+        }
     }
-  }
-
-  >.flex {
-    max-width: 50%;
-  }
 
-  &.must-bottom {
-    .list-item:last-child {
-      border-bottom-color: #ececec;
+    .top-search-group {
+      width: 100%;
+      height: 246px;
+      background-color: transparent;
+      h1 {
+        color: #1D1D1D;
+        font-family: Microsoft YaHei;
+        font-weight: 300;
+        font-size: 40px;
+        line-height: normal;
+        letter-spacing: 0px;
+        text-align: center;
+        margin: 42px 0 24px;
+      }
     }
-  }
-}
 
-<<<<<<< HEAD
-.in-app {
-  .word-file-list{
-   height: auto;
-  }
-  .word-recommend-ad{
-    height: auto;
-  }
-  .top-search-group {
-    height: 136px;
-    // background-image: url("~@/assets/images/wenkuBanner.png");
-    background-image: none;
-    background: linear-gradient(180deg, #B7F0FB 0%, #D5E8FF 100%);
-    background-size: cover;
-    background-repeat: no-repeat;
-    background-position: center;
-    border-radius: 8px;
-    .centerBox{
-      width: 988px;
-      height: 100%;
-      margin: 0 auto;
-      background-image: url("~@/assets/images/wkbg.png");
-      background-repeat: no-repeat;
-      background-position: center;
-      background-size: contain;
-      ::v-deep{
-        .search-input .el-input__inner{
-          border-radius: 8px 0 0 8px;
-          border: none;
-=======
     .new-list-group {
       .word-file-main{
         display: flex;
@@ -1004,7 +762,55 @@ export default {
             height: 26px;
             overflow: hidden;
           }
->>>>>>> master
+        }
+        .word-model-more{
+          width: 44px;
+          font-size: 14px;
+          line-height: 22px;
+          color: #1D1D1D;
+          cursor: pointer;
+        }
+      }
+        > .flex {
+          max-width: 50%;
+        }
+      &.must-bottom {
+        .list-item:last-child {
+          border-bottom-color: #ececec;
+        }
+      }
+    }
+    .in-app {
+  .word-file-list{
+   height: auto !important;
+  }
+  .word-recommend-ad{
+    height: auto !important;
+  }
+  .mini-img{
+    height: auto;
+  }
+  .top-search-group {
+    height: 136px;
+    // background-image: url("~@/assets/images/wenkuBanner.png");
+    background-image: none;
+    background: linear-gradient(180deg, #B7F0FB 0%, #D5E8FF 100%);
+    background-size: cover;
+    background-repeat: no-repeat;
+    background-position: center;
+    border-radius: 8px;
+    .centerBox{
+      width: 988px;
+      height: 100%;
+      margin: 0 auto;
+      background-image: url("~@/assets/images/wkbg.png");
+      background-repeat: no-repeat;
+      background-position: center;
+      background-size: contain;
+      ::v-deep{
+        .search-input .el-input__inner{
+          border-radius: 8px 0 0 8px;
+          border: none;
         }
         .search-input .el-input-group__append{
           border-radius: 0 8px 8px 0;