
<style>
.sexChart{
    height: 100%;
}
</style>
<template>
  <div class="sexChart" ref="sexChart">
    
  </div>
</template>
<script>
export default {
    props: ["dataList","totalCount"],    
    data() {
        return {
            nameList:[],
            data:[],
        };
    },watch:{
        
    },
    mounted() {
        if(this.dataList&&this.dataList.length>0){
            this.data=[];
            this.dataList.forEach(x => {
                this.nameList.push(x.FestivalName);
                let obj={
                    value:0,
                    name:''
                }
                // obj.value=((x.OrderCount / this.totalCount * 10000) / 100.00).toFixed(1);
                obj.value=x.ShopMoney;
                obj.name=x.FestivalName
                this.data.push(obj);
            });
        }
        this.init()
        let myChart = this.$echarts.init(this.$refs.sexChart);
        window.addEventListener("resize", () => { 
            myChart.resize();  
        });
    },
    methods: {
        init(){
            let myChart = this.$echarts.init(this.$refs.sexChart);
            let option = {
                title: {
                    text: '',
                    subtext: '',
                    left: 'center'
                },
                tooltip: {
                    trigger: 'item',
                    formatter: '{a} <br/>{b} : ({d}%)'
                },
                legend: {
                    orient: 'vertical',
                    left: 'left',
                    data: []
                },
                series: [
                    {
                        name: '购物占比',
                        type: 'pie',
                        radius: '55%',
                        center: ['50%', '60%'],
                        data: this.data,
                        emphasis: {
                            itemStyle: {
                                shadowBlur: 10,
                                shadowOffsetX: 0,
                                shadowColor: 'rgba(0, 0, 0, 0.5)'
                            }
                        }
                    }
                ]
            };
            myChart.setOption(option);
        }
    }
}
</script>