更新

src/views/vent/home/configurable/components/preset/dz-chart.vue

@@ -21,9 +21,9 @@ let props = defineProps({
         }
     },
     echartData: {
-        type: Object,
+        type: Array,
         default: () => {
-            return {}
+            return []
         }
     }
 })
@@ -31,42 +31,13 @@ let props = defineProps({
 //获取dom元素节点
 let chartRef = ref<any>();
 // 类别
-let category = [
-    {
-        name: "报警",
-        value: 300
-    },
-    {
-        name: "重大风险",
-        value: 300
-    },
-    {
-        name: "较大风险",
-        value: 300.2
-    },
-    {
-        name: "一般风险",
-        value: 548.7
-    },
-    {
-        name: "低风险",
-        value: 612.5
-    },
-
-];
-let total = ref(1000) // 数据总数
-let datas = [];
-category.forEach(value => {
-    datas.push(value.value);
-});
-
+let category = ref<any[]>([])
+let echartY=ref<any[]>([])
 function getOption() {
-
-
     let myChart = echarts.init(chartRef.value);
     let option = {
         xAxis: {
-            max: 1000,
+            max: 10,
             splitLine: {
                 show: false
             },
@@ -82,14 +53,14 @@ function getOption() {
         },
         grid: {
             left: 10,
-            top: 15, // 设置条形图的边距
+            top: 10, // 设置条形图的边距
             right: 10,
-            bottom: 15
+            bottom: 0
         },
         yAxis: [{
             type: "category",
             inverse: false,
-            data: category,
+            data: category.value,
             axisLine: {
                 show: false
             },
@@ -99,8 +70,6 @@ function getOption() {
             axisLabel: {
                 show: false
             },
-
-
         }],
         series: [
             {
@@ -118,20 +87,18 @@ function getOption() {
                 },
                 label: {
                     normal: {
-                        // formatter: '{warnLevel1|}', // 使用富文本占位符
                         formatter: (params) => {
-                            console.log(params,)
                             let text;
                             if (params.dataIndex == 0) {
-                                text = `{warnLevel5|\u00A0\u00A0\u00A0\u00A0${params.data.name}}`;
+                                text = `{warnLevel5|\u00A0\u00A0\u00A0\u00A0\u00A0\u00A0${params.data.name}}`;
                             } else if (params.dataIndex == 1) {
-                                // text = `{warnLevel4|${params.data.name}}`;
+                                text = `{warnLevel4|\u00A0\u00A0\u00A0\u00A0\u00A0\u00A0${params.data.name}}`;
                             } else if (params.dataIndex == 2) {
-                                //  text = `{warnLevel3|${params.data.name}}`;
+                                text = `{warnLevel3|\u00A0\u00A0\u00A0\u00A0\u00A0\u00A0${params.data.name}}`;
                             } else if (params.dataIndex == 3) {
-                                //  text = `{warnLevel2|${params.data.name}}`;
+                                text = `{warnLevel2|\u00A0\u00A0\u00A0\u00A0\u00A0\u00A0${params.data.name}}`;
                             } else if (params.dataIndex == 4) {
-                                //  text = `{warnLevel1|${params.data.name}}`;
+                                text = `{warnLevel1|\u00A0\u00A0\u00A0\u00A0\u00A0\u00A0${params.data.name}}`;
                             }
                             return text;
                         },
@@ -139,29 +106,36 @@ function getOption() {
                             color: "#fff",
                             fontSize: 12
                         },
-                        position: [20, -21],
+                        position: [0, -22],
                         show: true,
                         rich: { //富文本
                             warnLevel1: {
                                 backgroundColor: {
                                     image: warnLevel1,
                                 },
+                                height: 16,
+                                width: 16,
                             },
                             warnLevel2: {
                                 backgroundColor: { //这里可以添加你想自定义的图片
                                     image: warnLevel2,
-
                                 },
+                                height: 16,
+                                width: 16,
                             },
                             warnLevel3: {
                                 backgroundColor: {
                                     image: warnLevel3,
                                 },
+                                height: 16,
+                                width: 16,
                             },
                             warnLevel4: {
                                 backgroundColor: { //这里可以添加你想自定义的图片
                                     image: warnLevel4,
                                 },
+                                height: 16,
+                                width: 16,
                             },
                             warnLevel5: {
                                 backgroundColor: { //这里可以添加你想自定义的图片
@@ -169,15 +143,13 @@ function getOption() {
                                 },
                                 height: 16,
                                 width: 16,
-                                align: 'left',
-                                padding: [0, 5, 0, 0]  // 右侧增加5px间距
                             },
 
                         },
 
                     }
                 },
-                data: category,
+                data: category.value,
                 z: 1,
                 animationEasing: "elasticOut"
             },
@@ -197,8 +169,8 @@ function getOption() {
                 symbolSize: [10, 24],
                 symbolPosition: "start",
                 symbolOffset: [1, -4],
-                symbolBoundingData: 1000,
-                data: [1000, 1000, 1000, 1000, 1000],
+                symbolBoundingData: 10,
+                data: [10, 10, 10, 10, 10],
                 z: 2,
                 animationEasing: "elasticOut",
 
@@ -207,7 +179,7 @@ function getOption() {
             {
                 // label
                 type: "pictorialBar",
-                symbolBoundingData: 1000,
+                symbolBoundingData: 10,
                 itemStyle: {
                     normal: {
                         color: "none"
@@ -253,11 +225,11 @@ function getOption() {
                                 color: "#fff"
                             },
                         },
-                        position: [330, -15],
+                        position: [330, -12],
                         show: true
                     }
                 },
-                data: [612.5, 548.7, 300.2, 300, 299],
+                data: echartY.value,
                 z: 0,
 
             },
@@ -266,7 +238,7 @@ function getOption() {
                 name: "外框",
                 type: "bar",
                 barGap: "-130%", // 设置外框粗细
-                data: [1000, 1000, 1000, 1000, 1000],
+                data: [10, 10, 10, 10, 10],
 
                 barWidth: 29,
                 itemStyle: {
@@ -279,7 +251,7 @@ function getOption() {
                     }
                 },
 
-                z: 0
+                z: 2
             },
             {
                 type: 'scatter',
@@ -293,7 +265,7 @@ function getOption() {
                         color: "#3ecca7"
                     }
                 },
-                data: [1000, 1000, 1000, 1000, 1000],
+                data: [10, 10, 10, 10, 10],
             }
 
         ]
@@ -306,17 +278,20 @@ function getOption() {
 }
 
 
-onMounted(() => {
-    getOption()
 
-})
 
 
-// let windData = reactive<any>({})
 
-// watch(() => props.echartData, (newV, oldV) => {
-//     windData = Object.assign({}, newV)
-// }, { immediate: true, deep: true })
+
+watch(() => props.echartData, (newV, oldV) => {
+  console.log(newV,'99900')
+  if(newV.length){
+    category.value=newV
+    echartY.value=newV.map((el:any)=>el.value)
+    console.log(echartY.value,'900')
+    getOption()
+  }
+}, { immediate: true,  })
 
 </script>
 

src/views/vent/home/configurable/configurable.api.ts

@@ -2,7 +2,7 @@ import { floor, isArray, random, slice } from 'lodash-es';
 import { defHttp } from '/@/utils/http/axios';
 import { get } from '../billboard/utils';
 import { useGlobSetting } from '/@/hooks/setting';
-import { reactive } from 'vue'
+import { ref, reactive } from 'vue'
 
 enum Api {
   list = '/safety/ventanalyDevice/homedata2',
@@ -377,26 +377,34 @@ export const sysTypeWarnList = (params) => {
   });
 };
 //多灾融合预警
-function getLevelNum(warnNumMap) {
+function getLevelNum() {
   return new Promise(async (resolve) => {
+    const list = {}
     const typeArr = ['fire', 'dust', 'vent', 'gas'];
     for (let i = 0; i < typeArr.length; i++) {
       const type = typeArr[i];
       const result = await sysTypeWarnList({ type });
-      warnNumMap.set(type, result['length']);
+      if (type == 'fire') {
+        list.fire = result.length || 0
+      } else if (type == 'dust') {
+        list.dust = result.length || 0
+      } else if (type == 'vent') {
+        list.vent = result.length || 0
+      } else if (type == 'gas') {
+        list.gas = result.length || 0
+      }
     }
-    resolve(null);
+    resolve(list);
   });
 }
 export const getTotal = (params) => {
   const { sysOrgCode, sysDataType } = useGlobSetting();
-  const warnNumMap = new Map([
-    ['fire', 0],
-    ['dust', 0],
-    ['vent', 0],
-    ['gas', 0],
-  ]);
-  getLevelNum(warnNumMap)
+  let data = ref<any>({})
+  getLevelNum().then(res => {
+    data.value = res
+  })
+  console.log(data, '888')
+
   const key = `${Api.getTotal}?${JSON.stringify(params)}`;
   if (!cache.has(key)) {
     cache.set(
@@ -408,6 +416,29 @@ export const getTotal = (params) => {
   }
   return (cache.get(key) as Promise<any>).then((res) => {
     console.log(res, '多灾融合预警数据')
+     
+    const levelsList = [
+      {
+        name: "报警",
+        value: 0
+      },
+      {
+        name: "重大风险",
+        value: 0
+      },
+      {
+        name: "较大风险",
+        value: 0
+      },
+      {
+        name: "一般风险",
+        value: 0
+      },
+      {
+        name: "低风险",
+        value: data.value ? data.value.vent : 0
+      },
+    ];
     //通风监测预警数据
     switch (sysDataType) {
       case 'monitor':
@@ -416,7 +447,30 @@ export const getTotal = (params) => {
           ventXf: res.ventInfo.xufengliang,
           ventHf: res.ventInfo.zonghuifeng,
         }
-        res.ventData = { ...res.info.sysInfo.ventS.levels, blue: warnNumMap.get('vent') };
+        console.log(data.value,'999')
+        res.ventData = [
+          {
+            name: "报警",
+            value: res.info.sysInfo.ventS.levels.alarm
+          },
+          {
+            name: "重大风险",
+            value: res.info.sysInfo.ventS.levels.red
+          },
+          {
+            name: "较大风险",
+            value: res.info.sysInfo.ventS.levels.orange
+          },
+          {
+            name: "一般风险",
+            value: res.info.sysInfo.ventS.levels.yellow
+          },
+          {
+            name: "低风险",
+            value: data.value.vent ? data.value.vent : res.info.sysInfo.ventS.levels.blue
+          },
+        ];
+
         break;
       case 'report':
         res.ventWarn = {
@@ -424,7 +478,7 @@ export const getTotal = (params) => {
           ventXf: res.ventInfo.xufengliang,
           ventHf: res.ventInfo.totalRetM3,
         }
-        res.ventData = { alarm: 0, blue: warnNumMap.get('vent'), orange: 0, red: 0, yellow: 0 }
+        res.ventData = levelsList
         break;
       default:
         res.ventWarn = {
@@ -432,7 +486,7 @@ export const getTotal = (params) => {
           ventXf: res.ventInfo.xufengliang,
           ventHf: res.ventInfo.totalRetM3,
         }
-        res.ventData = { alarm: 0, blue: warnNumMap.get('vent'), orange: 0, red: 0, yellow: 0 }
+        res.ventData = levelsList
     }
     //设备监测预警数据
     res.deviceWarn = reactive({})

src/views/vent/home/configurable/configurable.data.ts

@@ -2910,49 +2910,8 @@ export const testConfigFusionGreen: Config[] = [
         {
           readFrom: 'ventData',
           echartOption: {
-            xAxisData: [
-              { key: '低风险', valueKey: 'blue' },
-              { key: '一般风险', valueKey: 'yellow' },
-              { key: '较大风险', valueKey: 'orange' },
-              { key: '重大风险', valueKey: 'red' },
-              { key: '报警', valueKey: 'alarm' },
-            ],
-            chartsColumns: [
-              {
-                legend: '低风险',
-                seriesName: '(Pa)',
-                ymax: 50,
-                ymin: 0,
-                yname: '个',
-                linetype: 'bar',
-                yaxispos: 'left',
-                color: '#cd5fff',
-                sort: 1,
-                dataIndex: '',
-                xRotate: 0,
-              },
-            ],
-            option: {
-              grid: {
-                top: '20px',
-                bottom: 15,
-                right: 20,
-                left: 10,
-                containLabel: true,
-              },
-              yAxis: {
-                show: false,
-              },
-            },
-            colors: [
-              [{ color: 'rgba(46,144,165, 1 )' }, { color: 'rgba(46,144,165, 0.8 )' }, { color: 'rgba(46, 144, 165, 0.08 )' }],
-              [{ color: 'rgba(254,254,53, 1 )' }, { color: 'rgba(254,254,53, 0.8 )' }, { color: 'rgba(254,254,53, 0.08 )' }],
-              [{ color: 'rgba(234,179,105, 1 )' }, { color: 'rgba(234,179,105, 0.8 )' }, { color: 'rgba(234,179,105, 0.08 )' }],
-              [{ color: 'rgba(254,111,0, 1 )' }, { color: 'rgba(254,111,0, 0.8 )' }, { color: 'rgba(254,111,0, 0.08 )' }],
-              [{ color: 'rgba(255,0,0, 1 )' }, { color: 'rgba(255,0,0, 0.8 )' }, { color: 'rgba(255,0,0, 0.08 )' }],
-            ],
-            fontColor: ['rgba(46,144,165, 1 )', 'rgba(254,254,53, 1 )', 'rgba(234,179,105, 1 )', 'rgba(254,111,0, 1 )', 'rgba(255,0,0, 1 )'],
-          },
+              colorList:['#ff0000', '#ff7700', '#d8b66f', '#dbbf2e', '#61b4c5'],
+          }
         },
       ],
       // mock: BDfireMock,
@@ -3395,7 +3354,6 @@ export const testConfigFusionGreen: Config[] = [
           value: '',
         },
       },
-
       background: {
         show: false,
         type: 'video',
@@ -3408,6 +3366,7 @@ export const testConfigFusionGreen: Config[] = [
             name: 'dz_risk',
             basis: '100%',
           },
+
         ],
       },
       board: [],
@@ -3421,16 +3380,16 @@ export const testConfigFusionGreen: Config[] = [
         {
           readFrom: 'dz_risk',
         },
+
       ],
       // mock: BDfireMock,
-
-      showStyle: {
-        size: 'width:360px;height:240px;',
-        version: '原版',
-        position: 'bottom:15px;right:450px',
-      },
-    }
-  }
+    },
+    showStyle: {
+      size: 'width:360px;height:240px;',
+      version: '原版',
+      position: 'bottom:15px;right:450px',
+    },
+  },
 
 ];
 

src/views/vent/monitorManager/alarmMonitor/common.data.ts

@@ -197,7 +197,7 @@ export function getMonitorFlag() {
       typeFlag = '2';
       return typeFlag;
     default:
-      typeFlag = '1';
+      typeFlag = '2';
       return typeFlag;
   }
 }