sun-card-design 1.1.37 → 1.1.39

package/dist/sun-card-designer.es24.js

@@ -1,265 +0,0 @@
-import { reactive, resolveComponent, createElementBlock, openBlock, createElementVNode, createVNode, createCommentVNode, withCtx, createTextVNode, toDisplayString, unref } from "vue";
-import { MinusOutlined, PlusOutlined, DeleteOutlined } from "@ant-design/icons-vue";
-import { generateShortUUID } from "./sun-card-designer.es14.js";
-import { message } from "ant-design-vue";
-import { useCardManageStore } from "./sun-card-designer.es13.js";
-/* empty css                        */
-import _export_sfc from "./sun-card-designer.es16.js";
-const _hoisted_1 = { class: "grid-base" };
-const _hoisted_2 = { key: 0 };
-const _hoisted_3 = { class: "slot" };
-const _hoisted_4 = { class: "a-item" };
-const _hoisted_5 = { style: { "display": "flex" } };
-const _hoisted_6 = { key: 0 };
-const _hoisted_7 = { key: 1 };
-const _sfc_main = {
-  __name: "gridBasePes",
-  props: ["record"],
-  setup(__props) {
-    const cardManageStore = useCardManageStore();
-    const props = __props;
-    const optionKeys = reactive(["固定格数", "动态格数"]);
-    const addSlot = () => {
-      props.record.columns.push({
-        list: [],
-        // 栅格中组件列表
-        flex: 1,
-        // 占位
-        type: "columns",
-        uuid: generateShortUUID(),
-        options: {
-          clickEvent: false,
-          // 是否启用点击事件
-          clickEventConfig: {
-            type: "url",
-            // url event agent tool 点击事件类型
-            value: "",
-            // 点击事件值，url event agent
-            toolItem: null,
-            // 调用工具值 tool
-            tooltemParams: []
-          }
-        }
-      });
-    };
-    const delSlot = (index) => {
-      if (props.record.columns.length < 2) {
-        message.warning("最少为一个");
-        return;
-      }
-      props.record.columns.splice(index, 1);
-    };
-    const variableOptions = () => {
-      const list = cardManageStore.variableList.filter((e) => e.type === "Array");
-      return list;
-    };
-    const onChange = () => {
-      props.record.options.variableName = null;
-      props.record.columns = [
-        {
-          list: [],
-          // 栅格中组件列表
-          flex: 1,
-          // 占位
-          type: "columns",
-          uuid: generateShortUUID(),
-          options: {
-            clickEvent: false,
-            // 是否启用点击事件
-            clickEventConfig: {
-              type: "url",
-              // url event agent tool 点击事件类型
-              value: "",
-              // 点击事件值，url event agent
-              toolItem: null,
-              // 调用工具值 tool
-              tooltemParams: []
-            }
-          }
-        },
-        {
-          list: [],
-          // 栅格中组件列表
-          flex: 1,
-          // 占位
-          type: "columns",
-          uuid: generateShortUUID(),
-          options: {
-            clickEvent: false,
-            // 是否启用点击事件
-            clickEventConfig: {
-              type: "url",
-              // url event agent tool 点击事件类型
-              value: "",
-              // 点击事件值，url event agent
-              toolItem: null,
-              // 调用工具值 tool
-              tooltemParams: []
-            }
-          }
-        },
-        {
-          list: [],
-          // 栅格中组件列表
-          flex: 1,
-          // 占位
-          type: "columns",
-          uuid: generateShortUUID(),
-          options: {
-            clickEvent: false,
-            // 是否启用点击事件
-            clickEventConfig: {
-              type: "url",
-              // url event agent tool 点击事件类型
-              value: "",
-              // 点击事件值，url event agent
-              toolItem: null,
-              // 调用工具值 tool
-              tooltemParams: []
-            }
-          }
-        }
-      ];
-    };
-    const selectChange = (val) => {
-      const list = cardManageStore.variableList.find((e) => e.type === "Array" && val === e.name);
-      const length = list.defaultValue ? JSON.parse(list.defaultValue).length : [];
-      props.record.columns = [];
-      const uuid = generateShortUUID();
-      const options = {
-        clickEvent: false,
-        // 是否启用点击事件
-        clickEventConfig: {
-          type: "url",
-          // url event agent tool 点击事件类型
-          value: "",
-          // 点击事件值，url event agent
-          toolItem: null,
-          // 调用工具值 tool
-          tooltemParams: []
-        }
-      };
-      for (let index = 0; index < length; index++) {
-        props.record.columns.push({
-          list: [],
-          // 栅格中组件列表
-          flex: 1,
-          // 占位
-          type: "columns",
-          uuid,
-          options
-        });
-      }
-    };
-    const minusClick = (index) => {
-      if (props.record.columns[index].flex <= 1) return;
-      props.record.columns[index].flex--;
-    };
-    const plusClick = (index) => {
-      if (props.record.columns[index].flex >= 24) return;
-      props.record.columns[index].flex++;
-    };
-    return (_ctx, _cache) => {
-      const _component_a_segmented = resolveComponent("a-segmented");
-      const _component_a_button = resolveComponent("a-button");
-      const _component_a_tag = resolveComponent("a-tag");
-      const _component_a_list_item = resolveComponent("a-list-item");
-      const _component_a_list = resolveComponent("a-list");
-      const _component_a_select = resolveComponent("a-select");
-      const _component_a_form_item = resolveComponent("a-form-item");
-      const _component_a_form = resolveComponent("a-form");
-      return openBlock(), createElementBlock("div", _hoisted_1, [
-        _cache[4] || (_cache[4] = createElementVNode("div", { class: "title" }, "数据", -1)),
-        createVNode(_component_a_segmented, {
-          style: { "margin-top": "12px" },
-          value: props.record.options.dataType,
-          "onUpdate:value": _cache[0] || (_cache[0] = ($event) => props.record.options.dataType = $event),
-          block: "",
-          options: optionKeys,
-          onChange
-        }, null, 8, ["value", "options"]),
-        props.record.options.dataType === "固定格数" ? (openBlock(), createElementBlock("div", _hoisted_2, [
-          createElementVNode("div", _hoisted_3, [
-            _cache[3] || (_cache[3] = createElementVNode("span", null, "插槽集合", -1)),
-            createVNode(_component_a_button, {
-              size: "small",
-              style: { "font-size": "13px" },
-              onClick: addSlot
-            }, {
-              default: withCtx(() => [..._cache[2] || (_cache[2] = [
-                createTextVNode("+添加插槽", -1)
-              ])]),
-              _: 1
-            })
-          ]),
-          createVNode(_component_a_list, {
-            bordered: "",
-            "data-source": props.record.columns
-          }, {
-            renderItem: withCtx(({ index }) => [
-              createVNode(_component_a_list_item, null, {
-                default: withCtx(() => [
-                  createElementVNode("div", _hoisted_4, [
-                    createElementVNode("span", null, "插槽 " + toDisplayString(index + 1), 1),
-                    createElementVNode("div", _hoisted_5, [
-                      props.record.options.mode === "vertical" ? (openBlock(), createElementBlock("div", _hoisted_6, [
-                        createVNode(unref(MinusOutlined), {
-                          onClick: ($event) => minusClick(index)
-                        }, null, 8, ["onClick"]),
-                        createVNode(_component_a_tag, { style: { "margin": "0 10px" } }, {
-                          default: withCtx(() => [
-                            createTextVNode(toDisplayString(props.record.columns[index].flex), 1)
-                          ]),
-                          _: 2
-                        }, 1024),
-                        createVNode(unref(PlusOutlined), {
-                          onClick: ($event) => plusClick(index)
-                        }, null, 8, ["onClick"])
-                      ])) : createCommentVNode("", true),
-                      createVNode(unref(DeleteOutlined), {
-                        style: { "margin-left": "20px" },
-                        onClick: ($event) => delSlot(index)
-                      }, null, 8, ["onClick"])
-                    ])
-                  ])
-                ]),
-                _: 2
-              }, 1024)
-            ]),
-            _: 1
-          }, 8, ["data-source"])
-        ])) : createCommentVNode("", true),
-        props.record.options.dataType === "动态格数" ? (openBlock(), createElementBlock("div", _hoisted_7, [
-          createVNode(_component_a_form, {
-            layout: "vertical",
-            style: { "margin-top": "16px" }
-          }, {
-            default: withCtx(() => [
-              createVNode(_component_a_form_item, { label: "绑定数组类型变量" }, {
-                default: withCtx(() => [
-                  createVNode(_component_a_select, {
-                    value: props.record.options.variableName,
-                    "onUpdate:value": _cache[1] || (_cache[1] = ($event) => props.record.options.variableName = $event),
-                    options: variableOptions(),
-                    style: { "width": "100%" },
-                    "field-names": {
-                      label: "name",
-                      value: "name"
-                    },
-                    onChange: selectChange
-                  }, null, 8, ["value", "options"])
-                ]),
-                _: 1
-              })
-            ]),
-            _: 1
-          })
-        ])) : createCommentVNode("", true)
-      ]);
-    };
-  }
-};
-const GridBasePes = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-a1349e50"]]);
-export {
-  GridBasePes as default
-};

package/dist/sun-card-designer.es240.js

@@ -1,375 +0,0 @@
-import { ref, computed, onMounted, onUnmounted, createElementBlock, openBlock, normalizeStyle } from "vue";
-import * as THREE from "three";
-import { OrbitControls } from "three/examples/jsm/controls/OrbitControls.js";
-import { CSS2DRenderer, CSS2DObject } from "three/examples/jsm/renderers/CSS2DRenderer.js";
-/* empty css                        */
-import _export_sfc from "./sun-card-designer.es16.js";
-const _sfc_main = {
-  __name: "barChart3dComp",
-  props: ["record"],
-  setup(__props) {
-    const props = __props;
-    const containerRef = ref(null);
-    let renderer = null;
-    let labelRenderer = null;
-    let scene = null;
-    let camera = null;
-    let animationId = null;
-    let resizeObserver = null;
-    let barsGroup = null;
-    let controls = null;
-    let hasFramedView = false;
-    let defaultBarColor = null;
-    let envTexture = null;
-    const chartStyle = computed(() => {
-      const style = props.record?.options?.style || {};
-      return {
-        width: style.width || "100%",
-        height: style.height || "260px"
-      };
-    });
-    function getChartConfig() {
-      const options = props.record?.options || {};
-      const xAxis = options.xAxisConfig[0];
-      const series = options.seriesConfig[0];
-      const colorType = series?.itemStyle?.colorType || (typeof series?.itemStyle?.color === "object" ? "gradient" : "solid");
-      defaultBarColor = series.itemStyle.color;
-      const color = series.itemStyle.color;
-      const data = Array.isArray(series?.data) ? series.data : [];
-      const labels = Array.isArray(xAxis?.data) ? xAxis.data : data.map((_, i) => String(i + 1));
-      return { data, labels, color, colorType };
-    }
-    function initScene() {
-      if (!containerRef.value) return;
-      const { clientWidth, clientHeight } = containerRef.value;
-      scene = new THREE.Scene();
-      scene.background = null;
-      const aspect = Math.max(clientWidth, 1) / Math.max(clientHeight, 1);
-      camera = new THREE.PerspectiveCamera(40, aspect, 0.1, 1e3);
-      const { data } = getChartConfig();
-      const barWidth = 0.8;
-      const gap = 1.6;
-      const totalWidth = data.length * (barWidth + gap);
-      const centerX = totalWidth / 2;
-      const maxBarHeight = 8;
-      const centerY = maxBarHeight / 2;
-      renderer = new THREE.WebGLRenderer({ antialias: true, alpha: true });
-      renderer.setPixelRatio(Math.min(window.devicePixelRatio || 1, 2));
-      renderer.setSize(clientWidth, clientHeight);
-      renderer.toneMapping = THREE.LinearToneMapping;
-      renderer.toneMappingExposure = 1.6;
-      renderer.outputColorSpace = THREE.SRGBColorSpace;
-      containerRef.value.appendChild(renderer.domElement);
-      try {
-        const jpgUrl = new URL("/assets/pic1.jpg", import.meta.url).href;
-        const textureLoader = new THREE.TextureLoader();
-        textureLoader.load(
-          jpgUrl,
-          (tex) => {
-            tex.mapping = THREE.EquirectangularReflectionMapping;
-            tex.colorSpace = THREE.SRGBColorSpace;
-            tex.userData = { brightness: 1.6, contrast: 1.2 };
-            envTexture = tex;
-            if (scene) {
-              scene.background = envTexture;
-              scene.environment = envTexture;
-            } else {
-              envTexture.dispose();
-              envTexture = null;
-            }
-          },
-          void 0,
-          () => {
-          }
-        );
-      } catch (e) {
-        return e;
-      }
-      labelRenderer = new CSS2DRenderer();
-      labelRenderer.setSize(clientWidth, clientHeight);
-      labelRenderer.domElement.style.position = "absolute";
-      labelRenderer.domElement.style.top = "0px";
-      labelRenderer.domElement.style.pointerEvents = "none";
-      containerRef.value.appendChild(labelRenderer.domElement);
-      addXYAxes();
-      barsGroup = new THREE.Group();
-      scene.add(barsGroup);
-      buildBars();
-      controls = new OrbitControls(camera, renderer.domElement);
-      controls.enableDamping = true;
-      controls.enablePan = true;
-      controls.enableRotate = true;
-      controls.enableZoom = true;
-      controls.screenSpacePanning = true;
-      controls.panSpeed = 1;
-      controls.rotateSpeed = 0.5;
-      controls.zoomSpeed = 1;
-      controls.autoRotate = false;
-      controls.target.set(centerX, centerY, 0);
-      camera.position.set(centerX, centerY, 20);
-      camera.lookAt(centerX, centerY, 0);
-      camera.rotation.set(0, 0, 0);
-      controls.update();
-      startAnimate();
-      observeResize();
-    }
-    function clearGroup(group) {
-      if (!group) return;
-      for (let i = group.children.length - 1; i >= 0; i--) {
-        const child = group.children[i];
-        if (child.children && child.children.length) {
-          clearGroup(child);
-        }
-        if (child.isCSS2DObject && child.element && child.element.parentNode) {
-          child.element.parentNode.removeChild(child.element);
-        }
-        group.remove(child);
-        if (child.geometry) child.geometry.dispose();
-        if (child.material) {
-          if (Array.isArray(child.material)) child.material.forEach((m) => m.dispose());
-          else child.material.dispose();
-        }
-      }
-    }
-    function buildBars() {
-      if (!barsGroup) return;
-      clearGroup(barsGroup);
-      const { data, color, colorType } = getChartConfig();
-      if (!Array.isArray(data) || data.length === 0) return;
-      const maxValue = Math.max(...data.map((v) => Number.isFinite(v) ? v : 0), 1);
-      const maxBarHeight = 8;
-      const barWidth = 0.8;
-      const gap = 1.6;
-      const totalWidth = data.length * (barWidth + gap);
-      const startX = barWidth / 2;
-      const materialFactory = (() => {
-        if (colorType === "gradient" && typeof color === "object" && Array.isArray(color.colorStops)) {
-          const tex = createVerticalGradientTexture(color);
-          const mat = new THREE.MeshStandardMaterial({ color: 16777215, map: tex, transparent: false });
-          mat.needsUpdate = true;
-          return () => mat;
-        }
-        return () => new THREE.MeshStandardMaterial({ color: new THREE.Color(typeof color === "string" ? color : defaultBarColor) });
-      })();
-      data.forEach((v, idx) => {
-        const value = Number(v) || 0;
-        const height = value / maxValue * maxBarHeight;
-        const geometry = new THREE.BoxGeometry(barWidth, Math.max(height, 0.01), barWidth);
-        const mesh = new THREE.Mesh(geometry, materialFactory());
-        mesh.position.set(startX + idx * (barWidth + gap), height / 2, 0);
-        mesh.castShadow = false;
-        mesh.receiveShadow = false;
-        barsGroup.add(mesh);
-        const valueDiv = document.createElement("div");
-        valueDiv.className = "bar-value-label";
-        valueDiv.textContent = String(value);
-        valueDiv.style.color = "#ffffff";
-        valueDiv.style.fontSize = "12px";
-        valueDiv.style.fontFamily = "Arial, sans-serif";
-        valueDiv.style.textAlign = "center";
-        valueDiv.style.pointerEvents = "none";
-        const valueObj = new CSS2DObject(valueDiv);
-        valueObj.position.set(startX + idx * (barWidth + gap), Math.max(height, 0.01) + 0.4, 0);
-        barsGroup.add(valueObj);
-      });
-      if (!hasFramedView) {
-        const zDistance = Math.max(14, totalWidth * 1.2);
-        const anchorX = -totalWidth * 0.5;
-        const yCenter = 10 / 2;
-        camera.position.set(anchorX, yCenter, zDistance);
-        controls && controls.target.set(anchorX, yCenter, 0);
-        camera.lookAt(anchorX, yCenter, 0);
-        hasFramedView = true;
-      }
-    }
-    function addXYAxes() {
-      const axisGroup = new THREE.Group();
-      axisGroup.name = "xy-axis-group";
-      const old = scene.getObjectByName("xy-axis-group");
-      if (old) {
-        clearGroup(old);
-        scene.remove(old);
-      }
-      const materialX = new THREE.MeshBasicMaterial({ color: 16777215 });
-      const materialY = new THREE.MeshBasicMaterial({ color: 16777215 });
-      const materialTick = new THREE.MeshBasicMaterial({ color: 16777215 });
-      const { data, labels } = getChartConfig();
-      const maxValue = Math.max(...data.map((v) => Number.isFinite(v) ? v : 0), 1);
-      const xLen = Math.max(20, data.length * 1.5);
-      const yLen = 10;
-      const xCylinderGeom = new THREE.CylinderGeometry(0.05, 0.05, xLen, 8);
-      const xCylinder = new THREE.Mesh(xCylinderGeom, materialX);
-      xCylinder.rotation.z = Math.PI / 2;
-      xCylinder.position.set(xLen / 2, 0, 0);
-      axisGroup.add(xCylinder);
-      const xArrowGeom = new THREE.ConeGeometry(0.2, 0.8, 8);
-      const xArrow = new THREE.Mesh(xArrowGeom, materialX);
-      xArrow.rotation.z = -Math.PI / 2;
-      xArrow.position.set(xLen, 0, 0);
-      axisGroup.add(xArrow);
-      const barWidth = 0.8;
-      const gap = 1.6;
-      const startX = barWidth / 2;
-      labels.forEach((label, idx) => {
-        const x = startX + idx * (barWidth + gap);
-        const tickGeom = new THREE.CylinderGeometry(0.05, 0.05, 0.3, 6);
-        const tick = new THREE.Mesh(tickGeom, materialTick);
-        tick.position.set(x, -0.15, 0);
-        axisGroup.add(tick);
-        const labelDiv = document.createElement("div");
-        labelDiv.className = "axis-label";
-        labelDiv.textContent = label;
-        labelDiv.style.color = "#ffffff";
-        labelDiv.style.fontSize = "14px";
-        labelDiv.style.fontFamily = "Arial, sans-serif";
-        labelDiv.style.textAlign = "center";
-        labelDiv.style.pointerEvents = "none";
-        const labelObject = new CSS2DObject(labelDiv);
-        labelObject.position.set(x, -2, 0);
-        axisGroup.add(labelObject);
-      });
-      const yCylinderGeom = new THREE.CylinderGeometry(0.05, 0.05, yLen, 8);
-      const yCylinder = new THREE.Mesh(yCylinderGeom, materialY);
-      yCylinder.position.set(0, yLen / 2, 0);
-      axisGroup.add(yCylinder);
-      const yArrowGeom = new THREE.ConeGeometry(0.2, 0.8, 8);
-      const yArrow = new THREE.Mesh(yArrowGeom, materialY);
-      yArrow.position.set(0, yLen, 0);
-      axisGroup.add(yArrow);
-      const tickCount = 5;
-      for (let i = 0; i <= tickCount; i++) {
-        const value = maxValue / tickCount * i;
-        const y = yLen / tickCount * i;
-        const tickGeom = new THREE.CylinderGeometry(0.01, 0.01, 0.3, 6);
-        const tick = new THREE.Mesh(tickGeom, materialTick);
-        tick.rotation.z = Math.PI / 2;
-        tick.position.set(-0.15, y, 0);
-        axisGroup.add(tick);
-        const labelDiv = document.createElement("div");
-        labelDiv.className = "axis-label";
-        labelDiv.textContent = Math.round(value).toString();
-        labelDiv.style.color = "#ffffff";
-        labelDiv.style.fontSize = "12px";
-        labelDiv.style.fontFamily = "Arial, sans-serif";
-        labelDiv.style.textAlign = "right";
-        labelDiv.style.pointerEvents = "none";
-        const labelObject = new CSS2DObject(labelDiv);
-        labelObject.position.set(-1, y, 0);
-        axisGroup.add(labelObject);
-      }
-      scene.add(axisGroup);
-    }
-    function createVerticalGradientTexture(gradient) {
-      const size = 128;
-      const canvas = document.createElement("canvas");
-      canvas.width = 1;
-      canvas.height = size;
-      const ctx = canvas.getContext("2d");
-      const grd = ctx.createLinearGradient(0, 0, 0, size);
-      const stops = Array.isArray(gradient.colorStops) ? gradient.colorStops : [];
-      if (stops.length === 0) {
-        grd.addColorStop(0, "#83bff6");
-        grd.addColorStop(1, "#188df0");
-      } else {
-        stops.forEach((s) => {
-          const off = typeof s.offset === "number" ? Math.min(Math.max(s.offset, 0), 1) : 0;
-          grd.addColorStop(off, s.color || "#ffffff");
-        });
-      }
-      ctx.fillStyle = grd;
-      ctx.fillRect(0, 0, 1, size);
-      const texture = new THREE.CanvasTexture(canvas);
-      texture.wrapS = THREE.ClampToEdgeWrapping;
-      texture.wrapT = THREE.ClampToEdgeWrapping;
-      texture.needsUpdate = true;
-      return texture;
-    }
-    function startAnimate() {
-      stopAnimate();
-      const animate = () => {
-        animationId = requestAnimationFrame(animate);
-        if (controls) controls.update();
-        renderer && renderer.render(scene, camera);
-        labelRenderer && labelRenderer.render(scene, camera);
-      };
-      animate();
-    }
-    function stopAnimate() {
-      if (animationId) {
-        cancelAnimationFrame(animationId);
-        animationId = null;
-      }
-    }
-    function observeResize() {
-      if (!containerRef.value) return;
-      if (resizeObserver) resizeObserver.disconnect();
-      resizeObserver = new ResizeObserver((entries) => {
-        for (const entry of entries) {
-          const cr = entry.contentRect;
-          onResize(Math.max(cr.width, 1), Math.max(cr.height, 1));
-        }
-      });
-      resizeObserver.observe(containerRef.value);
-    }
-    function onResize(width, height) {
-      if (!renderer || !camera) return;
-      renderer.setSize(width, height);
-      labelRenderer && labelRenderer.setSize(width, height);
-      camera.aspect = width / height;
-      camera.updateProjectionMatrix();
-    }
-    onMounted(() => {
-      initScene();
-    });
-    onUnmounted(() => {
-      stopAnimate();
-      if (resizeObserver) {
-        resizeObserver.disconnect();
-        resizeObserver = null;
-      }
-      if (barsGroup) {
-        clearGroup(barsGroup);
-        barsGroup = null;
-      }
-      if (renderer) {
-        renderer.dispose();
-        if (renderer.domElement && renderer.domElement.parentNode) {
-          renderer.domElement.parentNode.removeChild(renderer.domElement);
-        }
-        renderer = null;
-      }
-      if (labelRenderer) {
-        if (labelRenderer.domElement && labelRenderer.domElement.parentNode) {
-          labelRenderer.domElement.parentNode.removeChild(labelRenderer.domElement);
-        }
-        labelRenderer = null;
-      }
-      if (envTexture) {
-        envTexture.dispose();
-        envTexture = null;
-      }
-      if (controls) {
-        controls.dispose();
-        controls = null;
-      }
-      camera = null;
-      scene = null;
-    });
-    return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", {
-        class: "mian-barChart3d",
-        ref_key: "containerRef",
-        ref: containerRef,
-        style: normalizeStyle({
-          width: chartStyle.value.width,
-          height: chartStyle.value.height,
-          padding: `${props.record.options?.style?.tbPadding || 0}px ${props.record.options?.style?.lrPadding || 0}px`
-        })
-      }, null, 4);
-    };
-  }
-};
-const BarChart3D = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-8a4e4da8"]]);
-export {
-  BarChart3D as default
-};