公司演示版e鹿悦游
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 
CjyTravel/subPageB/suggest/jianyiDetail.vue

192 lines
5.2 KiB

<template>
<view class="m-content">
<view class="m-card">
<view class="m-card-header">
<view class="m-card-header-title">{{ type == "1" ? '投诉' : '建议' }}信息</view>
</view>
<view class="n-card-body">
<view class="m-card-item">
<view class="m-card-item-label">对象:</view>
<view class="m-card-item-value">{{ complaintInfo.ctype || '-' }}</view>
</view>
<view class="m-card-item">
<view class="m-card-item-label">原因:</view>
<view class="m-card-item-value">{{ complaintInfo.creason || '-' }}</view>
</view>
<view class="m-card-item">
<view class="m-card-item-label">证据:</view>
<view class="m-card-item-value">
<image v-for="(items, indexs) in complaintInfo.cimages" :src="imgUrl + items" class="sug_img"
mode="aspectFill"></image>
</view>
</view>
<view class="m-card-item">
<view class="m-card-item-label">位置:</view>
<view class="m-card-item-value">{{ complaintInfo.address || '-' }}</view>
</view>
</view>
</view>
<view class="m-card" v-if="complaintInfo.complaintReplyDO">
<view class="m-card-header">
<view class="m-card-header-title">回复信息</view>
</view>
<view class="n-card-body">
<view class="m-card-item flex-column">
<view class="m-card-item-label">回复内容:</view>
<view class="m-card-item-value">
<u-parse :content="complaintInfo.complaintReplyDO.content || '暂无信息'" />
</view>
</view>
<view class="m-card-item">
<view class="m-card-item-label">回复图集:</view>
<view class="m-card-item-value">
<image v-for="(items, indexs) in complaintInfo.complaintReplyDO.images" :src="items" class="sug_img"
mode="aspectFill"></image>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
import uParse from "../components/gaoyia-parse/parse.vue";
export default ({
components: {
uParse,
},
data() {
return {
type: "1",
imgUrl: this.$config.ROOTPATH,
complaintInfo: null,
}
},
computed: {},
methods: {
getComplaintinfo(val) {
var data = {
id: val
}
this.$Request.get(this.$config.getComplaintinfo, data, null, null, false, false).then(res => {
console.log(res)
if (res.data.cimages != null && res.data.cimages != undefined) {
if (res.data.cimages.includes(',')) {
res.data.cimages = res.data.cimages.split(',')
} else {
res.data.cimages = [res.data.cimages]
}
}
if (res.data.complaintReplyDO && res.data.complaintReplyDO.images) {
if (res.data.complaintReplyDO.images.includes(',')) {
res.data.complaintReplyDO.images = res.data.complaintReplyDO.images.split(',')
} else {
res.data.complaintReplyDO.images = [res.data.complaintReplyDO.images]
}
}
this.complaintInfo = res.data
})
}
},
watch: {},
// 页面周期函数--监听页面加载
onLoad(options) {
if (options) {
console.log(options)
this.type = options.type
this.getComplaintinfo(options.id)
}
},
// 页面周期函数--监听页面初次渲染完成
onReady() {
uni.setNavigationBarTitle({
title: this.type == "1" ? '投诉详情' : '建议详情'
});
},
// 页面周期函数--监听页面显示(not-nvue)
onShow() { },
// 页面周期函数--监听页面隐藏
onHide() { },
// 页面周期函数--监听页面卸载
onUnload() { },
// 页面处理函数--监听用户下拉动作
// onPullDownRefresh() { uni.stopPullDownRefresh(); },
// 页面处理函数--监听用户上拉触底
// onReachBottom() {},
// 页面处理函数--监听页面滚动(not-nvue)
// onPageScroll(event) {},
// 页面处理函数--用户点击右上角分享
// onShareAppMessage(options) {},
})
</script>
<style scoped lang="scss">
.m-content {
padding-bottom: 150rpx;
.m-card {
margin: 20rpx;
padding: 20rpx 30rpx;
border: solid 1rpx #dcedff;
box-shadow: 0 0 10px 1px #dcedff;
border-radius: 20rpx;
background-color: #fff;
.m-card-header {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 20rpx;
border-bottom: solid 1rpx #eee;
padding-bottom: 20rpx;
.m-card-header-title {
font-size: 35rpx;
color: #363636;
}
}
.n-card-body {
display: flex;
flex-direction: column;
.m-card-item {
display: flex;
justify-content: flex-start;
margin-bottom: 30rpx;
.m-card-item-label {
flex: none;
margin-right: 10rpx;
}
.m-card-item-value {
flex: 1;
min-width: 0;
display: flex;
flex-wrap: wrap;
}
}
.flex-column{
flex-direction: column;
.m-card-item-label{
margin-bottom: 20rpx;
}
}
}
}
}
image {
width: 200rpx;
height: 200rpx;
}
</style>