@jnrs/lingshu-smart 2.2.6 → 2.2.8

package/dist/ui/models/SingleJointRobot.js

@@ -0,0 +1,346 @@
+import { EnumResourceType } from '@/types';
+import { Box, Group } from 'leafer';
+import { ModelAbs } from '../abstract/ModelAbs';
+import { StationSlot } from '../components/StationSlot';
+import { setCursor } from '../utils/attr';
+import { createShadow } from '../factories/createShadow';
+import { ScrewHole } from '../shapes/ScrewHole';
+import { RectLight } from '../components/Light';
+/**
+ * 单关节机器人（SingleGripperRobot）
+ * 基于 ModelAbs 重构，保留 Bot.js 核心运行行为：状态灯、沿 X 移动、手臂旋转、夹具切换。
+ */
+export class SingleJointRobot extends ModelAbs {
+    static DEFAULT_WIDTH = 90;
+    static DEFAULT_HEIGHT = 76;
+    static DEFAULT_LIGHT_COLOR = '#DFC285';
+    light1 = null;
+    light2 = null;
+    defaultLightColor = SingleJointRobot.DEFAULT_LIGHT_COLOR;
+    palletStationSlot = null;
+    cutterStationSlot = null;
+    createUi() {
+        const { uuid, className, width = SingleJointRobot.DEFAULT_WIDTH, height = SingleJointRobot.DEFAULT_HEIGHT, x, y, zIndex, rotation, scale, visible, editable, draggable, currentFixture } = this.config;
+        // 创建托盘工位槽
+        this.palletStationSlot = new StationSlot({
+            index: 10,
+            x: 40,
+            y: 25,
+            width: 46,
+            height: 46,
+            hittable: this.config.hittable,
+            showContainer: false,
+            resourceType: EnumResourceType.PALLET,
+            visible: currentFixture === EnumResourceType.PALLET ? true : 0
+        }).init();
+        // 创建刀具工位槽
+        this.cutterStationSlot = new StationSlot({
+            index: 10,
+            x: 44,
+            y: 25,
+            width: 46,
+            height: 46,
+            hittable: this.config.hittable,
+            showContainer: false,
+            resourceType: EnumResourceType.TOOL,
+            visible: currentFixture === EnumResourceType.TOOL ? true : 0
+        }).init();
+        // 小摆臂
+        const smallArm = new Group({
+            hitSelf: false,
+            className: 'smallArm',
+            x: 35,
+            y: 30,
+            zIndex: 1,
+            around: {
+                type: 'percent',
+                x: 0.1,
+                y: 0.5
+            },
+            children: [
+                {
+                    hittable: false,
+                    tag: 'Box',
+                    width: 36,
+                    height: 16,
+                    stroke: 'rgba(0,0,0,0.1)',
+                    strokeWidth: 0.5,
+                    fill: {
+                        type: 'linear',
+                        stops: ['#FF6600', '#FFbb00', '#FF6600']
+                    },
+                    cornerRadius: [16, 0, 0, 16]
+                },
+                {
+                    hittable: false,
+                    className: 'smallArmJoint1',
+                    tag: 'Rect',
+                    width: 16,
+                    height: 16,
+                    fill: '#424242',
+                    cornerRadius: 16
+                },
+                {
+                    hittable: false,
+                    className: 'smallArmJoint2',
+                    tag: 'Rect',
+                    x: 36,
+                    width: 5,
+                    height: 16,
+                    fill: '#424242',
+                    cornerRadius: [0, 16, 16, 0]
+                },
+                // 夹具容器
+                {
+                    hitSelf: false,
+                    className: 'fork',
+                    tag: 'Box',
+                    x: 30,
+                    y: -17,
+                    zIndex: -1,
+                    children: [
+                        {
+                            hitSelf: false,
+                            id: 'fixture',
+                            tag: 'Box',
+                            state: currentFixture,
+                            states: {
+                                // 托盘夹具
+                                [EnumResourceType.PALLET]: {
+                                    hitSelf: false,
+                                    width: 66,
+                                    height: 50,
+                                    cornerRadius: [15, 0, 0, 15],
+                                    strokeWidth: 4,
+                                    stroke: {
+                                        type: 'linear',
+                                        from: 'left',
+                                        to: 'right',
+                                        stops: [
+                                            { offset: 0, color: '#424242' },
+                                            { offset: 0.9, color: '#000' },
+                                            { offset: 0.9, color: 'rgba(255, 0, 0, 0)' },
+                                            { offset: 1, color: 'rgba(255, 0, 0, 0)' }
+                                        ]
+                                    },
+                                    animation: {
+                                        keyframes: [
+                                            { opacity: 0, scaleX: 0 },
+                                            { opacity: 1, scaleX: 1 }
+                                        ],
+                                        duration: 0.3
+                                    }
+                                },
+                                // 刀具夹具
+                                [EnumResourceType.TOOL]: {
+                                    tag: 'Box',
+                                    width: 30,
+                                    height: 12,
+                                    y: 19,
+                                    fill: {
+                                        type: 'linear',
+                                        from: 'left',
+                                        to: 'right',
+                                        stops: [
+                                            { offset: 0, color: '#424242' },
+                                            { offset: 0.75, color: '#666' },
+                                            { offset: 0.75, color: '#424242' },
+                                            { offset: 1, color: '#424242' }
+                                        ]
+                                    },
+                                    children: [
+                                        {
+                                            className: 'cutterTip1',
+                                            tag: 'Box',
+                                            width: 6,
+                                            height: 2,
+                                            x: 24,
+                                            y: 2,
+                                            fill: '#000'
+                                        },
+                                        {
+                                            className: 'cutterTip2',
+                                            tag: 'Box',
+                                            width: 6,
+                                            height: 2,
+                                            x: 24,
+                                            y: 8,
+                                            fill: '#000'
+                                        }
+                                    ]
+                                }
+                            }
+                        },
+                        this.palletStationSlot.ui,
+                        this.cutterStationSlot.ui
+                    ]
+                }
+            ]
+        });
+        // 大摆臂
+        const bigArm = new Box({
+            hittable: false,
+            className: 'bigArm',
+            width: 50,
+            height: 30,
+            x: 35,
+            y: 30,
+            cornerRadius: [15, 3, 3, 15],
+            around: 'center',
+            fill: {
+                type: 'radial',
+                stops: [
+                    { offset: 0, color: '#FFcc00' },
+                    { offset: 1, color: '#FF6600' }
+                ]
+            },
+            shadow: {
+                color: 'rgba(0,0,0,0.5)',
+                spread: 0,
+                blur: 2
+            }
+        });
+        // 二级基座
+        const secondBase = new Box({
+            hitSelf: false,
+            className: 'secondBase',
+            width: 70,
+            height: 60,
+            x: 45,
+            y: 38,
+            cornerRadius: 10,
+            around: 'center',
+            fill: {
+                type: 'radial',
+                stops: [
+                    { offset: 0.3, color: '#FFcc00' },
+                    { offset: 1, color: '#FF6600' }
+                ]
+            },
+            shadow: {
+                color: 'rgba(0,0,0,0.5)',
+                spread: 0,
+                blur: 2
+            },
+            children: [
+                ScrewHole({ x: 10, y: 10, styleType: 'dark' }),
+                ScrewHole({ x: 62, y: 10, styleType: 'dark' }),
+                ScrewHole({ x: 62, y: 50, styleType: 'dark' }),
+                ScrewHole({ x: 10, y: 50, styleType: 'dark' }),
+                {
+                    hitSelf: false,
+                    rotation: -rotation,
+                    tag: 'Box',
+                    width: 50,
+                    height: 50,
+                    around: 'center',
+                    x: width / 2 - 10,
+                    y: height / 2 - 8,
+                    fill: '#ee6600',
+                    cornerRadius: 50,
+                    strokeWidth: 1,
+                    stroke: 'rgba(255,255,255,0.65)',
+                    children: [
+                        createShadow({
+                            width: 50,
+                            height: 50,
+                            cornerRadius: 50,
+                            shadow: null,
+                            innerShadow: [
+                                {
+                                    x: 4,
+                                    y: 2,
+                                    blur: 4,
+                                    color: 'rgba(0,0,0,0.5)'
+                                },
+                                {
+                                    x: -3,
+                                    y: -1,
+                                    blur: 3,
+                                    color: 'rgba(255, 255, 255, 0.4)'
+                                }
+                            ]
+                        })
+                    ]
+                }
+            ]
+        });
+        secondBase.add([bigArm, smallArm]);
+        // 主体
+        const main = new Box({
+            data: this.config,
+            id: uuid,
+            className,
+            x,
+            y,
+            width,
+            height,
+            around: 'center',
+            fill: '#FF9933',
+            cornerRadius: 10,
+            zIndex,
+            rotation,
+            scale,
+            visible,
+            editable,
+            draggable,
+            shadow: {
+                spread: 1,
+                blur: 4,
+                color: 'rgba(0,0,0,0.5)'
+            }
+        });
+        // 设备状态灯
+        this.light1 = new RectLight({
+            width: 30,
+            height: 4,
+            x: this.width_05,
+            y: 4,
+            color: this.defaultLightColor
+        }).init();
+        this.light2 = new RectLight({
+            width: 30,
+            height: 4,
+            x: this.width_05,
+            y: height - 4,
+            color: this.defaultLightColor
+        }).init();
+        main.add([this.light1.ui, this.light2.ui, secondBase]);
+        setCursor(main, this.config);
+        return main;
+    }
+    operating(data) {
+        if (data.light && this.light1 && this.light2) {
+            this.light1.operating(data.light);
+            this.light2.operating(data.light);
+        }
+        if (typeof data.x === 'number')
+            this.moveX(data.x);
+        if (typeof data.r === 'number')
+            this.handleRotate(data.r);
+        if (data.currentFixture)
+            this.switchFork(data.currentFixture);
+    }
+    handleRotate(r) {
+        if (!Number.isFinite(r))
+            return;
+        this.ui.findOne('.bigArm')?.animate({ rotation: -r, duration: 0.5 });
+        this.ui.findOne('.smallArm')?.animate({ rotation: r, duration: 0.5 });
+        this.ui.findOne('.secondBase')?.animate({ offsetX: Math.abs(r / 9) - 10, duration: 0.5 });
+    }
+    moveX(x) {
+        if (!Number.isFinite(x))
+            return;
+        this.ui.animate({ x, duration: 0.25 });
+    }
+    // 切换夹具类型
+    switchFork(type) {
+        if (this.palletStationSlot) {
+            this.palletStationSlot.toggleVisible(type === EnumResourceType.PALLET ? true : 0);
+        }
+        if (this.cutterStationSlot) {
+            this.cutterStationSlot.toggleVisible(type === EnumResourceType.TOOL ? true : 0);
+        }
+        this.ui.findOne('#fixture')?.set({ state: type });
+    }
+}

package/dist/ui/shapes/NamePlate.d.ts

@@ -1,3 +1,10 @@
+/**
+ * @Author : TanRui
+ * @WeChat : Tan578853789
+ * @File   : NamePlate.ts
+ * @Date   : 2026/02/12
+ * @Desc.  : 铭牌
+ */
 import { Box } from 'leafer';
 export interface NamePlateOptions {
     title: string;
@@ -9,7 +16,9 @@ export interface NamePlateOptions {
     fill?: string;
     textColor?: string;
     fontSize?: number;
+    stroke?: string;
+    strokeWidth?: number;
     screwHole?: boolean;
     zIndex?: number | string;
 }
-export declare function NamePlateUi(options: NamePlateOptions): Box;
+export declare function NamePlate(options: NamePlateOptions): Box;

package/dist/ui/shapes/NamePlate.js

@@ -0,0 +1,85 @@
+/**
+ * @Author : TanRui
+ * @WeChat : Tan578853789
+ * @File   : NamePlate.ts
+ * @Date   : 2026/02/12
+ * @Desc.  : 铭牌
+ */
+import { Box, Text } from 'leafer';
+import { ScrewHole } from './ScrewHole';
+export function NamePlate(options) {
+    const opts = {
+        x: 0,
+        y: 0,
+        width: undefined, // 显式区分是否传入
+        height: 18,
+        cornerRadius: 2,
+        fill: '#f2f2f2',
+        textColor: '#d15f2c',
+        fontSize: 14,
+        stroke: 'rgba(0,0,0,0.2)',
+        strokeWidth: 1,
+        screwHole: true,
+        zIndex: '',
+        ...options
+    };
+    // 默认宽度：按字符估算
+    const defaultWidth = Math.max(20, (opts.title.length + 2) * opts.fontSize);
+    const finalWidth = opts.width ?? defaultWidth;
+    // 文本节点配置
+    const textConfig = {
+        text: opts.title,
+        textAlign: 'center',
+        verticalAlign: 'middle',
+        fill: opts.textColor,
+        fontWeight: 'black',
+        width: finalWidth,
+        height: opts.height,
+        lineHeight: opts.height, // 行距为 0
+        wordWrap: !!opts.width, // 仅当指定了 width 时才允许换行
+        overflow: 'hide'
+    };
+    // 如果指定了 width，则使用较小字号尝试适配
+    if (opts.width !== undefined) {
+        textConfig.fontSize = Math.min(opts.fontSize, 12);
+    }
+    else {
+        textConfig.fontSize = opts.fontSize;
+    }
+    const textNode = new Text(textConfig);
+    const box = new Box({
+        hittable: false,
+        className: 'name-plate',
+        x: opts.x,
+        y: opts.y,
+        width: finalWidth,
+        height: opts.height,
+        fill: opts.fill,
+        overflow: 'hide',
+        around: 'center',
+        stroke: opts.stroke,
+        strokeWidth: opts.strokeWidth,
+        cornerRadius: opts.cornerRadius,
+        zIndex: opts.zIndex,
+        children: [textNode]
+    });
+    // 添加螺丝孔
+    if (opts.screwHole) {
+        const height_05 = opts.height / 2;
+        const holeSize = 4;
+        const leftScrew = ScrewHole({
+            x: holeSize,
+            y: height_05,
+            width: holeSize,
+            height: holeSize
+        });
+        const rightScrew = ScrewHole({
+            x: finalWidth - holeSize,
+            y: height_05,
+            width: holeSize,
+            height: holeSize
+        });
+        box.add([leftScrew, rightScrew]);
+    }
+    return box;
+}

package/dist/ui/shapes/ScrewHole.d.ts

@@ -1,3 +1,10 @@
+/**
+ * @Author : TanRui
+ * @WeChat : Tan578853789
+ * @File   : ScrewHole.ts
+ * @Date   : 2026/02/12
+ * @Desc.  : 梅花螺丝孔
+ */
 import { Box } from 'leafer';
 export type ScrewHoleStyle = 'light' | 'dark';
 export interface ScrewHoleOptions {
@@ -8,4 +15,4 @@ export interface ScrewHoleOptions {
     fill?: string;
     styleType?: ScrewHoleStyle;
 }
-export declare function ScrewHoleUi(options?: ScrewHoleOptions): Box;
+export declare function ScrewHole(options?: ScrewHoleOptions): Box;

package/dist/ui/shapes/ScrewHole.js

@@ -0,0 +1,57 @@
+/**
+ * @Author : TanRui
+ * @WeChat : Tan578853789
+ * @File   : ScrewHole.ts
+ * @Date   : 2026/02/12
+ * @Desc.  : 梅花螺丝孔
+ */
+import { Box, Star } from 'leafer';
+export function ScrewHole(options = {}) {
+    const opts = {
+        x: 0,
+        y: 0,
+        width: 5,
+        height: 5,
+        fill: '',
+        styleType: 'light',
+        ...options
+    };
+    // 根据 styleType 自动设置 fill
+    if (options.fill === undefined) {
+        opts.fill = opts.styleType === 'dark' ? '#777' : '#ccc';
+    }
+    const strokeWidth = 0.15;
+    const strokeColor = opts.styleType === 'dark' ? '#333' : '#888';
+    const screwHole = new Box({
+        hittable: false,
+        className: 'screw-hole',
+        x: opts.x,
+        y: opts.y,
+        width: opts.width,
+        height: opts.height,
+        fill: opts.fill,
+        cornerRadius: opts.width / 2,
+        stroke: strokeColor,
+        strokeWidth: strokeWidth,
+        around: 'center'
+    });
+    // 如果需要中心标记
+    const markSize = Math.min(opts.width, opts.height);
+    const width_05 = opts.width / 2;
+    const height_05 = opts.height / 2;
+    // 梅花图案
+    const torx = new Star({
+        x: width_05,
+        y: height_05,
+        width: markSize,
+        height: markSize,
+        innerRadius: 0.25,
+        corners: 5,
+        cornerRadius: 2,
+        rotation: 30,
+        fill: strokeColor,
+        around: 'center'
+    });
+    screwHole.add(torx);
+    return screwHole;
+}

package/dist/ui/shapes/Texture.d.ts

@@ -1,12 +1,21 @@
-import { Box } from 'leafer';
+/**
+ * @Author : TanRui
+ * @WeChat : Tan578853789
+ * @File   : Texture.ts
+ * @Date   : 2025/05/30
+ * @Desc.  : 纹理
+ */
+import { Box, type IFill } from 'leafer';
 export type TextureEffect = 'LightGrid' | 'DarkGrid' | 'MatrixGrid' | 'LightDot' | 'DarkDot' | 'WoodFloor' | 'VerticalBar';
 export interface ITextureOptions {
+    className?: string;
     width?: number;
     height?: number;
     effect?: TextureEffect;
     opacity?: number;
     scale?: number;
     rotation?: number;
-    cornerRadius?: number;
+    cornerRadius?: number | number[];
+    fill?: IFill;
 }
-export declare function TextureUi(options?: ITextureOptions): Box;
+export declare function Texture(options?: ITextureOptions): Box;

package/dist/ui/shapes/Texture.js

@@ -0,0 +1,51 @@
+/**
+ * @Author : TanRui
+ * @WeChat : Tan578853789
+ * @File   : Texture.ts
+ * @Date   : 2025/05/30
+ * @Desc.  : 纹理
+ */
+import { Box, Rect } from 'leafer';
+import LightGrid from '@/assets/images/texture/LightGrid.png';
+import DarkGrid from '@/assets/images/texture/DarkGrid.png';
+import MatrixGrid from '@/assets/images/texture/MatrixGrid.png';
+import LightDot from '@/assets/images/texture/LightDot.png';
+import DarkDot from '@/assets/images/texture/DarkDot.png';
+import WoodFloor from '@/assets/images/texture/WoodFloor.png';
+import VerticalBar from '@/assets/images/texture/VerticalBar.png';
+const EFFECT_MAP = {
+    LightGrid,
+    DarkGrid,
+    MatrixGrid,
+    LightDot,
+    DarkDot,
+    WoodFloor,
+    VerticalBar
+};
+export function Texture(options = {}) {
+    const { className = 'Texture', width = 0, height = 0, effect = 'LightGrid', opacity = 1, scale = 0.02, rotation = 0, cornerRadius = 0, fill } = options;
+    return new Box({
+        hittable: false,
+        className,
+        width,
+        height,
+        fill,
+        cornerRadius,
+        overflow: 'hide',
+        children: [
+            new Rect({
+                className: 'Texture-Image',
+                width,
+                height,
+                opacity,
+                fill: {
+                    type: 'image',
+                    url: EFFECT_MAP[effect],
+                    mode: 'repeat',
+                    scale,
+                    rotation
+                }
+            })
+        ]
+    });
+}

package/dist/ui/utils/attr.d.ts

@@ -1,9 +1,16 @@
-import { UI } from 'leafer';
-import { IInteractiveState, IEventState } from '../../types';
+/**
+ * @Author : TanRui
+ * @WeChat : Tan578853789
+ * @File   : attr.ts
+ * @Date   : 2026/04/07
+ * @Desc.  : 修改属性的工具函数
+ */
+import { type UI } from 'leafer';
+import type { IInteractiveState, IEventState } from '@/types';
 /**
  * 根据交互属性设置鼠标样式和 hover 效果
  * @param target UI 目标对象
  * @param data 交互属性数据
- * @param type 效果类型，默认为 'shadow'，可选 'border'
+ * @param type 效果类型，默认为 'shadow'，可选 'border'('border' 特别适用于 overflow: 'hidden' 的容器)
  */
 export declare function setCursor(target: UI, data: IInteractiveState & IEventState, type?: 'shadow' | 'border'): void;

package/dist/ui/utils/attr.js

@@ -0,0 +1,50 @@
+/**
+ * @Author : TanRui
+ * @WeChat : Tan578853789
+ * @File   : attr.ts
+ * @Date   : 2026/04/07
+ * @Desc.  : 修改属性的工具函数
+ */
+import {} from 'leafer';
+/**
+ * 根据交互属性设置鼠标样式和 hover 效果
+ * @param target UI 目标对象
+ * @param data 交互属性数据
+ * @param type 效果类型，默认为 'shadow'，可选 'border'('border' 特别适用于 overflow: 'hidden' 的容器)
+ */
+export function setCursor(target, data, type = 'shadow') {
+    if (data.hittable && data.hitSelf && (data.clickable || data.menuClickable || data.draggable)) {
+        let cursor = 'default';
+        const color = '#806EF7';
+        if (data.clickable) {
+            cursor = 'pointer';
+        }
+        else if (data.menuClickable) {
+            cursor = 'context-menu';
+        }
+        else if (data.draggable) {
+            cursor = 'move';
+        }
+        if (type === 'shadow') {
+            target.set({
+                cursor,
+                hoverStyle: {
+                    shadow: {
+                        spread: 2,
+                        blur: 2,
+                        color
+                    }
+                }
+            });
+        }
+        else if (type === 'border') {
+            target.set({
+                cursor,
+                hoverStyle: {
+                    stroke: color,
+                    strokeWidth: 3
+                }
+            });
+        }
+    }
+}