<template>
|
<div class='sa-ins_work_detail'>
|
<v-header title="查看"></v-header>
|
<div class="add">
|
<span class="back-color" @click="$router.back()"><i class="el-icon-arrow-left"></i>返回上一级</span>
|
</div>
|
<h6><b>安全工作记录表</b><i class="el-icon-download down-icon" @click.stop="down(details.id)"></i>
|
<!-- <el-button
|
type="primary"
|
size="small"
|
class="dy-margin"
|
v-print="'#recordDetail'"
|
>打印</el-button> -->
|
</h6>
|
<div class="head a">
|
<p class="l">巡查类别： {{details.patrolType}}</p>
|
<p class="f">
|
<span>{{details.createAt && details.createAt.substr(0,10)}}</span><span>{{wea}}</span>
|
</p>
|
<p class="r"></p>
|
</div>
|
<div class="cont a" id="recordDetail">
|
<table class="border_default table_bgc_default">
|
<tr>
|
<td><b>所属社区</b></td>
|
<td>{{details.communityName}}</td>
|
<td><b>巡查地址</b></td>
|
<td :title="details.address">{{details.address}}</td>
|
</tr>
|
<tr>
|
<td><b>工作记录</b></td>
|
<td colspan="3">
|
<p class="left">{{details.findRecord}}</p>
|
<!-- <p class="left">{{details.recordContent}}</p> -->
|
<div class="images"><img
|
:src="item || '../../static/image/noimage.jpg'"
|
alt=""
|
v-for="(item,index) in details.recordPhoto"
|
:key="index"
|
@click="onScaleImage(item)"
|
></div>
|
</td>
|
</tr>
|
<tr>
|
<td><b>备注</b></td>
|
<td colspan="3">{{details.remark}}</td>
|
</tr>
|
<tr>
|
<td><b>检查时间</b></td>
|
<td>{{details.createAt}}</td>
|
<td><b>工作人员</b></td>
|
<td>{{details.personName}}</td>
|
</tr>
|
</table>
|
</div>
|
<div class="foot a">
|
<p class="l">填报人：{{details.createName}}</p>
|
<p class="f">
|
</p>
|
<p class="r">填报时间：{{details.createAt}}</p>
|
</div>
|
</div>
|
</template>
|
|
<script>
|
export default {
|
props: {},
|
components: {},
|
data() {
|
return {
|
details:[],
|
weather:''
|
};
|
},
|
watch: {},
|
|
computed: {
|
wea() {
|
let wea = this.weather;
|
if (!wea.weather) return "";
|
return (
|
wea.city +
|
'-'+
|
wea.weather +
|
wea.temperature +
|
"℃ " +
|
wea.winddirection +
|
"风" +
|
wea.windpower +
|
"级"
|
);
|
},
|
},
|
|
mounted() {
|
/**获取城市 天气 */
|
this.$api.mock.getIp((e) => {
|
if (e.adcode) {
|
this.$api.mock.getWeather(510400, (res) => {
|
this.weather = (res.lives || [])[0] || {};
|
});
|
}
|
});
|
|
this.id = this.$route.params.id;
|
let isrecord = this.$route.query.v;
|
this.init()
|
},
|
|
methods: {
|
init() {
|
this.$api.get("patrolRecord/detailSafetyWorkRecord", { safetyWorkRecordId:this.id}, (e) => {
|
e.recordPhoto = !e.recordPhoto || e.recordPhoto == ' ' ? [] : e.recordPhoto.split(',')
|
this.details = e;
|
});
|
},
|
|
// 查看大图
|
onScaleImage(v) {
|
this.$store.dispatch("setImage", {
|
time: Date.now(),
|
title: '',
|
pic: v,
|
tool: true,
|
});
|
},
|
|
down(v) {
|
let id = [];
|
id.push(v)
|
this.$api.post("patrolRecord/export/safetyWorkRecord", id, (e) => {
|
window.location.href = e;
|
});
|
}
|
},
|
};
|
</script>
|
<style lang='less' scoped>
|
.sa-ins_work_detail {
|
overflow-y: auto;
|
box-sizing: border-box;
|
padding-right: 50px;
|
.add {
|
text-align: right;
|
padding-bottom: 20px;
|
.back-color {
|
color: #409EFF;
|
cursor: pointer;
|
}
|
}
|
.dy-margin {
|
margin-left: 10px;
|
}
|
.down-icon {
|
cursor: pointer;
|
color: #409EFF;
|
}
|
h6 {
|
text-align: center;
|
margin-bottom: 25px;
|
span {
|
color: rgb(61, 189, 228);
|
font-size: 18px;
|
cursor: pointer;
|
margin-left: 10px;
|
transform: scale(1.2);
|
display: inline-block;
|
}
|
}
|
.a {
|
max-width: 940px;
|
margin: 0 auto 15px;
|
}
|
td {
|
padding: 25px 10px;
|
font-size: 13px;
|
white-space: normal;
|
}
|
.left {
|
text-align: left;
|
}
|
.images {
|
display: flex;
|
flex-wrap: wrap;
|
img {
|
display: block;
|
margin: 0 8px 5px 0;
|
width: 120px;
|
height: 90px;
|
max-height: 90px;
|
background-color: #eee;
|
}
|
}
|
.head,
|
.foot {
|
display: flex;
|
font-size: 14px;
|
.l,
|
.r {
|
min-width: 200px;
|
}
|
.r {
|
text-align: right;
|
}
|
.f {
|
flex: 1;
|
display: flex;
|
justify-content: space-between;
|
padding: 0 30px;
|
span {
|
text-align: center;
|
flex: 1;
|
}
|
}
|
}
|
}
|
</style>
|
