117 lines
2.1 KiB
Vue
117 lines
2.1 KiB
Vue
|
<template>
|
||
|
|
<view class="container">
|
||
|
|
<view class="title">
|
||
|
|
{{title}}
|
||
|
|
</view>
|
||
|
|
<view class="info">
|
||
|
|
<!-- <text class="type">湖北省农村部</text> -->
|
||
|
|
<text class="time">{{ createTime }} 发表</text>
|
||
|
|
</view>
|
||
|
|
<view class="video" v-if='videoUrl'>
|
||
|
|
<video style="width:100%;height:400rpx;" :src="$config.imageBaseUrl + videoUrl"></video>
|
||
|
|
</view>
|
||
|
|
<view class="body">
|
||
|
|
<u-parse :content="content"></u-parse>
|
||
|
|
</view>
|
||
|
|
<view class="read">
|
||
|
|
{{readNum}}阅读
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
import { applicationList,courseDetails,browseCourses } from '@/api/home.js'
|
||
|
|
import config from "@/config";
|
||
|
|
export default {
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
content: '',
|
||
|
|
title: "",
|
||
|
|
read: 100,
|
||
|
|
imgUrl:'',
|
||
|
|
videoUrl:'',
|
||
|
|
readNum:'',
|
||
|
|
createTime:'',
|
||
|
|
}
|
||
|
|
},
|
||
|
|
onLoad(o) {
|
||
|
|
courseDetails(o.id).then(res=>{
|
||
|
|
this.content = res.data.content
|
||
|
|
this.title = res.data.title
|
||
|
|
this.imgUrl = res.data.coverImg
|
||
|
|
this.videoUrl = res.data.videoUrl
|
||
|
|
this.createTime = res.data.createTime
|
||
|
|
this.readNum = res.data.readNum
|
||
|
|
|
||
|
|
})
|
||
|
|
browseCourses({'id':o.id}).then(res=>{
|
||
|
|
console.log(res,'res')
|
||
|
|
})
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style lang="scss" scoped>
|
||
|
|
$color: #4892FD;
|
||
|
|
|
||
|
|
.container {
|
||
|
|
min-height: 80vh;
|
||
|
|
background-color: #fff;
|
||
|
|
padding: 10rpx 30rpx 100rpx;
|
||
|
|
background: #fff;
|
||
|
|
box-sizing: border-box;
|
||
|
|
align-items: initial;
|
||
|
|
.read {
|
||
|
|
margin-top: 60rpx;
|
||
|
|
height: 40rpx;
|
||
|
|
font-size: 24rpx;
|
||
|
|
font-weight: 500;
|
||
|
|
color: #999999;
|
||
|
|
line-height: 40rpx;
|
||
|
|
}
|
||
|
|
|
||
|
|
.body {
|
||
|
|
margin-top: 20rpx;
|
||
|
|
}
|
||
|
|
.img{
|
||
|
|
width:100%;
|
||
|
|
margin-top:20rpx;
|
||
|
|
}
|
||
|
|
.title {
|
||
|
|
font-size: 34rpx;
|
||
|
|
font-weight: 600;
|
||
|
|
color: #0D0D0D;
|
||
|
|
line-height: 50rpx;
|
||
|
|
}
|
||
|
|
.video{
|
||
|
|
margin: 20rpx auto;
|
||
|
|
width: 690rpx;
|
||
|
|
height: 400rpx;
|
||
|
|
border-radius: 10rpx;
|
||
|
|
video{
|
||
|
|
width: 100%;height: 100%;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.info {
|
||
|
|
margin-top: 30rpx;
|
||
|
|
line-height: 40rpx;
|
||
|
|
height: 40rpx;
|
||
|
|
|
||
|
|
.type {
|
||
|
|
font-size: 24rpx;
|
||
|
|
font-weight: 500;
|
||
|
|
color: $color;
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
.time {
|
||
|
|
margin-left: 50rpx;
|
||
|
|
font-size: 24rpx;
|
||
|
|
color: #999999;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</style>
|