| | |
| | | " |
| | | > |
| | | <el-col span="2" class="flex-col"> |
| | | <el-row justify="end"> |
| | | <el-row :justify="direction == 'left' ? 'end' : 'start'"> |
| | | <CardButton |
| | | :direction="direction" |
| | | name="动态溯源" |
| | |
| | | <SourceTraceFilter |
| | | v-model:data-slice="selectedMsgTypes" |
| | | v-model:factor-type="selectedFactorTypes" |
| | | :factor-options="factorOptions" |
| | | v-model:scene-type="selectedSceneTypes" |
| | | :factor-options="factorOptions" |
| | | :scene-options="sceneOptions" |
| | | ></SourceTraceFilter> |
| | | <!-- <el-divider direction="vertical"></el-divider> --> |
| | |
| | | </el-space> |
| | | </div> |
| | | </el-row> |
| | | <el-scrollbar ref="scrollbarRef" class="scrollbar"> |
| | | <el-scrollbar |
| | | ref="scrollbarRef" |
| | | class="scrollbar" |
| | | v-loading="loading" |
| | | > |
| | | <TransitionGroup name="list"> |
| | | <div |
| | | v-for="item in filterStreams" |
| | |
| | | const selectedSceneTypes = ref([]); |
| | | const sceneOptions = ref([]); |
| | | |
| | | const loading = ref(false); |
| | | |
| | | function handleDisplayChange() { |
| | | show.value = !show.value; |
| | | if ( |
| | |
| | | case '1': |
| | | case '3': |
| | | // 判断监测因子类型是否选中 |
| | | b2 = selectedFactorTypes.value.indexOf(v.pollutedData.factorId) != -1; |
| | | for (const key in v.pollutedData.statisticMap) { |
| | | const value = v.pollutedData.statisticMap[key]; |
| | | b2 = b2 || selectedFactorTypes.value.indexOf(value.factorId) != -1; |
| | | } |
| | | |
| | | // 判断场景类型是否选中 |
| | | if (v.pollutedSource.sceneList.length == 0) { |
| | | b3 = selectedSceneTypes.value.indexOf(NO_SCENE) != -1; |
| | |
| | | case '1': |
| | | case '3': |
| | | // 筛选监测因子类型 |
| | | if ( |
| | | factorOptions.value.findIndex( |
| | | (v) => v.value == objData.pollutedData.factorId |
| | | ) == -1 |
| | | ) { |
| | | factorOptions.value.push({ |
| | | label: objData.pollutedData.factorName, |
| | | value: objData.pollutedData.factorId |
| | | }); |
| | | selectedFactorTypes.value.push(objData.pollutedData.factorId); |
| | | for (const key in objData.pollutedData.statisticMap) { |
| | | const value = objData.pollutedData.statisticMap[key]; |
| | | if ( |
| | | factorOptions.value.findIndex((v) => v.value == value.factorId) == -1 |
| | | ) { |
| | | factorOptions.value.push({ |
| | | label: value.factorName, |
| | | value: value.factorId |
| | | }); |
| | | selectedFactorTypes.value.push(value.factorId); |
| | | } |
| | | } |
| | | |
| | | // 筛选场景类型 |
| | | if (objData.pollutedSource.sceneList.length == 0) { |
| | | // 若没有找到风险源时,将该分类设定为null |
| | |
| | | } |
| | | |
| | | function fetchPollutionTraceHistory() { |
| | | dataAnalysisApi.fetchPollutionTraceHistory(props.missionCode).then((res) => { |
| | | const objList = JSON.parse(res.data); |
| | | objList.forEach((obj) => { |
| | | obj._type = obj.msgType + ''; |
| | | if (obj._type == '1') { |
| | | obj.showMore = false; |
| | | show.value = true; |
| | | parseChartData(obj); |
| | | } else if (obj._type == '2') { |
| | | obj._timestr = timeFormatter(obj.time); |
| | | } else if (obj._type == '3') { |
| | | parseChartData(obj); |
| | | } |
| | | optionsFilte(obj); |
| | | }); |
| | | streams.value = objList; |
| | | }); |
| | | loading.value = true; |
| | | dataAnalysisApi |
| | | .fetchPollutionTraceHistory(props.missionCode) |
| | | .then((res) => { |
| | | const objList = JSON.parse(res.data); |
| | | objList.forEach((obj) => { |
| | | obj._type = obj.msgType + ''; |
| | | if (obj._type == '1') { |
| | | obj.showMore = false; |
| | | show.value = true; |
| | | parseChartData(obj); |
| | | } else if (obj._type == '2') { |
| | | obj._timestr = timeFormatter(obj.time); |
| | | } else if (obj._type == '3') { |
| | | parseChartData(obj); |
| | | } |
| | | optionsFilte(obj); |
| | | }); |
| | | streams.value = objList; |
| | | }) |
| | | .finally(() => (loading.value = false)); |
| | | } |
| | | |
| | | onMounted(() => { |
| | |
| | | ); |
| | | const factorDatas = new FactorDatas(); |
| | | factorDatas.setData(obj.pollutedData.historyDataList, 0, () => { |
| | | obj._chartOptions = factorDataParser.parseData(factorDatas, [ |
| | | { |
| | | label: obj.pollutedData.factorName, |
| | | name: obj.pollutedData.factorName, |
| | | value: obj.pollutedData.factorId + '' |
| | | } |
| | | ]); |
| | | for (const key in obj.pollutedData.statisticMap) { |
| | | const value = obj.pollutedData.statisticMap[key]; |
| | | value._chartOptions = factorDataParser.parseData(factorDatas, [ |
| | | { |
| | | label: value.factorName, |
| | | name: value.factorName, |
| | | value: value.factorId + '' |
| | | } |
| | | ]); |
| | | } |
| | | // obj._chartOptions = factorDataParser.parseData(factorDatas, [ |
| | | // { |
| | | // label: obj.pollutedData.factorName, |
| | | // name: obj.pollutedData.factorName, |
| | | // value: obj.pollutedData.factorId + '' |
| | | // } |
| | | // ]); |
| | | // console.log('折线图:', obj._chartOptions); |
| | | }); |
| | | } |