Files
dvcp_v2_wxcp_app/src/project/fengdu/AppVote/voteDetail.vue
aixianling 7a062635af BUG 12
2023-01-03 10:17:47 +08:00

88 lines
2.3 KiB
Vue

<template>
<section class="voteDetail">
<AiItem top-label :label="detail.videoName" :border="false" labelBold>
<u-parse class="mar-b8" :html="detail.videoIntroduction"/>
<video :src="detail.videoFileUrl" :poster="detail.imageFileUrl"/>
</AiItem>
<AiBottomBtn background="#fff">
<div flex class="pad-l32 pad-r16 pad-b16 pad-t16">
<AiHighlight class="fill color-999" content="当前票数:@v" :value="detail.voteNumber" color="#FF6900"/>
<div class="text circle mar-l16" :class="{disabled:canotVote}" @click="handleVote">投票</div>
</div>
</AiBottomBtn>
</section>
</template>
<script>
import {mapState, mapActions} from "vuex"
export default {
name: "voteDetail",
appName: "投票详情",
computed: {
...mapState(['user']),
wxCode: v => v.$route.query.code,
canotVote: v => v.detail.isVote == '0' && v.user.token
},
data() {
return {
detail: {}
}
},
methods: {
...mapActions(['getWechatToken', 'getCode']),
getDetail() {
const {id} = this.$route.query
this.$http.post("/app/appvideoinfo/queryDetailById", null, {params: {id}, withoutToken: true}).then(res => {
if (res?.data) {
this.detail = res.data
document.title = this.detail.videoName
}
})
},
handleVote() {
if (!this.user.token) {//未登录,获取openId和token
this.$http.get("/app/appdvcpconfig/getMpAppid", {withoutToken: true}).then(res => {
if (res?.code == 0 && res?.data) {
this.getCode({scope: "snsapi_userinfo", appid: res.data})
}
})
} else {//已登录,直接投票
if (!this.canotVote) {
const {id} = this.$route.query
this.$http.post("/app/appvideovoteinfo/voteByVideoId", null, {
params: {id}
}).then(res => {
if (res?.code == 0) {
this.$u.toast("投票成功!")
this.getDetail()
}
})
}
}
},
},
onShow() {
this.getDetail()
if (!!this.wxCode) {
this.getWechatToken({module: "AppVote", code: this.wxCode}).then(this.handleVote)
}
}
}
</script>
<style lang="scss" scoped>
.voteDetail {
background: #F3F6F9;
min-height: 100vh;
::v-deep.disabled {
filter: grayscale(100%);
}
::v-deep video {
width: 100%;
}
}
</style>