mixdashboards 1.0.32 → 1.0.39

package/dist/timeSeriesCurve-BSgtPqYw.js

@@ -0,0 +1,463 @@
+var ge = Object.defineProperty, ye = Object.defineProperties;
+var be = Object.getOwnPropertyDescriptors;
+var X = Object.getOwnPropertySymbols;
+var Ce = Object.prototype.hasOwnProperty, _e = Object.prototype.propertyIsEnumerable;
+var ee = (h, r, s) => r in h ? ge(h, r, { enumerable: !0, configurable: !0, writable: !0, value: s }) : h[r] = s, L = (h, r) => {
+  for (var s in r || (r = {}))
+    Ce.call(r, s) && ee(h, s, r[s]);
+  if (X)
+    for (var s of X(r))
+      _e.call(r, s) && ee(h, s, r[s]);
+  return h;
+}, V = (h, r) => ye(h, be(r));
+var te = (h, r, s) => new Promise((u, v) => {
+  var T = (g) => {
+    try {
+      _(s.next(g));
+    } catch (k) {
+      v(k);
+    }
+  }, c = (g) => {
+    try {
+      _(s.throw(g));
+    } catch (k) {
+      v(k);
+    }
+  }, _ = (g) => g.done ? u(g.value) : Promise.resolve(g.value).then(T, c);
+  _((s = s.apply(h, r)).next());
+});
+import { ElInput as we, ElIcon as De, ElCheckbox as Se, ElButton as xe } from "element-plus/es";
+import "element-plus/es/components/base/style/css";
+import "element-plus/es/components/button/style/css";
+import "element-plus/es/components/checkbox/style/css";
+import "element-plus/es/components/input/style/css";
+import "element-plus/es/components/icon/style/css";
+import { defineComponent as ke, ref as O, computed as b, onMounted as Me, onBeforeUnmount as Oe, watch as Ie, openBlock as A, createElementBlock as B, normalizeStyle as oe, createElementVNode as y, toDisplayString as H, createVNode as x, withCtx as R, normalizeClass as Ee, unref as ne, createBlock as je, Teleport as Ae, withDirectives as Te, withModifiers as se, Fragment as Ne, renderList as Le, vShow as Ve, createTextVNode as Be, renderSlot as He } from "vue";
+import { u as Re } from "./vue-i18n-5Nahpzrm.js";
+import { ArrowDown as ze } from "@element-plus/icons-vue";
+import { d as I, _ as We } from "./index-kShjySl9.js";
+import { E as $e } from "./EChartComponentBase-BQOhWkz2.js";
+import { A as Fe, D as Ze } from "./ele-vlu-icon-Bg6EHZdJ.js";
+const Pe = { class: "chart-header" }, Ue = { class: "chart-title" }, Ye = { class: "chart-actions" }, qe = ["onClick"], Ge = { class: "item-label" }, Je = ["id"], Ke = {
+  DEFAULT_ICON: Ze,
+  ACTIVE_ICON: Fe,
+  NAME_CN: "指标时序演变曲线",
+  NAME_EN: "TimeSeriesCurve",
+  ORDER: 1
+}, Qe = {
+  bgColor: { value: "#ffffff", type: "color", label: "setting.bgColor" },
+  textColor: { value: "#333333", type: "color", label: "setting.textColor" },
+  titleSize: { value: 14, type: "number", label: "component.options.titleSize" },
+  showLegend: { value: !0, type: "switch", label: "component.options.showLegend" },
+  showDataZoom: { value: !0, type: "switch", label: "component.crack.showDataZoom" },
+  lineWidth: { value: 2.5, type: "number", label: "component.options.lineWidth" },
+  // 联动频道配置
+  linkChannel: {
+    value: "crack",
+    type: "select",
+    label: "component.linkChannel",
+    options: [
+      { label: "裂缝监测", value: "crack" },
+      { label: "GNSS监测", value: "gnss" },
+      { label: "边坡监测", value: "slope" },
+      { label: "深部位移", value: "deepDisplacement" },
+      { label: "自定义", value: "custom" }
+    ]
+  },
+  customChannel: {
+    value: "",
+    type: "string",
+    label: "component.customChannel",
+    showWhen: { linkChannel: "custom" }
+  }
+}, Xe = [
+  { name: "宽度累计变化量", fv: "", object_id: "", device: "", color: "#5470c6" },
+  { name: "宽度日变化量", fv: "", object_id: "", device: "", color: "#91cc75" },
+  { name: "x方向加速度", fv: "", object_id: "", device: "", color: "#fac858" },
+  { name: "y方向加速度", fv: "", object_id: "", device: "", color: "#ee6666" },
+  { name: "z方向加速度", fv: "", object_id: "", device: "", color: "#73c0de" },
+  { name: "x方向倾角", fv: "", object_id: "", device: "", color: "#3ba272" },
+  { name: "y方向倾角", fv: "", object_id: "", device: "", color: "#fc8452" },
+  { name: "z方向倾角", fv: "", object_id: "", device: "", color: "#9a60b4" }
+], et = ["name", "fv", "object_id", "device", "color"], tt = ["mosaic", "statistics", "calculate"], ot = {
+  useAlias: !1,
+  multiObject: !1,
+  hideMultiObject: !0,
+  source: "mosaic"
+}, nt = 50, st = { DEFAULT: Ke, OPTIONS: Qe, DATA: Xe, PARAMS: et, SOURCE: tt, ITEMS: nt, COMMON: ot }, at = /* @__PURE__ */ ke(V(L({}, st), {
+  __name: "timeSeriesCurve",
+  props: {
+    conf: { type: Object, default: () => ({ data: [] }) },
+    uid: { type: String, default: "" },
+    mode: { type: String, default: "edit" },
+    theme: { type: String, default: "light" }
+  },
+  setup(h) {
+    var Y, q;
+    const { t: r } = Re(), s = h, u = O([]), v = b(() => s.conf.data || []);
+    class T extends $e {
+      constructor() {
+        super(...arguments), this.deviceColors = ["#5470c6", "#91cc75", "#fac858", "#ee6666", "#73c0de", "#3ba272", "#fc8452", "#9a60b4"], this.realTimeData = /* @__PURE__ */ new Map(), this.deviceNameMap = /* @__PURE__ */ new Map(), this.currentObjectId = "";
+      }
+      getCurrentObjectId() {
+        return this.currentObjectId;
+      }
+      setCurrentObjectId(e) {
+        this.currentObjectId = e;
+      }
+      extractStyles() {
+        return V(L({}, super.extractStyles()), {
+          showLegend: this.getOptionValue("showLegend", !0),
+          showDataZoom: this.getOptionValue("showDataZoom", !0),
+          lineWidth: this.getOptionValue("lineWidth", 2.5),
+          linkChannel: this.getOptionValue("linkChannel", "crack")
+        });
+      }
+      onPreview() {
+        var a;
+        const { common: e, data: t } = this.props.conf, d = this.getSource();
+        if (e.multiObject && Array.isArray(t)) {
+          const i = /* @__PURE__ */ new Set();
+          t.forEach((o) => {
+            const l = this.resolveObjectId(o);
+            !l || i.has(l) || (i.add(l), this.subscribeBySource(d, l, o.uid));
+          });
+        } else {
+          const i = this.resolveObjectId(), o = (a = t == null ? void 0 : t[0]) == null ? void 0 : a.uid;
+          i && (this.currentObjectId = i, this.subscribeBySource(d, i, o));
+        }
+      }
+      // 联动事件处理
+      onLinkEvent(e) {
+        k(e);
+      }
+      getChartOption() {
+        const { data: e } = this.props.conf, t = this.Style.value, d = u.value.length === 0 ? [] : e.filter((o) => u.value.includes(o.name));
+        let a = [];
+        if (this.props.mode === "edit")
+          a = this.generateTimeLabels();
+        else
+          for (const [, o] of this.realTimeData)
+            o.times.length > a.length && (a = o.times);
+        const i = d.filter((o) => o.fv || this.props.mode === "edit").map((o, l) => {
+          const m = o.device && this.deviceNameMap.get(o.device) || "", f = m ? `${m}-${o.name}` : o.name, p = o.color || this.deviceColors[l % this.deviceColors.length];
+          let C;
+          if (this.props.mode !== "edit") {
+            const D = this.realTimeData.get(o.name);
+            C = D ? D.values : [];
+          } else
+            C = this.generateSeriesData(o, a);
+          return {
+            name: f,
+            type: "line",
+            smooth: !0,
+            showSymbol: !1,
+            lineStyle: {
+              color: p,
+              type: "solid",
+              width: t.lineWidth
+            },
+            itemStyle: {
+              color: p
+            },
+            data: C
+          };
+        });
+        return {
+          tooltip: {
+            trigger: "axis",
+            axisPointer: { type: "cross" }
+          },
+          legend: {
+            show: t.showLegend,
+            type: "scroll",
+            top: 10,
+            textStyle: { color: t.textColor }
+          },
+          grid: {
+            top: 60,
+            left: 60,
+            right: 40,
+            bottom: t.showDataZoom ? 80 : 40
+          },
+          xAxis: {
+            type: "category",
+            data: a,
+            axisLabel: {
+              interval: "auto",
+              rotate: 15,
+              fontSize: 10,
+              color: t.textColor
+            }
+          },
+          yAxis: {
+            type: "value",
+            name: "值",
+            nameTextStyle: { color: t.textColor },
+            axisLabel: { color: t.textColor },
+            splitLine: {
+              lineStyle: { type: "dashed", opacity: 0.5 }
+            }
+          },
+          dataZoom: t.showDataZoom ? [
+            { type: "inside" },
+            { type: "slider", bottom: 10, height: 15 }
+          ] : [],
+          series: i
+        };
+      }
+      generateTimeLabels() {
+        const e = [];
+        for (let t = 24; t >= 0; t--) {
+          const d = I().subtract(t, "hour");
+          e.push(d.format("MM-DD HH:mm"));
+        }
+        return e;
+      }
+      generateSeriesData(e, t) {
+        const d = e.name, a = this.realTimeData.get(d);
+        if (a && a.times.length > 0) {
+          const i = /* @__PURE__ */ new Map();
+          return a.times.forEach((o, l) => i.set(o, a.values[l])), t.map((o) => {
+            var l;
+            return (l = i.get(o)) != null ? l : null;
+          });
+        }
+        if (this.props.mode === "edit") {
+          const i = Math.random() * 10 + 5;
+          return Array.from({ length: t.length }, (o, l) => {
+            const m = Math.sin(l * 0.5) * 0.3;
+            return parseFloat((i * (0.8 + m)).toFixed(2));
+          });
+        }
+        return new Array(t.length).fill(null);
+      }
+      setSocketData(e) {
+        if (!e) return;
+        const { data: t } = this.props.conf;
+        if (!t || !Array.isArray(t)) return;
+        const d = e.datetime ? e.datetime.split(".")[0] : I().format("MM-DD HH:mm:ss"), a = I(d).format("MM-DD HH:mm:ss");
+        t.forEach((o) => {
+          if (!o.fv) return;
+          if (o.device) {
+            const m = this.extractDataValue(e, o.device);
+            m != null && this.deviceNameMap.set(o.device, String(m));
+          }
+          const l = this.extractDataValue(e, o.fv);
+          if (l != null) {
+            const m = parseFloat(l);
+            if (!isNaN(m)) {
+              const f = o.name;
+              let p = this.realTimeData.get(f);
+              p || (p = { times: [], values: [] }, this.realTimeData.set(f, p)), p.times.push(a), p.values.push(m), p.times.length > 200 && (p.times.shift(), p.values.shift()), o.value = m;
+            }
+          }
+        });
+        const i = this.getChartInstance();
+        i && i.setOption(this.getChartOption());
+      }
+    }
+    const c = new T(s, "timeSeriesCurve");
+    c.setupLifecycle();
+    const _ = c.getStyle(), g = c.getEchartId(), k = (n) => {
+      console.log("[指标时序演变曲线] 收到联动事件:", n);
+      const { payload: e } = n;
+      if (!e) return;
+      const t = e.objectId || e.object_id;
+      t && ae(t);
+    }, ae = (n) => te(null, null, function* () {
+      var m;
+      if (!n || s.mode !== "preview" || c.getCurrentObjectId() === n) return;
+      c.setCurrentObjectId(n), c.realTimeData.clear(), c.deviceNameMap.clear();
+      const t = (m = c.session) == null ? void 0 : m.value;
+      if (!t) return;
+      const d = s.conf.id;
+      t.componentRequests && t.componentRequests.delete(d);
+      const { data: a, common: i } = s.conf;
+      Array.isArray(a) && a.forEach((f) => {
+        f.object_id = n;
+      }), i.multiObject || (i.object_id = n);
+      try {
+        const f = yield import("./history-BkZhlpdY.js"), C = yield new f.default().getHistoryData(s, "timeSeriesCurve");
+        C && Array.isArray(C) && a.forEach((D, fe) => {
+          if (!D.fv) return;
+          const j = C[fe], G = (j == null ? void 0 : j.data) || j;
+          if (!Array.isArray(G)) return;
+          const ve = [...G].sort((S, M) => new Date(S.time || S.datetime || "").getTime() - new Date(M.time || M.datetime || "").getTime()), N = [], J = [];
+          ve.forEach((S) => {
+            const M = S.time || S.datetime, K = S[D.fv];
+            if (M && K != null) {
+              const Q = parseFloat(K);
+              isNaN(Q) || (N.push(I(M).format("MM-DD HH:mm:ss")), J.push(Q));
+            }
+          }), N.length > 0 && c.realTimeData.set(D.name, { times: N, values: J });
+        }), console.log("[指标时序演变曲线] 历史数据加载完成");
+      } catch (f) {
+        console.warn("[指标时序演变曲线] 历史数据获取失败:", f);
+      }
+      const o = c.getChartInstance();
+      o && o.setOption(c.getChartOption(), !0), t.registerComponent({
+        id: d,
+        request: null,
+        onUpdate: (f, p) => {
+          f === "realtime" && c.setSocketData(p);
+        }
+      });
+      const l = c.getSource();
+      c.subscribeBySource(l, n);
+    }), ie = b(() => ({
+      background: _.value.bgColor,
+      color: _.value.textColor
+    })), le = b(() => r("component.crack.timeSeriesCurve")), re = b(() => r("component.crack.exportImage")), ce = b(() => r("component.crack.selectIndicators"));
+    s.mode === "edit" && v.value.length > 0 && (u.value = [
+      (Y = v.value[0]) == null ? void 0 : Y.name,
+      (q = v.value[1]) == null ? void 0 : q.name
+    ].filter(Boolean));
+    const w = O(!1), E = O(null), z = O(null), W = O({}), ue = b(() => u.value.length === 0 ? "" : u.value.length === v.value.length ? "全部" : u.value.join("、")), $ = b(() => {
+      const n = v.value;
+      return n.length > 0 && n.every((e) => u.value.includes(e.name));
+    }), de = b(() => {
+      const n = v.value, e = n.filter((t) => u.value.includes(t.name)).length;
+      return e > 0 && e < n.length;
+    }), me = () => {
+      w.value = !w.value, w.value && pe();
+    };
+    function pe() {
+      if (!E.value) return;
+      const n = E.value.getBoundingClientRect();
+      W.value = {
+        position: "fixed",
+        top: `${n.bottom + 4}px`,
+        left: `${n.left}px`,
+        zIndex: "9999"
+      };
+    }
+    const F = (n) => {
+      const e = E.value, t = z.value;
+      e && !e.contains(n.target) && t && !t.contains(n.target) && (w.value = !1);
+    };
+    Me(() => {
+      document.addEventListener("click", F);
+    }), Oe(() => {
+      document.removeEventListener("click", F);
+    });
+    const Z = () => {
+      $.value ? u.value = [] : u.value = v.value.map((n) => n.name), U();
+    }, P = (n) => {
+      const e = u.value.indexOf(n.name);
+      e > -1 ? u.value.splice(e, 1) : u.value.push(n.name), U();
+    }, U = () => {
+      const n = c.getChartInstance();
+      n && n.setOption(c.getChartOption(), !0);
+    };
+    Ie(() => s.conf.data, (n) => {
+      var e, t;
+      n && n.length > 0 && u.value.length === 0 && (u.value = [
+        (e = n[0]) == null ? void 0 : e.name,
+        (t = n[1]) == null ? void 0 : t.name
+      ].filter(Boolean));
+    }, { immediate: !0 });
+    const he = () => {
+      const n = c.getChartInstance();
+      if (!n) return;
+      const e = document.createElement("a");
+      e.href = n.getDataURL({
+        type: "png",
+        pixelRatio: 2,
+        backgroundColor: "#fff"
+      }), e.download = `${r("component.crack.timeSeriesCurve")}_${I().format("YYYYMMDDHHmmss")}.png`, e.click();
+    };
+    return (n, e) => {
+      const t = De, d = we, a = Se, i = xe;
+      return A(), B("div", {
+        class: "mix-component crack-time-series",
+        style: oe(ie.value)
+      }, [
+        y("div", Pe, [
+          y("span", Ue, "📉 " + H(le.value), 1),
+          y("div", Ye, [
+            y("div", {
+              class: "metrics-select-wrapper",
+              ref_key: "metricsWrapperRef",
+              ref: E
+            }, [
+              x(d, {
+                "model-value": ue.value,
+                placeholder: ce.value,
+                size: "small",
+                style: { width: "220px" },
+                readonly: "",
+                onClick: me
+              }, {
+                suffix: R(() => [
+                  x(t, {
+                    class: Ee(["metrics-arrow", { "is-open": w.value }])
+                  }, {
+                    default: R(() => [
+                      x(ne(ze))
+                    ]),
+                    _: 1
+                  }, 8, ["class"])
+                ]),
+                _: 1
+              }, 8, ["model-value", "placeholder"]),
+              (A(), je(Ae, { to: "body" }, [
+                Te(y("div", {
+                  class: "metrics-dropdown",
+                  style: oe(W.value),
+                  ref_key: "metricsDropdownRef",
+                  ref: z
+                }, [
+                  y("div", {
+                    class: "metrics-dropdown-item",
+                    onClick: se(Z, ["stop"])
+                  }, [
+                    x(a, {
+                      "model-value": $.value,
+                      indeterminate: de.value,
+                      onChange: Z
+                    }, null, 8, ["model-value", "indeterminate"]),
+                    e[0] || (e[0] = y("span", {
+                      class: "item-label",
+                      style: { "font-weight": "bold" }
+                    }, "全部", -1))
+                  ]),
+                  (A(!0), B(Ne, null, Le(v.value, (o) => (A(), B("div", {
+                    key: o.name,
+                    class: "metrics-dropdown-item",
+                    onClick: se((l) => P(o), ["stop"])
+                  }, [
+                    x(a, {
+                      "model-value": u.value.includes(o.name),
+                      onChange: (l) => P(o)
+                    }, null, 8, ["model-value", "onChange"]),
+                    y("span", Ge, H(o.name), 1)
+                  ], 8, qe))), 128))
+                ], 4), [
+                  [Ve, w.value]
+                ])
+              ]))
+            ], 512),
+            x(i, {
+              size: "small",
+              onClick: he
+            }, {
+              default: R(() => [
+                Be("💾 " + H(re.value), 1)
+              ]),
+              _: 1
+            })
+          ])
+        ]),
+        y("div", {
+          id: ne(g),
+          class: "chart-container"
+        }, null, 8, Je),
+        He(n.$slots, "default", {}, void 0, !0)
+      ], 4);
+    };
+  }
+})), bt = /* @__PURE__ */ We(at, [["__scopeId", "data-v-920e39d1"]]);
+export {
+  bt as default
+};

package/dist/titleStyle-BT5GlpAb.js

@@ -0,0 +1,49 @@
+function e(t, d, i) {
+  var r;
+  const l = t == null ? void 0 : t[d];
+  return l && typeof l == "object" && "value" in l ? (r = l.value) != null ? r : i : l != null ? l : i;
+}
+function T(t) {
+  return {
+    isHideTitle: e(t, "isHideTitle", !1),
+    titleColor: e(t, "titleColor", "#333333"),
+    titleSize: e(t, "titleSize", 14),
+    titleAlign: e(t, "titleAlign", "left"),
+    titleWeight: e(t, "titleWeight", "bold"),
+    titleBgColor: e(t, "titleBgColor", "transparent"),
+    titleBorderType: e(t, "titleBorderType", "none"),
+    titleBorderColor: e(t, "titleBorderColor", "#cccccc"),
+    titleBorderWidth: e(t, "titleBorderWidth", 1),
+    titlePaddingH: e(t, "titlePaddingH", 8),
+    titlePaddingV: e(t, "titlePaddingV", 4)
+  };
+}
+function y(t) {
+  const d = "titleColor" in t || "isHideTitle" in t ? T(t) : t, {
+    isHideTitle: i = !1,
+    titleColor: l = "#333333",
+    titleSize: r = 14,
+    titleAlign: g = "left",
+    titleWeight: o = "bold",
+    titleBgColor: a = "transparent",
+    titleBorderType: n = "none",
+    titleBorderColor: B = "#cccccc",
+    titleBorderWidth: f = 1,
+    titlePaddingH: C = 8,
+    titlePaddingV: u = 4
+  } = d;
+  let c = "none";
+  return n !== "none" && (c = `${f}px ${n} ${B}`), {
+    display: i ? "none" : "block",
+    color: l,
+    fontSize: `${r}px`,
+    textAlign: g,
+    fontWeight: String(o),
+    backgroundColor: a || "transparent",
+    border: c,
+    padding: `${u}px ${C}px`
+  };
+}
+export {
+  y as g
+};

package/dist/titleStyle-NSnz6cUg.cjs

@@ -0,0 +1 @@
+"use strict";function t(e,n,i){var r;const l=e==null?void 0:e[n];return l&&typeof l=="object"&&"value"in l?(r=l.value)!=null?r:i:l!=null?l:i}function T(e){return{isHideTitle:t(e,"isHideTitle",!1),titleColor:t(e,"titleColor","#333333"),titleSize:t(e,"titleSize",14),titleAlign:t(e,"titleAlign","left"),titleWeight:t(e,"titleWeight","bold"),titleBgColor:t(e,"titleBgColor","transparent"),titleBorderType:t(e,"titleBorderType","none"),titleBorderColor:t(e,"titleBorderColor","#cccccc"),titleBorderWidth:t(e,"titleBorderWidth",1),titlePaddingH:t(e,"titlePaddingH",8),titlePaddingV:t(e,"titlePaddingV",4)}}function y(e){const n="titleColor"in e||"isHideTitle"in e?T(e):e,{isHideTitle:i=!1,titleColor:l="#333333",titleSize:r=14,titleAlign:g="left",titleWeight:a="bold",titleBgColor:o="transparent",titleBorderType:d="none",titleBorderColor:B="#cccccc",titleBorderWidth:f=1,titlePaddingH:C=8,titlePaddingV:u=4}=n;let c="none";return d!=="none"&&(c=`${f}px ${d} ${B}`),{display:i?"none":"block",color:l,fontSize:`${r}px`,textAlign:g,fontWeight:String(a),backgroundColor:o||"transparent",border:c,padding:`${u}px ${C}px`}}exports.generateTitleStyle=y;

package/dist/toggleBtn-Dh64vVWo.cjs

@@ -0,0 +1 @@
+"use strict";var M=Object.defineProperty,A=Object.defineProperties;var F=Object.getOwnPropertyDescriptors;var _=Object.getOwnPropertySymbols;var R=Object.prototype.hasOwnProperty,$=Object.prototype.propertyIsEnumerable;var k=(s,o,n)=>o in s?M(s,o,{enumerable:!0,configurable:!0,writable:!0,value:n}):s[o]=n,E=(s,o)=>{for(var n in o||(o={}))R.call(o,n)&&k(s,n,o[n]);if(_)for(var n of _(o))$.call(o,n)&&k(s,n,o[n]);return s},N=(s,o)=>A(s,F(o));Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue");require("html2canvas");const D=require("./element-resize-detector-Bo5uDQAu.cjs"),j=require("./index-Mh5Dw2sd.cjs"),q=require("./EChartComponentBase-BaQpBzVC.cjs"),V=require("./install-DV5cEgNV.cjs"),Z=require("./install-CltTFs4e.cjs"),m=require("./installCanvasRenderer-CyhM1Qpl.cjs"),I=require("./install-C8buXQPI.cjs"),U=require("./install-B1IEhhn3.cjs"),H="data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='UTF-8'?%3e%3csvg%20width='18px'%20height='17px'%20viewBox='0%200%2018%2017'%20version='1.1'%20xmlns='http://www.w3.org/2000/svg'%20xmlns:xlink='http://www.w3.org/1999/xlink'%3e%3ctitle%3e切换%3c/title%3e%3cg%20id='基础规范'%20stroke='none'%20stroke-width='1'%20fill='none'%20fill-rule='evenodd'%3e%3cg%20id='数据大屏备份'%20transform='translate(-986.000000,%20-99.000000)'%20fill='%23333333'%20fill-rule='nonzero'%3e%3cpath%20d='M998.978161,99.5%20C999.333655,99.5%20999.621839,99.7881845%20999.621839,100.143678%20L999.621839,100.143678%20L999.621,100.971%20L1002.65632,100.971264%20C1002.9795,100.971264%201003.24705,101.209433%201003.29302,101.519824%20L1003.3,101.614943%20L1003.3,113.385057%20C1003.3,113.740551%201003.01182,114.028736%201002.65632,114.028736%20L1002.65632,114.028736%20L999.621,114.028%20L999.621839,114.856322%20C999.621839,115.179498%20999.38367,115.447047%20999.073279,115.493021%20L998.978161,115.5%20L991.621839,115.5%20C991.266345,115.5%20990.978161,115.211815%20990.978161,114.856322%20L990.978161,114.856322%20L990.978,114.028%20L987.943678,114.028736%20C987.620502,114.028736%20987.352953,113.790567%20987.306979,113.480176%20L987.3,113.385057%20L987.3,101.614943%20C987.3,101.259449%20987.588185,100.971264%20987.943678,100.971264%20L987.943678,100.971264%20L990.978,100.971%20L990.978161,100.143678%20C990.978161,99.8205021%20991.21633,99.5529535%20991.526721,99.5069791%20L991.621839,99.5%20Z%20M998.334483,100.786788%20L992.265517,100.786788%20L992.265517,114.212076%20L998.334483,114.212076%20L998.334483,100.786788%20Z%20M1002.01264,102.258053%20L999.621839,102.258053%20L999.621839,112.740811%20L1002.01264,112.740811%20L1002.01264,102.258053%20Z%20M990.978161,102.258053%20L988.587356,102.258053%20L988.587356,112.740811%20L990.978161,112.740811%20L990.978161,102.258053%20Z'%20id='形状结合'%3e%3c/path%3e%3c/g%3e%3c/g%3e%3c/svg%3e",P="data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='UTF-8'?%3e%3csvg%20width='18px'%20height='17px'%20viewBox='0%200%2018%2017'%20version='1.1'%20xmlns='http://www.w3.org/2000/svg'%20xmlns:xlink='http://www.w3.org/1999/xlink'%3e%3ctitle%3e切换%3c/title%3e%3cg%20id='基础规范'%20stroke='none'%20stroke-width='1'%20fill='none'%20fill-rule='evenodd'%3e%3cg%20id='数据大屏备份-2'%20transform='translate(-986.000000,%20-99.000000)'%20fill='%23FFFFFF'%20fill-rule='nonzero'%3e%3cpath%20d='M998.978161,99.5%20C999.333655,99.5%20999.621839,99.7881845%20999.621839,100.143678%20L999.621839,100.143678%20L999.621,100.971%20L1002.65632,100.971264%20C1002.9795,100.971264%201003.24705,101.209433%201003.29302,101.519824%20L1003.3,101.614943%20L1003.3,113.385057%20C1003.3,113.740551%201003.01182,114.028736%201002.65632,114.028736%20L1002.65632,114.028736%20L999.621,114.028%20L999.621839,114.856322%20C999.621839,115.179498%20999.38367,115.447047%20999.073279,115.493021%20L998.978161,115.5%20L991.621839,115.5%20C991.266345,115.5%20990.978161,115.211815%20990.978161,114.856322%20L990.978161,114.856322%20L990.978,114.028%20L987.943678,114.028736%20C987.620502,114.028736%20987.352953,113.790567%20987.306979,113.480176%20L987.3,113.385057%20L987.3,101.614943%20C987.3,101.259449%20987.588185,100.971264%20987.943678,100.971264%20L987.943678,100.971264%20L990.978,100.971%20L990.978161,100.143678%20C990.978161,99.8205021%20991.21633,99.5529535%20991.526721,99.5069791%20L991.621839,99.5%20Z%20M998.334483,100.786788%20L992.265517,100.786788%20L992.265517,114.212076%20L998.334483,114.212076%20L998.334483,100.786788%20Z%20M1002.01264,102.258053%20L999.621839,102.258053%20L999.621839,112.740811%20L1002.01264,112.740811%20L1002.01264,102.258053%20Z%20M990.978161,102.258053%20L988.587356,102.258053%20L988.587356,112.740811%20L990.978161,112.740811%20L990.978161,102.258053%20Z'%20id='形状结合'%3e%3c/path%3e%3c/g%3e%3c/g%3e%3c/svg%3e",G=["onClick"],J=["id"],K={class:"progress-wrap"},Q=["title"],W={DEFAULT_ICON:H,ACTIVE_ICON:P,NAME_CN:"切换",NAME_EN:"Toggle Button",ORDER:2},X={titleSize:14,textSize:12,barHeight:8,textColor:"#a8b4d9",bgColor:"#0a1635",barColor:"#1e3a5f",tabColor:"#1e3a5f",activeBgColor:"#6b7fd9",borderColor:"#1e3a5f",activeBorder:"#6b7fd9",radiusSize:8,type:{value:"none",type:"radio",option:[{value:"none",label:"component.radar.diamond"},{value:"circle",label:"component.radar.circle"}],label:"component.radar.shapeSelect"},tags:{value:[{label:"TAB1",flag:["S01","S02","S03"]},{label:"TAB2",flag:["S02","S03","S04"]}],type:"tags",label:"component.radar.tagsSetting"}},Y=[{name:"参数一",color:"#4162ff",fv:"S01",object_id:""},{name:"参数二",color:"#3bbc6a",fv:"S02",object_id:""},{name:"参数三",color:"#e24359",fv:"S03",object_id:""},{name:"参数四",color:"#ff8b41",fv:"S04",object_id:""}],ee=["name","fv","object_id","color"],te=["mosaic","statistics","calculate"],re={useAlias:!1,multiObject:!1,source:"mosaic"},le={DEFAULT:W,OPTIONS:X,DATA:Y,PARAMS:ee,SOURCE:te,COMMON:re},ae=e.defineComponent(N(E({},le),{__name:"toggleBtn",props:{conf:{type:Object,default:()=>({data:[]})},uid:{type:String,default:""},mode:{type:String,default:"edit"},theme:{type:String,default:"light"}},setup(s){m.use([V.install,Z.install,m.install,I.install,m.install$1,U.install]);const o=s,n=e.ref(0),u=e.reactive({indicator:[],series:[]}),d=e.ref(0);class T extends q.EChartComponentBase{extractStyles(){var r,a,i,c,f,g,h,p,S,b,y,x,w,z,B;const{options:t}=this.props.conf;return{bgColor:((r=t==null?void 0:t.bgColor)==null?void 0:r.value)||"#fff",titleSize:((a=t==null?void 0:t.titleSize)==null?void 0:a.value)||16,barHeight:((i=t==null?void 0:t.barHeight)==null?void 0:i.value)||8,textColor:((c=t==null?void 0:t.textColor)==null?void 0:c.value)||"#111",tabColor:((f=t==null?void 0:t.tabColor)==null?void 0:f.value)||"#f5f5f5",activeBgColor:((g=t==null?void 0:t.activeBgColor)==null?void 0:g.value)||"#4162ff",borderColor:((h=t==null?void 0:t.borderColor)==null?void 0:h.value)||"#e5e5e5",activeBorder:((p=t==null?void 0:t.activeBorder)==null?void 0:p.value)||"#4162ff",barColor:((S=t==null?void 0:t.barColor)==null?void 0:S.value)||"#e5e5e5",radiusSize:(y=(b=t==null?void 0:t.radiusSize)==null?void 0:b.value)!=null?y:8,textSize:(w=(x=t==null?void 0:t.textSize)==null?void 0:x.value)!=null?w:12,type:((z=t==null?void 0:t.type)==null?void 0:z.value)||!1,tags:((B=t==null?void 0:t.tags)==null?void 0:B.value)||[]}}getChartOption(){var r;const{name:t}=this.props.conf;return{radar:{shape:this.Style.value.type,axisNameGap:10,indicator:u.indicator,center:["50%","55%"],radius:70,axisLine:{lineStyle:{type:"dashed",color:"#383D42"}},splitLine:{show:!0,lineStyle:{width:1,color:"#4B5FAB"}},splitArea:{show:!0,areaStyle:{color:["transparent"]}},axisName:{fontSize:12,color:this.Style.value.textColor}},series:[{name:t!=null?t:"",type:"radar",data:(r=u.series)!=null?r:[],areaStyle:{},itemStyle:{color:"#4162ff"}}]}}init(){super.init(),e.nextTick(()=>{this.initChart(),C(d.value)})}setSocketData(t){if(!t)return;const{data:r}=this.props.conf;r.forEach(a=>{const i=this.extractDataValue(t,a.fv);a.value=i!=null?i:0}),C(d.value)}refreshChart(){var r;const t=this.getChartOption();(r=this.chartObj)==null||r.setOption(t,!0)}}const v=new T(o,"toggleBtn");v.setupLifecycle();const l=v.getStyle(),O=v.getEchartId(),C=L=>{const{data:t,options:r,name:a}=o.conf;d.value=L,u.indicator=[],u.series=[];let i={};i.name=a,i.value=[],n.value=Math.max(...t.map(c=>c.value||0)),t.forEach(c=>{var f,g;(g=(f=r.tags.value[d.value])==null?void 0:f.flag)!=null&&g.includes(c.fv)&&(u.indicator.push({name:c.name,max:n.value,value:c.value,min:0,color:c.color}),i.value.push(c.value))}),u.series.push(i),v.refreshChart()};return(L,t)=>(e.openBlock(),e.createElementBlock("div",{class:"mix-component",style:e.normalizeStyle({background:e.unref(l).bgColor,borderRadius:`${e.unref(l).radiusSize}px`})},[e.createElementVNode("div",{class:"toggle-wrap",style:e.normalizeStyle({borderTopLeftRadius:`${e.unref(l).radiusSize}px`,borderTopRightRadius:`${e.unref(l).radiusSize}px`})},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(l).tags,(r,a)=>(e.openBlock(),e.createElementBlock("div",{key:a,class:e.normalizeClass(["btn-item",{active:d.value===a}]),style:e.normalizeStyle({backgroundColor:d.value===a?e.unref(l).activeBgColor:e.unref(l).tabColor,color:d.value===a?"#fff":e.unref(l).textColor,fontSize:`${e.unref(l).titleSize}px`,borderTopLeftRadius:a===0?`${e.unref(l).radiusSize}px`:"0",borderTopRightRadius:a===e.unref(l).tags.length-1?`${e.unref(l).radiusSize}px`:"0"}),onClick:i=>C(a)},e.toDisplayString(r.label),15,G))),128))],4),e.createElementVNode("div",{class:"radar-wrap",style:e.normalizeStyle({color:e.unref(l).textColor,fontSize:`${e.unref(l).textSize}px`})},[e.createElementVNode("div",{id:e.unref(O),class:"radar-chart"},null,8,J),e.createElementVNode("div",K,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(u.indicator,(r,a)=>(e.openBlock(),e.createElementBlock("div",{class:"bar-item-crosswise",key:a},[e.createElementVNode("div",{class:"bar-title",title:r.name,style:e.normalizeStyle({color:e.unref(l).textColor})},e.toDisplayString(r.name),13,Q),e.createElementVNode("div",{class:"bar",style:e.normalizeStyle({backgroundColor:e.unref(l).barColor,height:`${e.unref(l).barHeight}px`})},[e.createElementVNode("div",{class:"progress",style:e.normalizeStyle({backgroundColor:r.color||e.unref(D.COLORS)[a],width:(r.value/n.value*100).toFixed(2)+"%"})},null,4)],4),e.createElementVNode("div",{class:"bar-value",style:e.normalizeStyle({color:e.unref(l).textColor})},e.toDisplayString(r.value||0),5)]))),128))])],4),e.renderSlot(L.$slots,"default",{},void 0,!0)],4))}})),oe=j._export_sfc(ae,[["__scopeId","data-v-9692ecf4"]]);exports.default=oe;