<template>
  <vab-chart
    style="width: 100%; height: 200px; z-index: 999"
    :autoresize="true"
    :options="option"
    theme="vab-echarts-theme"
  />
</template>
<script>
  import VabChart from "@/extra/vabCharts";
  export default {
    components: { VabChart },
    props: {
      goodsValue: {
        type: Array,
        default: () => {
          return [];
        },
      },
      goodsName2: {
        type: Array,
        default: () => {
          return [];
        },
      },
    },
    data() {
      return {
        // option: {
        //   tooltip: {
        //     trigger: "item",
        //   },
        //
        //   series: [
        //     {
        //       name: "客户订单",
        //       type: "pie",
        //       radius: "55%",
        //       center: ["50%", "60%"],
        //       data: this.goodsValue,
        //       emphasis: {
        //         itemStyle: {
        //           shadowBlur: 10,
        //           shadowOffsetX: 0,
        //           shadowColor: "rgba(0, 0, 0, 0.5)",
        //         },
        //       },
        //     },
        //   ],
        // },
      };
    },
    computed: {
      option() {
        return {
          tooltip: {
            trigger: "item",
          },

          series: [
            {
              name: "客户金额",
              type: "pie",
              radius: "55%",
              center: ["50%", "55%"],
              data: this.goodsValue,
              emphasis: {
                itemStyle: {
                  shadowBlur: 10,
                  shadowOffsetX: 0,
                  shadowColor: "rgba(0, 0, 0, 0.5)",
                },
              },
            },
          ],
        };
      },
    },
  };
</script>
<style></style>
