<!--
 * @FilePath: \wwwd:\code\screenFront\src\views\energyConsume\content\chart\power2023.vue
 * @Author: 王路平
 * @文件版本: V1.0.0
 * @Date: 2023-02-13 15:04:23
 * @Description: 
 * 
 * 版权信息         : 2023 by ${再登软件}, All Rights Reserved.
-->
<template>
    <div :style="{ width: boxWH.width, height: boxWH.height }">
  <border4 ref="refborder4">
      <template v-slot>
          <div ref="power"></div>
      </template>
  </border4>
  </div>
</template>

<script setup lang="ts">
import {getCurrentInstance, onMounted, reactive, ref} from "vue"
import {EDataPerson,EDataPersonItem} from '@/type/energyConsume'
import {accAdd} from '@/utils/precision'
import border4 from "@/components/borderBox/border6.vue"
const { proxy } = getCurrentInstance() as any;
let props=defineProps<{
      title:string
      }>()
let power=ref()

let refborder4=ref()

const echartsData = reactive<EDataPerson>({
  power:{
      div:null,
      data:null,
      title:'',
      box:null
  },
})

const setData=(value:any)=>{

let series=[]
value.listData.forEach(res=>{
  if(res.years==2023){
for(let key in res.month){
  series.push({
    name: key+'月',
    type: 'bar',
    stack: res.years,
    emphasis: {
      focus: 'coordinateSystem',
      label: {
      show: true,
      formatter:function(value,index){
        return value.value.toLocaleString()
      }
      }
    },
    data: res.month[key]
  })
}
}
})
//data0用于初始化计算的数据
let data0=[]
console.log(value);

    for(let i=1;i<=value.name.length;i++){
      data0.push(0)
    }

series.push({
  name: '',
  type: 'bar',
  data: data0,
  color: '#bbf',
  stack: value.listData[1].years,
  // barWidth: 30,
  label: {
    show: true,
    
    position: 'right',
    color: '#fff'
  }
  },  
)




  echartsData.power!.div=power.value
  echartsData.power!.title=props.title
  echartsData.power!.data={
  title:{
      text:echartsData.power!.title,
      show:true,
      textStyle:{
          color:'#fff',
          fontSize:20
      },
      top: '3%',
  },
tooltip: {
  trigger: 'item',
  axisPointer: {
    // Use axis to trigger tooltip
    type: 'shadow', // 'shadow' as default; can also be 'line' or 'shadow',
    axis:'auto',
    
  },
},
// color:color,
legend: {
  type:'scroll',
  // width:400,
  // right:20,
  top: '11%',
  // itemStyle:{
  //     data:yue
  //   },
},
grid: {
      top: "20%",
      left: "3%",
      right: "10%",
      bottom: "3%",
      containLabel: true,
    },
xAxis: {
  type: 'value',
  splitLine:{
      show:false
    }
},
yAxis: {
  type: 'category',
  data: value.name
},
series: series
  };

change(echartsData.power,value)
}

const change = (item:EDataPersonItem,value:any) => {
  let Ebox=proxy.$echarts.init(
  item.div,
  "dark"
);
clacChartsSum(item.data,value)
Ebox.setOption(item.data);
item.box = Ebox
changeecharts(item.data,value)

};

/**
 * @函数功能: 修改用电量总数数值的标签
 * @param {*} option echarts数据
 * @param {*} value api接收数据
 * @出口参数: 
 * @函数备注: 
 */
const clacChartsSum=(option:any,value:any)=>{
  var series = option.series
  // function getSum1 (params) {
  //     let stack=value.listData[0].years
  //       var datavalue = 0
  //       for (var i = 0; i < series.length; i++) {
  //         if(series[i].stack==stack){
  //           // datavalue += series[i].data[params.dataIndex]
  //           datavalue=accAdd(datavalue,series[i].data[params.dataIndex])
  //         }
          
  //       }
  //       return datavalue ? stack+'年/'+ datavalue+'kw.h' : null
  //     }
      function getSum2 (params) {
      let stack=value.listData[1].years
        var datavalue = 0
        for (var i = 0; i < series.length; i++) {
          if(series[i].stack==stack){
            // datavalue += series[i].data[params.dataIndex]
            datavalue=accAdd(datavalue,series[i].data[params.dataIndex])
          }
          
        }
        return datavalue ? datavalue.toLocaleString() : null
      }
    series[series.length - 1].label.formatter = getSum2
    // series[series.length - 2].label.formatter = getSum1
}

/**
 * @函数功能: 修改用电量总数数值的标签
 * @param {*} option echarts数据
 * @param {*} value api接收数据
 * @出口参数: 
 * @函数备注: 
 */
const changeecharts=(option:any,value:any)=>{
  var series = option.series

  echartsData.power.box.on('legendselectchanged',(obj)=>{
      //重新计算前一年数据
      // function getSum1 (params) {
      //   let stack=value.listData[0].years
      //   var datavalue = 0
      //   for (var i = 0; i < series.length; i++) {
      //     if (obj.selected[series[i].name]) {
      //       if(series[i].stack==stack){
      //       // datavalue += series[i].data[params.dataIndex]
      //       datavalue=accAdd(datavalue,series[i].data[params.dataIndex])
      //       }
      //     }
      //   }
      //   return datavalue ? stack+'年/'+ datavalue+'kw.h' : null
      // }
      //重新计算今年年数据
      function getSum2 (params) {
        let stack=value.listData[1].years
        var datavalue = 0
        for (var i = 0; i < series.length; i++) {
          if (obj.selected[series[i].name]) {
            if(series[i].stack==stack){
            // datavalue += series[i].data[params.dataIndex]
            datavalue=accAdd(datavalue,series[i].data[params.dataIndex])
            }
          }
        }
        return datavalue ? datavalue.toLocaleString() : null
      } 
      series[series.length - 1].label.formatter = getSum2
    // series[series.length - 2].label.formatter = getSum1
    echartsData.power.box.setOption(option)
})








  // function getSum1 (params) {
  //     let stack=value.listData[0].years
  //       var datavalue = 0
  //       for (var i = 0; i < series.length; i++) {
  //         if(series[i].stack==stack){
  //           // datavalue += series[i].data[params.dataIndex]
  //           datavalue=accAdd(datavalue,series[i].data[params.dataIndex])
  //         }
          
  //       }
  //       return datavalue ? stack+'年/'+ datavalue+'kw.h' : null
  //     }
      function getSum2 (params) {
      let stack=value.listData[1].years
        var datavalue = 0
        for (var i = 0; i < series.length; i++) {
          if(series[i].stack==stack){
            // datavalue += series[i].data[params.dataIndex]
            datavalue=accAdd(datavalue,series[i].data[params.dataIndex])
          }
          
        }
        return datavalue ?  datavalue.toLocaleString() : null
      }
    series[series.length - 1].label.formatter = getSum2
    // series[series.length - 2].label.formatter = getSum1
}
let boxWH = reactive({
  width: "0px",
  height: "0px",
});
function setchartWH(width:any,height:any){
  echartsData.power!.div=power.value
    power.value.style.height=height+'px'
    power.value.style.width=width+'px'
    boxWH.height = height+30 + "px";
    boxWH.width = width + "px";
  refborder4.value.resetWH()
if(echartsData.power.box){
  echartsData.power.box.resize()
}

}
onMounted(() => {

})

// return{setchartWH}
defineExpose({
  setchartWH,
  setData
})

</script>

<style scoped>

</style>
