import { defineComponent as R, ref as g, onMounted as K, onBeforeUnmount as Q, computed as X, watch as h, createElementBlock as d, openBlock as u, normalizeClass as H, createCommentVNode as S, normalizeStyle as f, Fragment as W, renderList as M, createElementVNode as B, toDisplayString as k, unref as Y } from "vue";
import { cloneDeep as p, isEqual as b } from "lodash";
import z from "gsap";
import { useFps as Z } from "@vueuse/core";
import { World as x } from "./map3d/map.mjs";
import { initWatch as ee } from "./watch.mjs";
import "three";
import "d3-geo";
import "three/examples/jsm/controls/OrbitControls";
import "three/examples/jsm/loaders/GLTFLoader";
import "three/examples/jsm/loaders/DRACOLoader.js";
import { createHistory as te } from "./map3d/mini3d/utils/CreateHistory.mjs";
import "three/examples/jsm/libs/lil-gui.module.min";
import "three/examples/jsm/utils/BufferGeometryUtils";
import "three/examples/jsm/renderers/CSS3DRenderer";
import { SHJDatasourceV2 as oe } from "../../commons/core/datasource/index.mjs";
import { autoInstallFont as L, jsonToCssStyle as E } from "../../commons/utils/json2css.mjs";
const ae = { class: "value" }, le = ["onClick"], ne = {
  key: 3,
  class: "fps"
}, ie = R({ name: "zv-scene-map3d" }), Oe = /* @__PURE__ */ R({
  ...ie,
  props: {
    basicOption: {},
    sources: {},
    useEvents: {},
    uuid: {}
  },
  emits: [
    "on-loaded",
    "on-animated",
    "on-drill-down",
    "on-area-mouseover",
    "on-area-mouseout",
    "on-area-click",
    "on-bar-click",
    "on-scatter-click",
    "on-flyline-click",
    "on-return",
    "on-data-change"
  ],
  setup(T, { expose: $, emit: V }) {
    const r = V, a = T, l = g(), O = g(!1), C = g(!1), w = "zerov-map3d-scene", I = "zerov-map3d-scene-wrap", n = new te(), v = g(!1), y = (e = !0) => {
      l.value.cleanAllBar(), l.value.cleanAllScatter(), l.value.cleanAllFlyLine(), l.value.createAllRegionalLevel(), a.sources && a.sources.length > 0 && oe.parse({
        tId: a.uuid,
        sources: a.sources,
        callback: (o) => {
          try {
            const t = a.basicOption.widgets && a.basicOption.widgets.find((s) => s._sourceId === o.id);
            t && t.type === "bar" && l.value.createBar(t, o.data[0].data, !0, e), t && t.type === "scatter" && l.value.createScatter(t, o.data[0].data, !0, e), t && t.type === "flyline" && l.value.createFlyLine(t, o.data[0].data, !0, e), t && t.type === "regionalLevel" && l.value.createRegionalLevel(t, o.data[0].data, !0, e), e && (l.value.createBarTimeLine(), l.value.createScatterTimeLine(), l.value.createFlyLineTimeLine(), l.value.createRegionalLevelTimeLine()), r("on-data-change", o), window.SHJParseEvent(a.useEvents, "on-data-change", o);
          } catch {
            r("on-data-change", null), window.SHJParseEvent(a.useEvents, "on-data-change", null);
          }
        }
      });
    }, N = () => {
      document.getElementById(w) && document.getElementById(I).removeChild(document.getElementById(w));
      const e = document.createElement("canvas");
      e.id = w, e.className = "zerov-map-3d", e.style.width = "100%", e.style.height = "100%", document.getElementById(I).appendChild(e);
    }, m = (e) => (O.value = !1, C.value = !1, l.value && (l.value.destroy(), l.value = null), N(), new x(document.getElementById(w), { geoProjectionCenter: [108.55, 36.32] }, e, {
      onAreaMouseover: (t) => {
        r("on-area-mouseover", t), window.SHJParseEvent(a.useEvents, "on-area-mouseover", t);
      },
      onAreaMouseout: (t) => {
        r("on-area-mouseout", t), window.SHJParseEvent(a.useEvents, "on-area-mouseout", t);
      },
      onLoadChild: (t) => {
        if (r("on-area-click", t), window.SHJParseEvent(a.useEvents, "on-area-click", t), t.adcode !== n.present && a.basicOption.scene.isDrilling && a.basicOption.scene.defaultMapAdcode !== 1) {
          r("on-drill-down", t), window.SHJParseEvent(a.useEvents, "on-drill-down", t);
          const s = p(a.basicOption);
          s.scene.defaultMapAdcode = t.adcode, l.value = m(s), n.push(t.adcode), n.past.length <= 0 ? v.value = !1 : v.value = !0;
        }
      },
      onMapSuccess: () => {
        O.value = !0, r("on-loaded"), window.SHJParseEvent(a.useEvents, "on-loaded", null);
      },
      onMapAnimationSuccess: () => {
        y(), C.value = !0, r("on-animated"), window.SHJParseEvent(a.useEvents, "on-animated", null);
      },
      onClickBar: (t) => {
        r("on-bar-click", t), window.SHJParseEvent(a.useEvents, "on-bar-click", t);
      },
      onClickScatter: (t) => {
        r("on-scatter-click", t), window.SHJParseEvent(a.useEvents, "on-scatter-click", t);
      },
      onClickFlyline: (t) => {
        r("on-flyline-click", t), window.SHJParseEvent(a.useEvents, "on-flyline-click", t);
      }
    }));
    K(() => {
      setTimeout(() => {
        l.value = m(a.basicOption), n.push(a.basicOption.scene.defaultMapAdcode), ee(a, l, m, y, j);
      }, 0);
    }), Q(() => {
      l.value && l.value.destroy();
    });
    const P = () => {
      r("on-return", {
        parentAdcode: n.past[n.past.length - 1],
        adcode: n.present
      }), window.SHJParseEvent(a.useEvents, "on-return", {
        parentAdcode: n.past[n.past.length - 1],
        adcode: n.present
      }), n.undo();
      const e = p(a.basicOption);
      e.scene.defaultMapAdcode = n.present, l.value = m(e), n.past.length <= 0 ? v.value = !1 : v.value = !0;
    }, j = () => {
      n.empty(), n.push(a.basicOption.scene.defaultMapAdcode), l.value = m(a.basicOption), n.past.length <= 0 ? v.value = !1 : v.value = !0;
    }, D = (e, o, t) => {
      z.timeline().add(z.to(l.value.camera.instance.position, {
        duration: 2,
        delay: 0,
        x: e,
        y: o,
        z: t,
        ease: "circ.out"
      }));
    };
    $({
      refresh: () => y(),
      refreshView: () => y(),
      refreshData: () => y(),
      // 返回上一级
      goBack: () => P(),
      // 更新相机位置
      setCameraPosition: (e, o, t) => D(e, o, t)
    });
    const U = Z(), A = g(), _ = (e) => {
      if (A.value && e) {
        L(a.basicOption.backButtonCss.fontFamily);
        const o = `url(${e.backgroundImage})`;
        return {
          ...E(e),
          left: a.basicOption.backButtonLeft + "%",
          bottom: a.basicOption.backButtonBottom + "%",
          "background-image": o
        };
      }
      return {};
    }, c = g(p(a.basicOption.widgets)), i = X(() => {
      try {
        const e = c.value.filter((o) => o.type === "regionalLevel");
        return e.length > 0 ? (L(e[0].labelStyle.fontFamily), e[0].isHide ? null : e[0]) : null;
      } catch {
        return null;
      }
    });
    h(() => p(a.basicOption.widgets), (e, o) => {
      try {
        !b(e, o) && l.value && (c.value = p(a.basicOption.widgets));
      } catch {
      }
    }, {
      deep: !0
    }), h(() => p(c.value.filter((e) => e.type === "bar")), (e, o) => {
      try {
        !b(e, o) && l.value && e.length === o.length && e.forEach((t) => {
          l.value.createBar(t, void 0, !1);
        });
      } catch {
      }
    }, {
      deep: !0
    }), h(() => p(c.value.filter((e) => e.type === "scatter")), (e, o) => {
      try {
        !b(e, o) && l.value && e.length === o.length && e.forEach((t) => {
          l.value.createScatter(t, void 0, !1);
        });
      } catch {
      }
    }, {
      deep: !0
    }), h(() => p(c.value.filter((e) => e.type === "flyline")), (e, o) => {
      try {
        !b(e, o) && l.value && e.length === o.length && e.forEach((t) => {
          l.value.createFlyLine(t, void 0, !1);
        });
      } catch {
      }
    }, {
      deep: !0
    }), h(() => p(c.value.filter((e) => e.type === "regionalLevel")), (e, o) => {
      try {
        !b(e, o) && l.value && e.length === o.length && e.forEach((t) => {
          l.value.createRegionalLevel(t, void 0, !1);
        });
      } catch {
      }
    }, {
      deep: !0
    });
    const q = (e) => {
      try {
        e.isHide === void 0 ? e.isHide = !0 : e.isHide = !e.isHide;
      } catch {
      }
    }, G = () => {
      try {
        const e = c.value.every((o) => !o.isHide);
        c.value.forEach((o) => o.isHide = e);
      } catch {
      }
    }, F = (e) => {
      L(a.basicOption.widgetControlStyle.fontFamily);
      const o = `url(${e.backgroundImage})`, t = `url(${J(e.hover.backgroundImage)})`, s = `url(${J(e.active.backgroundImage)})`;
      return {
        ...E(e),
        ...E(e.hover, "hover"),
        ...E(e.active, "active"),
        "background-image": o,
        "--hover-background-image": t,
        "--active-background-image": s
      };
    }, J = (e) => !e.startsWith("http") && !e.startsWith("//") ? "../" + e : e;
    return (e, o) => (u(), d("div", {
      id: "zerov-map3d-scene-wrap",
      class: H(["map-3d-wrap", { show: O.value }])
    }, [
      C.value && v.value && e.basicOption.backButton ? (u(), d("div", {
        key: 0,
        ref_key: "buttonRef",
        ref: A,
        class: "return-btn",
        style: f(_(e.basicOption.backButtonCss)),
        onClick: P
      }, " 返回上一级 ", 4)) : S("", !0),
      i.value ? (u(), d("div", {
        key: 1,
        class: "regional-level",
        style: f({
          left: i.value.labelStyle.left + "%",
          top: i.value.labelStyle.top + "%",
          flexDirection: i.value.labelStyle.direction,
          gap: i.value.labelStyle.gap + "px",
          fontSize: i.value.labelStyle.fontSize + "px",
          fontFamily: i.value.labelStyle.fontFamily,
          fontStyle: i.value.labelStyle.fontStyle,
          color: i.value.labelStyle.color,
          "--color-width": i.value.labelStyle.colorStyle.width + "px",
          "--color-height": i.value.labelStyle.colorStyle.height + "px",
          "--color-borderRadius": i.value.labelStyle.colorStyle.borderRadius + "px"
        })
      }, [
        (u(!0), d(W, null, M(i.value.rules, (t, s) => (u(), d("div", {
          key: s,
          class: "item"
        }, [
          B("div", {
            class: "color",
            style: f({ backgroundColor: t.color })
          }, null, 4),
          B("span", ae, k(t.label), 1)
        ]))), 128))
      ], 4)) : S("", !0),
      e.basicOption.widgets.length > 0 && e.basicOption.widgetControlStyle && e.basicOption.widgetControlStyle.show ? (u(), d("div", {
        key: 2,
        class: "widget-control",
        style: f({
          left: e.basicOption.widgetControlStyle.left + "%",
          top: e.basicOption.widgetControlStyle.top + "%",
          flexDirection: e.basicOption.widgetControlStyle.direction,
          gap: e.basicOption.widgetControlStyle.gap + "px",
          "--widget-width": e.basicOption.widgetControlStyle.width + "px",
          "--widget-height": e.basicOption.widgetControlStyle.height + "px"
        })
      }, [
        B("div", {
          class: H(["control-button", {
            active: c.value.every((t) => !t.isHide)
          }]),
          style: f(F(e.basicOption.widgetControlStyle)),
          onClick: G
        }, k(c.value.every((t) => !t.isHide) ? "隐藏" : "显示") + "/全部 ", 7),
        (u(!0), d(W, null, M(c.value, (t) => (u(), d("div", {
          key: t.id,
          class: H(["control-button", {
            active: !t.isHide
          }]),
          style: f(F(e.basicOption.widgetControlStyle)),
          onClick: (s) => q(t)
        }, k(t.name || "-"), 15, le))), 128))
      ], 4)) : S("", !0),
      e.basicOption.debugger ? (u(), d("div", ne, " fps:" + k(Y(U)), 1)) : S("", !0)
    ], 2));
  }
});
export {
  Oe as default
};
