@shjjs/visual-ui 1.0.22 → 1.0.24

package/es/commons/types/flex.d.ts

@@ -0,0 +1,9 @@
+export interface IFlex {
+    flexDirection: 'row' | 'column';
+    flexWrap: 'nowrap' | 'wrap' | 'wrap-reverse';
+    alignContent: 'flex-start' | 'flex-end' | 'center' | 'space-between' | 'space-around' | 'space-stretch';
+    justifyContent: 'center' | 'flex-start' | 'flex-end' | 'space-between' | 'space-around' | 'space-evenly';
+    alignItems: 'flex-start' | 'flex-end' | 'center' | 'stretch' | 'baseline';
+    gap: number;
+    borderRadius: number;
+}

package/es/commons/types/scroll.d.ts

@@ -0,0 +1,9 @@
+export interface IScroll {
+    start: boolean;
+    hover: boolean;
+    limitScrollNum: number;
+    isSingle: boolean;
+    singleWaitTime: number;
+    step: number;
+    direction: 'up' | 'down' | 'left' | 'right';
+}

package/es/commons/types/shadow.d.ts

@@ -0,0 +1,7 @@
+export interface IShadow {
+    show: boolean;
+    color: string;
+    value: number;
+    x: number;
+    y: number;
+}

package/es/commons/types/text-style.d.ts

@@ -0,0 +1,19 @@
+import { IShadow } from './shadow';
+export interface ITextStyle {
+    fontStyle: string;
+    fontFamily: string;
+    color: string;
+    fontSize: number;
+    fontWeight: number;
+    alignItems: 'center' | 'flex-start' | 'flex-end' | 'stretch' | 'baseline';
+    justifyContent: 'center' | 'left' | 'right';
+    '-webkit-text-stroke-color': string;
+    '-webkit-text-stroke-width': number;
+    letterSpacing: number;
+    lineHeight: number;
+    textShadow: IShadow;
+    textOverflow: {
+        enable: boolean;
+        displayLines: number;
+    };
+}

package/es/commons/utils/json2css.d.ts

@@ -1,3 +1,12 @@
-export declare function jsonToCssStyle(styleJson: Object, pd?: string): Object;
-export declare function camelCaseToDash(str: any): any;
+interface StyleObject {
+    [key: string]: string | number | StyleObject;
+}
+/**
+ * 将 JSON 转换为 CSS 样式
+ * @param styleJson - 需要转换的 JSON 对象
+ * @param pd - 前缀
+ * @returns 转换后的 CSS 样式对象
+ */
+export declare function jsonToCssStyle(styleJson: StyleObject, pd?: string): Record<string, string>;
 export declare const autoInstallFont: (fontFamily: string) => void;
+export {};

package/es/commons/utils/json2css.mjs

@@ -1,23 +1,28 @@
-import { isObject as i, isNumber as r } from "lodash";
-function d(t, c) {
+import { isObject as f, isNumber as a } from "lodash";
+import { PX_PROPERTIES as l } from "../const/css.mjs";
+function u(t, n) {
+  if (!t || typeof t != "object")
+    return {};
   const e = {};
-  for (const s in t)
-    if (!i(t[s])) {
-      const n = a(s);
-      ["fontSize", "width", "height", "borderWidth", "borderRadius", "gap", "-webkit-text-stroke-width", "letterSpacing", "maxHeight", "marginRight"].includes(s) && r(t[s]) ? e[(c ? `--${c}-` : "") + n] = `${t[s]}px` : e[(c ? `--${c}-` : "") + n] = t[s];
+  for (const c in t) {
+    const s = t[c];
+    if (f(s)) {
+      const i = u(s, c);
+      Object.assign(e, i);
+      continue;
     }
+    const o = c.replace(/([a-zA-Z])(?=[A-Z])/g, "$1-").toLowerCase(), r = (n ? `--${n}-` : "") + o;
+    l.includes(c) && a(s) ? e[r] = `${s}px` : e[r] = String(s);
+  }
   return e;
 }
-function a(t) {
-  return t.replace(/([a-zA-Z])(?=[A-Z])/g, "$1-").toLowerCase();
-}
-const h = (t) => {
+const g = (t) => {
   if (t && t.startsWith("SHJ-")) {
-    let c = !1;
+    let n = !1;
     if (document.fonts.forEach((e) => {
-      e.family === t && (c = !0);
-    }), !c) {
-      const e = t.slice(4, t.lastIndexOf("-")), s = e.slice(0, e.lastIndexOf("-")), n = t.slice(t.lastIndexOf("-") + 1, t.length), o = new FontFace(t, `url(https://lganv-1304359499.cos.ap-beijing.myqcloud.com/lg_cos_static/fonts/${s}/${e}.${n})`);
+      e.family === t && (n = !0);
+    }), !n) {
+      const e = t.slice(4, t.lastIndexOf("-")), c = e.slice(0, e.lastIndexOf("-")), s = t.slice(t.lastIndexOf("-") + 1, t.length), o = new FontFace(t, `url(https://lganv-1304359499.cos.ap-beijing.myqcloud.com/lg_cos_static/fonts/${c}/${e}.${s})`);
       document.fonts.add(o), o.load().then(() => {
       }).catch(() => {
       });
@@ -25,7 +30,6 @@ const h = (t) => {
   }
 };
 export {
-  h as autoInstallFont,
-  a as camelCaseToDash,
-  d as jsonToCssStyle
+  g as autoInstallFont,
+  u as jsonToCssStyle
 };

package/es/commons/utils/utils.d.ts

@@ -0,0 +1,18 @@
+export declare class Utils {
+    /**
+     * 字体地址
+     */
+    private static fontUrl;
+    /**
+     * 将 JSON 转换为 CSS 样式对象
+     * @param styleJson - 需要转换的 JSON 对象
+     * @param prefix - 前缀
+     * @returns 转换后的 CSS 样式对象
+     */
+    static json2cssObject(styleJson: any, prefix?: string): Record<string, string>;
+    /**
+     * 安装字体
+     * @param fontFamily - 字体名称
+     */
+    static installFont(fontFamily: string): void;
+}

package/es/commons/utils/utils.mjs

@@ -0,0 +1,71 @@
+var d = Object.defineProperty;
+var g = (i, t, s) => t in i ? d(i, t, { enumerable: !0, configurable: !0, writable: !0, value: s }) : i[t] = s;
+var l = (i, t, s) => g(i, typeof t != "symbol" ? t + "" : t, s);
+import { cloneDeep as p, isObject as f, isNumber as x } from "lodash";
+import { PX_PROPERTIES as $ } from "../const/css.mjs";
+class h {
+  /**
+   * 将 JSON 转换为 CSS 样式对象
+   * @param styleJson - 需要转换的 JSON 对象
+   * @param prefix - 前缀
+   * @returns 转换后的 CSS 样式对象
+   */
+  static json2cssObject(t, s) {
+    const e = p(t);
+    if (!f(e))
+      return {};
+    const c = {};
+    for (const o in e) {
+      const n = e[o];
+      if (n === "" || n === null)
+        continue;
+      const u = o.replace(/([a-zA-Z])(?=[A-Z])/g, "$1-").toLowerCase(), a = (s ? `--${s}-` : "") + u;
+      if (f(n)) {
+        if (o === "textShadow") {
+          const r = n;
+          r.show && Object.assign(c, { [a]: `${r.x}px ${r.y}px ${r.value}px ${r.color}` });
+          continue;
+        }
+        continue;
+      }
+      if (o === "backgroundImage") {
+        c[a] = `url('${n}')`;
+        continue;
+      }
+      if ($.includes(o) && x(n)) {
+        c[a] = `${n}px`;
+        continue;
+      }
+      if (o === "fontFamily" && this.installFont(n), o === "color" && n.includes("linear-gradient")) {
+        c["-webkit-background-clip"] = "text", c.color = "transparent", c.backgroundImage = n;
+        continue;
+      }
+      c[a] = String(n);
+    }
+    return c;
+  }
+  /**
+   * 安装字体
+   * @param fontFamily - 字体名称
+   */
+  static installFont(t) {
+    if (t && t.startsWith("SHJ-")) {
+      let s = !1;
+      if (document.fonts.forEach((e) => {
+        e.family === t && (s = !0);
+      }), !s) {
+        const e = t.slice(4, t.lastIndexOf("-")), c = e.slice(0, e.lastIndexOf("-")), o = t.slice(t.lastIndexOf("-") + 1, t.length), n = new FontFace(t, `url(${this.fontUrl}/${c}/${e}.${o})`);
+        document.fonts.add(n), n.load().then(() => {
+        }).catch(() => {
+        });
+      }
+    }
+  }
+}
+/**
+ * 字体地址
+ */
+l(h, "fontUrl", "https://lganv-1304359499.cos.ap-beijing.myqcloud.com/lg_cos_static/fonts");
+export {
+  h as Utils
+};

package/es/components/chart/commons/components/common-chart/hooks/useCommonChart.d.ts

@@ -0,0 +1,12 @@
+import { type Ref } from 'vue';
+/**
+ * 通用图表
+ * @param props 选项
+ * @param initData 初始化数据
+ * @param initView 初始化视图
+ * @param chart 图表实例
+ */
+export declare const useCommonChart: (props: {
+    option: any;
+    sources: any;
+}, initData: Function, initView: Function, chart: Ref<any>) => void;

package/es/components/chart/commons/components/common-chart/hooks/useCommonChart.mjs

@@ -0,0 +1,27 @@
+import { watch as u, defineExpose as f } from "vue";
+import { cloneDeep as s, isEqual as h } from "lodash";
+const a = (e, o, t, c) => {
+  u(() => e.sources, () => {
+    e.sources && e.sources.length > 0 && o(e.option);
+  }, {
+    deep: !0
+  }), u(() => s(e.option), (r, n) => {
+    h(r, n) || t(r);
+  }, {
+    deep: !0
+  }), f({
+    getEchartsInstance: () => c.value,
+    refresh: () => {
+      e.sources && e.sources.length > 0 && o(e.option), t(e.option);
+    },
+    refreshView: () => {
+      t(e.option);
+    },
+    refreshData: () => {
+      o(e.option);
+    }
+  });
+};
+export {
+  a as useCommonChart
+};

package/es/components/chart/commons/components/common-chart/index.vue.d.ts

@@ -0,0 +1,68 @@
+declare const _sfc_main: import("vue").DefineComponent<{
+    option: {
+        type: any;
+        required: true;
+    };
+    sources: {
+        type: ArrayConstructor;
+        required: true;
+    };
+    useEvents: {
+        type: ArrayConstructor;
+        required: true;
+    };
+    uuid: {
+        type: StringConstructor;
+        required: true;
+    };
+    isMultiSeries: {
+        type: BooleanConstructor;
+        required: true;
+    };
+    customRenderData: {
+        type: FunctionConstructor;
+        required: false;
+    };
+}, {
+    props: any;
+    emits: (event: "chart-click" | "chart-dblclick" | "chart-mousedown" | "chart-mouseover" | "chart-mouseout" | "chart-contextmenu" | "dataListener", ...args: any[]) => void;
+    id: string;
+    setOption: (optionParams: any, type?: any) => void;
+    chart: import("vue").ShallowRef<import("echarts/types/dist/echarts").ECharts>;
+    renderChart: import("lodash").DebouncedFunc<(option: import("echarts/types/dist/echarts").EChartsOption) => void>;
+    renderData: Function;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("chart-click" | "chart-dblclick" | "chart-mousedown" | "chart-mouseover" | "chart-mouseout" | "chart-contextmenu" | "dataListener")[], "chart-click" | "chart-dblclick" | "chart-mousedown" | "chart-mouseover" | "chart-mouseout" | "chart-contextmenu" | "dataListener", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    option: {
+        type: any;
+        required: true;
+    };
+    sources: {
+        type: ArrayConstructor;
+        required: true;
+    };
+    useEvents: {
+        type: ArrayConstructor;
+        required: true;
+    };
+    uuid: {
+        type: StringConstructor;
+        required: true;
+    };
+    isMultiSeries: {
+        type: BooleanConstructor;
+        required: true;
+    };
+    customRenderData: {
+        type: FunctionConstructor;
+        required: false;
+    };
+}>> & {
+    "onChart-click"?: (...args: any[]) => any;
+    "onChart-dblclick"?: (...args: any[]) => any;
+    "onChart-mousedown"?: (...args: any[]) => any;
+    "onChart-mouseover"?: (...args: any[]) => any;
+    "onChart-mouseout"?: (...args: any[]) => any;
+    "onChart-contextmenu"?: (...args: any[]) => any;
+    onDataListener?: (...args: any[]) => any;
+}, {}, {}>;
+export default _sfc_main;

package/es/components/chart/commons/components/common-chart/index.vue.mjs

@@ -0,0 +1,59 @@
+import { defineComponent as p, createElementBlock as f, openBlock as h, createElementVNode as v, unref as E } from "vue";
+import { cloneDeep as s } from "lodash";
+import { useCommonChart as _ } from "./hooks/useCommonChart.mjs";
+import { SHJDatasourceV2 as D } from "../../../../../commons/plugins/datasource/index.mjs";
+import { useChart as k } from "../../hooks/useChart.mjs";
+import { parseDataset as C } from "../../../../../commons/utils/parseDataset.mjs";
+import { cloneSeries as L } from "../../../../../commons/utils/cloneSeries.mjs";
+import { SHJParseEvent as n } from "../../../../../commons/plugins/event/index.mjs";
+const S = { class: "zerov-widget" }, x = ["id"], O = /* @__PURE__ */ p({
+  __name: "index",
+  props: {
+    option: {},
+    sources: {},
+    useEvents: {},
+    uuid: {},
+    isMultiSeries: { type: Boolean },
+    customRenderData: { type: Function }
+  },
+  emits: ["dataListener", "chart-click", "chart-dblclick", "chart-mousedown", "chart-mouseover", "chart-mouseout", "chart-contextmenu"],
+  setup(c, { emit: i }) {
+    const e = c, o = i, {
+      id: u,
+      setOption: a,
+      chart: m,
+      renderChart: d,
+      renderData: l
+    } = k({
+      basicOption: s(e.option),
+      useEvents: s(e.useEvents),
+      customRenderData: (t) => {
+        t = s(t), D.parse({
+          tId: e.uuid,
+          sources: e.sources,
+          callback: ({ data: r }) => {
+            try {
+              if (o("dataListener", r), n.parseEvents(e.useEvents, "dataListener", r), e.customRenderData) {
+                e.customRenderData(t, r, a);
+                return;
+              }
+              t.dataset = C(s(r)), e.isMultiSeries && (t.series = L(r, t.series)), a(t);
+            } catch {
+              o("dataListener", null), n.parseEvents(e.useEvents, "dataListener", null), a(t);
+            }
+          }
+        });
+      },
+      emits: o
+    });
+    return _(e, l, d, m), (t, r) => (h(), f("div", S, [
+      v("div", {
+        id: E(u),
+        class: "widget"
+      }, null, 8, x)
+    ]));
+  }
+});
+export {
+  O as default
+};

package/es/components/chart/commons/components/common-chart/index.vue2.mjs

@@ -0,0 +1,4 @@
+import f from "./index.vue.mjs";
+export {
+  f as default
+};

package/es/components/chart/commons/components/common-chart-map/hooks/useCommonChart.d.ts

@@ -0,0 +1,12 @@
+import { type Ref } from 'vue';
+/**
+ * 通用图表
+ * @param props 选项
+ * @param initData 初始化数据
+ * @param initView 初始化视图
+ * @param chart 图表实例
+ */
+export declare const useCommonChart: (props: {
+    option: any;
+    sources: any;
+}, initData: Function, initView: Function, chart: Ref<any>) => void;

package/es/components/chart/commons/components/common-chart-map/hooks/useCommonChart.mjs

@@ -0,0 +1,27 @@
+import { watch as u, defineExpose as f } from "vue";
+import { cloneDeep as s, isEqual as h } from "lodash";
+const a = (e, o, t, c) => {
+  u(() => e.sources, () => {
+    e.sources && e.sources.length > 0 && o(e.option);
+  }, {
+    deep: !0
+  }), u(() => s(e.option), (r, n) => {
+    h(r, n) || t(r);
+  }, {
+    deep: !0
+  }), f({
+    getEchartsInstance: () => c.value,
+    refresh: () => {
+      e.sources && e.sources.length > 0 && o(e.option), t(e.option);
+    },
+    refreshView: () => {
+      t(e.option);
+    },
+    refreshData: () => {
+      o(e.option);
+    }
+  });
+};
+export {
+  a as useCommonChart
+};

package/es/components/chart/commons/components/common-chart-map/index.vue.d.ts

@@ -0,0 +1,52 @@
+declare const _sfc_main: import("vue").DefineComponent<{
+    option: {
+        type: any;
+        required: true;
+    };
+    sources: {
+        type: ArrayConstructor;
+        required: true;
+    };
+    useEvents: {
+        type: ArrayConstructor;
+        required: true;
+    };
+    uuid: {
+        type: StringConstructor;
+        required: true;
+    };
+}, {
+    props: any;
+    emits: (event: "chart-click" | "chart-dblclick" | "chart-mousedown" | "chart-mouseover" | "chart-mouseout" | "chart-contextmenu" | "dataListener", ...args: any[]) => void;
+    id: string;
+    setOption: (optionParams: any, type?: any) => void;
+    chart: import("vue").ShallowRef<import("echarts/types/dist/echarts").ECharts>;
+    renderChart: import("lodash").DebouncedFunc<(option: import("echarts/types/dist/echarts").EChartsOption) => void>;
+    renderData: Function;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("chart-click" | "chart-dblclick" | "chart-mousedown" | "chart-mouseover" | "chart-mouseout" | "chart-contextmenu" | "dataListener")[], "chart-click" | "chart-dblclick" | "chart-mousedown" | "chart-mouseover" | "chart-mouseout" | "chart-contextmenu" | "dataListener", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    option: {
+        type: any;
+        required: true;
+    };
+    sources: {
+        type: ArrayConstructor;
+        required: true;
+    };
+    useEvents: {
+        type: ArrayConstructor;
+        required: true;
+    };
+    uuid: {
+        type: StringConstructor;
+        required: true;
+    };
+}>> & {
+    "onChart-click"?: (...args: any[]) => any;
+    "onChart-dblclick"?: (...args: any[]) => any;
+    "onChart-mousedown"?: (...args: any[]) => any;
+    "onChart-mouseover"?: (...args: any[]) => any;
+    "onChart-mouseout"?: (...args: any[]) => any;
+    "onChart-contextmenu"?: (...args: any[]) => any;
+    onDataListener?: (...args: any[]) => any;
+}, {}, {}>;
+export default _sfc_main;

package/es/components/chart/commons/components/common-chart-map/index.vue.mjs

@@ -0,0 +1,53 @@
+import { defineComponent as f, createElementBlock as v, openBlock as _, createElementVNode as E, unref as k } from "vue";
+import { cloneDeep as o } from "lodash";
+import { useCommonChart as C } from "./hooks/useCommonChart.mjs";
+import { SHJDatasourceV2 as L } from "../../../../../commons/plugins/datasource/index.mjs";
+import { useChart as x } from "../../hooks/useChart.mjs";
+import { SHJParseEvent as c } from "../../../../../commons/plugins/event/index.mjs";
+const D = { class: "zerov-widget" }, b = ["id"], J = /* @__PURE__ */ f({
+  __name: "index",
+  props: {
+    option: {},
+    sources: {},
+    useEvents: {},
+    uuid: {}
+  },
+  emits: ["dataListener", "chart-click", "chart-dblclick", "chart-mousedown", "chart-mouseover", "chart-mouseout", "chart-contextmenu"],
+  setup(i, { emit: d }) {
+    const e = i, s = d, {
+      id: u,
+      setOption: n,
+      chart: m,
+      renderChart: p,
+      renderData: l
+    } = x({
+      basicOption: o(e.option),
+      useEvents: o(e.useEvents),
+      customRenderData: (t) => {
+        t = o(t), L.parse({
+          tId: e.uuid,
+          sources: e.sources,
+          callback: (r) => {
+            try {
+              s("dataListener", r.data), c.parseEvents(e.useEvents, "dataListener", r.data);
+              const a = t.series.find((h) => h._sourceId === r.id);
+              a && (a.data = r.data[0].data), n(t);
+            } catch {
+              s("dataListener", null), c.parseEvents(e.useEvents, "dataListener", null), n(t);
+            }
+          }
+        });
+      },
+      emits: s
+    });
+    return C(e, l, p, m), (t, r) => (_(), v("div", D, [
+      E("div", {
+        id: k(u),
+        class: "widget"
+      }, null, 8, b)
+    ]));
+  }
+});
+export {
+  J as default
+};

package/es/components/chart/commons/components/common-chart-map/index.vue2.mjs

@@ -0,0 +1,4 @@
+import f from "./index.vue.mjs";
+export {
+  f as default
+};

package/es/components/chart/commons/hooks/useChart.d.ts

@@ -0,0 +1,15 @@
+import * as echarts from 'echarts';
+export interface IUseChart {
+    basicOption: any;
+    useEvents: any[];
+    customRenderData: Function;
+    emits: any;
+}
+export declare const useChart: ({ basicOption, useEvents, customRenderData, emits }: IUseChart) => {
+    id: string;
+    status: import("vue").Ref<boolean>;
+    chart: import("vue").ShallowRef<echarts.ECharts>;
+    setOption: (optionParams: any, type?: any) => void;
+    renderChart: import("lodash").DebouncedFunc<(option: echarts.EChartsOption) => void>;
+    renderData: Function;
+};