import { defineComponent, useCssVars, unref, toRefs, ref, watch, openBlock, createElementBlock, normalizeClass, createElementVNode, toDisplayString } from "vue";
import "./DigitalItem.vue_vue_type_style_index_0_scoped_true_lang.mjs";
import _export_sfc from "../../../../../_virtual/plugin-vue_export-helper.mjs";
const _hoisted_1 = { class: "current top" };
const _hoisted_2 = { class: "next top" };
const _hoisted_3 = { class: "current bottom" };
const _hoisted_4 = { class: "next bottom" };
const _sfc_main = /* @__PURE__ */ defineComponent({
  __name: "DigitalItem",
  props: {
    chartConfig: {
      type: Object,
      required: true
    },
    value: {
      type: Number,
      required: false
    }
  },
  setup(__props) {
    const props = __props;
    useCssVars((_ctx) => ({
      "a71b68a6": unref(singleWidth) + "px",
      "731ee04c": unref(singleHeight) + "px",
      "706a28ea": unref(fontSize) + "px",
      "11dc3a09": unref(singleHeight) / 2 + "px"
    }));
    const { fontSize, singleHeight, singleWidth } = toRefs(props.chartConfig.option);
    let changeState = ref("");
    let time = ref(0);
    let nextTime = ref(0);
    let duration = 1e3;
    let arrow = "up";
    watch(
      () => props.value,
      (n) => {
        if (typeof n == "number")
          selfAdaption(n);
      },
      { deep: true, immediate: true }
    );
    function selfAdaption(n) {
      changeState.value = "";
      setTimeout(() => {
        changeState.value = "changing";
      }, 20);
      setTimeout(() => {
        changeState.value = "changed";
      }, duration * 0.9);
      time.value = n;
      nextTime.value = n - 1 < 0 ? 0 : n - 1;
    }
    function Interval() {
      setTimeout(() => {
        changeState.value = "";
        setTimeout(() => {
          changeState.value = "changing";
        }, 20);
        setTimeout(() => {
          changeState.value = "changed";
        }, duration * 0.9);
        if (time.value == 0)
          arrow = "up";
        if (time.value == 9)
          arrow = "down";
        let delta = -1;
        if (arrow == "up")
          delta = 1;
        if (arrow == "down") {
          if (time.value == 0) {
            setTimeout(() => {
              time.value = 9;
            }, 20);
          }
        }
        if (arrow == "up") {
          if (time.value == 9) {
            setTimeout(() => {
              time.value = 0;
            }, 20);
          }
        }
        time.value += delta;
        nextTime.value = time.value - delta;
        Interval();
      }, duration);
    }
    if (!(typeof props.value == "number")) {
      Interval();
    }
    return (_ctx, _cache) => {
      return openBlock(), createElementBlock("div", {
        class: normalizeClass(["count", [unref(changeState), unref(arrow)]])
      }, [
        createElementVNode("span", _hoisted_1, toDisplayString(unref(nextTime)), 1),
        createElementVNode("span", _hoisted_2, toDisplayString(unref(time)), 1),
        createElementVNode("span", _hoisted_3, toDisplayString(unref(nextTime)), 1),
        createElementVNode("span", _hoisted_4, toDisplayString(unref(time)), 1)
      ], 2);
    };
  }
});
var DigitalItem = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-3a070393"]]);
export { DigitalItem as default };
