Parcourir la source

fix:详情页底部悬浮逻辑调整

Signed-off-by: tangshizhe <48740614+tangshizhe@users.noreply.github.com>
tangshizhe il y a 1 an
Parent
commit
b35288f86f

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

@@ -7,7 +7,7 @@
 </template>
 
 <script>
-import { mapState, mapActions } from 'vuex'
+import { mapActions } from 'vuex'
 export default {
   components: {},
   data () {
@@ -37,15 +37,14 @@ export default {
       ]
     }
   },
-  created() {
-    console.log(this.$store, 'this.$store')
+  created () {
     this.getMemberInfo()
   },
   methods: {
     ...mapActions({
       getUserMemberInfo: 'user/getUserMemberInfo'
     }),
-    getMemberInfo() {
+    getMemberInfo () {
       this.getUserMemberInfo()
     }
   }

+ 39 - 58
jydocs-pc/src/components/Search.vue

@@ -15,68 +15,49 @@
 
 <script>
 import { Input, Button, Tabs, TabPane } from 'element-ui'
-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, ' ')
-    })
-  }
-},
-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
+  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, ' ')
+      })
+    }
   },
-  submitSearch (e) {
-    this.$emit('submit', {
-      text: this.input.trim().replace(/\s+/g, ' '),
-      events: e
-    })
+  methods: {
+    setSearchContent: function (v) {
+      this.input = v
+    },
+    submitSearch (e) {
+      this.$emit('submit', {
+        text: this.input.trim().replace(/\s+/g, ' '),
+        events: e
+      })
+    }
   }
 }
-}
 </script>
 
 <style scoped lang="scss">

+ 2 - 3
jydocs-pc/src/components/SelectedRecommend.vue

@@ -33,7 +33,6 @@
 </template>
 
 <script>
-import { moneyUnit } from "@/utils/";
 export default {
   name: 'SelectedRecommend',
   props: {
@@ -55,8 +54,8 @@ export default {
     },
     SetViewUnit (num) {
       let newNum = 0
-      if(!num) return 0
-      if(num > 10000) {
+      if (!num) return 0
+      if (num > 10000) {
         newNum = (num / 10000).toFixed(1) + 'w'
       } else {
         newNum = num

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

@@ -22,96 +22,96 @@
 </template>
 
 <script>
-  import { CheckboxGroup, Checkbox, CheckboxButton } from 'element-ui'
-  export default {
-    name:'select-card',
-    components: {
-      [CheckboxGroup.name]: CheckboxGroup,
-      [Checkbox.name]: Checkbox,
-      [CheckboxButton.name]: CheckboxButton
+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
     },
-    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: ''
-      }
+    // field: 空代表字符串数组
+    // 其他: options是对象数组,field是对象数组的某个字段
+    field: {
+      type: String,
+      default: ''
     },
-    data() {
-      return {
-        list: []
-      }
+    options: {
+      type: Array,
+      default: () => []
     },
-    mounted() {
-      if (!this.value.length) {
-        this.list = ['全部']
-      } else {
-        this.list = this.value
-      }
+    value: {
+      type: Array,
+      default: () => []
     },
-    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 = ['全部']
+    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 {
-          // 如果是单选,则只取最新一个
-          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 = ['全部']
-            }
+          value = value.filter((item) => item !== '全部')
+          if (value.length === 0) {
+            value = ['全部']
           }
-        } 
-        this.list = value
-        if (value.length === 1 && value[0] === '全部') {
-          this.$emit('input', [])
-        } else {
-          const datas = []
-          this.options.forEach((item) => {
-            value.forEach((val) => {
-              if(this.field) {
-                if(val === item[this.field]) {
-                  datas.push(item)
-                }
-              } else {
-                if(val === item) {
-                  datas.push(item)
-                }
+        }
+      } 
+      this.list = value
+      if (value.length === 1 && value[0] === '全部') {
+        this.$emit('input', [])
+      } else {
+        const datas = []
+        this.options.forEach((item) => {
+          value.forEach((val) => {
+            if (this.field) {
+              if (val === item[this.field]) {
+                datas.push(item)
               }
-            })
+            } else {
+              if (val === item) {
+                datas.push(item)
+              }
+            }
           })
-          this.$emit('input', datas)
-        }
+        })
+        this.$emit('input', datas)
       }
     }
   }
+}
 </script>
 
 <style lang="scss" scoped>

+ 22 - 15
jydocs-pc/src/views/Content.vue

@@ -38,14 +38,14 @@
         <div class="bottoms" id="colWidth">
           <div class="page">
             <div class="cont-p" v-show="fileTypeThis !== 'docx' && fileTypeThis !== 'xlsx'" id="pdfPage"></div>
-            <div class="file-content file-word-docx" v-if="fileTypeThis === 'docx'">
+            <div class="file-content file-word-docx" id="docxPage" v-if="fileTypeThis === 'docx'">
               <vue-office-docx
                   :src="fileSrc.docSrc"
                   style="height: 100vh;"
                   @rendered="rendered"
               />
             </div>
-            <div class="file-content file-word-docx" v-if="fileTypeThis === 'xlsx'">
+            <div class="file-content file-word-docx" id="xlsxPage" v-if="fileTypeThis === 'xlsx'">
               <vue-office-excel
                   :src="fileSrc.excelSrc"
                   style="height: 100vh;"
@@ -165,10 +165,10 @@ import { getSearchTag } from '../api/modules/home'
 import { getDocPays } from '../api/modules/purchase'
 import { getJyAdListApi } from '../api/modules/publicapply'
 import { mapState } from 'vuex'
-//引入VueOfficeDocx组件
+// 引入VueOfficeDocx组件
 import VueOfficeDocx from '@vue-office/docx'
 import VueOfficeExcel from '@vue-office/excel'
-//引入相关样式
+// 引入相关样式
 import '@vue-office/docx/lib/index.css'
 import '@vue-office/excel/lib/index.css'
 export default {
@@ -310,10 +310,10 @@ export default {
     }
   },
   methods: {
-    rendered(){
+    rendered () {
       console.log("渲染完成")
     },
-    errorHandler() {
+    errorHandler () {
       console.log("渲染失败")
     },
     // 使用免费下载特权
@@ -349,7 +349,7 @@ export default {
       if (text === '立即充值') {
         window.location.href = '/swordfish/integral/index/recharge?id=' + this.datas.docId
       } else if (text === '明日再来' || text === '我知道了') {
-        if(this.dialogInfo.title === '文档下载成功') {
+        if (this.dialogInfo.title === '文档下载成功') {
           // 加载文档内容,刷新页面
           location.reload()
         } else {
@@ -377,7 +377,6 @@ export default {
         }
       }
     },
-    
     loginCallback () {
       this.islogin = true
       this.adverse()
@@ -408,14 +407,22 @@ export default {
       const scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop
       this.fixed = !!(scrollTop > this.offsetTop && this.buyed)
       this.watchPage()
-      const t = document.getElementById('pdfPage')
+      let t = document.getElementById('pdfPage')
+      if (this.fileTypeThis === 'docx') {
+        t = document.getElementById('docxPage')
+      } else if (this.fileTypeThis === 'xlsx') {
+        t = document.getElementById('xlsxPage')
+      }
       const b = t.getBoundingClientRect().bottom
       const dom = document.getElementById('footp')
+      console.log(t, 't')
+      console.log(b, 'b')
       if (b < 700) {
         dom.style.position = 'unset'
       } else {
         dom.style.position = 'fixed'
         dom.style.bottom = '0px'
+        dom.style.zIndex = '99'
       }
     },
     updateText ({ type, value = '' }) {
@@ -481,7 +488,7 @@ export default {
           let FileIndex = 0
           const fileExtensions = ['doc', 'docx', 'pdf', 'xls', 'xlsx', 'ppt', 'txt']
           fileExtensions.forEach((v, index) => {
-            if(this.conts.data.indexOf(v) > -1){
+            if (this.conts.data.indexOf(v) > -1){
               FileIndex = index
             }
           })
@@ -489,13 +496,13 @@ export default {
           switch (fileExtensions[FileIndex]) {
             case 'docx':
               this.fileSrc.docSrc = res.data.data
-              break;
+              break
             case 'xlsx':
               this.fileSrc.excelSrc = res.data.data
-              break;
+              break
             default:
               this.init()
-              break;
+              break
           }
         } else {
           Message({
@@ -555,7 +562,7 @@ export default {
           this.datas = res.data.detail
           this.datas.docFileSize = formatSize(this.datas.docFileSize)
           this.datas.uploadDate = dateFormatter(this.datas.uploadDate.replace(/-/g, '/'), 'yyyy/MM/dd')
-          if(this.datas.docSummary) {
+          if (this.datas.docSummary) {
             this.datas.docSummary = this.datas.docSummary.split('').length >= 500 ? this.datas.docSummary + '...' : this.datas.docSummary
           } else {
             this.datas.docSummary = ''
@@ -678,7 +685,7 @@ export default {
                   showCancel: false,
                   confirmText: '我知道了'
                 }
-              } else if(res.data.data.status === 0) {
+              } else if (res.data.data.status === 0) {
                 // 下载成功,显示下载成功弹窗
                 params = {
                   visible: true,

+ 20 - 20
jydocs-pc/src/views/Home.vue

@@ -93,7 +93,7 @@
       </div>
       <selected-recommend
         :options="pageData.keep"
-        @click="goContent"  
+        @click="goContent"
       ></selected-recommend>
   </div>
 </template>
@@ -102,7 +102,7 @@
 import { Button, Carousel, CarouselItem } from 'element-ui'
 import SearchInput from '../components/Search'
 import SelectedRecommend from '@/components/SelectedRecommend.vue'
-import { getHomeActivity, getHomeHot, getSearchTag } from '../api/modules/home'
+import { getHomeHot, getSearchTag } from '../api/modules/home'
 import { getJyAdListApi } from '../api/modules/publicapply'
 import { getSearch } from '../api/modules/search'
 import { recoveryPageData } from '../utils'
@@ -220,17 +220,17 @@ export default {
       })
       window.open(routeData.href, '_blank')
     },
-    onSetWordModel(data) {
+    onSetWordModel (data) {
       this.wordModel.forEach(v => {
         v.active = false
-      });
-      data.active = true;
+      })
+      data.active = true
       const localList = this.getLocalData(data.value)
-      if(localList && localList.length) {
+      if (localList && localList.length) {
         this.wordFileList = localList.map((v) => formatData(v))
       } else {
         this.getSearchEvent(data.value, (res) => {
-          if(res.data && res.data.list && res.data.list.length) {
+          if (res.data && res.data.list && res.data.list.length) {
             const list = res.data.list.map((v) => formatData(v))
             this.wordFileList = list
           } else {
@@ -247,7 +247,7 @@ export default {
         num: 1,
         size: 8
       }
-      if(!type) {
+      if (!type) {
         params = {
           productType: 2,
           sort: 'vSort',
@@ -257,16 +257,16 @@ export default {
       }
       getSearch(params).then(data => {
         const res = data.data
-        if(res && res.error_code === 0) {
-          if(type) {
+        if (res && res.error_code === 0) {
+          if (type) {
             this.setLocalData(type, res.data.list)
           }
           callBack && callBack(res)
         }
       })
     },
-    setLocalData(tag, list) {
-      let foundItem = this.docsWordList.find(item => item['word-name-' + tag] !== undefined)
+    setLocalData (tag, list) {
+      const foundItem = this.docsWordList.find(item => item['word-name-' + tag] !== undefined)
       if (foundItem) {
         // 如果找到,则更新该项
         foundItem['word-name-' + tag] = list
@@ -274,18 +274,18 @@ export default {
         // 如果没有找到,则创建新项并添加到列表中
         const docsWordObj = {
           ['word-name-' + tag]: list
-        };
+        }
         this.docsWordList.push(docsWordObj)
       }
       // 存储更新后的列表到sessionStorage
       sessionStorage.setItem('jy-docs-word-list', JSON.stringify(this.docsWordList))
     },
-    getLocalData(tag) {
+    getLocalData (tag) {
       // 优先取本地数据,无数据时返回一个空数组
       try {
         const jyDocsWordList = sessionStorage.getItem('jy-docs-word-list')
         if (jyDocsWordList) {
-          const parsedList = JSON.parse(jyDocsWordList);
+          const parsedList = JSON.parse(jyDocsWordList)
           // 使用 find 方法找到第一个匹配的项,并返回对应的列表
           const item = parsedList.find(v => 'word-name-' + tag in v)
           return item ? item['word-name-' + tag] : []
@@ -310,14 +310,14 @@ export default {
       // 获取文件分类
       getSearchTag().then(data => {
         const res = data.data
-        if(res && res.error_code === 0) {
+        if (res && res.error_code === 0) {
           this.wordModel = res.data.map((item, index) => ({ value: item, active: index === 0 ? true : false }))
           const localList = this.getLocalData(this.wordModel[0].value)
-          if(localList && localList.length) {
+          if (localList && localList.length) {
             this.wordFileList = localList.map((v) => formatData(v))
           } else {
             this.getSearchEvent(this.wordModel[0].value, (item) => {
-              if(item.data && item.data.list && item.data.list.length) {
+              if (item.data && item.data.list && item.data.list.length) {
                 this.wordFileList = item.data.list.map((v) => formatData(v))
               } else {
                 this.wordFileList = []
@@ -329,7 +329,7 @@ export default {
       // 获取广告信息
       getJyAdListApi({ codes: ['jy-pc-docmember', 'jy-pc-doc-recommend'] }).then(res => {
         const resData = res.data
-        if(resData && resData.error_code === 0) {
+        if (resData && resData.error_code === 0) {
           this.jyPcDocRecommend = resData.data['jy-pc-doc-recommend']
           this.jyPcDocMember = resData.data['jy-pc-docmember']
         }
@@ -339,7 +339,7 @@ export default {
       })
     },
     onDocLink (item) {
-      if(item.s_link) {
+      if (item.s_link) {
         window.open(item.s_link, '_blank')
       }
     },

+ 2 - 4
jydocs-pc/src/views/Search.vue

@@ -193,9 +193,7 @@ export default {
       }
       try {
         this.$router.replace(`/search?text=${this.searchQuery.text}`)
-      } catch (error) {
-        
-      }
+      } catch (error) {}
     },
     getSearchState: function (search) {
       if (search) {
@@ -217,7 +215,7 @@ export default {
       this.getList()
     },
     onFilterFormat (filters, keyName) {
-      let key = filters.length > 0 ? filters[0] : { label: '全部', value: 0 }
+      const key = filters.length > 0 ? filters[0] : { label: '全部', value: 0 }
       this.searchQuery[keyName] = key.value
       this.listState.pageNum = 1
       this.getList()

+ 2 - 2
jydocs-pc/src/views/purchase/purchase.vue

@@ -131,7 +131,7 @@ export default {
   watch: {
     userMemberInfo: {
       handler (val) {
-        if(val) {
+        if (val) {
           this.docsInfo = val.docsInfo
         }
       },
@@ -170,7 +170,7 @@ export default {
           this.sessioninfor.payTime = payTime
           this.sessioninfor.payWay = payWay
           sessionStorage.setItem('paydata', JSON.stringify(this.sessioninfor))
-          if(this.docsInfo.docStatus > 0) {
+          if (this.docsInfo.docStatus > 0) {
             this.$router.push('/purchasesuccess/' + this.response.docMemberPrice)
           } else {
             this.$router.push('/purchasesuccess/' + this.response.price)

+ 3 - 2
jydocs-pc/src/views/purchase/purchasesuccess.vue

@@ -43,13 +43,14 @@
 
 <script>
 import { dateFormatter } from '../../utils/globalFunctions'
-import { checkbox } from 'element-ui'
+import { checkbox, Message } from 'element-ui'
 import { getDown } from '../../api/modules/detail'
 
 export default {
   name: 'purchasePage',
   components: {
-    [checkbox.name]: checkbox
+    [checkbox.name]: checkbox,
+    [Message.name]: Message
   },
   data () {
     return {