import * as echarts from 'echarts';

export function stackRightOptions(xAxisData, yAxisData) {
  return {
    tooltip: {},
    xAxis: {
      data: xAxisData,
      axisTick: { show: false },
      splitLine: { show: false },
      splitArea: { show: false }
    },
    yAxis: {
      axisTick: { show: false },
      splitLine: { show: false },
      splitArea: { show: false }
    },
    grid: {
      top: 10,
      bottom: 20
    },
    series: [
      {
        type: 'bar',
        stack: 'one',
        data: yAxisData.data1,
        barWidth: 8,
        itemStyle: {
          normal: {
            color: '#00479D'
          }
        }
      },
      {
        type: 'bar',
        stack: 'one',
        data: yAxisData.data2,
        barWidth: 8,
        itemStyle: {
          normal: {
            color: '#EA68A2'
          }
        }
      },
      {
        type: 'bar',
        stack: 'one',
        data: yAxisData.data3,
        barWidth: 8,
        itemStyle: {
          normal: {
            color: '#00B7EE'
          }
        }
      },
      {
        type: 'bar',
        stack: 'one',
        data: yAxisData.data4,
        barWidth: 8,
        itemStyle: {
          normal: {
            color: '#18CC54'
          }
        }
      },
      {
        type: 'bar',
        stack: 'one',
        data: yAxisData.data4,
        barWidth: 8,
        itemStyle: {
          normal: {
            color: '#FFF34D'
          }
        }
      },
      {
        type: 'bar',
        stack: 'one',
        data: yAxisData.data4,
        barWidth: 8,
        itemStyle: {
          normal: {
            color: '#FF9500'
          }
        }
      }
    ]
  };
}

export function stackLeftOptions(xAxisData, yAxisData) {
  return {
    xAxis: [
      {
        type: 'category',
        data: ['2024-01', '2024-03', '2024-04', '2024-05', '2024-06', '2024-07', '2024-08'],
        axisPointer: {
          show: false
        },
        axisTick: { show: false },
        splitLine: { show: false },
        splitArea: { show: false }
      }
    ],
    grid: {
      top: 10,
      bottom: 20
    },
    yAxis: [
      {
        type: 'value',
        min: 0,
        max: 250,
        interval: 50
      },
      {
        type: 'value',
        min: 0,
        max: 25,
        interval: 5
      }
    ],
    series: [
      {
        name: 'Evaporation',
        type: 'bar',
        barWidth: 4,
        data: [62.0, 45.9, 37.0, 23.2, 25.6, 76.7, 35.6, 62.2, 32.6, 20.0, 61.4, 13.3],
        itemStyle: {
          color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
            {
              offset: 0,
              color: '#0080FF'
            },
            {
              offset: 1,
              color: 'rgba(0,128,255,0)'
            }
          ])
        }
      },
      {
        name: 'Precipitation',
        type: 'bar',
        barWidth: 4,
        data: [25.6, 57.9, 39.0, 26.4, 28.7, 40.7, 15.6, 32.2, 48.7, 18.8, 64.0, 28.3],
        itemStyle: {
          color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
            {
              offset: 0,
              color: '#00D5FF'
            },
            {
              offset: 1,
              color: 'rgba(0,195,255,0)'
            }
          ])
        }
      },
      {
        name: 'Temperature',
        type: 'line',
        smooth: true,
        yAxisIndex: 1,
        showSymbol: false,
        data: [9.0, 7.2, 3.3, 4.5, 6.3, 10.2, 10.3, 8.4, 13.0, 16.5, 12.0, 6.2],
        lineStyle: {
          color: '#FFD400',
          width: 1
        },
        areaStyle: {
          opacity: 0.8,
          color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
            {
              offset: 0,
              color: '#FFD400'
            },
            {
              offset: 1,
              color: 'rgba(255,212,0,0)'
            }
          ])
        }
      }
    ]
  };
}

// export function stackRightOptions(xAxisData, yAxisData) {
//   return {
//     tooltip: {},
//     xAxis: {
//       data: xAxisData,
//       axisTick: { show: false },
//       splitLine: { show: false },
//       splitArea: { show: false }
//     },
//     yAxis: {
//       axisTick: { show: false },
//       splitLine: { show: false },
//       splitArea: { show: false }
//     },
//     grid: {
//       top: 10,
//       bottom: 20,
//       left: 35
//     },
//     series: [
//       {
//         type: 'bar',
//         stack: 'one',
//         data: yAxisData.data1,
//         barWidth: 8,
//         itemStyle: {
//           normal: {
//             color: '#00479D'
//           }
//         }
//       },
//       {
//         type: 'bar',
//         stack: 'one',
//         data: yAxisData.data2,
//         barWidth: 8,
//         itemStyle: {
//           normal: {
//             color: '#EA68A2'
//           }
//         }
//       },
//       {
//         type: 'bar',
//         stack: 'one',
//         data: yAxisData.data3,
//         barWidth: 8,
//         itemStyle: {
//           normal: {
//             color: '#00B7EE'
//           }
//         }
//       },
//       {
//         type: 'bar',
//         stack: 'one',
//         data: yAxisData.data4,
//         barWidth: 8,
//         itemStyle: {
//           normal: {
//             color: '#18CC54'
//           }
//         }
//       },
//       {
//         name: 'bar5',
//         type: 'bar',
//         stack: 'one',
//         data: yAxisData.data4,
//         barWidth: 8,
//         itemStyle: {
//           normal: {
//             color: '#FFF34D'
//           }
//         }
//       },
//       {
//         name: 'bar6',
//         type: 'bar',
//         stack: 'one',
//         data: yAxisData.data4,
//         barWidth: 8,
//         itemStyle: {
//           normal: {
//             color: '#FF9500'
//           }
//         }
//       }
//     ]
//   };
// }

// export function stackLeftOptions(xAxisData, yAxisData) {
//   return {
//     xAxis: [
//       {
//         type: 'category',
//         data: xAxisData,
//         axisPointer: {
//           show: false
//         },
//         axisTick: { show: false },
//         splitLine: { show: false },
//         splitArea: { show: false }
//       }
//     ],
//     grid: {
//       top: 10,
//       bottom: 20,
//       left: 35,
//       right: 35
//     },
//     yAxis: [
//       {
//         type: 'value',
//         min: 0,
//         interval: 50
//       },
//       {
//         type: 'value',
//         min: 0,
//         interval: 50
//       }
//     ],
//     series: [
//       {
//         type: 'bar',
//         barWidth: 3,
//         data: yAxisData.data1,
//         itemStyle: {
//           color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
//             {
//               offset: 0,
//               color: '#0080FF'
//             },
//             {
//               offset: 1,
//               color: 'rgba(0,128,255,0)'
//             }
//           ])
//         }
//       },
//       {
//         type: 'bar',
//         barWidth: 3,
//         data: yAxisData.data2,
//         itemStyle: {
//           color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
//             {
//               offset: 0,
//               color: '#00D5FF'
//             },
//             {
//               offset: 1,
//               color: 'rgba(0,195,255,0)'
//             }
//           ])
//         }
//       },
//       {
//         type: 'bar',
//         barWidth: 3,
//         data: yAxisData.data4,
//         itemStyle: {
//           color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
//             {
//               offset: 0,
//               color: '#00D5FF'
//             },
//             {
//               offset: 1,
//               color: 'rgba(0,195,255,0)'
//             }
//           ])
//         }
//       },
//       {
//         type: 'bar',
//         barWidth: 3,
//         data: yAxisData.data3,
//         itemStyle: {
//           color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
//             {
//               offset: 0,
//               color: '#00D5FF'
//             },
//             {
//               offset: 1,
//               color: 'rgba(0,195,255,0)'
//             }
//           ])
//         }
//       },
//       {
//         type: 'line',
//         smooth: true,
//         yAxisIndex: 1,
//         showSymbol: false,
//         data: yAxisData.line,
//         lineStyle: {
//           color: '#FFD400',
//           width: 1
//         },
//         areaStyle: {
//           opacity: 0.8,
//           color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
//             {
//               offset: 0,
//               color: '#FFD400'
//             },
//             {
//               offset: 1,
//               color: 'rgba(255,212,0,0)'
//             }
//           ])
//         }
//       }
//     ]
//   };
// }
