174 lines
3.9 KiB
Vue
174 lines
3.9 KiB
Vue
<template lang="pug">
|
|
.invitation
|
|
top
|
|
video
|
|
.invitation_a
|
|
span {{Return.detail.title}}
|
|
.invitation_b
|
|
span {{Return.detail.create_time}}
|
|
.invitation_c
|
|
.left
|
|
.left_a
|
|
img(class='xing' src='/static/img/icon/collection-icon.png')
|
|
span 收藏
|
|
.left_b
|
|
img(class='zan' src='/static/img/icon/give_thumbs-up.png')
|
|
span {{Return.detail.like_count}}
|
|
.right( @click="boom" )
|
|
span 简介
|
|
img(:src="booker ? '/static/img/icon/open-just.png' : '/static/img/icon/open-close.png'")
|
|
.invitation_d(v-show='booker')
|
|
span 简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容简介内容
|
|
comment
|
|
allComment
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
name: 'invitation',
|
|
data () {
|
|
return {
|
|
booker: false,
|
|
Return: {}
|
|
}
|
|
},
|
|
created () {
|
|
this.getvideoDetail()
|
|
},
|
|
methods: {
|
|
async getvideoDetail () {
|
|
let res = await this.$http.index.videoDetail({
|
|
id: '147'
|
|
})
|
|
console.log(res)
|
|
this.Return = res
|
|
},
|
|
boom (e) {
|
|
this.booker = !this.booker;
|
|
}
|
|
},
|
|
}
|
|
|
|
</script>
|
|
|
|
<style scoped lang="less">
|
|
.invitation {
|
|
uni-video {
|
|
width: 100%;
|
|
height: 422rpx;
|
|
}
|
|
.invitation_a {
|
|
margin: 0.878rem 0.693rem 0.493rem 0.307rem;
|
|
span {
|
|
width: 337.5px;
|
|
height: 44px;
|
|
font-family: PingFangSC-Bold;
|
|
font-size: 18px;
|
|
font-weight: normal;
|
|
font-stretch: normal;
|
|
line-height: 28.5px;
|
|
letter-spacing: 0px;
|
|
color: #333333;
|
|
}
|
|
|
|
.invitation_b {
|
|
span {
|
|
width: 103.5px;
|
|
height: 9px;
|
|
font-family: PingFangSC-Medium;
|
|
font-size: 11.5px;
|
|
font-weight: normal;
|
|
font-stretch: normal;
|
|
line-height: 21.6px;
|
|
letter-spacing: 0px;
|
|
color: #999999;
|
|
}
|
|
|
|
.invitation_c {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
.left {
|
|
display: flex;
|
|
.left_a {
|
|
img {
|
|
width: 14px;
|
|
height: 14px;
|
|
}
|
|
|
|
span {
|
|
width: 0.613rem;
|
|
height: 0.307rem;
|
|
font-family: PingFangSC-Medium;
|
|
font-size: 0.32rem;
|
|
font-weight: normal;
|
|
font-stretch: normal;
|
|
line-height: 0.6rem;
|
|
letter-spacing: 0rem;
|
|
}
|
|
}
|
|
|
|
.left_b {
|
|
img {
|
|
width: 14px;
|
|
height: 14px;
|
|
}
|
|
|
|
span {
|
|
width: 0.613rem;
|
|
height: 0.307rem;
|
|
font-family: PingFangSC-Medium;
|
|
font-size: 0.32rem;
|
|
font-weight: normal;
|
|
font-stretch: normal;
|
|
line-height: 0.6rem;
|
|
letter-spacing: 0rem;
|
|
}
|
|
}
|
|
}
|
|
|
|
.right {
|
|
span {
|
|
width: 0.627rem;
|
|
height: 0.307rem;
|
|
font-family: PingFangSC-Medium;
|
|
font-size: 0.32rem;
|
|
font-weight: normal;
|
|
font-stretch: normal;
|
|
line-height: 0.384rem;
|
|
letter-spacing: 0rem;
|
|
color: #999999;
|
|
}
|
|
|
|
img {
|
|
width: 8.5px;
|
|
height: 5px;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.invitation_d{
|
|
.active{
|
|
display: none;
|
|
}
|
|
.none{
|
|
display: block !important;
|
|
}
|
|
margin: 0.32rem;
|
|
span{
|
|
width: 348.5px;
|
|
height: 34.5px;
|
|
font-family: PingFangSC-Medium;
|
|
font-size: 14px;
|
|
font-weight: normal;
|
|
font-stretch: normal;
|
|
line-height: 23.5px;
|
|
letter-spacing: 0px;
|
|
color: #999999;
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
</style>
|