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.

310 lines
7.7 KiB

<template>
<view class="boxContent">
<view class="box-header">
</view>
<view class="list" style="padding-top: 20rpx;">
<block>
<u-card :title="form.created_at" padding="20" margin="20rpx" :border="true">
<view class="" slot="body">
<u-row gutter="16">
<u-col span="4">
<view class="demo-layout bg-purple">地址/排放点</view>
</u-col>
<u-col span="12">
<view class="demo-layout bg-purple-light">{{form.address}}</view>
</u-col>
</u-row>
<u-row gutter="16">
<u-col span="3">
<view class="demo-layout bg-purple">养护类型</view>
</u-col>
<u-col span="9">
<view class="demo-layout bg-purple-light">{{form.typeName}}</view>
</u-col>
</u-row>
<u-row gutter="16">
<u-col span="3">
<view class="demo-layout bg-purple">所属片区</view>
</u-col>
<u-col span="9">
<view class="demo-layout bg-purple-light">{{form.areaName}}</view>
</u-col>
</u-row>
<u-row gutter="16">
<u-col span="3">
<view class="demo-layout bg-purple">描述</view>
</u-col>
<u-col span="12">
<view class="demo-layout bg-purple-light">{{form.content}}</view>
</u-col>
</u-row>
<u-row gutter="16">
<u-col span="3">
<view class="demo-layout bg-purple">现场图片</view>
</u-col>
<u-col span="12" v-for="(item,index) in filesList">
<u-image style="margin:20rpx 0" width="100%" height="300rpx" :src="item.files.url"></u-image>
</u-col>
</u-row>
<view v-if="formshow">
<u-row gutter="16">
<u-col span="3">
<view class="demo-layout bg-purple">是否解决</view>
</u-col>
<u-col span="9">
<view class="demo-layout bg-purple-light">{{form.solveName}}</view>
</u-col>
</u-row>
<u-row gutter="16" v-if="lawshow">
<u-col span="3">
<view class="demo-layout bg-purple">是否违法</view>
</u-col>
<u-col span="9">
<view class="demo-layout bg-purple-light">{{form.lawName}}</view>
</u-col>
</u-row>
<u-row gutter="16">
<u-col span="4">
<view class="demo-layout bg-purple">临时处理办法</view>
</u-col>
<u-col span="12">
<view class="demo-layout bg-purple-light">{{form.deal_content}}</view>
</u-col>
</u-row>
<u-row gutter="16" v-if="form.is_solve == 1">
<u-col span="3">
<view class="demo-layout bg-purple">处理结果</view>
</u-col>
<u-col span="12">
<view class="demo-layout bg-purple-light">{{form.deal_result}}</view>
</u-col>
</u-row>
<u-row gutter="16" v-if="form.is_solve == 1">
<u-col span="4">
<view class="demo-layout bg-purple">处理后图片</view>
</u-col>
<u-col span="12" v-for="(item,index) in dealFilesList">
<u-image style="margin:20rpx 0" width="100%" height="300rpx" :src="item.files.url"></u-image>
</u-col>
</u-row>
</view>
</view>
</u-card>
</block>
</view>
</view>
</template>
<script>
export default {
data() {
return {
formshow:true,
lawshow:true,
lists:{},
form:{},
filesList:[],
dealFilesList:[],
}
},
onLoad(options) {
if(options.id){
this.loadInfo(options.id)
}
},
methods: {
loadInfo: function(id) {
var that = this;
this.util.request({
method:"get",
api: '/api/mobile/rain-maintains/show',
customLoading: false,
data: {
id:id
},
utilSuccess: function(result) {
that.lists = result
switch(result.type){
case 1:
case 2:
that.form = result.circulation_info;
let _files = [];
for (var mod of result.circulation_info.circulation_files) {
let m = Object.assign({}, mod);
m.url = mod.files.url;
m.id = mod.files.id;
m.photoType = "before";
_files.push(m);
}
that.filesList = _files;
let _filesafter = [];
for (var mod of result.circulation_info.circulation_deal_files) {
let m = Object.assign({}, mod);
m.url = mod.files.url;
m.id = mod.files.id;
m.photoType = "after";
_filesafter.push(m);
}
that.dealFilesList = _filesafter;
that.form.type = result.type
result.circulation_info.is_solve==0 ? that.form.solveName="否":that.form.solveName="是"
result.circulation_info.is_law==0 ? that.form.lawName="否":that.form.lawName="是"
that.form.areaName = result.area_info.name
that.form.created_at = result.created_at
break;
case 3:
that.lawshow = false
that.form = result.help_discharge_info;
let discharge_files = [];
for (var mod of result.help_discharge_info.help_discharge_files) {
let m = Object.assign({}, mod);
m.url = mod.files.url;
m.id = mod.files.id;
m.photoType = "before";
discharge_files.push(m);
}
that.filesList = discharge_files;
let discharge_filesafter = [];
for (var mod of result.help_discharge_info.help_discharge_deal_files) {
let m = Object.assign({}, mod);
m.url = mod.files.url;
m.id = mod.files.id;
m.photoType = "after";
discharge_filesafter.push(m);
}
that.dealFilesList = discharge_filesafter;
that.form.type = result.type
that.form.typeName = "汛期助排"
result.help_discharge_info.is_solve==0 ? that.form.solveName="否":that.form.solveName="是"
that.form.areaName = result.area_info.name
that.form.created_at = result.created_at
break;
case 4:
that.formshow = false
that.form = result.mire_info;
let mire_files = [];
for (var mod of result.mire_info.mire_files) {
let m = Object.assign({}, mod);
m.url = mod.files.url;
m.id = mod.files.id;
m.photoType = "before";
mire_files.push(m);
}
that.filesList =mire_files;
that.form.type = result.type
that.form.typeName = "污泥外运"
that.form.areaName = result.area_info.name
that.form.created_at = result.created_at
break;
}
},
utilFail: function(res) {
this.util.alert(res);
}
});
}
}
}
</script>
<style>
.boxContent {
background: #f3f4f6;
min-height: 100vh;
}
.footer {
display: flex;
justify-content: flex-end;
}
.box-header {
position: fixed;
top: 0;
width: 100%;
z-index: 99;
}
.u-row {
margin: 10rpx 0;
font-size: 28rpx;
}
.u-card{
z-index: 1;
}
</style>
<style scoped lang="scss">
.overflowmask{
overflow: hidden;
}
.loadmore{
padding:24rpx!important
}
.search-wrap {
background: #007AFF;
padding: 20rpx;
}
.u-config-wrap {
padding: 30rpx;
}
.bg-purple {
font-weight: bold;
}
.slot-content {
background-color: #FFFFFF;
padding: 24rpx;
.item-box {
margin-bottom: 50rpx;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
.item {
border: 1px solid $u-type-primary;
color: $u-type-primary;
padding: 8rpx 40rpx;
border-radius: 100rpx;
margin-top: 30rpx;
}
.active {
color: #FFFFFF;
background-color: $u-type-primary;
}
}
}
</style>