<!--
 * @Description: 路灯-历史报警趋势
 * @Author: 王晓颖
 * @Date: 2021-07-15 17:46:41
 -->
<template>
  <container1 title="路灯运行情况">
    <div style="width: 100%;height: 100%;padding: 0.1rem; display: flex;">
      <div style="width:50%;height:100%">
        <simple-block :data="data1" style="height:50%;width:100%">
          <a-icon type="setting" theme="twoTone" :style="{fontSize:'0.25rem'}"/>
        </simple-block>
        <simple-block :data="data2" style="height:50%;width:100%">
          <a-icon type="bell" theme="twoTone" :style="{fontSize:'0.25rem'}"/>
        </simple-block>
      </div>
      <div style="width: 100%;height: 100%;">
        <gradient-line-chart :x-axis-data="xAxisData" :series-data="seriesData"/>
      </div>
    </div>
  </container1>
</template>

<script>
  import Container1 from "@/components/container/container1"
  import GradientLineChart from "@/components/echart/lineChart/gradientLineChart";
  import SimpleBlock from "../../../components/block/simpleBlock";
  export default {
    name: "lampAlarmHistory",
    components: {SimpleBlock, GradientLineChart, Container1},
    data(){
      return {
        data1: {name:'路灯总数', value:'9981', unit:'个',icon:'setting'},
        data2: {name:'路灯报警', value:'81', unit:'次',icon:'alert'},
        xAxisData:['周一','周二','周三','周四','周五','周六','周日'],
        seriesData:[
          {name:'井盖状态监测仪',data:[120, 252, 101, 134, 290, 230, 110],color:'58,55,194'},
          {name:'液位监测仪',data:[120, 222, 191, 234, 250, 200, 310],color:'109,202,23'},
          {name:'有害气体',data:[3, 2, 1, 2, 0, 2, 1],color:'248,211,81'},
          {name:'消防栓',data:[0, 0, 1, 0, 0, 0, 0],color:'255,192,203'},
        ]
      }
    },
  }
</script>

<style rel="stylesheet/scss" lang="scss" scoped>

</style>