import * as echarts from "echarts";


// 计算总和
function getTotal(data) {
  return data.reduce((sum, item) => sum + item.value, 0);
};
export const pieOption = (data) => {
  console.log(data, 'datadatadata')
  // 颜色数组
  const colors = [
    'rgba(105, 177, 255, 1)',
    'rgba(255, 236, 61, 1)',
    'rgba(135, 232, 222, 1)',
    'rgba(133, 165, 255, 1)',
    'rgba(255, 120, 117, 1)',
    'rgba(179, 127, 235, 1)',
    'rgba(255, 187, 120, 1)',
    'rgba(120, 255, 180, 1)',
    'rgba(255, 150, 150, 1)'
  ];
  const seriesData = data.names.map((name, index) => ({
    name,
    value: data.values[index],
    itemStyle: { color: colors[index % colors.length] }
  }));
  const option = {
    tooltip: {
      trigger: 'item'
    },
    legend: {
      orient: 'vertical',
      x: 'right',
      y: 'center',
      align: 'left',
      left: '50%',
      data: data.names,
      textStyle: { // 图例字体样式
        color: "rgba(59, 65, 75, 1)",
        fontSize: 16
      },
      // formatter: function (name) {
      //   var total = data.total;
      //   var item = data.find(item => item.name === name);
      //   var percentage = ((item.value / total) * 100).toFixed(2);
      //   return `${name} ${percentage}%`;
      // }
    },
    series: [
      {
        name: '频度',
        type: 'pie',
        center: ['25%', '50%'],
        radius: ['40%', '70%'],
        avoidLabelOverlap: false,
        label: {
          show: false,
          position: 'center'
        },

        labelLine: {
          show: false
        },
        data: seriesData
      }
    ]
  };
  return option
}

var data1 = [
  {
    name: "捐赠基金",
    value: 27
  },
  {
    name: "政府拨款",
    value: 22
  },
  {
    name: "企业合作",
    value: 18
  },
  {
    name: "学费收入",
    value: 15
  },
  {
    name: "其他来源",
    value: 12
  }
];

export const pieOption1 = (data) => {
  // 提取部门名称和对应的金额 
  const colors = [
    'rgba(105, 177, 255, 1)',
    'rgba(255, 236, 61, 1)',
    'rgba(135, 232, 222, 1)',
    'rgba(133, 165, 255, 1)',
    'rgba(255, 120, 117, 1)'
  ];
  // 提取部门名称和对应的金额
  const departmentNames = data.map(item => item.departmentName);
  const amounts = data.map(item => item.amount);

  // 计算总金额
  const getTotal = (data) => {
    return data.reduce((total, item) => total + item.amount, 0);
  };

  // 饼图配置
  const option = {
    legend: {
      orient: 'vertical',
      x: 'right',
      y: 'center',
      align: 'left',
      left: '60%',
      data: departmentNames,
      textStyle: { // 图例字体样式
        color: "rgba(59, 65, 75, 1)",
        fontSize: 16
      },
      formatter: function (name) {
        var total = getTotal(data);
        var item = data.find(item => item.departmentName === name);
        var percentage = ((item.amount / total) * 100).toFixed(2);
        return `${name} ${percentage}%`;
      }
    },
    series: [
      {
        name: '频度',
        type: 'pie',
        center: ['30%', '50%'],
        radius: ['40%', '70%'],
        avoidLabelOverlap: false,
        label: {
          show: false,
          position: 'center'
        },
        labelLine: {
          show: false
        },
        data: data.map((item, index) => ({
          name: item.departmentName,
          value: item.amount,
          itemStyle: { color: colors[index % colors.length] } // 使用颜色列表
        }))
      }
    ]
  };
  return option;
}

export const raderOption = (data) => {
  // 提取所有可能的 areaName
  const allAreaNames = new Set();
  data.forEach(subject => {
    subject.areaVoList.forEach(area => {
      allAreaNames.add(area.areaName);
    });
  });
  const indicatorNames = Array.from(allAreaNames);

  // 定义雷达图的指标最大值（可以根据实际数据调整）
  const indicatorMaxValues = {};
  indicatorNames.forEach(name => {
    indicatorMaxValues[name] = 5; // 假设每个指标的最大值为 5
  });

  // 生成雷达图的 indicator 配置
  const radarIndicators = indicatorNames.map(name => ({
    name,
    max: indicatorMaxValues[name]
  }));

  // 为每个 subjectTypeName 生成雷达图数据
  const radarSeriesData = data.map(subject => {
    const values = indicatorNames.map(indicator => {
      const area = subject.areaVoList.find(a => a.areaName === indicator);
      return area ? area.amount : 0; // 如果存在该指标，取其 amount 值，否则为 0
    });
    return {
      value: values,
      name: subject.subjectTypeName,
      areaStyle: { color: `rgba(${Math.floor(Math.random() * 256)}, ${Math.floor(Math.random() * 256)}, ${Math.floor(Math.random() * 256)}, 0.2)` }
    };
  });
  // 雷达图配置
  const option = {
    title: { text: '' },
    legend: {
      icon: 'circle',
      orient: 'vertical',
      right: 50,
      top: 'center',
      align: 'left',
      textStyle: {
        color: "rgba(59, 65, 75, 1)",
        fontSize: "16px"
      }
    },
    radar: {
      radius: '60%',
      indicator: radarIndicators,
      axisName: {
        formatter: '{value}',
        color: 'rgba(59, 65, 75, 1)',
        fontSize: 16,
        fontWeight: 700
      }
    },
    series: [
      {
        name: 'Budget vs spending',
        type: 'radar',
        data: radarSeriesData
      }
    ]
  };
  return option;

}


export const barOption = (data) => {
  // 提取年份和对应的专利数量
  const years = data.map(item => item.year.toString());
  const counts = data.map(item => item.countNum);
  // 柱状图配置
  const option = {
    tooltip: {
      trigger: "axis",
      axisPointer: {
        type: "shadow"
      }
    },
    grid: {
      top: '3%',
      right: '3%',
      bottom: '1%',
      left: '1%',
      containLabel: true
    },
    xAxis: [{
      axisLine: {
        lineStyle: {
          width: 1,
          color: "rgba(231, 243, 255, 1)"
        }
      },
      axisTick: { show: false },
      type: "category",
      boundaryGap: [100, 100],
      axisLabel: {
        color: "rgba(95, 101, 108, 1)",
        // fontSize: 22,
        // fontWeight: 400
      },
      data: years, // 动态设置 xAxis 数据
    }],
    yAxis: {
      type: "value",
      axisLine: {
        lineStyle: {
          type: "dashed"
        }
      },
      axisLabel: {
        color: "rgba(95, 101, 108, 1)",
        // fontSize: 22,
        // fontWeight: 400
      },
      splitNumber: 5,
      splitLine: {
        lineStyle: {
          width: 1,
          type: "dashed",
          color: "rgba(231, 243, 255, 1)"
        },
      }
    },
    series: [
      {
        name: "专利数量",
        data: counts, // 动态设置 series 数据
        type: "bar",
        barWidth: 20,
        itemStyle: {
          color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
            { offset: 0, color: "rgba(46, 165, 255, 1)" },
            { offset: 1, color: "rgba(46, 165, 255, 0)" }
          ])
        },
        label: {
          show: false,
          position: 'top',
          textStyle: {
            fontSize: '20px',
            fontWeight: 400,
            color: 'rgba(255, 255, 255, 1)'
          }
        }
      }
    ]
  };
  return option;
}
export const lineChart = (data) => {
  // 提取年份和对应的专利数量
  const years = data.map(item => item.year.toString());
  const counts = data.map(item => item.countNum);
  // 折线图配置
  const option = {
    tooltip: {
      trigger: "axis",
      axisPointer: {
        type: "shadow"
      }
    },
    grid: {
      left: '2%',
      top: '8%',
      right: '2%',
      bottom: '3%',
      containLabel: true
    },
    xAxis: {
      type: 'category',
      boundaryGap: false,
      splitLine: {
        show: false
      },
      axisLine: {
        show: false
      },
      data: years, // 动态设置 xAxis 数据
    },
    yAxis: {
      type: 'value',
      splitLine: {
        show: true,
        lineStyle: {
          type: "dashed",
          color: "#E7F3FF"
        }
      },
      axisLine: {
        show: false
      },
    },
    color: ['rgba(255, 149, 77, 1)'],
    series: [
      {
        data: counts, // 动态设置 series 数据
        type: 'line',
        emphasis: {
          focus: 'series'
        },
        areaStyle: {
          color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
            { offset: 0, color: 'rgba(255, 149, 77, 0.5)' }, // 起始颜色：深色
            { offset: 1, color: 'rgba(255, 149, 77, 0)' } // 结束颜色：浅色且透明度降低
          ])
        },
      }
    ]
  };
  return option;
}
export const lineChart1 = (data) => {
  // 提取年份和对应的 fundAmount
  const years = data.map(item => item.year.toString());
  const fundAmounts = data.map(item => item.fundAmount);
  // 折线图配置
  const option = {
    tooltip: {
      trigger: "axis",
      axisPointer: {
        type: "shadow"
      }
    },
    grid: {
      left: '2%',
      top: '8%',
      right: '2%',
      bottom: '3%',
      containLabel: true
    },
    xAxis: {
      type: 'category',
      boundaryGap: false,
      splitLine: {
        show: false
      },
      axisLine: {
        show: false
      },
      data: years, // 动态设置 xAxis 数据
    },
    yAxis: {
      type: 'value',
      splitLine: {
        show: true,
        lineStyle: {
          type: "dashed",
          color: "#E7F3FF"
        }
      },
      axisLine: {
        show: false
      },
    },
    color: ['rgba(33, 129, 57, 1)'],
    series: [
      {
        data: fundAmounts, // 动态设置 series 数据
        type: 'line',
        emphasis: {
          focus: 'series'
        },
        areaStyle: {
          color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
            { offset: 0, color: 'rgba(33, 129, 57, 0.5)' }, // 起始颜色：深色
            { offset: 1, color: 'rgba(33, 129, 57, 0)' } // 结束颜色：浅色且透明度降低
          ])
        },
      }
    ]
  };
  return option;
}


const nameList = ["教育学院", "文理学院", "法学院", "商学院", "工程学院", "医学院"];
const valueList = [21, 21, 25, 79, 95, 109];
export const horizontalBaroption = (data) => {
  // 提取部门名称和对应的金额
  const departmentNames = data.map(item => item.departmentName);
  const amounts = data.map(item => item.amount);

  // 水平柱状图配置
  const option = {
    grid: {
      top: '0',
      right: '3%',
      bottom: '1%',
      left: '1%',
      containLabel: true
    },
    color: ['#ce4f51', '#1778ff'],
    xAxis: {
      type: 'value',
      splitLine: {
        show: false
      },
      show: false
    },
    yAxis: {
      type: 'category',
      data: departmentNames, // 动态设置 yAxis 数据
      splitLine: {
        show: false
      },
      axisTick: {
        show: false
      },
      axisLine: {
        show: false
      },
      axisLabel: {
        show: true
      }
    },
    series: [{
      type: 'bar',
      data: amounts.map((item, index) => {
        return {
          value: item,
          label: {
            textStyle: {
              color: index < 3 ? '#1778ff' : '#ce4f51'
            }
          }
        };
      }),
      label: {
        show: true,
        position: [650, -2]
      },
      barWidth: 8,
      itemStyle: {
        color: function (params) {
          if (params.dataIndex < 3) {
            return new echarts.graphic.LinearGradient(0, 0, 1, 0, [
              { offset: 0, color: 'rgba(22, 119, 255, 0)' },
              { offset: 1, color: '#1778ff' }
            ]);
          } else {
            return new echarts.graphic.LinearGradient(0, 0, 1, 0, [
              { offset: 0, color: 'rgba(206, 79, 81, 0)' },
              { offset: 1, color: '#ce4f51' }
            ]);
          }
        },
        barBorderRadius: 4,
      }
    }]
  };
  return option;
}
export const raderOption1 = (data) => {
  // 提取指标名称和对应的值
  const indicatorNames = data.map(item => item.areaName);
  const indicatorValues = data.map(item => item.areaValue);

  // 动态生成雷达图的 indicator 配置
  const indicators = indicatorNames.map((name, index) => ({
    name,
    max: Math.max(...indicatorValues) * 1.2 // 设置最大值为所有值的最大值的1.2倍
  }));

  let radarData = {
    color:
      "rgba(215, 27, 56, 0.2)",
    name: '',
    value: indicatorValues
  }
  console.log(indicators, 'indicators', radarData, 'radarDataradarData')
  // 雷达图配置
  const option = {
    title: { text: '' },
    legend: {
      icon: 'circle',
      orient: 'vertical',
      right: 50,
      top: 'center',
      align: 'left',
      textStyle: {
        color: "rgba(59, 65, 75, 1)",
        fontSize: "16px"
      }
    },
    radar: {
      radius: '60%',
      indicator: indicators,
      axisName: {
        formatter: '{value}',
        color: 'rgba(59, 65, 75, 1)',
        fontSize: 16,
        fontWeight: 700
      }
    },
    series: [
      {
        name: 'Budget vs spending',
        type: 'radar',
        data: [radarData]
      }
    ]
  };
  return option;

}

