lanan-repair/pages/detedetails/detedetails.vue
2024-09-24 21:20:37 +08:00

445 lines
9.1 KiB
Vue

<!-- 默认复制 -->
<template>
<view class="content">
<view class="c-top">
<view class="" @click="getback()">
<uni-icons type="left" size="18"></uni-icons>
</view>
<view class="c-title">{{obj.newsTitle}}</view>
<view class=""></view>
</view>
<!-- html -->
<view class="c-content">
<!-- <view class="cont-title">
</view> -->
<view class="cont-gongs">{{obj.publishUnit}}</view>
<u-parse :content="obj.newsContent" :tagStyle="style"></u-parse>
<view class="videobox" v-if="videoList != null ">
<video :src="baseUrl+ videoList" controls></video>
</view>
<view class="cont-time">{{createTime ? createTime.substring(0,createTime.length - 8) : ''}}</view>
</view>
<!-- 评论 -->
<view class="pinglist">
<view class="list-top">
<view class="t-t-t">评论</view>
<view class="gang"></view>
</view>
<view class="view-box" v-for="(item,index) in pinglunlist" :key="index">
<view class="touxiang">
<image src="http://www.nuoyunr.com/lananRsc/wwwx.png" mode=""></image>
</view>
<view class="vb-right">
<view class="vb-title">{{item.realName}}</view>
<view class="vb-nr">{{item.context}}</view>
<view class="vb-bottom">
<view class="zuo-hui">{{item.createTime}}</view>
<view class="s-botm" v-if="user.userId == item.createBy" @click="dialogToggle(item.id)">
<!-- getdelete(item.id) -->
<text>删除</text>
</view>
</view>
</view>
</view>
<view style="width: 100%; height: 50px;"></view>
</view>
<!-- <tabBar></tabBar> -->
<view class="pinginput">
<view class="left-input">
<input type="text" placeholder="评论..." v-model="inputvalue">
<view class="t-right" @click="getfasong()">发送</view>
</view>
<view class="right-xuan">
<!-- 收藏 -->
<view class="sc-botm" @click="getshoucang()">
<view class="icon-sc">
<image src="http://www.nuoyunr.com/lananRsc/detection/sc.png" v-if="shoucang == false"></image>
<image src="http://www.nuoyunr.com/lananRsc/detection/scx.png" v-if="shoucang == true"></image>
</view>
<view class="">{{obj.collectNum}}</view>
</view>
<!-- 点赞 -->
<view class="sc-botm" @click="getdianzan()">
<view class="icon-sc">
<image src="http://www.nuoyunr.com/lananRsc/detection/dz.png" v-if="dianzan == false"></image>
<image src="http://www.nuoyunr.com/lananRsc/detection/dzx.png" v-if="dianzan == true"></image>
</view>
<view class="">{{obj.likeNum}}</view>
</view>
</view>
</view>
<uni-popup ref="alertDialog" type="dialog">
<uni-popup-dialog :type="msgType" cancelText="关闭" confirmText="同意" title="通知" content="您确认删除吗" @confirm="dialogConfirm()"
@close="dialogClose"></uni-popup-dialog>
</uni-popup>
</view>
</template>
<script>
import config from '@/config'
import request from '../../utils/request';
import tabBar from '../../components/tabBar/tabBar.vue'
import uniPopup from '../../uni_modules/uni-popup/components/uni-popup/uni-popup.vue';
export default{
data(){
return{
id:'',
obj:{},
style:{
image:'width: 100%;'
},
inputvalue:'',
createTime:'',
pinglun:false,
dianzan:false,
shoucang:false,
baseUrl:this.$baseUrl,
pinglunlist:[],
arrlist:[],
user:{},
videoList:null,
type: 'center',
msgType: 'success',
messageText: '这是一条成功提示',
}
},
components:{
tabBar,
},
onLoad(option) {
this.id = option.id
console.log('执行了');
this.getlistindex()
},
onShow() {
this.user = uni.getStorageSync('userinfo')
console.log('userinfo',this.user);
},
methods:{
//dianzan
async getdianzan(){
let data = {
newsId:this.id,
type:'like',
}
let res = await request({
url:'/admin-api/appInspection/news/likeOrCollect',
method: 'post',
params:data
})
this.getlistindex()
},
//收藏
async getshoucang(){
let data = {
newsId:this.id,
type:'collect',
}
let res = await request({
url:'/admin-api/appInspection/news/likeOrCollect',
method: 'post',
params:data
})
this.getlistindex()
},
async getdelete(id){
let data ={
commentId :id,
}
let res = await request({
url:'/admin-api/appInspection/news/delNewsComment',
method: 'post',
params:data
})
this.getlistindex()
},
//评论
getpinglun(){
this.pinglun =! this.pinglun
},
getback(){
uni.navigateBack({
delta:1,
})
},
async getnew(){
let data ={
newsId:this.id,
}
let res = await request({
url:'/admin-api/appInspection/news/getDetail',
method: 'get',
params:data
})
console.log(res);
},
async getlistindex(){
let res = await request({
url: '/admin-api/appInspection/news/getDetail?newsId='+this.id,
method: 'get',
})
console.log(res);
this.obj = res.data
this.videoList = res.data.videoUrl
if(res.data.isLike == '1'){
this.dianzan = true
}else{
this.dianzan = false
}
if(res.data.isCollect == '1'){
this.shoucang = true
}else{
this.shoucang = false
}
this.createTime = this.obj.createTime
let resx = await request({
url:'/admin-api/appInspection/news/getCommentList?newsId='+this.id,
})
this.pinglunlist = resx.rows
console.log(resx);
let ress = await request({
url: '/admin-api/appInspection/news/addReadNum?newsId='+this.id,
method: 'post',
})
},
async getfasong(){
if(!this.inputvalue){
uni.showToast({
title:'请输入评论内容',
icon:'none'
})
return
}
let data ={
newsId:this.id,
context:this.inputvalue,
}
let res = await request({
url: '/admin-api/appInspection/news/addInspectionNewsComment',
method: 'post',
data:data
})
console.log(res);
this.inputvalue =''
this.getlistindex()
},
dialogToggle(id) {
this.deleteid = id
this.$refs.alertDialog.open()
},
dialogClose() {
console.log('点击关闭')
},
dialogConfirm() {
console.log('点击确认')
this.getdelete(this.deleteid)
},
}
}
</script>
<style scoped lang="scss">
.content{
width: 100%;
height: calc(100vh);
background-color: #F6F6F6;
box-sizing: border-box;
// padding-top: 45px;
}
.cont-title{
width: 100%;
text-align: center;
font-size: 24px;
font-weight: bold;
color: #333333;
margin-bottom: 5px;
}
.cont-gongs{
text-align: right;
font-size: 14px;
font-weight: 400;
color: #666666;
margin-bottom: 25px;
}
.videobox{
width: 100%;
margin: 0 auto;
}
.cont-time{
font-size: 16px;
font-weight: 400;
color: #666666;
margin-bottom: 25px;
}
.top-icon{
margin-bottom: 45px;
}
.c-top{
width: 100%;
box-sizing: border-box;
padding: 15px;
padding-top: 15%;
display: flex;
justify-content: space-between;
align-items: center;
background-color: white;
}
.c-title{
font-size: 18px;
font-weight: bold
}
.c-content{
width: 100%;
background-color: white;
box-sizing: border-box;
padding: 15px;
}
.pinglist{
width: 100%;
background-color: white;
margin-top: 15px;
box-sizing: border-box;
padding: 15px;
border-radius: 16px 16px 0px 0px;
}
.pinginput{
width: 100%;
// height: 50px;
background-color: white;
display: flex;
position: fixed;
bottom: 0px;
z-index: 99;
box-sizing: border-box;
padding: 15px;
padding-bottom: 35px;
display: flex;
align-items: center;
justify-content: space-between;
}
.left-input{
width: 50%;
height: 35px;
border-radius: 50px;
background: #E7E7E7;
display: flex;
align-items: center;
justify-content: space-between;
padding: 0 20px;
font-size: 16px;
}
.t-right{
width: 60px;
border-left:1px solid #a6a6a6 ;
font-size: 16px;
color: #a6a6a6;
box-sizing: border-box;
padding-left: 5px;
}
.list-top{
}
.gang{
width: 8%;
height: 4px;
background: #0D2E8D;
}
.view-box{
border-bottom: 1px solid #D8D8D8;
display: flex;
justify-content: space-between;
margin-top: 10px;
box-sizing: border-box;
padding-bottom: 9px;
}
.touxiang{
width: 40px;
height: 40px;
background: #D8D8D8;
border-radius: 50%;
overflow: hidden;
image{
width: 100%;
height: 100%;
}
}
.vb-right{
width: 85%;
}
.vb-nr{
}
.vb-bottom{
width: 100%;
display: flex;
justify-content: space-between;
align-items: center;
margin-top: 5px;
}
.vb-title{
font-size: 16px;
font-weight: 400;
color: #666666;
}
.right-xuan{
display: flex;
}
.sc-botm{
display: flex;
align-items: center;
margin-right: 5px;
}
.icon-sc{
width: 20px;
height: 20px;
margin-right: 5px;
image{
width: 100%;
height: 100%;
}
}
.s-botm{
display: flex;
align-items: center;
margin-right: 5px;
color: crimson;
}
.icon-s{
width: 18px;
height: 18px;
margin-right: 5px;
image{
width: 100%;
height: 100%;
}
}
.font-s{
font-size: 15px;
line-height: 16px;
}
.zuo-hui{
font-size: 15px;
font-weight: 400;
color: #B7B7B7;
}
</style>