From 7bcdaba7faad85bf16bf0f2a1dbd3e390bdb15dd Mon Sep 17 00:00:00 2001
From: shuishen <1109946754@qq.com>
Date: Tue, 05 Nov 2024 21:15:40 +0800
Subject: [PATCH] 救援队伍统计、应急空间统计、风险源统计图表样式初步调整,园区概况布局调整 倾斜模型加载配置微调后续看加载效果 企业名录样式调整

---
 src/views/survey/components/box/unitContent.vue |  120 ++++++++++++++++++++++++++++++++++++++++++------------------
 1 files changed, 84 insertions(+), 36 deletions(-)

diff --git a/src/views/survey/components/box/unitContent.vue b/src/views/survey/components/box/unitContent.vue
index 47fba66..7e68486 100644
--- a/src/views/survey/components/box/unitContent.vue
+++ b/src/views/survey/components/box/unitContent.vue
@@ -2,58 +2,106 @@
  * @Author: shuishen 1109946754@qq.com
  * @Date: 2023-03-13 14:54:26
  * @LastEditors: shuishen 1109946754@qq.com
- * @LastEditTime: 2023-03-13 15:00:55
- * @FilePath: \forest-fire\src\views\statistics\components\box\dataContent.vue
+ * @LastEditTime: 2024-11-05 17:15:55
+ * @FilePath: \bigScreen\src\views\survey\components\box\unitContent.vue
  * @Description: 
  * 
  * Copyright (c) 2023 by ${git_name_email}, All Rights Reserved. 
 -->
 <script setup>
-// import publicContent from './publicContent.vue'
+import { useEchartsResize } from 'hooks/useEchartsResize'
 
-import { inject } from 'vue'
+import { getEmergencySpaceStatistic } from '../../../../api/indParkInfo'
 
 let $echarts = inject('echarts')
+const curEcharts = ref(null)
 
-console.log($echarts)
+let myEcharts = reactive(null)
 
-onMounted(() => {
-    let myEcharts = $echarts.init(document.getElementById('unit-content-echarts'))
-    myEcharts.setOption({
-        xAxis: {
-            data: ['A', 'B', 'C', 'D', 'E']
-        },
-        yAxis: {},
-        series: [
-            {
-                type: 'bar',
-                data: [10, 22, 28, 43, 49],
-                barWidth: '60%'
-            }
-        ]
+function getEmergencySpace () {
+  getEmergencySpaceStatistic().then(res => {
+    // console.log(res)
+    let data = res.data.data
+    let dataRsult = []
+    data.forEach(item => {
+      dataRsult.push({
+        name: item.type,
+        value: item.num
+      })
     })
+
+    myEcharts.setOption({
+      legend: {
+        orient: "vertical",
+        top: '5%',
+        left: "5%",
+        textStyle: {
+          color: '#fff'
+        }
+      },
+
+      grid: {
+        top: '6%',
+        left: '6%',
+        right: '6%',
+        bottom: '6%',
+        containLabel: true
+      },
+
+      tooltip: {
+        trigger: 'item'
+      },
+
+      series: [
+        {
+          // name: 'Access From',
+          type: 'pie',
+          left: '10%',
+          radius: ['30%', '60%'],
+          // avoidLabelOverlap: false,
+          // padAngle: 5,
+          // itemStyle: {
+          //   borderRadius: 10
+          // },
+          // label: {
+          //   show: false,
+          //   position: 'left'
+          // },
+          // emphasis: {
+          //   label: {
+          //     show: true,
+          //     fontSize: 40,
+          //     fontWeight: 'bold'
+          //   }
+          // },
+          // labelLine: {
+          //   normal: {
+          //     show: true
+          //   }
+          // },
+          data: dataRsult
+        }
+      ]
+    })
+  })
+}
+
+nextTick(() => {
+  myEcharts = $echarts.init(curEcharts.value)
+  getEmergencySpace()
 })
 
+const echartsResize = () => {
+  myEcharts && myEcharts.resize()
+}
+
+useEchartsResize(echartsResize)
 </script>
 
 <template>
-    <!-- <public-content>
-        <template #content> -->
-    <div class="unit-content">
-        <div class="unit-content-echarts" id="unit-content-echarts">
+  <div class="w100 h100" ref="curEcharts">
 
-        </div>
-    </div>
-    <!-- </template>
-    </public-content> -->
+  </div>
 </template>
 
-<style lang="scss" scoped>
-.unit-content {
-    color: #fff;
-}
-
-.unit-content-echarts {
-    height: 5rem;
-}
-</style>
\ No newline at end of file
+<style lang="scss" scoped></style>
\ No newline at end of file

--
Gitblit v1.9.3