/*
 * @Author: changjun
 * @FilePath: /yuan-qingdao-zld-browser/src/components/chart/logic/useLineXAxisAuto.ts
 * @Date: 2022-09-05 16:06:46
 * @Description: x 轴固定数量，自动滚动
 * @LastEditTime: 2023-03-08 14:24:16
 * @LastEditors: 李佐宁
 */
import { onBeforeUpdate } from "vue";
import { tryOnMounted, tryOnUnmounted } from "@vueuse/core";
export const useLineXAxisAuto = (chart, chartOption, xAxisData) => {
  const dataZoom = chartOption.dataZoom;
  let timer = null as any;
  const autoSwipe = () => {
    if (dataZoom.endValue == xAxisData.length) {
      chartOption.dataZoom.endValue = 6;
      chartOption.dataZoom.startValue = 0;
    } else {
      chartOption.dataZoom.endValue = chartOption.dataZoom.endValue + 1;
      chartOption.dataZoom.startValue = chartOption.dataZoom.startValue + 1;
    }
    chart.setOption(chartOption);
  };

  const init = () => {
    if (timer) {
      stopAutoSwipe();
    }
    timer = setInterval(autoSwipe, 2000);
  };

  const stopAutoSwipe = () => {
    clearInterval(timer);
    timer = null;
    console.log(chartOption);
    if (chart && chartOption.dataZoom) {
      chartOption.dataZoom.endValue = 6;
      chartOption.dataZoom.startValue = 0;
      chart.setOption(chartOption);
    }
  };

  if (!timer && xAxisData.length > 0) {
    init();
  }

  // tryOnUnmounted(() => {
  //   stopAutoSwipe();
  // });

  return { stopAutoSwipe };
};