public-opinion/pagesA/detail/detail.vue

197 lines
6.7 KiB
Vue
Raw Normal View History

2022-07-31 08:27:56 +00:00
<template>
<view>
2022-07-31 09:43:52 +00:00
<view class="pad-zy20 fon24" v-if="loading">
2022-07-31 08:27:56 +00:00
<view class="disjbac fon30 bbot pad-sx30">
<view class="colb bold flexs">序号</view>
2022-07-31 08:44:43 +00:00
<view class="col9">{{detail.coding}}</view>
2022-07-31 08:27:56 +00:00
</view>
<view class="disjbac fon30 bbot pad-sx30">
<view class="colb bold flexs">审核状态</view>
2022-07-31 08:44:43 +00:00
<view class="col9">{{detail.state_text}}</view>
2022-07-31 08:27:56 +00:00
</view>
2022-07-31 08:44:43 +00:00
<view class="disjbac bbot pad-sx20" v-if="detail.u_name">
2022-07-31 08:27:56 +00:00
<view class="fon30 colb bold flexs">真实姓名</view>
2022-07-31 08:44:43 +00:00
<view class="col9">{{detail.u_name}}</view>
2022-07-31 08:27:56 +00:00
</view>
2022-07-31 08:44:43 +00:00
<view class="disjbac bbot pad-sx20" v-if="detail.u_name">
2022-07-31 08:27:56 +00:00
<view class="fon30 colb bold flexs">联系方式</view>
2022-07-31 08:44:43 +00:00
<view class="col9">{{detail.u_phone}}</view>
2022-07-31 08:27:56 +00:00
</view>
<view class="disjbac fon30 bbot pad-sx30">
<view class="colb bold flexs">社区</view>
2022-07-31 08:44:43 +00:00
<view class="col9">{{detail.community.name}}</view>
2022-07-31 08:27:56 +00:00
</view>
<view class="disjbac fon30 bbot pad-sx30">
<view class="colb bold flexs"></view>
2022-07-31 08:44:43 +00:00
<view class="col9">{{detail.village.name}}</view>
2022-07-31 08:27:56 +00:00
</view>
<view class="dis fon30 bbot pad-sx30">
<view class="colb bold flexs">图片</view>
2022-07-31 08:44:43 +00:00
<view class="disac width100 fe" v-if="detail.images">
<image :src="item" v-for="(item,index) in detail.images.split(',')" :key="index" @tap="preVedio(index,0)" mode="aspectFill" class="width155 radius30 mar-z20"></image>
2022-07-31 08:27:56 +00:00
</view>
2022-07-31 09:43:52 +00:00
<view class="disac col9 width100 fe" v-else></view>
2022-07-31 08:27:56 +00:00
</view>
<view class="dis fon30 bbot pad-sx30">
<view class="colb bold flexs">视频</view>
2022-07-31 08:44:43 +00:00
<view class="disac width100 fe" v-if="detail.videos">
<view class="width155 radius30 mar-z20" v-for="(item,index) in detail.videos.split(',')" :key="index" style="overflow: hidden;" @tap="preVedio(index,1)">
<video :src="item" :controls="false" class="width155 radius30"></video>
</view>
2022-07-31 08:27:56 +00:00
</view>
2022-07-31 09:43:52 +00:00
<view class="disac col9 width100 fe" v-else></view>
2022-07-31 08:27:56 +00:00
</view>
<view class="disjb bbot pad-sx20">
<view class="fon30 colb bold flexs">描述文案</view>
2022-07-31 09:43:52 +00:00
<view class="col9 tright line-h40" style="max-width: 60%;">{{detail.description}}</view>
2022-07-31 08:27:56 +00:00
</view>
<view class="dis fon30 bbot pad-sx30">
<view class="colb bold flexs">语音</view>
2022-07-31 09:43:52 +00:00
<view class="disac col9 width100 fe" v-if="detail.audios" @tap="playVoice">
<view class="col9 radius30 disjcac fc posir mar-y20 item-box width155" style="border: 1px solid #d9d9d9;">
2022-07-31 08:27:56 +00:00
<image src="/static/icon/icon-audio.png" mode="aspectFill" style="width: 74rpx;height: 85rpx;"></image>
</view>
</view>
2022-07-31 09:43:52 +00:00
<view class="disac col9 width100 fe" v-else></view>
2022-07-31 08:27:56 +00:00
</view>
<view class="disjbac fon30 bbot pad-sx30">
<view class="colb bold flexs">类别</view>
2022-07-31 09:43:52 +00:00
<view class="col9">{{detail.type_text}}</view>
2022-07-31 08:27:56 +00:00
</view>
<view class="" style="margin: 0 -20rpx;" v-if="ifManager!=2">
<view class="disac pad-zy20 pad-x30 pad-s40">
<view class="cricle-box"></view>
<view class="fon36 mar-z20 bold">处理反馈</view>
</view>
<view class="pad-zy20 fon30" style="background-color: #f5f5f5;">
<view class="col9 pad-sx30">2021年7月19日 2130</view>
<view class="disjb bbot pad-x30">
<view class="">调查情况</view>
<view class="col9 tright" style="max-width: 50%;">情况属实马上安排人员 处理请耐心等待</view>
</view>
<view class="disjb bbot pad-sx30">
<view class="">处理结果</view>
<view class="col9 tright" style="max-width: 50%;">情况属实马上安排人员 处理请耐心等待</view>
</view>
</view>
<view class="disac pad-zy20 pad-x30 pad-s40">
<view class="cricle-box"></view>
<view class="fon36 mar-z20 bold">群众反馈</view>
</view>
<view class="pad-zy20 fon30" style="background-color: #f5f5f5;">
<view class="col9 pad-sx30">2021年7月19日 2130</view>
<view class="disjb bbot pad-x30">
<view class="">反馈意见不满意</view>
<view class="col9 tright" style="max-width: 50%;">等了好久了还没有上门 处理</view>
</view>
</view>
</view>
</view>
<view class="disjcac pad-sx50" v-if="ifManager==0">
2022-07-31 08:58:24 +00:00
<view class="disjcac enter-btn" style="margin: 0;" @tap="handleEv(detail.id)"></view>
2022-07-31 08:27:56 +00:00
</view>
<view class="disjcac pad-sx50" v-if="ifManager==1">
<view class="disjcac enter-btn" style="margin: 0;background-color: #f71200;border-color: #f71200;" @tap="reexamineEv"></view>
</view>
</view>
</template>
<script>
const recorderManager = uni.getRecorderManager();
const innerAudioContext = uni.createInnerAudioContext();
innerAudioContext.autoplay = true;
export default {
data() {
return {
2022-07-31 08:44:43 +00:00
detail:'', //工单详情
2022-07-31 08:27:56 +00:00
ifManager:0, // 是否是管理员
id:0, //工单id
2022-07-31 09:43:52 +00:00
loading:false
2022-07-31 08:27:56 +00:00
}
},
onLoad(op) {
if(op.manager) this.ifManager = op.manager;
// 查询详情
2022-07-31 08:44:43 +00:00
this.getDetailEv(op.id);
2022-07-31 08:27:56 +00:00
},
onHide() {
innerAudioContext.stop();
},
methods: {
2022-07-31 08:44:43 +00:00
// 预览视频
preVedio(index,num){
let arr = [];
let tempArr = [this.detail.images.split(','),this.detail.videos.split(',')][num];
if(tempArr.length){
tempArr.forEach(item=>{
let obj = {
url:item,
type:['image','video'][num]
}
arr.push(obj);
})
}
uni.previewMedia({
current:index,
sources:arr
})
},
2022-07-31 08:27:56 +00:00
// 播放录音
playVoice() {
2022-07-31 09:43:52 +00:00
innerAudioContext.src = this.detail.audios;
innerAudioContext.play();
2022-07-31 08:27:56 +00:00
},
// 查询工单详情
2022-07-31 08:44:43 +00:00
getDetailEv(id){
2022-07-31 09:43:52 +00:00
this.$toolAll.tools.showToast('加载中...');
2022-07-31 08:44:43 +00:00
this.$requst.post('user/opinionInfo',{id}).then(res => {
2022-07-31 08:27:56 +00:00
if(res.code==0){
2022-07-31 08:44:43 +00:00
this.detail = res.data.opinion;
2022-07-31 09:43:52 +00:00
this.loading = true;
uni.hideToast();
2022-07-31 08:27:56 +00:00
} else {
this.$toolAll.tools.showToast(res.msg);
}
uni.hideLoading();
this.isLoading = true;
})
},
// 督办复审
reexamineEv(){
this.$requst.post('/api/administrator/examine',{id:this.id}).then(res => {
if(res.code==0){
console.log(res,'督办复审');
// 返回
uni.navigateBack({
delta:1
})
} else {
this.$toolAll.tools.showToast(res.msg);
}
uni.hideLoading();
this.isLoading = true;
})
},
// 前往立即办理
handleEv(id){
uni.navigateTo({
url:`/pagesA/community/handle/handle?id=${id}`
})
},
}
}
</script>
<style>
.del-btn{
background-color: #39d091;width: 45rpx;height: 45rpx;border-radius: 100%;top: -20rpx;right: -20rpx;
}
.width155{
width: 155rpx;
height: 150rpx;
}
.item-box{border: 1px solid #FFFFFF;}
</style>