<template>
|
<BaseContentLayout>
|
<template #header>
|
<SearchBar @on-submit="search"> </SearchBar>
|
</template>
|
<template #aside>
|
<SideList
|
:items="subtasks"
|
:loading="sideLoading"
|
@item-click="chooseSubtask"
|
></SideList>
|
</template>
|
<template #main>
|
<el-scrollbar class="el-scrollbar" v-loading="mainLoading">
|
<CompSceneConstructionInfo
|
title="A、工地基本信息"
|
:form-info="formSubScene"
|
/>
|
<div><el-text type="">附图片：</el-text></div>
|
<CompImgInfo
|
title="施工铭牌"
|
:img-src="sceneImg.url"
|
@change="anyPhotoDialog = true"
|
></CompImgInfo>
|
<el-divider />
|
<el-text tag="h1">B、主要污染防治设施</el-text>
|
<el-space wrap>
|
<CompImgInfo
|
v-for="(item, i) in deviceList"
|
:key="i"
|
down-title
|
:title="item._deviceTypeName"
|
:img-src="item._showStatusPic"
|
@change="showDevicePhotoDialog(item)"
|
></CompImgInfo>
|
</el-space>
|
<el-divider />
|
<el-text tag="h1">C、现场污染问题与整改情况</el-text>
|
<el-space wrap>
|
<CompProblemTable
|
v-for="(item, i) in curProList"
|
:key="i"
|
:problem="item"
|
></CompProblemTable>
|
</el-space>
|
<el-text tag="h1">D、扬尘污染防治建议</el-text>
|
|
</el-scrollbar>
|
</template>
|
</BaseContentLayout>
|
<el-dialog
|
v-model="anyPhotoDialog"
|
width="66%"
|
title="任意图片"
|
destroy-on-close
|
>
|
<ArbitraryPhoto
|
:max-select="1"
|
:readonly="false"
|
:subtask="curSubtask.data"
|
@selectByAnyPhonoEvent="handleSelectAnyPhoto"
|
:defaultFile="[sceneImg]"
|
>
|
</ArbitraryPhoto>
|
</el-dialog>
|
<el-dialog
|
title="设备图片"
|
width="66%"
|
v-model="deiveceImgDialog"
|
destroy-on-close
|
>
|
<CompDevicePhono
|
@selectPhonoEvent="handleSelectDevicePhoto"
|
:imgPathsDataSource="showDeviceImgList"
|
>
|
</CompDevicePhono>
|
</el-dialog>
|
</template>
|
<script setup>
|
import { ref, computed } from 'vue';
|
|
import { $fysp } from '@/api/index';
|
import taskApi from '@/api/fysp/taskApi';
|
import sceneApi from '@/api/fysp/sceneApi';
|
import deviceApi from '@/api/fysp/deviceApi';
|
import { formatDeviceList } from '@/model/fysp/device';
|
import { enumDevice, toLabel } from '@/enum/device/device';
|
|
import CompSceneConstructionInfo from '@/views/fysp/scene/CompSceneConstructionInfo.vue';
|
import ArbitraryPhoto from '@/views/fysp/check/components/ArbitraryPhoto.vue';
|
import CompDevicePhono from '@/views/fysp/check/components/CompDevicePhono.vue';
|
import CompImgInfo from '@/views/fysp/data-product/components/CompImgInfo.vue';
|
import CompProblemTable from './components/CompProblemTable.vue';
|
|
/************************* 左侧巡查任务选单 **********************************/
|
const curSubtask = ref({});
|
const subtasks = ref([]);
|
const sideLoading = ref(false);
|
const mainLoading = ref(false);
|
//获取任务问题的审核情况
|
function getSubtaskType(s) {
|
let type = 0;
|
if (s.proNum == 0) {
|
type = 2;
|
} else if (s.proCheckedNum == 0) {
|
type = 0;
|
} else if (s.proCheckedNum < s.proNum) {
|
type = 1;
|
} else {
|
type = 2;
|
}
|
return type;
|
}
|
//查询子任务统计信息
|
function search(formSearch) {
|
// this.topTask = formSearch.topTask;
|
sideLoading.value = true;
|
mainLoading.value = true;
|
// this.curProList = [];
|
curSubtask.value = {};
|
const param = {
|
topTaskId: formSearch.topTask.tguid,
|
sceneTypeId: formSearch.sceneTypeId
|
};
|
taskApi.getSubtaskSummary(param).then((res) => {
|
const list = [];
|
res.forEach((s) => {
|
const t = getSubtaskType(s);
|
list.push({
|
type: t,
|
title: s.stName,
|
categoly: s.stPlanTime.split('T')[0],
|
data: s
|
});
|
});
|
subtasks.value = list;
|
if (list.length == 0) {
|
sideLoading.value = false;
|
mainLoading.value = false;
|
}
|
});
|
}
|
//点击左侧菜单任务事件
|
function chooseSubtask(s) {
|
sideLoading.value = false;
|
mainLoading.value = true;
|
curSubtask.value = s;
|
|
fetchSceneInfo(s.data.sceneId).finally(() => {
|
mainLoading.value = false;
|
});
|
fetchDeviceList(s);
|
fetchProblems(s);
|
}
|
|
/************************* 场景基本信息 **********************************/
|
const formSubScene = ref({});
|
function fetchSceneInfo(sceneId) {
|
formSubScene.value = {};
|
sceneImg.value = {};
|
return sceneApi.getSceneDetail(sceneId).then((res) => {
|
//场景
|
// if (res.data.scense) formScene = res.data.scense;
|
formSubScene.value = res.data.subScene ? res.data.subScene : {};
|
// if (res.data.sceneDevice) {
|
// formSceneDevice = res.data.sceneDevice;
|
// } else {
|
// formSceneDevice = {
|
// sGuid: formScene.guid,
|
// };
|
// }
|
});
|
}
|
|
// 任意拍图片选择对话框
|
const anyPhotoDialog = ref(false);
|
const sceneImg = ref({});
|
function handleSelectAnyPhoto(data) {
|
anyPhotoDialog.value = false;
|
if (data.length > 0) {
|
sceneImg.value = data[0];
|
}
|
}
|
/************************* 场景设备信息 **********************************/
|
|
// 设备图片选择对话框
|
const deiveceImgDialog = ref(false);
|
const showDeviceImg = ref({});
|
const showDeviceImgList = ref([]);
|
// 设备图片列表
|
const deviceList = ref([]);
|
|
function showDevicePhotoDialog(device) {
|
deiveceImgDialog.value = true;
|
showDeviceImgList.value = [];
|
let imgList = [];
|
device._status
|
.map((s) => s._picUrls)
|
.forEach((pics) => {
|
imgList = imgList.concat(
|
pics.map((p) => {
|
return {
|
topTypeId: device.topTypeId,
|
_picUrl: p
|
};
|
})
|
);
|
});
|
console.log(imgList);
|
|
showDeviceImgList.value = imgList;
|
}
|
|
function handleSelectDevicePhoto(data) {
|
deiveceImgDialog.value = false;
|
if (data.length > 0) {
|
showDeviceImg.value = { url: data[0].url };
|
}
|
}
|
|
const deviceTopTypes = [
|
{ id: 0, label: '监控设备' },
|
{ id: 1, label: '治理设备' }
|
// { id: 2, label: '生产设备' }
|
];
|
|
function fetchDeviceList(s) {
|
deviceList.value = [];
|
for (const deviceTopTypeElement of deviceTopTypes) {
|
const topTypeId = deviceTopTypeElement.id;
|
deviceApi
|
.fetchDevices(s.data.sceneId, topTypeId)
|
.then((res) => {
|
return formatDeviceList(res.data);
|
})
|
.then((result) => {
|
result.forEach((r) => {
|
const param = {
|
deviceId: r.id,
|
sceneId: r.sceneGuid,
|
deviceTypeId: topTypeId
|
};
|
deviceApi
|
.fetchDeviceStatus(param)
|
.then((res) => {
|
res.data.forEach((e) => {
|
if (e.dlPicUrl && e.dlPicUrl.trim() != '') {
|
e._picUrls = e.dlPicUrl
|
.split(';')
|
.map((v) => $fysp.imgUrl + v);
|
} else {
|
e._picUrls = [];
|
}
|
});
|
return res;
|
})
|
.then((res) => {
|
if (res.data.length > 0 && res.data[0]._picUrls.length > 0) {
|
r._showStatusPic = res.data[0]._picUrls[0];
|
}
|
r._status = res.data;
|
r.topTypeId = topTypeId;
|
r._deviceTypeName = toLabel(r.sceneTypeId, topTypeId, [
|
r.typeId,
|
r.subtypeId
|
]).join('-');
|
deviceList.value.push(r);
|
});
|
});
|
});
|
}
|
}
|
/************************* 现场巡查情况（问题与整改） **********************************/
|
//当前任务的问题列表
|
const curProList = ref([]);
|
|
function fetchProblems(s) {
|
curProList.value = [];
|
taskApi.getProBySubtask(s.data.stGuid).then((res) => {
|
curProList.value = res;
|
});
|
}
|
/************************* 扬尘防治建议 **********************************/
|
</script>
|
