"use strict";
Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
require("../../../../../../node_modules/.pnpm/vue@3.3.4/node_modules/vue/dist/vue.runtime.esm-bundler.js");
const utils = require("../../../../../utils/utils.js");
require("../../../../../../node_modules/.pnpm/crypto-js@4.1.1/node_modules/crypto-js/index.js");
require("../../../../../enums/pageEnum.js");
require("../../../../../router/index.js");
require("../../../../../store/modules/designStore/designStore.js");
require("../../../../../../node_modules/.pnpm/vue3-lazyload@0.2.5-beta_a6dezdz3je235ci4e3tu4rayna/node_modules/vue3-lazyload/dist/vue3-lazyload.esm.js");
require("../../../../../components/GoSkeleton/index.vue.js");
require("../../../../../components/GoLoading/index.js");
require("../../../../../settings/designSetting.js");
const runtimeCore_esmBundler = require("../../../../../../node_modules/.pnpm/@vue_runtime-core@3.3.4/node_modules/@vue/runtime-core/dist/runtime-core.esm-bundler.js");
const reactivity_esmBundler = require("../../../../../../node_modules/.pnpm/@vue_reactivity@3.3.4/node_modules/@vue/reactivity/dist/reactivity.esm-bundler.js");
const _withScopeId = (n) => (runtimeCore_esmBundler.pushScopeId("data-v-966367ac"), n = n(), runtimeCore_esmBundler.popScopeId(), n);
const _hoisted_1 = { class: "go-border-box" };
const _hoisted_2 = ["width", "height"];
const _hoisted_3 = ["d"];
const _hoisted_4 = /* @__PURE__ */ _withScopeId(() => /* @__PURE__ */ runtimeCore_esmBundler.createElementVNode("stop", {
  offset: "0%",
  "stop-color": "#fff",
  "stop-opacity": "1"
}, null, -1));
const _hoisted_5 = /* @__PURE__ */ _withScopeId(() => /* @__PURE__ */ runtimeCore_esmBundler.createElementVNode("stop", {
  offset: "100%",
  "stop-color": "#fff",
  "stop-opacity": "0"
}, null, -1));
const _hoisted_6 = [
  _hoisted_4,
  _hoisted_5
];
const _hoisted_7 = ["fill"];
const _hoisted_8 = ["dur", "path"];
const _hoisted_9 = ["fill", "points"];
const _hoisted_10 = ["stroke", "xlink:href"];
const _hoisted_11 = ["stroke", "xlink:href", "mask"];
const _hoisted_12 = ["from", "to", "dur"];
const _sfc_main = /* @__PURE__ */ runtimeCore_esmBundler.defineComponent({
  __name: "index",
  props: {
    chartConfig: {
      type: Object,
      required: true
    }
  },
  setup(__props) {
    const props = __props;
    const path = `border-box-08-path-${utils.getUUID()}`;
    const gradient = `border-box-08-gradient-${utils.getUUID()}`;
    const mask = `border-box-08-mask-${utils.getUUID()}`;
    const { w, h } = reactivity_esmBundler.toRefs(props.chartConfig.attr);
    const { colors, dur, backgroundColor, reverse } = reactivity_esmBundler.toRefs(
      props.chartConfig.option
    );
    const length = runtimeCore_esmBundler.computed(() => {
      return (w.value + h.value - 5) * 2;
    });
    const pathD = runtimeCore_esmBundler.computed(() => {
      if (reverse.value)
        return `M 2.5, 2.5 L 2.5, ${h.value - 2.5} L ${w.value - 2.5}, ${h.value - 2.5} L ${w.value - 2.5}, 2.5 L 2.5, 2.5`;
      return `M2.5, 2.5 L${w.value - 2.5}, 2.5 L${w.value - 2.5}, ${h.value - 2.5} L2.5, ${h.value - 2.5} L2.5, 2.5`;
    });
    return (_ctx, _cache) => {
      return runtimeCore_esmBundler.openBlock(), runtimeCore_esmBundler.createElementBlock("div", _hoisted_1, [
        (runtimeCore_esmBundler.openBlock(), runtimeCore_esmBundler.createElementBlock("svg", {
          width: reactivity_esmBundler.unref(w),
          height: reactivity_esmBundler.unref(h)
        }, [
          runtimeCore_esmBundler.createElementVNode("defs", null, [
            runtimeCore_esmBundler.createElementVNode("path", {
              id: path,
              d: pathD.value,
              fill: "transparent"
            }, null, 8, _hoisted_3),
            runtimeCore_esmBundler.createElementVNode("radialGradient", {
              id: gradient,
              cx: "50%",
              cy: "50%",
              r: "50%"
            }, _hoisted_6),
            runtimeCore_esmBundler.createElementVNode("mask", { id: mask }, [
              runtimeCore_esmBundler.createElementVNode("circle", {
                cx: "0",
                cy: "0",
                r: "150",
                fill: `url(#${gradient})`
              }, [
                runtimeCore_esmBundler.createElementVNode("animateMotion", {
                  dur: `${reactivity_esmBundler.unref(dur)}s`,
                  path: pathD.value,
                  rotate: "auto",
                  repeatCount: "indefinite"
                }, null, 8, _hoisted_8)
              ], 8, _hoisted_7)
            ])
          ]),
          runtimeCore_esmBundler.createElementVNode("polygon", {
            fill: reactivity_esmBundler.unref(backgroundColor),
            points: `5, 5 ${reactivity_esmBundler.unref(w) - 5}, 5 ${reactivity_esmBundler.unref(w) - 5} ${reactivity_esmBundler.unref(h) - 5} 5, ${reactivity_esmBundler.unref(h) - 5}`
          }, null, 8, _hoisted_9),
          runtimeCore_esmBundler.createElementVNode("use", {
            stroke: reactivity_esmBundler.unref(colors)[0],
            "stroke-width": "1",
            "xlink:href": `#${path}`
          }, null, 8, _hoisted_10),
          runtimeCore_esmBundler.createElementVNode("use", {
            stroke: reactivity_esmBundler.unref(colors)[1],
            "stroke-width": "3",
            "xlink:href": `#${path}`,
            mask: `url(#${mask})`
          }, [
            runtimeCore_esmBundler.createElementVNode("animate", {
              attributeName: "stroke-dasharray",
              from: `0, ${length.value}`,
              to: `${length.value}, 0`,
              dur: `${reactivity_esmBundler.unref(dur)}s`,
              repeatCount: "indefinite"
            }, null, 8, _hoisted_12)
          ], 8, _hoisted_11)
        ], 8, _hoisted_2))
      ]);
    };
  }
});
exports.default = _sfc_main;
