aldehyde 0.2.493 → 0.2.495

package/src/aldehyde/lowcode-components/base-table/index.less

@@ -1,62 +1,62 @@
-.base-table {
-  width: 100%;
-  height: 100%;
-  overflow: hidden;
-
-  .base-table-empty {
-    width: 100%;
-    height: 100%;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-  }
-
-  table {
-    width: 100%;
-    text-align: center;
-    table-layout: fixed;
-    /* 关键：合并相邻边框，消除双线 */
-    border-collapse: collapse;
-    margin-top: -2px;
-
-    thead {
-      position: relative;
-      z-index: 1;
-
-      th {
-        padding: 0 4px;
-      }
-    }
-
-
-    .scroll-body {
-      overflow: hidden;
-      animation: scroll 10s linear infinite;
-
-      td {
-        padding: 0 4px;
-        overflow: hidden;
-        white-space: nowrap;
-        text-overflow: ellipsis;
-      }
-    }
-  }
-
-  table:hover {
-    .scroll-body {
-      animation-play-state: paused !important;
-    }
-  }
-
-}
-
-
-@keyframes scroll {
-  0% {
-    transform: translateY(0);
-  }
-
-  100% {
-    transform: translateY(-100%);
-  }
+.base-table {
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+
+  .base-table-empty {
+    width: 100%;
+    height: 100%;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+  }
+
+  table {
+    width: 100%;
+    text-align: center;
+    table-layout: fixed;
+    /* 关键：合并相邻边框，消除双线 */
+    border-collapse: collapse;
+    margin-top: -2px;
+
+    thead {
+      position: relative;
+      z-index: 1;
+
+      th {
+        padding: 0 4px;
+      }
+    }
+
+
+    .scroll-body {
+      overflow: hidden;
+      animation: scroll 10s linear infinite;
+
+      td {
+        padding: 0 4px;
+        overflow: hidden;
+        white-space: nowrap;
+        text-overflow: ellipsis;
+      }
+    }
+  }
+
+  table:hover {
+    .scroll-body {
+      animation-play-state: paused !important;
+    }
+  }
+
+}
+
+
+@keyframes scroll {
+  0% {
+    transform: translateY(0);
+  }
+
+  100% {
+    transform: translateY(-100%);
+  }
 }

package/src/aldehyde/lowcode-components/base-text/index.less

@@ -1,20 +1,20 @@
-
-.base-text-component {
-  --stroke-color: #000000;
-  --stroke-width: 0;
-
-  height: 100%;
-  display: flex;
-  -webkit-text-stroke-color: var(--stroke-color);
-  -webkit-text-stroke-width: var(--stroke-width);
-  stroke-color: var(--stroke-color);
-  stroke-width: var(--stroke-width);
-
-  input {
-    outline: none;
-    width: 100%;
-    background-color: rgba(255, 222, 173, 0);
-    text-align: center;
-    border: none;
-  }
+
+.base-text-component {
+  --stroke-color: #000000;
+  --stroke-width: 0;
+
+  height: 100%;
+  display: flex;
+  -webkit-text-stroke-color: var(--stroke-color);
+  -webkit-text-stroke-width: var(--stroke-width);
+  stroke-color: var(--stroke-color);
+  stroke-width: var(--stroke-width);
+
+  input {
+    outline: none;
+    width: 100%;
+    background-color: rgba(255, 222, 173, 0);
+    text-align: center;
+    border: none;
+  }
 }

package/src/aldehyde/lowcode-components/column-chart/index.tsx

@@ -89,7 +89,7 @@ const handleData = (data: { config: { [key: string]: string }, value: { [key: st
                     vLength: vNames.length,
                     isMarkLine: true,
                     name: config[r],
-                    data: value.map((v) => [v["d1"], v[r]]),
+                    data: value.map((v) => [v["d1"], (v[r])?.split("@R@")[1] || v[r]]),
                 }))
             ]
         } : {
@@ -268,7 +268,7 @@ const Index = forwardRef((props: ComponentProps, ref: ForwardedRef<ComponentRef>
         const temData = isDesignMode && !data?.length ? defDatas[componentType] || [] : data;
         option.barMaxWidth = barMaxWidth;
         option.grid = grid;
-        option.legend = { ...legend, ...legends[legend?.position] };
+        option.legend = { ...legend, ...legends[legend?.position], data: temData?.filter((item: any) => !item.isMarkLine).map((r: any) => r.name) };
         option.tooltip = { trigger: "axis", ...tooltip };
         option.xAxis = { ...option.xAxis, ...xAxis, axisTick: { show: xAxis?.axisLine?.show } };
         option.yAxis = { ...option.yAxis, ...yAxis };

package/src/aldehyde/lowcode-components/data-number/index.less

@@ -1,11 +1,11 @@
-.data-number-component {
-  --stroke-color: #000000;
-  --stroke-width: 0;
-
-  height: 100%;
-  display: flex;
-  -webkit-text-stroke-color: var(--stroke-color);
-  -webkit-text-stroke-width: var(--stroke-width);
-  stroke-color: var(--stroke-color);
-  stroke-width: var(--stroke-width);
+.data-number-component {
+  --stroke-color: #000000;
+  --stroke-width: 0;
+
+  height: 100%;
+  display: flex;
+  -webkit-text-stroke-color: var(--stroke-color);
+  -webkit-text-stroke-width: var(--stroke-width);
+  stroke-color: var(--stroke-color);
+  stroke-width: var(--stroke-width);
 }

package/src/aldehyde/lowcode-components/date-time/index.less

@@ -1,5 +1,5 @@
-.date-time-component {
-  width: 100%;
-  height: 100%;
-  display: flex;
+.date-time-component {
+  width: 100%;
+  height: 100%;
+  display: flex;
 }

package/src/aldehyde/lowcode-components/date-time/index.tsx

@@ -1,65 +1,65 @@
-import React, { ForwardedRef, forwardRef, useEffect, useImperativeHandle, useRef, useState } from 'react';
-import dayjs from "dayjs";
-import './index.less';
-
-export interface DateTimeComponentStyle {
-    fontSize?: number;
-    color?: string;
-    fontFamily?: string;
-    fontWeight?: number;
-    alignItems?: string;
-    justifyContent?: string;
-    letterSpacing?: string;
-    formatType?: string;
-}
-
-export interface DateTimeComponentProps {
-    style?: DateTimeComponentStyle;
-}
-
-export interface DateTimeComponentRef {
-    updateConfig: (newConfig: DateTimeComponentProps) => void;
-    setEventHandler: (eventMap: Record<string, Function>) => void;
-    destroy: () => void;
-}
-
-const defFormatType = "YYYY年MM月DD日 HH时mm分ss秒";
-
-const DateTimeComponent = forwardRef((props: DateTimeComponentProps, ref: ForwardedRef<DateTimeComponentRef>) => {
-    const [config, setConfig] = useState<DateTimeComponentProps>({ ...props });
-    const [datetime, setDateTime] = useState<string>(dayjs().format(config.style?.formatType || defFormatType));
-    const timeRef = useRef<NodeJS.Timeout | null>(null);
-    const eventHandlerMap = useRef<Record<string, Function>>({});
-
-    const handleClearInterval = () => {
-        timeRef.current && clearInterval(timeRef.current);
-        timeRef.current = null;
-    }
-
-    useEffect(() => {
-        timeRef.current = setInterval(() => {
-            setDateTime(dayjs().format(config.style?.formatType || defFormatType));
-        }, 1000);
-        return () => {
-            handleClearInterval();
-        }
-    }, []);
-
-
-    useImperativeHandle(ref, () => ({
-        updateConfig: (newConfig) => setConfig({ ...newConfig }),
-        setEventHandler: (eventMap) => eventHandlerMap.current = eventMap,
-        destroy: () => {
-            handleClearInterval();
-        }
-    }));
-
-
-    return (
-        <div className="date-time-component" style={{ ...(config?.style || {}) }}>
-            {datetime}
-        </div>
-    );
-});
-
+import React, { ForwardedRef, forwardRef, useEffect, useImperativeHandle, useRef, useState } from 'react';
+import dayjs from "dayjs";
+import './index.less';
+
+export interface DateTimeComponentStyle {
+    fontSize?: number;
+    color?: string;
+    fontFamily?: string;
+    fontWeight?: number;
+    alignItems?: string;
+    justifyContent?: string;
+    letterSpacing?: string;
+    formatType?: string;
+}
+
+export interface DateTimeComponentProps {
+    style?: DateTimeComponentStyle;
+}
+
+export interface DateTimeComponentRef {
+    updateConfig: (newConfig: DateTimeComponentProps) => void;
+    setEventHandler: (eventMap: Record<string, Function>) => void;
+    destroy: () => void;
+}
+
+const defFormatType = "YYYY年MM月DD日 HH时mm分ss秒";
+
+const DateTimeComponent = forwardRef((props: DateTimeComponentProps, ref: ForwardedRef<DateTimeComponentRef>) => {
+    const [config, setConfig] = useState<DateTimeComponentProps>({ ...props });
+    const [datetime, setDateTime] = useState<string>(dayjs().format(config.style?.formatType || defFormatType));
+    const timeRef = useRef<NodeJS.Timeout | null>(null);
+    const eventHandlerMap = useRef<Record<string, Function>>({});
+
+    const handleClearInterval = () => {
+        timeRef.current && clearInterval(timeRef.current);
+        timeRef.current = null;
+    }
+
+    useEffect(() => {
+        timeRef.current = setInterval(() => {
+            setDateTime(dayjs().format(config.style?.formatType || defFormatType));
+        }, 1000);
+        return () => {
+            handleClearInterval();
+        }
+    }, []);
+
+
+    useImperativeHandle(ref, () => ({
+        updateConfig: (newConfig) => setConfig({ ...newConfig }),
+        setEventHandler: (eventMap) => eventHandlerMap.current = eventMap,
+        destroy: () => {
+            handleClearInterval();
+        }
+    }));
+
+
+    return (
+        <div className="date-time-component" style={{ ...(config?.style || {}) }}>
+            {datetime}
+        </div>
+    );
+});
+
 export default DateTimeComponent;

package/src/aldehyde/lowcode-components/four-angle-glow-border/index.less

@@ -1,50 +1,50 @@
-.four-angle-glow {
-  --fagb-color: #00ebff;
-  --fagb-width: 2px;
-  --fagb-length: 8px;
-  --fagb-radius: 3px;
-  width: 100%;
-  height: 100%;
-  position: relative;
-
-  .angle {
-    position: absolute;
-    border: var(--fagb-width) solid var(--fagb-color);
-    width: var(--fagb-length);
-    height: var(--fagb-length);
-  }
-
-  .angle-tl {
-    margin: -1px 0 0 -1px;
-    border-right: 0;
-    border-bottom: 0;
-    border-top-left-radius: var(--fagb-radius);
-  }
-
-  .angle-tr {
-    top: 0;
-    right: 0;
-    border-left: 0;
-    border-bottom: 0;
-    margin: -1px -1px 0 0;
-    border-top-right-radius: var(--fagb-radius);
-  }
-
-  .angle-bl {
-    bottom: 0;
-    left: 0;
-    border-top: 0;
-    border-right: 0;
-    margin: 0 0 -1px -1px;
-    border-bottom-left-radius: var(--fagb-radius);
-  }
-
-  .angle-br {
-    bottom: 0;
-    right: 0;
-    border-left: 0;
-    border-top: 0;
-    margin: 0 -1px -1px 0;
-    border-bottom-right-radius: var(--fagb-radius);
-  }
+.four-angle-glow {
+  --fagb-color: #00ebff;
+  --fagb-width: 2px;
+  --fagb-length: 8px;
+  --fagb-radius: 3px;
+  width: 100%;
+  height: 100%;
+  position: relative;
+
+  .angle {
+    position: absolute;
+    border: var(--fagb-width) solid var(--fagb-color);
+    width: var(--fagb-length);
+    height: var(--fagb-length);
+  }
+
+  .angle-tl {
+    margin: -1px 0 0 -1px;
+    border-right: 0;
+    border-bottom: 0;
+    border-top-left-radius: var(--fagb-radius);
+  }
+
+  .angle-tr {
+    top: 0;
+    right: 0;
+    border-left: 0;
+    border-bottom: 0;
+    margin: -1px -1px 0 0;
+    border-top-right-radius: var(--fagb-radius);
+  }
+
+  .angle-bl {
+    bottom: 0;
+    left: 0;
+    border-top: 0;
+    border-right: 0;
+    margin: 0 0 -1px -1px;
+    border-bottom-left-radius: var(--fagb-radius);
+  }
+
+  .angle-br {
+    bottom: 0;
+    right: 0;
+    border-left: 0;
+    border-top: 0;
+    margin: 0 -1px -1px 0;
+    border-bottom-right-radius: var(--fagb-radius);
+  }
 }

package/src/aldehyde/lowcode-components/four-angle-glow-border/index.tsx

@@ -1,53 +1,53 @@
-import './index.less';
-import React, { ForwardedRef, forwardRef, useEffect, useImperativeHandle, useRef, useState } from "react";
-
-export interface FourAngleGlowBorderStyle {
-    width?: number;
-    length?: number;
-    color?: string;
-    radius?: number;
-}
-
-export interface FourAngleGlowProps {
-    style?: FourAngleGlowBorderStyle;
-}
-
-export interface FourAngleGlowBorderRef {
-    updateConfig: (config: FourAngleGlowProps) => void;
-}
-
-const FourAngleGlowBorder = forwardRef((props: FourAngleGlowProps, ref: ForwardedRef<FourAngleGlowBorderRef>) => {
-    const [config] = useState<FourAngleGlowProps>({ ...props });
-    const fourAngleGlowRef = useRef<HTMLDivElement | null>(null);
-
-    const updateStyle = (style: FourAngleGlowBorderStyle) => {
-        const dom = fourAngleGlowRef.current;
-        if (dom) {
-            dom.style.setProperty('--fagb-length', `${style?.length}px`);
-            dom.style.setProperty('--fagb-color', style?.color);
-            dom.style.setProperty('--fagb-radius', `${style?.radius}px`);
-            dom.style.setProperty('--fagb-width', `${style?.width}px`);
-        }
-    };
-
-    useImperativeHandle(ref, () => ({
-        updateConfig: (newConfig) => updateStyle({ ...newConfig.style }),
-    }));
-
-    useEffect(() => {
-        updateStyle(config.style);
-    }, []);
-
-    return (
-        <div className="four-angle-glow" ref={fourAngleGlowRef}>
-            <span className="angle angle-tl" />
-            <span className="angle angle-tr" />
-            <span className="angle angle-bl" />
-            <span className="angle angle-br" />
-        </div>
-    );
-})
-
-export default FourAngleGlowBorder;
-
-
+import './index.less';
+import React, { ForwardedRef, forwardRef, useEffect, useImperativeHandle, useRef, useState } from "react";
+
+export interface FourAngleGlowBorderStyle {
+    width?: number;
+    length?: number;
+    color?: string;
+    radius?: number;
+}
+
+export interface FourAngleGlowProps {
+    style?: FourAngleGlowBorderStyle;
+}
+
+export interface FourAngleGlowBorderRef {
+    updateConfig: (config: FourAngleGlowProps) => void;
+}
+
+const FourAngleGlowBorder = forwardRef((props: FourAngleGlowProps, ref: ForwardedRef<FourAngleGlowBorderRef>) => {
+    const [config] = useState<FourAngleGlowProps>({ ...props });
+    const fourAngleGlowRef = useRef<HTMLDivElement | null>(null);
+
+    const updateStyle = (style: FourAngleGlowBorderStyle) => {
+        const dom = fourAngleGlowRef.current;
+        if (dom) {
+            dom.style.setProperty('--fagb-length', `${style?.length}px`);
+            dom.style.setProperty('--fagb-color', style?.color);
+            dom.style.setProperty('--fagb-radius', `${style?.radius}px`);
+            dom.style.setProperty('--fagb-width', `${style?.width}px`);
+        }
+    };
+
+    useImperativeHandle(ref, () => ({
+        updateConfig: (newConfig) => updateStyle({ ...newConfig.style }),
+    }));
+
+    useEffect(() => {
+        updateStyle(config.style);
+    }, []);
+
+    return (
+        <div className="four-angle-glow" ref={fourAngleGlowRef}>
+            <span className="angle angle-tl" />
+            <span className="angle angle-tr" />
+            <span className="angle angle-bl" />
+            <span className="angle angle-br" />
+        </div>
+    );
+})
+
+export default FourAngleGlowBorder;
+
+

package/src/aldehyde/lowcode-components/line-bar-chart/index.tsx

@@ -72,7 +72,10 @@ const handleData = (data: { config: { [key: string]: string }, value: { [key: st
                     vLength: vNames.length,
                     isMarkLine: true,
                     name: config[r],
-                    data: value.map((v) => [v["d1"], nullSetZero ? (v[r] || 0) : v[r]]),
+                    data: value.map((v) => {
+                        const temData = nullSetZero ? (v[r] || 0) : v[r];
+                        return [v["d1"], (temData)?.split("@R@")[1] || temData];
+                    }),
                 }))
             ]
         } : {
@@ -261,7 +264,7 @@ const Index = forwardRef((props: ComponentProps, ref: ForwardedRef<ComponentRef>
         const temData = isDesignMode && !data?.length ? option.series : data;
         option.barMaxWidth = barMaxWidth;
         option.grid = grid;
-        option.legend = { ...legend, ...legends[legend?.position] };
+        option.legend = { ...legend, ...legends[legend?.position], data: temData?.filter((item: any) => !item.isMarkLine).map((r: any) => r.name) };
         option.tooltip = { trigger: "axis", ...tooltip };
         option.xAxis = { ...option.xAxis, ...xAxis, axisTick: { show: xAxis?.axisLine?.show } };
         option.yAxis = { ...option.yAxis, ...yAxis };

package/src/aldehyde/lowcode-components/line-chart/index.tsx

@@ -67,7 +67,10 @@ const handleData = (data: { config: { [key: string]: string }, value: { [key: st
                     vLength: vNames.length,
                     isMarkLine: true,
                     name: config[r],
-                    data: value.map((v) => [v["d1"], nullSetZero ? (v[r] || 0) : v[r]]),
+                    data: value.map((v) => {
+                        const temData = nullSetZero ? (v[r] || 0) : v[r];
+                        return [v["d1"], (temData)?.split("@R@")[1] || temData];
+                    }),
                 }))
             ],
         } : {
@@ -255,7 +258,7 @@ const Index = forwardRef((props: ComponentProps, ref: ForwardedRef<ComponentRef>
         // 编辑态无数据显示默认数据
         const temData = isDesignMode && !data?.length ? option.series : data;
         option.grid = grid;
-        option.legend = { ...legend, ...legends[legend?.position] };
+        option.legend = { ...legend, ...legends[legend?.position], data: temData?.filter((item: any) => !item.isMarkLine).map((r: any) => r.name) };
         option.tooltip = { trigger: "axis", ...tooltip };
         option.xAxis = { ...option.xAxis, ...xAxis, axisTick: { show: xAxis?.axisLine?.show } };
         option.yAxis = { ...option.yAxis, ...yAxis };