<template>
|
<div :class="'wrapper' + (item._selected ? ' wrapper-select' : '')">
|
<div v-if="item._type == '1'">
|
<el-row justify="space-between">
|
<el-space>
|
<el-tag v-if="noWarn" type="info" effect="dark" size="small"
|
>异常</el-tag
|
>
|
<el-tag v-else type="warning" effect="dark" size="small">异常</el-tag>
|
<el-text type="primary">{{
|
item.pollutedData.startTime + ' - ' + item.pollutedData.endTime
|
}}</el-text>
|
</el-space>
|
<el-link type="primary" @click="emits('open', item)"> 详情 </el-link>
|
</el-row>
|
<el-col :span="24">
|
<el-text type="primary">{{
|
item.pollutedData.factorName +
|
formatException(item.pollutedData.exceptionType) +
|
'，' +
|
formatDistanceType(item.pollutedArea.distanceType)
|
}}</el-text>
|
<el-text :type="noWarn ? 'primary' : 'warning'">
|
{{
|
item.pollutedSource.sceneList.length == 0
|
? '未找到可疑污染源'
|
: '找到' + item.pollutedSource.sceneList.length + '个可疑污染源'
|
}}
|
</el-text>
|
</el-col>
|
<!-- <el-col :span="2"> </el-col> -->
|
</div>
|
<div v-else-if="item._type == '2'">
|
<el-row justify="space-between">
|
<el-tag type="danger" effect="dark" size="small">线索</el-tag>
|
<el-link type="primary" @click="emits('open')"> 详情 </el-link>
|
</el-row>
|
<el-text type="danger">{{ item.advice }}</el-text>
|
</div>
|
</div>
|
</template>
|
<script setup>
|
import { computed } from 'vue';
|
|
const props = defineProps({
|
item: Object
|
});
|
|
const emits = defineEmits(['open']);
|
|
const noWarn = computed(() => {
|
return props.item && props.item.pollutedSource.sceneList.length == 0;
|
});
|
|
function formatException(value) {
|
switch (value) {
|
case 4:
|
return '量级突变';
|
case 9:
|
return '快速上升';
|
default:
|
return '量级突变';
|
}
|
}
|
|
function formatDistanceType(value) {
|
switch (value) {
|
case 'TYPE1':
|
return '50米以内';
|
case 'TYPE2':
|
return '50米 - 500米以内';
|
case 'TYPE3':
|
return '50米 - 1公里以内';
|
case 'TYPE4':
|
return '50米 - 2公里以内';
|
|
default:
|
break;
|
}
|
}
|
</script>
|
<style scoped>
|
.wrapper {
|
margin-bottom: 8px;
|
border-bottom: 1px dashed rgba(253, 253, 253, 0.651);
|
}
|
.wrapper-select {
|
background: linear-gradient(
|
rgba(228, 228, 228, 0.274),
|
rgba(64, 165, 248, 0.089)
|
);
|
}
|
.no-warning {
|
color: var(--el-text-color-disabled) !important;
|
}
|
</style>
|
