|
|
@@ -12,8 +12,8 @@
|
|
|
<div class="cd-tips">
|
|
|
<ul>
|
|
|
<li class="li-tags" v-for="item in getContentTags" :key="item">{{ item }}</li>
|
|
|
- <li>{{ datas.viewTimes }}次浏览<el-divider direction="vertical"></el-divider></li>
|
|
|
- <li>{{ datas.downTimes }}次下载<el-divider direction="vertical"></el-divider></li>
|
|
|
+ <li>{{ datas.viewTimes || 0 }}次浏览<el-divider direction="vertical"></el-divider></li>
|
|
|
+ <li>{{ datas.downTimes || 0 }}次下载<el-divider direction="vertical"></el-divider></li>
|
|
|
<li>共{{ datas.docPageSize }}页<el-divider direction="vertical"></el-divider></li>
|
|
|
<li>{{ datas.docFileSize }}<el-divider direction="vertical"></el-divider></li>
|
|
|
<li class="no-line">{{ datas.uploadDate }}上传</li>
|
|
|
@@ -37,7 +37,22 @@
|
|
|
</div>
|
|
|
<div class="bottoms" id="colWidth">
|
|
|
<div class="page">
|
|
|
- <div class="cont-p" id="pdfPage"></div>
|
|
|
+ <div class="cont-p" v-show="fileTypeThis !== 'docx' && fileTypeThis !== 'xlsx'" id="pdfPage"></div>
|
|
|
+ <div class="file-content file-word-docx" 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'">
|
|
|
+ <vue-office-excel
|
|
|
+ :src="fileSrc.excelSrc"
|
|
|
+ style="height: 100vh;"
|
|
|
+ @rendered="rendered"
|
|
|
+ @error="errorHandler"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
</div>
|
|
|
<div class="foot-tip tops" id="footp">
|
|
|
<div class="member-time-tip" v-if="redShow && islogin">
|
|
|
@@ -80,7 +95,7 @@
|
|
|
<span>{{ datas.price }}</span>
|
|
|
<span>原价下载</span>
|
|
|
</el-button>
|
|
|
- <el-button class="prime-cost" @click="downLoadFreeEvent" v-if="buyed !== 1 && !docsInfo.docStatus && docsInfo.freeDownload !== 1">
|
|
|
+ <el-button class="prime-cost" @click="downLoadFreeEvent" v-if="islogin && buyed !== 1 && !docsInfo.docStatus && docsInfo.freeDownload !== 1">
|
|
|
<span>使用免费下载特权</span>
|
|
|
<span>（1次机会）</span>
|
|
|
</el-button>
|
|
|
@@ -96,11 +111,11 @@
|
|
|
<span>{{ datas.price }}</span>
|
|
|
<span>原价下载</span>
|
|
|
</el-button>
|
|
|
- <div class="coin before-coin" v-if="docsInfo.docStatus > 0">
|
|
|
+ <div class="coin before-coin" v-if="docsInfo.docStatus > 0 && buyed === 0">
|
|
|
原价：<i class="el-icon-jy-iconJianYu"></i>
|
|
|
<span style="text-decoration: line-through;">{{ datas.price }}</span>
|
|
|
</div>
|
|
|
- <div class="coin after-coin" v-if="docsInfo.docStatus > 0">
|
|
|
+ <div class="coin after-coin" v-if="docsInfo.docStatus > 0 && buyed === 0">
|
|
|
会员价：<i class="el-icon-jy-iconJianYu"></i>
|
|
|
<span style="color: #FF3A20;font-size: 24px;">{{ datas.docMemberPrice }}</span>
|
|
|
</div>
|
|
|
@@ -130,7 +145,7 @@
|
|
|
</common-dialog>
|
|
|
<div class="d-right">
|
|
|
<div class="r-tops">
|
|
|
- <a :href="item.s_link" v-for="item in adsUrl" :key="item.s_pic">
|
|
|
+ <a :href="item.s_link ? item.s_link : 'javascript:;'" v-for="item in adsUrl" :key="item.s_pic">
|
|
|
<img :src="item.s_pic">
|
|
|
</a>
|
|
|
</div>
|
|
|
@@ -150,6 +165,12 @@ import { getSearchTag } from '../api/modules/home'
|
|
|
import { getDocPays } from '../api/modules/purchase'
|
|
|
import { getJyAdListApi } from '../api/modules/publicapply'
|
|
|
import { mapState } from 'vuex'
|
|
|
+//引入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 {
|
|
|
components: {
|
|
|
[Button.name]: Button,
|
|
|
@@ -158,7 +179,9 @@ export default {
|
|
|
[Message.name]: Message,
|
|
|
vRecommend,
|
|
|
commonDialog,
|
|
|
- CollectInfo
|
|
|
+ CollectInfo,
|
|
|
+ VueOfficeDocx,
|
|
|
+ VueOfficeExcel
|
|
|
},
|
|
|
data () {
|
|
|
return {
|
|
|
@@ -172,6 +195,7 @@ export default {
|
|
|
coinNum: 0,
|
|
|
btnName: '',
|
|
|
buyed: 0,
|
|
|
+ downloadStatus: 0,
|
|
|
collectd: 0,
|
|
|
offsetTop: 0,
|
|
|
offsetWidth: 0,
|
|
|
@@ -212,6 +236,11 @@ export default {
|
|
|
startDate: 0
|
|
|
},
|
|
|
surplusDay: 0, // 剩余多少天到期
|
|
|
+ fileSrc: {
|
|
|
+ docSrc: '',
|
|
|
+ excelSrc: ''
|
|
|
+ },
|
|
|
+ fileTypeThis: '' // 当前文件类型
|
|
|
}
|
|
|
},
|
|
|
created () {
|
|
|
@@ -253,7 +282,7 @@ export default {
|
|
|
return nArr.splice(0, 3)
|
|
|
},
|
|
|
showCostBtn () {
|
|
|
- return this.buyed !== 1 && !this.docsInfo.docStatus && this.docsInfo.freeDownload === 1 && this.datas.downloadStatus !== 1
|
|
|
+ return (this.buyed !== 1 && !this.docsInfo.docStatus && this.docsInfo.freeDownload === 1 && this.downloadStatus !== 1) || !this.islogin
|
|
|
}
|
|
|
},
|
|
|
watch: {
|
|
|
@@ -264,13 +293,15 @@ export default {
|
|
|
const date = parseInt(new Date().getTime() / 1000)
|
|
|
const sevenDay = 60 * 60 * 24 * 7
|
|
|
const oneDay = 60 * 60 * 24
|
|
|
- const surplus = val.docsInfo?.endDate - date
|
|
|
- if (val.docsInfo?.endDate - date <= sevenDay && val.docsInfo.dataStatus === 1) {
|
|
|
+ const surplus = parseInt(val.docsInfo?.endDate - date)
|
|
|
+ if (surplus <= sevenDay && val.docsInfo.docStatus === 1) {
|
|
|
this.redShow = true
|
|
|
- this.surplusDay = Math.ceil(surplus / oneDay) + '天后'
|
|
|
+ this.surplusDay = (surplus / oneDay)
|
|
|
// 如果剩余天数不到1天，则显示今天到期
|
|
|
if (this.surplusDay < 1) {
|
|
|
this.surplusDay = '今天'
|
|
|
+ } else {
|
|
|
+ this.surplusDay = this.surplusDay.toFixed(0) + '天后'
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
@@ -279,6 +310,12 @@ export default {
|
|
|
}
|
|
|
},
|
|
|
methods: {
|
|
|
+ rendered(){
|
|
|
+ console.log("渲染完成")
|
|
|
+ },
|
|
|
+ errorHandler() {
|
|
|
+ console.log("渲染失败")
|
|
|
+ },
|
|
|
// 使用免费下载特权
|
|
|
downLoadFreeEvent () {
|
|
|
if (this.docsInfo?.freeDownload === 0) {
|
|
|
@@ -312,7 +349,12 @@ export default {
|
|
|
if (text === '立即充值') {
|
|
|
window.location.href = '/swordfish/integral/index/recharge?id=' + this.datas.docId
|
|
|
} else if (text === '明日再来' || text === '我知道了') {
|
|
|
- this.dialogInfo.visible = false
|
|
|
+ if(this.dialogInfo.title === '文档下载成功') {
|
|
|
+ // 加载文档内容，刷新页面
|
|
|
+ location.reload()
|
|
|
+ } else {
|
|
|
+ this.dialogInfo.visible = false
|
|
|
+ }
|
|
|
}
|
|
|
},
|
|
|
dialogCancel () {
|
|
|
@@ -341,7 +383,6 @@ export default {
|
|
|
this.adverse()
|
|
|
this.tabs = recoveryPageData('jy-docs-search-tags-pc')
|
|
|
this.getTags()
|
|
|
- this.details()
|
|
|
},
|
|
|
getSimpleData_ () {
|
|
|
getSimpleData({ t: new Date().getTime() }).then((res) => {
|
|
|
@@ -370,7 +411,7 @@ export default {
|
|
|
const t = document.getElementById('pdfPage')
|
|
|
const b = t.getBoundingClientRect().bottom
|
|
|
const dom = document.getElementById('footp')
|
|
|
- if (b < 877) {
|
|
|
+ if (b < 700) {
|
|
|
dom.style.position = 'unset'
|
|
|
} else {
|
|
|
dom.style.position = 'fixed'
|
|
|
@@ -437,7 +478,25 @@ export default {
|
|
|
getShow({ docId: this.docIds }).then(res => {
|
|
|
if (res.data.error_code === 0) {
|
|
|
this.conts = res.data
|
|
|
- this.init()
|
|
|
+ let FileIndex = 0
|
|
|
+ const fileExtensions = ['doc', 'docx', 'pdf', 'xls', 'xlsx', 'ppt', 'txt']
|
|
|
+ fileExtensions.forEach((v, index) => {
|
|
|
+ if(this.conts.data.indexOf(v) > -1){
|
|
|
+ FileIndex = index
|
|
|
+ }
|
|
|
+ })
|
|
|
+ this.fileTypeThis = fileExtensions[FileIndex]
|
|
|
+ switch (fileExtensions[FileIndex]) {
|
|
|
+ case 'docx':
|
|
|
+ this.fileSrc.docSrc = res.data.data
|
|
|
+ break;
|
|
|
+ case 'xlsx':
|
|
|
+ this.fileSrc.excelSrc = res.data.data
|
|
|
+ break;
|
|
|
+ default:
|
|
|
+ this.init()
|
|
|
+ break;
|
|
|
+ }
|
|
|
} else {
|
|
|
Message({
|
|
|
message: res.data.error_msg,
|
|
|
@@ -496,9 +555,14 @@ 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')
|
|
|
- this.datas.docSummary = this.datas.docSummary.split('').length >= 500 ? this.datas.docSummary + '...' : 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 = ''
|
|
|
+ }
|
|
|
this.datas.tags = this.datas.tags.split(',')
|
|
|
this.buyed = res.data.status
|
|
|
+ this.downloadStatus = res.data.downloadStatus
|
|
|
if (this.buyed === 1) {
|
|
|
document.getElementById('fixedTop').style.display = 'block'
|
|
|
document.getElementById('footp').style.position = 'fixed'
|
|
|
@@ -571,7 +635,7 @@ export default {
|
|
|
}
|
|
|
return
|
|
|
}
|
|
|
- if (this.buyed !== 1 && !this.docsInfo.docStatus && this.docsInfo.freeDownload !== 1) {
|
|
|
+ if (this.buyed !== 1 && !this.docsInfo.docStatus && this.docsInfo.freeDownload !== 1 && this.datas.productType === 1) {
|
|
|
this.downLoadFreeEvent()
|
|
|
} else {
|
|
|
this.loadFile()
|
|
|
@@ -705,12 +769,20 @@ export default {
|
|
|
.high-light{
|
|
|
color: #2ABED1;
|
|
|
}
|
|
|
+.cont-p {
|
|
|
+ .page, .canvasWrapper, canvas {
|
|
|
+ width: 100%!important;
|
|
|
+ height: auto;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
</style>
|
|
|
<style lang="scss" scoped>
|
|
|
@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);
|
|
|
@include diy-icon('share', 18);
|
|
|
@include diy-icon('jubao', 18);
|
|
|
@include diy-icon('weiguanzhu', 18);
|
|
|
@@ -1044,6 +1116,14 @@ export default {
|
|
|
background: #fff;
|
|
|
// padding: 24px 40px 32px;
|
|
|
}
|
|
|
+ ::v-deep {
|
|
|
+ .docx-wrapper {
|
|
|
+ padding: 0;
|
|
|
+ }
|
|
|
+ .vue-office-docx .docx-wrapper>section.docx{
|
|
|
+ width: 100%!important;
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
.foot-tip {
|
wenmenghao