|
|
@@ -1,198 +1,232 @@
|
|
|
<template>
|
|
|
- <div class="lookDetail">
|
|
|
- <div class="list-item">
|
|
|
- <div class="formContent-item_title">工单信息</div>
|
|
|
- <el-form ref="form" label-width="110px">
|
|
|
- <template v-for="(item, index) in formLook">
|
|
|
- <el-col :span="!!item.span ? item.span : 12" :key="index">
|
|
|
- <el-form-item :label="item.label">
|
|
|
- <template v-if="item.slot">
|
|
|
- <template v-if="item.slot === 'inspectionStatus'">
|
|
|
- <span v-if="thisItem['inspectionStatus'] == 1">待执行</span>
|
|
|
- <span v-else-if="thisItem['inspectionStatus'] == 2">执行中</span>
|
|
|
- <span v-else-if="thisItem['inspectionStatus'] == 3">已完成</span>
|
|
|
- <span v-else-if="thisItem['inspectionStatus'] == 4">已完成(超时)</span>
|
|
|
- <span v-else-if="thisItem['inspectionStatus'] == 5">已逾期</span>
|
|
|
- <span v-else>--</span>
|
|
|
- </template>
|
|
|
- </template>
|
|
|
- <template v-else>
|
|
|
- {{ thisItem[item.prop] || '--' }}
|
|
|
- </template>
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
+ <div class="lookDetail">
|
|
|
+ <div class="list-item">
|
|
|
+ <div class="formContent-item_title">工单信息</div>
|
|
|
+ <el-form
|
|
|
+ ref="form"
|
|
|
+ label-width="110px"
|
|
|
+ >
|
|
|
+ <template v-for="(item, index) in formLook">
|
|
|
+ <el-col
|
|
|
+ :span="!!item.span ? item.span : 12"
|
|
|
+ :key="index"
|
|
|
+ >
|
|
|
+ <el-form-item :label="item.label">
|
|
|
+ <template v-if="item.slot">
|
|
|
+ <template v-if="item.slot === 'inspectionStatus'">
|
|
|
+ <span v-if="thisItem['inspectionStatus'] == 1">待执行</span>
|
|
|
+ <span v-else-if="thisItem['inspectionStatus'] == 2">执行中</span>
|
|
|
+ <span v-else-if="thisItem['inspectionStatus'] == 3">已完成</span>
|
|
|
+ <span v-else-if="thisItem['inspectionStatus'] == 4">已完成(超时)</span>
|
|
|
+ <span v-else-if="thisItem['inspectionStatus'] == 5">已逾期</span>
|
|
|
+ <span v-else>--</span>
|
|
|
</template>
|
|
|
- </el-form>
|
|
|
- </div>
|
|
|
- <div class="list-item">
|
|
|
- <div class="formContent-item_title">设备巡检信息</div>
|
|
|
- <zz-table
|
|
|
- :cols="cols"
|
|
|
- :settings="{ showIndex: true, stripe: true }"
|
|
|
- :loading="mixins_onQuery"
|
|
|
- :data="mixins_list"
|
|
|
- :pageset="mixins_pageset"
|
|
|
- @page-change="pageChange"
|
|
|
+ </template>
|
|
|
+ <template v-else>
|
|
|
+ {{ thisItem[item.prop] || '--' }}
|
|
|
+ </template>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </template>
|
|
|
+ </el-form>
|
|
|
+ </div>
|
|
|
+ <div class="list-item">
|
|
|
+ <div class="formContent-item_title">设备巡检信息</div>
|
|
|
+ <zz-table
|
|
|
+ :cols="cols"
|
|
|
+ :settings="{ showIndex: true, stripe: true }"
|
|
|
+ :loading="mixins_onQuery"
|
|
|
+ :data="mixins_list"
|
|
|
+ :pageset="mixins_pageset"
|
|
|
+ @page-change="pageChange"
|
|
|
+ >
|
|
|
+ <template
|
|
|
+ slot="picturePath"
|
|
|
+ slot-scope="scope"
|
|
|
+ >
|
|
|
+ <div v-if="!!scope.row.picturePath">
|
|
|
+ <div
|
|
|
+ class="imgVdio"
|
|
|
+ v-for="item in scope.row.picturePath.split(',')"
|
|
|
+ :key="item"
|
|
|
>
|
|
|
- <template slot="picturePath" slot-scope="scope">
|
|
|
- <div v-if="!!scope.row.picturePath">
|
|
|
- <div class="imgVdio" v-for="item in scope.row.picturePath.split(',')" :key="item">
|
|
|
- <video v-if="typeVideo(item)" :src="item" @click="lookVideos(item)"></video>
|
|
|
- <el-image class="imgs" v-else :src="item" :preview-src-list="[item]"></el-image>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </template>
|
|
|
- <template slot-scope="scope" slot="opt">
|
|
|
- <div class="opt">
|
|
|
- <el-tooltip effect="light" placement="bottom" content="详情" v-if="!!scope.row.id">
|
|
|
- <i class="zoniot_font zoniot-icon-xiangqing" @click="lookDetails(scope.row)"></i>
|
|
|
- </el-tooltip>
|
|
|
- </div>
|
|
|
- </template>
|
|
|
- </zz-table>
|
|
|
- </div>
|
|
|
+ <video
|
|
|
+ v-if="typeVideo(item)"
|
|
|
+ :src="item"
|
|
|
+ @click="lookVideos(item)"
|
|
|
+ ></video>
|
|
|
+ <el-image
|
|
|
+ class="imgs"
|
|
|
+ v-else
|
|
|
+ :src="item"
|
|
|
+ :preview-src-list="[item]"
|
|
|
+ ></el-image>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ <template
|
|
|
+ slot-scope="scope"
|
|
|
+ slot="opt"
|
|
|
+ >
|
|
|
+ <div class="opt">
|
|
|
+ <el-tooltip
|
|
|
+ effect="light"
|
|
|
+ placement="bottom"
|
|
|
+ content="详情"
|
|
|
+ v-if="!!scope.row.id"
|
|
|
+ >
|
|
|
+ <i
|
|
|
+ class="zoniot_font zoniot-icon-xiangqing"
|
|
|
+ @click="lookDetails(scope.row)"
|
|
|
+ ></i>
|
|
|
+ </el-tooltip>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </zz-table>
|
|
|
</div>
|
|
|
+ </div>
|
|
|
</template>
|
|
|
<script >
|
|
|
import list from '@utils/list.js';
|
|
|
export default {
|
|
|
- props: ['params'],
|
|
|
- mixins: [list],
|
|
|
- data() {
|
|
|
- return {
|
|
|
- formLook: [
|
|
|
- {
|
|
|
- label: '所属社区:',
|
|
|
- prop: 'communityName'
|
|
|
- },
|
|
|
- {
|
|
|
- label: '任务名称:',
|
|
|
- prop: 'inspectionName'
|
|
|
- },
|
|
|
- {
|
|
|
- label: '设备/设施类型:',
|
|
|
- prop: 'typeValue'
|
|
|
- },
|
|
|
- {
|
|
|
- label: '巡检人员:',
|
|
|
- prop: 'peopleName'
|
|
|
- },
|
|
|
- {
|
|
|
- label: '计划开始时间:',
|
|
|
- prop: 'startDate'
|
|
|
- },
|
|
|
- {
|
|
|
- label: '计划结束时间:',
|
|
|
- prop: 'endDate'
|
|
|
- },
|
|
|
- {
|
|
|
- label: '实际开始时间:',
|
|
|
- prop: 'startTime'
|
|
|
- },
|
|
|
- {
|
|
|
- label: '实际结束时间:',
|
|
|
- prop: 'endTime'
|
|
|
- },
|
|
|
- {
|
|
|
- label: '状态:',
|
|
|
- prop: 'inspectionStatus',
|
|
|
- slot: 'inspectionStatus'
|
|
|
- }
|
|
|
- ],
|
|
|
- cols: [
|
|
|
- {
|
|
|
- label: '设备编号',
|
|
|
- prop: 'no'
|
|
|
- },
|
|
|
- {
|
|
|
- label: '设备名称',
|
|
|
- prop: 'name'
|
|
|
- },
|
|
|
- {
|
|
|
- label: '地址',
|
|
|
- prop: 'address'
|
|
|
- },
|
|
|
- {
|
|
|
- label: '巡检时间',
|
|
|
- prop: 'checkTime'
|
|
|
- },
|
|
|
- {
|
|
|
- label: '巡检结果',
|
|
|
- prop: 'result'
|
|
|
- },
|
|
|
- {
|
|
|
- label: '图片/视频',
|
|
|
- prop: 'picturePath',
|
|
|
- slot: 'picturePath'
|
|
|
- },
|
|
|
- {
|
|
|
- label: '操作',
|
|
|
- prop: 'opt',
|
|
|
- slot: 'opt'
|
|
|
- }
|
|
|
- ],
|
|
|
- thisItem: {},
|
|
|
- mixins_post: 'post'
|
|
|
- };
|
|
|
- },
|
|
|
-
|
|
|
- methods: {
|
|
|
- lookDetails(row) {
|
|
|
- new Promise((resolve) => {
|
|
|
- this.$store.dispatch('addPopup', {
|
|
|
- url: '/facilityInspections/popups/itemDetails.vue',
|
|
|
- width: '500px',
|
|
|
- height: '500px',
|
|
|
- props: {
|
|
|
- data: row,
|
|
|
- callback: resolve
|
|
|
- },
|
|
|
- showConfirmButton: true,
|
|
|
- showCancelButton: true,
|
|
|
- hideStar: true,
|
|
|
- title: '巡检项详情'
|
|
|
- });
|
|
|
- }).then(() => {
|
|
|
- this.mixins_search();
|
|
|
- });
|
|
|
+ props: ['params'],
|
|
|
+ mixins: [list],
|
|
|
+ data () {
|
|
|
+ return {
|
|
|
+ formLook: [
|
|
|
+ {
|
|
|
+ label: '所属社区:',
|
|
|
+ prop: 'communityName'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '任务名称:',
|
|
|
+ prop: 'inspectionName'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '设备/设施类型:',
|
|
|
+ prop: 'typeValue'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '巡检人员:',
|
|
|
+ prop: 'peopleName'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '计划开始时间:',
|
|
|
+ prop: 'startDate'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '计划结束时间:',
|
|
|
+ prop: 'endDate'
|
|
|
},
|
|
|
- getDatali(id) {
|
|
|
- this.mixins_dataUrl = '/sc-community/inspectionRecord/findDetail';
|
|
|
- this.mixins_query = {
|
|
|
- id: id,
|
|
|
- type: this.params.data.type
|
|
|
- };
|
|
|
- this.mixins_search();
|
|
|
+ {
|
|
|
+ label: '实际开始时间:',
|
|
|
+ prop: 'startTime'
|
|
|
},
|
|
|
- typeVideo(str) {
|
|
|
- let type = str.slice(str.lastIndexOf('.') + 1, str.length);
|
|
|
- let videoType = ['mp4'];
|
|
|
- return videoType.includes(type);
|
|
|
+ {
|
|
|
+ label: '实际结束时间:',
|
|
|
+ prop: 'endTime'
|
|
|
},
|
|
|
- lookVideos(src) {
|
|
|
- new Promise((resolve) => {
|
|
|
- this.$store.dispatch('addPopup', {
|
|
|
- url: '/lookVideo.vue',
|
|
|
- width: '600px',
|
|
|
- height: '500px',
|
|
|
- props: {
|
|
|
- src: src,
|
|
|
- callback: resolve
|
|
|
- },
|
|
|
- showConfirmButton: true,
|
|
|
- showCancelButton: true,
|
|
|
- hideStar: true,
|
|
|
- title: '查看视频'
|
|
|
- });
|
|
|
- }).then(() => {
|
|
|
- this.mixins_search();
|
|
|
- });
|
|
|
+ {
|
|
|
+ label: '状态:',
|
|
|
+ prop: 'inspectionStatus',
|
|
|
+ slot: 'inspectionStatus'
|
|
|
}
|
|
|
+ ],
|
|
|
+ cols: [
|
|
|
+ {
|
|
|
+ label: '设备编号',
|
|
|
+ prop: 'no'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '设备名称',
|
|
|
+ prop: 'name'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '地址',
|
|
|
+ prop: 'address'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '巡检时间',
|
|
|
+ prop: 'checkTime'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '巡检结果',
|
|
|
+ prop: 'result'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '图片/视频',
|
|
|
+ prop: 'picturePath',
|
|
|
+ slot: 'picturePath'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '操作',
|
|
|
+ prop: 'opt',
|
|
|
+ slot: 'opt'
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ thisItem: {},
|
|
|
+ mixins_post: 'post'
|
|
|
+ };
|
|
|
+ },
|
|
|
+
|
|
|
+ methods: {
|
|
|
+ lookDetails (row) {
|
|
|
+ debugger
|
|
|
+ new Promise((resolve) => {
|
|
|
+ this.$store.dispatch('addPopup', {
|
|
|
+ url: '/facilityInspections/popups/itemDetails.vue',
|
|
|
+ width: '500px',
|
|
|
+ height: '500px',
|
|
|
+ props: {
|
|
|
+ data: row,
|
|
|
+ callback: resolve
|
|
|
+ },
|
|
|
+ showConfirmButton: true,
|
|
|
+ showCancelButton: true,
|
|
|
+ hideStar: true,
|
|
|
+ title: '巡检项详情'
|
|
|
+ });
|
|
|
+ }).then(() => {
|
|
|
+ this.mixins_search();
|
|
|
+ });
|
|
|
+ },
|
|
|
+ getDatali (id) {
|
|
|
+ this.mixins_dataUrl = '/sc-community/inspectionRecord/findDetail';
|
|
|
+ this.mixins_query = {
|
|
|
+ id: id,
|
|
|
+ type: this.params.data.type
|
|
|
+ };
|
|
|
+ this.mixins_search();
|
|
|
+ },
|
|
|
+ typeVideo (str) {
|
|
|
+ let type = str.slice(str.lastIndexOf('.') + 1, str.length);
|
|
|
+ let videoType = ['mp4'];
|
|
|
+ return videoType.includes(type);
|
|
|
},
|
|
|
- created() {
|
|
|
- this.thisItem = this.params.data;
|
|
|
- this.getDatali(this.params.data.id);
|
|
|
+ lookVideos (src) {
|
|
|
+ new Promise((resolve) => {
|
|
|
+ this.$store.dispatch('addPopup', {
|
|
|
+ url: '/lookVideo.vue',
|
|
|
+ width: '600px',
|
|
|
+ height: '500px',
|
|
|
+ props: {
|
|
|
+ src: src,
|
|
|
+ callback: resolve
|
|
|
+ },
|
|
|
+ showConfirmButton: true,
|
|
|
+ showCancelButton: true,
|
|
|
+ hideStar: true,
|
|
|
+ title: '查看视频'
|
|
|
+ });
|
|
|
+ }).then(() => {
|
|
|
+ this.mixins_search();
|
|
|
+ });
|
|
|
}
|
|
|
+ },
|
|
|
+ created () {
|
|
|
+ this.thisItem = this.params.data;
|
|
|
+ this.getDatali(this.params.data.id);
|
|
|
+ }
|
|
|
};
|
|
|
</script>
|
|
|
<style lang="scss" scoped>
|
