feat: 我的文库，文库收藏页面功能调整

Signed-off-by: tangshizhe <48740614+tangshizhe@users.noreply.github.com>

jydocs-pc/src/components/Search.vue

@@ -1,16 +1,16 @@
 <template>
-    <div class="search-input">
-        <el-input
-                placeholder="搜索文档"
-                v-model="input"
-                @keyup.enter.native="submitSearch('onEnter')"
-                clearable>
-            <el-button @click="submitSearch('onSubmit')" slot="append" icon="el-icon-jy-search"></el-button>
-        </el-input>
-        <el-tabs v-model="type" v-show="tabs.length" @tab-click="submitSearch('onChangeType')">
-          <el-tab-pane v-for="item in tabs" :key="item.type" :label="item.label" :name="item.type"></el-tab-pane>
-        </el-tabs>
-    </div>
+  <div class="search-input">
+      <el-input
+              placeholder="搜索文档"
+              v-model="input"
+              @keyup.enter.native="submitSearch('onEnter')"
+              clearable>
+          <el-button @click="submitSearch('onSubmit')" slot="append" icon="el-icon-jy-search"></el-button>
+      </el-input>
+      <!-- <el-tabs v-model="type" v-show="tabs.length" @tab-click="submitSearch('onChangeType')">
+        <el-tab-pane v-for="item in tabs" :key="item.type" :label="item.label" :name="item.type"></el-tab-pane>
+      </el-tabs> -->
+  </div>
 </template>
 
 <script>
@@ -19,123 +19,122 @@ import { getSearchTag } from '../api/modules/home'
 import { recoveryPageData } from '../utils'
 
 export default {
-  name: 'Search-Input',
-  props: {
-    msg: String
-  },
-  components: {
-    [Input.name]: Input,
-    [Tabs.name]: Tabs,
-    [TabPane.name]: TabPane,
-    [Button.name]: Button
-  },
-  data () {
-    return {
-      input: '',
-      type: '全部',
-      tabs: []
-    }
-  },
-  mounted () {
-    this.tabs = recoveryPageData('jy-docs-search-tags-pc')
-    this.getTags()
-    const qUrl = this.$route.query
-    qUrl && qUrl.type && (this.type = qUrl.type)
-    if (qUrl && qUrl.text) {
-      this.input = qUrl.text
-      this.$emit('recovery', {
-        type: this.type,
-        text: this.input.trim().replace(/\s+/g, ' ')
-      })
-    }
+name: 'Search-Input',
+props: {
+  msg: String
+},
+components: {
+  [Input.name]: Input,
+  [Tabs.name]: Tabs,
+  [TabPane.name]: TabPane,
+  [Button.name]: Button
+},
+data () {
+  return {
+    input: '',
+    // type: '全部',
+    // tabs: []
+  }
+},
+mounted () {
+  // this.tabs = recoveryPageData('jy-docs-search-tags-pc')
+  // this.getTags()
+  const qUrl = this.$route.query
+  qUrl && qUrl.type && (this.type = qUrl.type)
+  if (qUrl && qUrl.text) {
+    this.input = qUrl.text
+    this.$emit('recovery', {
+      type: this.type,
+      text: this.input.trim().replace(/\s+/g, ' ')
+    })
+  }
+},
+methods: {
+  // async getTags () {
+  //   getSearchTag().then(res => {
+  //     if (!res.data.error_msg.length) {
+  //       this.tabs = res.data.data.map(v => {
+  //         return {
+  //           type: v,
+  //           label: v
+  //         }
+  //       })
+  //       if (this.type === '') {
+  //         this.type = this.tabs[0].type
+  //       }
+  //       sessionStorage.setItem('jy-docs-search-tags-pc', JSON.stringify(this.tabs))
+  //     }
+  //   })
+  // },
+  setSearchContent: function (v) {
+    this.input = v
   },
-  methods: {
-    async getTags () {
-      getSearchTag().then(res => {
-        if (!res.data.error_msg.length) {
-          this.tabs = res.data.data.map(v => {
-            return {
-              type: v,
-              label: v
-            }
-          })
-          if (this.type === '') {
-            this.type = this.tabs[0].type
-          }
-          sessionStorage.setItem('jy-docs-search-tags-pc', JSON.stringify(this.tabs))
-        }
-      })
-    },
-    setSearchContent: function (v) {
-      this.input = v
-    },
-    submitSearch (e) {
-      this.$emit('submit', {
-        type: this.type,
-        text: this.input.trim().replace(/\s+/g, ' '),
-        events: e
-      })
-    }
+  submitSearch (e) {
+    this.$emit('submit', {
+      text: this.input.trim().replace(/\s+/g, ' '),
+      events: e
+    })
   }
 }
+}
 </script>
 
 <style scoped lang="scss">
-    .search-input {
-        width: 640px;
-        margin: 0 auto;
-        @include diy-icon('search', 24);
-        ::v-deep .el-tabs__nav-wrap::after {
-          background-color: transparent;
-        }
-        ::v-deep .el-tabs__item {
-          height: 48px;
-          line-height: 48px;
-          font-size: 14px;
-          color: #686868;
-        }
-      ::v-deep .el-tabs__active-bar {
-        background-color: #2CB7CA;
-      }
-      ::v-deep .el-tabs__item.is-active {
-        color: #2CB7CA;
+  .search-input {
+      width: 640px;
+      margin: 0 auto;
+      @include diy-icon('search', 24);
+      ::v-deep .el-tabs__nav-wrap::after {
+        background-color: transparent;
       }
-      ::v-deep .el-tabs--bottom .el-tabs__item.is-bottom:nth-child(2),
-      ::v-deep .el-tabs--bottom .el-tabs__item.is-top:nth-child(2),
-      ::v-deep .el-tabs--top .el-tabs__item.is-bottom:nth-child(2),
-      ::v-deep .el-tabs--top .el-tabs__item.is-top:nth-child(2) {
-        padding-left: 20px;
-      }
-
-      ::v-deep .el-tabs--bottom .el-tabs__item.is-bottom:last-child,
-      ::v-deep .el-tabs--bottom .el-tabs__item.is-top:last-child,
-      ::v-deep .el-tabs--top .el-tabs__item.is-bottom:last-child,
-      ::v-deep .el-tabs--top .el-tabs__item.is-top:last-child {
-        padding-right: 20px;
+      ::v-deep .el-tabs__item {
+        height: 48px;
+        line-height: 48px;
+        font-size: 14px;
+        color: #686868;
       }
+    ::v-deep .el-tabs__active-bar {
+      background-color: #2CB7CA;
+    }
+    ::v-deep .el-tabs__item.is-active {
+      color: #2CB7CA;
+    }
+    ::v-deep .el-tabs--bottom .el-tabs__item.is-bottom:nth-child(2),
+    ::v-deep .el-tabs--bottom .el-tabs__item.is-top:nth-child(2),
+    ::v-deep .el-tabs--top .el-tabs__item.is-bottom:nth-child(2),
+    ::v-deep .el-tabs--top .el-tabs__item.is-top:nth-child(2) {
+      padding-left: 20px;
+    }
 
-        ::v-deep .el-input__inner {
-            border-radius: 22px 0 0 22px;
-            background: #FFFFFF;
-            border: 1px solid #E0E0E0;
-            padding-left: 24px;
-            color: #1D1D1D;
-            font-family: Microsoft YaHei;
-            font-size: 16px;
-            line-height: 24px;
-            height: 42px;
-        }
-        ::v-deep .el-input-group__append {
-            height: 42px;
-            box-sizing: border-box;
-            text-align: center;
-            border: none;
-            border-radius: 0px 22px 22px 0px;
-            background: #2CB7CA;
-            .el-button {
-              padding: 8px 24px;
-              margin-top: -4px;
-            }
-        }
+    ::v-deep .el-tabs--bottom .el-tabs__item.is-bottom:last-child,
+    ::v-deep .el-tabs--bottom .el-tabs__item.is-top:last-child,
+    ::v-deep .el-tabs--top .el-tabs__item.is-bottom:last-child,
+    ::v-deep .el-tabs--top .el-tabs__item.is-top:last-child {
+      padding-right: 20px;
     }
+
+      ::v-deep .el-input__inner {
+          border-radius: 22px 0 0 22px;
+          background: #FFFFFF;
+          border: 1px solid #E0E0E0;
+          padding-left: 24px;
+          color: #1D1D1D;
+          font-family: Microsoft YaHei;
+          font-size: 16px;
+          line-height: 24px;
+          height: 42px;
+      }
+      ::v-deep .el-input-group__append {
+          height: 42px;
+          box-sizing: border-box;
+          text-align: center;
+          border: none;
+          border-radius: 0px 22px 22px 0px;
+          background: #2CB7CA;
+          .el-button {
+            padding: 8px 24px;
+            margin-top: -4px;
+          }
+      }
+  }
 </style>

jydocs-pc/src/components/doc-item-card/Card.vue

@@ -56,9 +56,12 @@
             v-for="(item, index) in subInfo"
             :key="index"
           >{{ item }}</span>
+          <span class="vip_mark" v-if="productType === 0">会员免费</span>
         </div>
         <div class="c-f-right flex-r-c">
-          <slot name="price"><Price :price="price" /></slot>
+          <slot name="price">
+            <!-- <Price :price="price" /> -->
+          </slot>
         </div>
       </div>
     </div>
@@ -82,6 +85,10 @@ export default {
       type: String,
       default: ''
     },
+    productType: {
+      type: Number,
+      default: 0
+    },
     highlightKey: {
       type: Array,
       default () {
@@ -219,6 +226,14 @@ export default {
         background-color: rgba($color: #000, $alpha: 0.05);
       }
     }
+    .vip_mark{
+      padding: 1px 8px;
+      background: linear-gradient(to right, #FFA674 0%,#F01212 100%);
+      color: #fff;
+      font-size: 12px;
+      border-radius: 4px;
+      line-height: 18px;
+    }
   }
 
   .image-container {

jydocs-pc/src/components/filters-item/SelectCard.vue

@@ -0,0 +1,157 @@
+<template>
+  <div class="common-checkbox-selector">
+    <div class="j-checkbox-label">{{ labelText }}：</div>
+    <el-checkbox-group
+      class="j-checkbox-group"
+      :value="list"
+      @input="onIssueStateChange"
+    >
+      <el-checkbox-button class="j-checkbox-button" label="全部"
+        >全部</el-checkbox-button
+      >
+      <el-checkbox-button
+        class="j-checkbox-button"
+        v-for="(state, index) in options"
+        :key="index"
+        :label="setSelectValue(state)"
+      >
+        {{ field ? state.label : state }}
+      </el-checkbox-button>
+    </el-checkbox-group>
+  </div>
+</template>
+
+<script>
+  import { CheckboxGroup, Checkbox, CheckboxButton } from 'element-ui'
+  export default {
+    name:'select-card',
+    components: {
+      [CheckboxGroup.name]: CheckboxGroup,
+      [Checkbox.name]: Checkbox,
+      [CheckboxButton.name]: CheckboxButton
+    },
+    props: {
+      // 是否单选
+      single: {
+        type: Boolean,
+        default: false
+      },
+      // field: 空代表字符串数组
+      // 其他: options是对象数组，field是对象数组的某个字段
+      field: {
+        type: String,
+        default: ''
+      },
+      options: {
+        type: Array,
+        default: () => []
+      },
+      value: {
+        type: Array,
+        default: () => []
+      },
+      labelText: {
+        type: String,
+        default: ''
+      }
+    },
+    data() {
+      return {
+        list: []
+      }
+    },
+    mounted() {
+      if (!this.value.length) {
+        this.list = ['全部']
+      } else {
+        this.list = this.value
+      }
+    },
+    methods: {
+      setSelectValue(state) {
+        return this.field === '' ? state : state[this.field];
+      },
+      onIssueStateChange(value) {
+        const isAllBtn = value.filter((item, i) => item === '全部' && i !== 0)
+        if (isAllBtn.length > 0) {
+          value = ['全部']
+        } else {
+          // 如果是单选，则只取最新一个
+          if (this.single) {
+            const nonAllValues = value.filter((item) => item !== '全部')
+            value = nonAllValues.length
+              ? [nonAllValues[nonAllValues.length - 1]]
+              : ['全部']
+          } else {
+            value = value.filter((item) => item !== '全部')
+            if (value.length === 0) {
+              value = ['全部']
+            }
+          }
+        } 
+        this.list = value
+        if (value.length === 1 && value[0] === '全部') {
+          this.$emit('input', [])
+        } else {
+          this.$emit('input', value)
+        }
+      }
+    }
+  }
+</script>
+
+<style lang="scss" scoped>
+.common-checkbox-selector {
+  display: flex;
+  align-items: center;
+  .j-checkbox-label {
+    font-size: 14px;
+    line-height: 22px;
+    color: #686868;
+  }
+  .j-checkbox-group{
+    display: flex;
+    align-items: center
+  }
+  .j-checkbox-button {
+    margin: 0 10px 0 0;
+    ::v-deep{
+      .el-checkbox-button__inner {
+        line-height: 22px;
+        border: none;
+        border-color: transparent;
+        border-radius: 4px;
+        padding: 2px 6px;
+        &:hover{
+          background: #2abed1;
+          color: #fff
+        }
+      }
+    }
+    
+    &.is-active {
+      .el-checkbox-button__inner {
+        border-color: #2abed1;
+      }
+    }
+    
+  }
+  .j-checkbox-button:first-child,
+  .j-checkbox-button:last-child {
+    :v-deep{
+      .el-checkbox-button__inner {
+        border-color: transparent;
+        border-radius: 4px;
+        padding: 2px 6px;
+      }
+    }
+  }
+  .el-checkbox-button__inner {
+    color: #1d1d1d;
+  }
+  .el-checkbox-button.is-focus .el-checkbox-button__inner {
+    border: none;
+    border-color: transparent;
+  }
+}
+</style>

jydocs-pc/src/components/recommend.vue

@@ -17,7 +17,7 @@
                   <p>{{item.docFileSize}}</p>
                 </div>
             </div>
-            <div class="r-coin"><i class="el-icon-jy-iconJianYu"></i><span>{{item.price}}</span></div>
+            <!-- <div class="r-coin"><i class="el-icon-jy-iconJianYu"></i><span>{{item.price}}</span></div> -->
         </div>
     </div>
 </div>
@@ -110,7 +110,7 @@ export default {
     .docs {
         display: flex;
         .imgs {
-            height: 110px;
+            height: 90px;
             display: table;
             position: relative;
             border-radius: 4px;
@@ -150,6 +150,7 @@ export default {
             .d-tip {
                 display: flex;
                 flex-direction: column;
+                margin-top: 8px;
                 .el-divider--vertical {
                     height: 0.8em;
                     margin: 0 2px;

jydocs-pc/src/views/Content.vue

@@ -17,14 +17,10 @@
             <li>{{ datas.docFileSize }}<el-divider direction="vertical"></el-divider></li>
             <li class="no-line">{{ datas.uploadDate }}上传</li>
           </ul>
-          <div class="coin"><i class="el-icon-jy-iconJianYu"></i><span>{{ datas.price }}</span></div>
+          <!-- <div class="coin"><i class="el-icon-jy-iconJianYu"></i><span>{{ datas.price }}</span></div> -->
         </div>
-        <div class="buyed" v-if="buyed == 1">您已兑换过该文档，可直接下载</div>
-        <div class="buyed no-buyed" v-if="redShow && islogin">剑鱼币余额不足，现有 {{ coinNum }} 剑鱼币，还需 {{ datas.price - coinNum }}
-          剑鱼币，请先充值</div>
         <el-divider class="heng-line" v-if="lineShow"></el-divider>
-        <div class="load-doc">
-          <el-button type="primary" @click="loadFile">{{ islogin ? btnName : '查看详情' }}</el-button>
+        <!-- <div class="load-doc">
           <div class="icons">
             <el-tooltip placement="bottom" effect="light" popper-class="f-share">
               <span class="spa1"><i class="el-icon-jy-share"></i>分享</span>
@@ -37,10 +33,10 @@
                 :class="collectd == 1 ? 'el-icon-jy-guanzhu' : 'el-icon-jy-weiguanzhu'"></i>{{ collectd == 1 ? '已收藏' :
                   '收藏' }}</span>
             <el-tooltip content="如果您发现此内容有侵权行为，请联系客服400-108-6670进行投诉" placement="top" effect="dark">
-              <span class="spa1"><i class="el-icon-jy-jubao"></i>投诉</span>
+              <span class="spa1"><i class="el-icon-jy-jubao"></i>投诉举报</span>
             </el-tooltip>
           </div>
-        </div>
+        </div> -->
       </div>
       <div class="middles" :class="{ 'actives': buyed == 0, 'actives1': lineShow == 1 }">
         <h3>摘要</h3>
@@ -55,9 +51,15 @@
         </h3>
         <span class="pages"><i>{{ page_num }}</i> / <i>{{ page_count }}</i></span>
       </div>
-      <div class="bottoms" id="colWidth" v-show="buyed == 1">
+      <div class="bottoms" id="colWidth">
         <div class="page">
-          <div class="cont-p" id="pdfPage"></div>
+          <div class="cont-p" id="pdfPage">
+            <!-- <div class="buyed" v-if="buyed == 1">您已兑换过该文档，可直接下载</div>
+            <div class="buyed no-buyed" v-if="redShow && islogin">剑鱼币余额不足，现有 {{ coinNum }} 剑鱼币，还需 {{ datas.price - coinNum }}
+              剑鱼币，请先充值
+            </div> -->
+          </div>
+          
         </div>
         <div class="foot-tip tops" id="footp">
           <div class="load-doc">
@@ -73,7 +75,7 @@
                   :class="collectd == 1 ? 'el-icon-jy-guanzhu' : 'el-icon-jy-weiguanzhu'"></i>{{ collectd == 1 ? '已收藏' :
                     '收藏' }}</span>
               <el-tooltip content="如果您发现此内容有侵权行为，请联系客服400-108-6670进行投诉" placement="top" effect="dark">
-                <span class="spa1"><i class="el-icon-jy-jubao"></i>投诉</span>
+                <span class="spa1"><i class="el-icon-jy-jubao"></i>投诉举报</span>
               </el-tooltip>
             </div>
             <el-button type="primary" @click="loadFile">{{ islogin ? btnName : '查看详情' }}</el-button>
@@ -436,6 +438,7 @@ export default {
 @include diy-icon('iconJianYu', 24);
 
 .c-details {
+  position: relative;
   width: 1200px;
   display: flex;
   flex-direction: initial;
@@ -538,7 +541,7 @@ export default {
       }
 
       .load-doc {
-        height: 52px;
+        height: 69px;
         display: flex;
         justify-content: space-between;
         align-items: center;
@@ -681,6 +684,8 @@ export default {
     }
 
     .bottoms {
+      position: fixed;
+      bottom: 0;
       display: flex;
       flex-direction: column;
 
@@ -701,7 +706,7 @@ export default {
 
         .load-doc {
           height: 100%;
-          justify-content: flex-end;
+          // justify-content: flex-end;
 
           .spa2 {
             cursor: pointer;

jydocs-pc/src/views/Home.vue

@@ -8,13 +8,28 @@
       <div class="new-group">
           <div class="flex-r-c">
               <div class="title-group flex-r-c center left">
-                  <h5>最新文档</h5>
-                  <i class="el-icon-jy-Frame"></i>
+                  <h5>热门文档</h5>
+                  <!-- <i class="el-icon-jy-Frame"></i> -->
               </div>
           </div>
 
-          <div class="new-list-group must-bottom flex-r-c">
-              <div class="flex flex-c-c">
+          <div class="new-list-group must-bottom">
+            <div class="word-model">
+              <div class="word-model-content">
+                <div class="word-model-list" @mouseenter="onSetWordModel(item, true)" @mouseleave="onSetWordModel(item, false)" :class="{'active': item.active}" v-for="(item, index) in wordModel" :key="index">
+                  {{item.value}}
+                </div>
+              </div>
+            </div>
+            <div class="word-file-main">
+              <div class="word-file-list card-item" v-for="(item, index) in wordFileList" :key="index">
+                <div class="mini-img-group">
+                  <img :src="item.previewImgId" alt="">
+                  <i :class="'el-icon-jy-' + item.type" ></i>
+                </div>
+              </div>
+            </div>
+              <!-- <div class="flex flex-c-c">
                 <div class="list-item flex-r-c" v-for="item in newList1" :key="item.id" @click="goContent(item)">
                   <div class="flex flex-r-c center left">
                     <i :class="'el-icon-jy-' + item.type" />
@@ -41,7 +56,7 @@
                     <span>{{item.money}}</span>
                   </div>
                 </div>
-              </div>
+              </div> -->
           </div>
       </div>
 
@@ -123,7 +138,8 @@
 <script>
 import { Button } from 'element-ui'
 import SearchInput from '../components/Search'
-import { getHomeActivity, getHomeHot } from '../api/modules/home'
+import { getHomeActivity, getHomeHot, getSearchTag } from '../api/modules/home'
+import { getSearch } from '../api/modules/search'
 import { recoveryPageData } from '../utils'
 
 function checkType (type) {
@@ -180,7 +196,9 @@ export default {
   data () {
     return {
       fullscreenLoading: false,
-      pageData: {}
+      pageData: {},
+      wordModel: [],
+      wordFileList: []
     }
   },
   created () {
@@ -218,6 +236,34 @@ export default {
       })
       window.open(routeData.href, '_blank')
     },
+    onSetWordModel(data, isHover) {
+      this.wordModel.forEach(v => {
+        v.active = false
+      });
+      if(isHover) {
+        data.active = true;
+        this.getSearchEvent(data.value)
+      } else {
+        setTimeout(() => {
+          const findItemActive = this.wordModel.find(v => v.active)
+          console.log(findItemActive, 'findItemActive')
+          if(!findItemActive) {
+            this.wordModel[0].active = true;
+            this.getSearchEvent(this.wordModel[0].value)
+          }
+        }, 300)
+      }
+    },
+    // 获取文件列表
+    async getSearchEvent (type) {
+      const _this = this
+      getSearch({tag: type, sort: 'vSort', num: 1, size: 8}).then(data => {
+        const res = data.data
+        if(res && res.error_code === 0) {
+          _this.wordFileList = res.data
+        }
+      })
+    },
     async getHome () {
       getHomeHot({ sign: 'new', num: 10 }).then(res => {
         if (!res.data.error_msg.length) {
@@ -234,6 +280,14 @@ export default {
           this.$set(this.pageData, 'keep', res.data.data.map((v) => formatData(v)))
         }
       })
+      // 获取文件分类
+      getSearchTag().then(data => {
+        const res = data.data
+        if(res && res.error_code === 0) {
+          this.wordModel = res.data.map((item, index) => ({ value: item, active: index === 0 ? true : false }))
+          this.getSearchEvent(this.wordModel[0].value)
+        }
+      })
     },
     goSubmit (search) {
       if (!search.text.replace(/\s+/g, '')) {
@@ -458,8 +512,8 @@ export default {
         h5 {
             color: #1D1D1D;
             font-family: Microsoft YaHei;
-            font-size: 18px;
-            line-height: 28px;
+            font-size: 24px;
+            line-height: 36px;
             letter-spacing: 0px;
             text-align: left;
             margin-right: 9px;
@@ -468,19 +522,40 @@ export default {
 
     .top-search-group {
       width: 100%;
-      height: 323px;
+      height: 246px;
+      background-image: url("~@/assets/images/wenkuBanner.png");
+      background-repeat: no-repeat;
+      background-color: #fff;
       h1 {
         color: #1D1D1D;
         font-family: Microsoft YaHei;
-        font-size: 20px;
+        font-weight: 300;
+        font-size: 40px;
         line-height: normal;
         letter-spacing: 0px;
         text-align: left;
-        margin-bottom: 40px;
+        margin: 42px 0 24px;
       }
     }
 
     .new-list-group {
+      .word-model {
+        .word-model-content {
+          display: flex;
+          .word-model-list {
+            padding: 2px 8px;
+            color: #686868;
+            font-size: 14px;
+            border-radius: 4px;
+            line-height: 22px;
+            cursor: pointer;
+            &.active{
+              background: #2ABED1;
+              color: #fff;
+            }
+          }
+        }
+      }
         > .flex {
           max-width: 50%;
         }

jydocs-pc/src/views/Search.vue

@@ -2,6 +2,23 @@
   <div class="search-container">
     <search-input ref="search" @submit="doSearch" @recovery="doSearch"></search-input>
     <div class="search-result-container">
+      <div class="filter-content">
+        <div class="filter-item">
+          <select-card
+            labelText="文件格式"
+            :options="fileTypeList"
+            :single="true"
+          ></select-card>
+        </div>
+        <div class="filter-item">
+          <select-card
+            field="label"
+            labelText="商品类型"
+            :options="productTypeList"
+            :single="true"
+          ></select-card>
+        </div>
+      </div>
       <div class="sort-list">
         <span
           class="sort-item"
@@ -21,6 +38,7 @@
           :title="item.docName"
           :desc="item.docSummary + '...'"
           :docType="item.docFileType"
+          :productType="item.product_type ? 1 : 0"
           :price="item.price"
           :subInfo="calcSubInfo(item)"
           @onClick="toDocDetail(item)"
@@ -48,6 +66,7 @@
 
 <script>
 import { Icon, Pagination } from 'element-ui'
+import SelectCard from '@/components/filters-item/SelectCard'
 import SearchInput from '@/components/Search'
 import DocCard from '@/components/doc-item-card/Card'
 import NoData from '@/components/NoData'
@@ -63,10 +82,22 @@ export default {
     [Pagination.name]: Pagination,
     SearchInput,
     DocCard,
-    NoData
+    NoData,
+    SelectCard
   },
   data () {
     return {
+      fileTypeList: ['doc', 'pdf', 'ppt', 'xls', 'txt'],
+      productTypeList: [
+        {
+          label: '会员免费',
+          value: 1
+        }, 
+        {
+          label: '精品',
+          value: 2
+        }
+      ],
       sortTypeList: [
         {
           type: 'tSort',
@@ -250,6 +281,13 @@ export default {
 }
 .search-result-container {
   margin: 0 auto;
+  .filter-content {
+    margin-top: 48px;
+  }
+  .filter-item{
+    padding-left: 18px;
+    margin-bottom: 16px;
+  }
   .sort-list {
     display: flex;
     align-items: center;

jydocs-pc/src/views/UserCollections.vue

@@ -11,12 +11,13 @@
           :title="item.DocName"
           :desc="item.DocSummary"
           :docType="item.DocFileType"
+          :productType="item.product_type ? 1 : 0"
           :subInfo="calcSubInfo(item)"
           @onClick="toDocDetail(item)"
         >
           <template slot="price">
             <div class="bought" v-if="item.Cost === '已购买'">已购买</div>
-            <Price v-else :price="item.Cost" />
+            <!-- <Price v-else :price="item.Cost" /> -->
           </template>
         </doc-card>
         <no-data v-if="listState.list.length === 0 && listState.loaded">

jydocs-pc/src/views/UserDocs.vue

@@ -17,6 +17,7 @@
           cardType="oneline"
           :key="index"
           :title="item.DocName"
+          :productType="item.product_type ? 1 : 0"
           :docType="item.DocFileType + ''"
           :subInfo="calcSubInfo(item)"
           @onClick="toDocDetail(item)"
@@ -53,20 +54,20 @@
           </div>
           <div class="flex-c-c">
             <div class="flex">
-              <div class="title-text van-multi-ellipsis--l2">{{item.title}}</div>
+              <div class="title-text van-multi-ellipsis--l2">{{item.docName}}</div>
+            </div>
+            <div v-if="item.docTags" class="money-group flex-r-c center left">
+              <span style="margin-right: 8px;">{{ item.docTags }}</span>
+              <!-- <span>地方性法规</span> -->
             </div>
             <div class="flex-c-c info-text">
               <span v-if="item.contribution">贡献者: {{item.contribution}}</span>
               <div class="info-text-group flex-r-c center left">
-                <span v-if="item.down">{{item.down}}次下载</span>
-                <span v-if="item.page">共{{item.page}}页</span>
-                <span v-if="item.size">{{item.size | sizeFormatter}}</span>
+                <span v-if="item.viewTimes">{{item.viewTimes}}次浏览</span>
+                <span v-if="item.docPageSize">共{{item.docPageSize}}页</span>
+                <span v-if="item.docFileSize">{{item.docFileSize | sizeFormatter}}</span>
               </div>
             </div>
-            <div class="money-group flex-r-c center left">
-              <i class="el-icon-jy-iconJianYu s20" />
-              <span class="red-text">{{item.money}}</span>
-            </div>
           </div>
         </div>
       </div>
@@ -79,7 +80,7 @@ import { Pagination } from 'element-ui'
 import DocCard from '@/components/doc-item-card/Card'
 import NoData from '@/components/NoData'
 import { getUserDocs } from '../api/modules/user'
-import { getHomeActivity } from '../api/modules/home'
+import { getSearch } from '../api/modules/search'
 import { dateFormatter, formatSize } from '@/utils/index'
 import { mixinBackground } from '@/utils/mixins'
 
@@ -202,9 +203,10 @@ export default {
       return subInfoArr
     },
     getRecommendList () {
-      getHomeActivity({ code: 3, size: 6, num: 1 }).then(res => {
-        if (!res.data.error_msg.length) {
-          this.recommendList = res.data.data.map((v) => formatData(v))
+      getSearch({ productType: 2, sort: 'vSort', num: 1, size: 6 }).then(res => {
+        const data = res.data
+        if (data && data.error_code === 0) {
+          this.recommendList = data.data.map((v) => formatData(v))
         }
       })
     },
@@ -323,7 +325,10 @@ export default {
       }
 
       .money-group {
-        margin-top: 8px;
+        margin-bottom: 8px;
+        font-size: 14px;
+        line-height: 22px;
+        color: #999999;
       }
       .mini-img-group {
         flex-shrink: 0;