<template>
|
<div class='comminist-box'>
|
<v-header title="详情"></v-header>
|
<div class="list">
|
<div class="title">留言内容:</div>
|
<div class="cont">{{item.msgContent}}</div>
|
</div>
|
<div class="list images">
|
<div class="cont">
|
<template v-if="!item.video">
|
<img
|
class="image"
|
v-for="(i,index) in item.imgList"
|
:key="index"
|
:src="i"
|
@click="appShowImage(i,item.imgList)"
|
alt=""
|
>
|
</template>
|
<video class="video" controls v-else :src="item.imgList[0]"></video>
|
</div>
|
</div>
|
<!---->
|
<div class="list">
|
<div class="title">联系方式:</div>
|
<div class="cont">{{item.userPhone}}</div>
|
</div>
|
<!---->
|
<div class="list">
|
<div class="title">留言对象:</div>
|
<div class="cont">{{item.sendtoUserName}}</div>
|
</div>
|
<!---->
|
<div class="list">
|
<div class="title">状态:</div>
|
<div class="cont">{{item.status ==1?'待回复':'已回复'}}</div>
|
</div>
|
<!---->
|
<div class="list">
|
<div class="title">是否公开:</div>
|
<div class="cont">{{item.ispublic ==1?'公开':'保密'}}</div>
|
</div>
|
<!---->
|
<div class="list">
|
<div class="title">留言人账号:</div>
|
<div class="cont">{{item.userAccount}}</div>
|
</div>
|
<!---->
|
<div class="list">
|
<div class="title">留言人姓名:</div>
|
<div class="cont">{{item.userName}}</div>
|
</div>
|
<!---->
|
<div class="list">
|
<div class="title">留言时间:</div>
|
<div class="cont">{{item.createAt}}</div>
|
</div>
|
<div class="reply">
|
回复内容
|
</div>
|
<div
|
style="padding: 20px"
|
v-if="item.backList && item.backList.length==0"
|
>无</div>
|
<div
|
v-for="(item,index) in item.backList"
|
:key="index"
|
class="reply-list"
|
>
|
<div class="reply-title">
|
<div>{{item.userName}}</div>
|
<div>{{item.userJob}}</div>
|
<div>{{item.createAt}}</div>
|
</div>
|
<div class="reply-cont">
|
{{item.msgContent}}
|
</div>
|
</div>
|
<el-button @click="back">返回</el-button>
|
</div>
|
</template>
|
<script>
|
export default {
|
data() {
|
return {
|
item: {},
|
};
|
},
|
inject: ["appShowImage"],
|
mounted() {
|
let d = demo.$session.get("com-message-detail") || {};
|
if (d.id === this.$route.params.id * 1) {
|
this.item = d;
|
this.item.imgList = ((d.photoPah || "") + "").split(",").filter((r) => {
|
return r !== "";
|
});
|
if(this.item.imgList.length!==0){
|
this.item.video = this.item.imgList[0].indexOf('mp4')!==-1
|
}
|
|
}
|
},
|
methods: {
|
back() {
|
this.$router.back();
|
},
|
},
|
watch: {},
|
computed: {},
|
destroyed() {
|
demo.$session.clear("com-message-detail");
|
},
|
};
|
</script>
|
<style scoped lang="less">
|
.comminist-box {
|
overflow: scroll;
|
.list {
|
margin: 10px 0;
|
display: flex;
|
width: 100%;
|
box-sizing: border-box;
|
}
|
|
.title {
|
max-width: 100px;
|
}
|
|
.images .cont {
|
display: flex;
|
flex-wrap: wrap;
|
}
|
|
.cont {
|
padding-left: 10px;
|
box-sizing: border-box;
|
flex: 1;
|
}
|
|
.image {
|
width: 200px;
|
height: 150px;
|
margin: 10px;
|
}
|
.reply {
|
font-size: 20px;
|
margin: 20px 0;
|
}
|
.reply-title {
|
display: flex;
|
}
|
.reply-title div {
|
box-sizing: border-box;
|
padding: 0 20px;
|
}
|
.reply-cont {
|
padding: 20px;
|
box-sizing: border-box;
|
}
|
}
|
.video{
|
width: 300px;
|
height: 150px;
|
}
|
</style>
|
