93 lines
1.5 KiB
Vue
93 lines
1.5 KiB
Vue
<template>
|
||
<view class="newDetail">
|
||
<view class="title">
|
||
{{info.title}}
|
||
</view>
|
||
<view class="categoryName">
|
||
{{info.categoryName}}
|
||
</view>
|
||
<view class="newsInfo">
|
||
<view class="author">
|
||
作者：{{info.author}}
|
||
</view>
|
||
<view class="createTime">
|
||
时间：{{info.createTime}}
|
||
</view>
|
||
</view>
|
||
<view class="img">
|
||
<image class="image" :src="baseUrl+info.imgUrl" mode=""></image>
|
||
</view>
|
||
<view class="content" v-html="info.content"></view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
data() {
|
||
return {
|
||
info:{},
|
||
baseUrl:uni.$u.http.config.baseURL
|
||
}
|
||
},
|
||
onLoad(option) {
|
||
this.getDetail(option.id)
|
||
},
|
||
methods: {
|
||
getDetail(id){
|
||
uni.$u.http.get("/iot/news/"+id).then(res=>{
|
||
this.info=res.data
|
||
})
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
.newDetail{
|
||
height: 100vh;
|
||
background-color: #fff;
|
||
padding: 30rpx;
|
||
box-sizing: border-box;
|
||
background-color: #fff;
|
||
.title{
|
||
font-weight: 900;
|
||
font-size: 40rpx;
|
||
}
|
||
.categoryName{
|
||
background-color: #2b7;
|
||
color:#fff;
|
||
display: inline;
|
||
font-size: 22rpx;
|
||
padding:5rpx 10rpx;
|
||
border-radius: 8rpx;
|
||
}
|
||
.newsInfo{
|
||
display: flex;
|
||
font-size: 26rpx;
|
||
font-weight: 400;
|
||
margin: 20rpx 0;
|
||
color: #616161;
|
||
.author{
|
||
margin-right: 20rpx;
|
||
}
|
||
.createTime{
|
||
margin-right: 20rpx;
|
||
}
|
||
}
|
||
.img{
|
||
width: 100%;
|
||
height: 300rpx;
|
||
overflow: hidden;
|
||
margin: 40rpx 0;
|
||
.image{
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
}
|
||
.content{
|
||
line-height: 60rpx;
|
||
padding:0 20rpx;
|
||
}
|
||
}
|
||
</style>
|