From 235a109b3b461c7acbd1d7bb4f7e920075de2b9e Mon Sep 17 00:00:00 2001
From: 马宇豪 <978517621@qq.com>
Date: 星期四, 24 四月 2025 15:40:51 +0800
Subject: [PATCH] 修改大屏
---
src/views/hazardousChemicals/bigScreen/components/midTop.vue | 79 +++++++++++++++++++++++++++------------
1 files changed, 55 insertions(+), 24 deletions(-)
diff --git a/src/views/hazardousChemicals/bigScreen/components/midTop.vue b/src/views/hazardousChemicals/bigScreen/components/midTop.vue
index 4a26014..99e6443 100644
--- a/src/views/hazardousChemicals/bigScreen/components/midTop.vue
+++ b/src/views/hazardousChemicals/bigScreen/components/midTop.vue
@@ -8,13 +8,31 @@
v-model="companyType"
filterable
placeholder="请选择企业类型"
- style="width: 100%"
+ style="flex: 1"
remote
remote-show-suffix
:remote-method="getList"
>
<el-option
v-for="item in typeList"
+ :key="item.id"
+ :label="item.name"
+ :value="item.id"
+ />
+ </el-select>
+ <el-select
+ clearable
+ :teleported="false"
+ v-model="warningType"
+ filterable
+ placeholder="请选择风险等级"
+ style="flex: 1"
+ remote
+ remote-show-suffix
+ :remote-method="getList"
+ >
+ <el-option
+ v-for="item in warningList"
:key="item.id"
:label="item.name"
:value="item.id"
@@ -94,6 +112,7 @@
})
const companyType = ref('')
+const warningType = ref('')
const typeList = [
{
id: 0,
@@ -108,12 +127,40 @@
name: '中试类'
}
]
+const warningList = [
+ {
+ id: 1,
+ name: '红'
+ },
+ {
+ id: 2,
+ name: '橙'
+ },
+ {
+ id: 3,
+ name: '黄'
+ },
+ {
+ id: 4,
+ name: '蓝'
+ }
+]
const getList = async () => {
const res = await getCompanyMessage(companyType.value)
if(res.code == 200){
- companyData.value = res.data
- // console.log(companyData.value,555)
+ if(res.data && Array.isArray(res.data) && res.data.length>0){
+ companyData.value = res.data
+ const mapData = companyData.value.map(i=>{
+ return {
+ name: i.companyName + '(' + i.warningCount + ')',
+ value: [i.longitude,i.latitude]
+ }
+ })
+ console.log(mapData,'mapData')
+ initChart(mapData)
+ }
+
}else{
ElMessage.warning(res.message)
}
@@ -144,24 +191,10 @@
animationFrame = requestAnimationFrame(scrollAnimation)
}
-const initChart =()=>{
+const initChart =(mapData)=>{
//获取echart对象
let dom = document.getElementById('areaMap')
if (dom) {
- let data = [
- {
- name: "姑苏区",
- value: Math.round(Math.random() * 100)
- },
- {
- name: "虎丘区",
- value: Math.round(Math.random() * 100)
- },
- {
- name: "吴中区",
- value: Math.round(Math.random() * 100)
- },
- ]
//初始化
let myEchart = echarts.init(dom)
//注册地图
@@ -233,7 +266,6 @@
}
}
},
- data: data
},
// 区域散点图
{
@@ -254,11 +286,7 @@
fontSize: 12
}
},
- data: [
- { name: '斜塘街道 11', value: [120.697614, 31.288664] },
- { name: '桑田岛 12', value: [120.807510, 31.350300] },
- { name: '车坊 2', value: [120.627614, 31.338664] }
- ],
+ data: mapData,
itemStyle: {
//坐标点颜色
normal: {
@@ -300,6 +328,9 @@
.filter{
width: 300px;
+ margin-top: 50px;
+ display: flex;
+ align-items: center;
}
:deep(.el-input__wrapper){
height: 28px;
--
Gitblit v1.9.2