20261008
This commit is contained in:
@@ -0,0 +1,222 @@
|
||||
<template>
|
||||
<view>
|
||||
<top-bar></top-bar>
|
||||
<common-header></common-header>
|
||||
<category-bar></category-bar>
|
||||
<view class="page-nav">
|
||||
<el-breadcrumb separator="/">
|
||||
<el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
|
||||
<el-breadcrumb-item>
|
||||
<navigator style="display: inline-block;" url="/pages/article/list">金久信学堂</navigator>
|
||||
</el-breadcrumb-item>
|
||||
<el-breadcrumb-item>金久信学堂详情</el-breadcrumb-item>
|
||||
</el-breadcrumb>
|
||||
</view>
|
||||
|
||||
<view class="w-1200 m-a bg-white p-40">
|
||||
<view class=" flex justify-between items-center">
|
||||
<text class="text-50 font-bold">{{ info.name }}</text>
|
||||
<view class="flex flex-col justify-center items-center">
|
||||
<star @click.native="changeCollect" theme="outline" size="30" fill="#4a4a4a" strokeLinecap="square"
|
||||
v-if="!hasCollect" class="pointer"/>
|
||||
<star @click.native="changeCollect" theme="filled" size="30" fill="#d00243" strokeLinecap="square"
|
||||
v-else class="pointer"/>
|
||||
<text>{{ hasCollect ? '已收藏' : '收藏' }}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="mt-20 text-gray text-28 pb-20 border-bottom">{{ info._add_time_str }}</view>
|
||||
<view class="mt-20 text-gray text-28 pb-20 border-bottom" v-if="userInfo">
|
||||
<span>剩余</span>
|
||||
<span class="mx-15 text-main font-bold">{{ userInfo.remainArticleDownloadNum }}</span>
|
||||
<span>次下载次数</span>
|
||||
</view>
|
||||
<view class="py-20 border-bottom flex justify-start flex-col items-start " v-if="info.files">
|
||||
<view class="form-title-wrap">
|
||||
<view class="goods-info-title">
|
||||
<view class="form-title">
|
||||
附件
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="flex justify-start items-start flex-wrap my-25">
|
||||
<view class="mt-15 mr-15" v-for="(item, index) in info.files" :key="index">
|
||||
<template v-if="['doc', 'docx'].includes(item.split('.').pop())">
|
||||
<file-word theme="outline" class="pointer" size="100" fill="#4a90e2" strokeLinecap="square"
|
||||
@click.native="openDownload(item)"/>
|
||||
</template>
|
||||
<template v-else-if="['xls', 'xlsx'].includes(item.split('.').pop())">
|
||||
<file-excel theme="outline" class="pointer" size="100" fill="#417505" strokeLinecap="square"
|
||||
@click.native="openDownload(item)"/>
|
||||
</template>
|
||||
<template v-else-if="['pdf'].includes(item.split('.').pop())">
|
||||
<file-pdf-one theme="outline" class="pointer" size="100" fill="#f5a623"
|
||||
strokeLinecap="square"
|
||||
@click.native="openDownload(item)"/>
|
||||
</template>
|
||||
<template v-else>
|
||||
<el-image :src="item" style="width: 100px; height: 100px" fit="cover"
|
||||
:preview-src-list="[item]"/>
|
||||
</template>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-html="info.content" class="mt-20"></view>
|
||||
</view>
|
||||
<gap height="50"/>
|
||||
<common-footer></common-footer>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {FileExcel, FilePdfOne, FileWord, Star} from "@icon-park/vue";
|
||||
|
||||
export default {
|
||||
name: "detail",
|
||||
components: {FileWord, FilePdfOne, FileExcel, Star},
|
||||
data() {
|
||||
return {
|
||||
info: {
|
||||
name: '',
|
||||
content: ''
|
||||
},
|
||||
hasCollect: false,
|
||||
userInfo: null,
|
||||
}
|
||||
},
|
||||
onLoad(option) {
|
||||
if (option.id) {
|
||||
this.getInfo(option.id);
|
||||
this.addView(option.id)
|
||||
this.getUserInfo()
|
||||
}
|
||||
},
|
||||
onShow() {
|
||||
this.getUserInfo()
|
||||
},
|
||||
methods: {
|
||||
async getInfo(id) {
|
||||
this.info = await vk.callFunction({
|
||||
url: `client/article/list/pub/getDetail`,
|
||||
data: {id}
|
||||
});
|
||||
await this.checkCollect()
|
||||
},
|
||||
async getUserInfo() {
|
||||
const {userInfo} = await vk.callFunction({
|
||||
url: 'user/kh/getMyUserInfo'
|
||||
})
|
||||
this.userInfo = userInfo
|
||||
},
|
||||
addView(id) {
|
||||
vk.callFunction({
|
||||
url: `client/article/list/pub/addView`,
|
||||
data: {id}
|
||||
});
|
||||
},
|
||||
async openDownload(url) {
|
||||
await this.getUserInfo()
|
||||
if (this.userInfo.userLevel < 0) return this.$message.error('非会员,无法下载');
|
||||
// else if (this.userInfo.userLevel === 0) {
|
||||
const {data} = await vk.callFunction({
|
||||
url: 'client/article/list/kh/check',
|
||||
data: {
|
||||
id: this.info._id,
|
||||
}
|
||||
})
|
||||
if (!data) {
|
||||
if (this.userInfo.remainArticleDownloadNum === 0) {
|
||||
return this.$confirm(`下载次数不足,是否购买次数?`, '提示', {
|
||||
cancelButtonText: '关闭',
|
||||
}).then(async () => {
|
||||
const {data} = await vk.callFunction({
|
||||
url: 'client/order/kh/addDownloadOrder',
|
||||
title: '请求中...',
|
||||
})
|
||||
vk.navigateTo({
|
||||
url: `/pages/index/shop/pay?id=${data}`
|
||||
})
|
||||
})
|
||||
} else {
|
||||
this.$confirm(`将消耗1次下载次数,是否继续?`, '提示', {
|
||||
cancelButtonText: '关闭',
|
||||
}).then(async () => {
|
||||
this.userInfo.remainArticleDownloadNum -= 1
|
||||
// await this.getUserInfo()
|
||||
vk.callFunction({
|
||||
url: 'client/article/list/pub/addDownload',
|
||||
data: {
|
||||
id: this.info._id,
|
||||
}
|
||||
})
|
||||
vk.callFunction({
|
||||
url: 'client/user/kh/reduceDownloadNum',
|
||||
})
|
||||
vk.callFunction({
|
||||
url: 'client/article/list/kh/addDownload',
|
||||
data: {
|
||||
id: this.info._id,
|
||||
}
|
||||
})
|
||||
window.open(url)
|
||||
})
|
||||
}
|
||||
} else {
|
||||
window.open(url)
|
||||
}
|
||||
// } else {
|
||||
// vk.callFunction({
|
||||
// url: 'client/article/list/pub/addDownload',
|
||||
// data: {
|
||||
// id: this.info._id
|
||||
// }
|
||||
// })
|
||||
// window.open(url)
|
||||
// }
|
||||
|
||||
},
|
||||
async checkCollect() {
|
||||
const {data} = await vk.callFunction({
|
||||
url: 'client/article/collect/kh/check',
|
||||
data: {
|
||||
articleId: this.info._id
|
||||
},
|
||||
});
|
||||
this.hasCollect = data
|
||||
},
|
||||
changeCollect() {
|
||||
this.hasCollect = !this.hasCollect
|
||||
vk.callFunction({
|
||||
url: 'client/article/collect/kh/changeCollect',
|
||||
data: {
|
||||
articleId: this.info._id
|
||||
},
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
@import "@/common/css/app.scss";
|
||||
|
||||
.form-title-wrap {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
|
||||
.goods-info-title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.form-title {
|
||||
padding-left: 10px;
|
||||
color: $--color-primary;
|
||||
font-size: 18px;
|
||||
line-height: 18px;
|
||||
border-left: 4px solid $--color-primary;
|
||||
}
|
||||
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user