Merge branch 'main' of http://139.196.74.78:10010/r/zhyq/bigScreen

shuishen

2024-11-04 7f7c612ca21f0a1c808e2d069edf642b8e19919c

 src/views/survey/components/box/fireContent.vue

@@ -1,39 +1,66 @@
<!--
 * @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
 * @Description: 
 * 
 * Copyright (c) 2023 by ${git_name_email}, All Rights Reserved. 
-->
<script setup>
import publicContent from './publicContent.vue'

import { inject, reactive } from 'vue'
import { getRiskSourceStatistic } from '../../../../api/indParkInfo'

let $echarts = inject('echarts')
const curEcharts = ref(null)

let myEcharts = reactive(null)

onMounted(() => {
  nextTick(() => {
    let myEcharts = $echarts.init(curEcharts.value)
  myEcharts = $echarts.init(curEcharts.value)
  getRiskSource()

})


function getRiskSource () {
  getRiskSourceStatistic().then(res => {
    let xaxis_data = []
    let yaxis_data = []
    res.data.data.forEach(element => {
      xaxis_data.push(element.riskLevel)
      yaxis_data.push(element.num)
    })
    myEcharts.setOption({
      xAxis: {
        data: ['A', 'B', 'C', 'D', 'E']
      tooltip: {
        trigger: 'axis',
        axisPointer: {
          type: 'shadow'
        }
      },
      yAxis: {},
      grid: {
        left: '3%',
        right: '4%',
        bottom: '3%',
        containLabel: true
      },
      xAxis: [
        {
          type: 'category',
          data: xaxis_data,
          axisTick: {
            alignWithLabel: true
          }
        }
      ],
      yAxis: [
        {
          type: 'value'
        }
      ],
      series: [
        {
          name: 'Direct',
          type: 'bar',
          data: [10, 22, 28, 43, 49],
          barWidth: '60%'
          barWidth: '30%',
          data: yaxis_data
        }
      ]
    })
  })
})
}
</script>

<template>
@@ -60,6 +87,6 @@
}

.fire-content-echarts {
  height: 4.5rem
  height: 200px;
}
</style>