@jnrs/lingshu-smart 2.2.6 → 2.2.8

package/dist/components/preview/index.vue.d.ts

@@ -1,4 +1,4 @@
-import { ICase, ILayer, ILayerOperating, InteractiveUi } from '../../types';
+import type { ICase, ILayer, ILayerOperating, InteractiveUi } from '@/types';
 export interface PreviewActions {
     /**
      * 加载案例列表
@@ -28,10 +28,11 @@ type __VLS_Props = {
      */
     caseUuid?: string;
 };
-declare const _default: import('vue').DefineComponent<__VLS_Props, {
-    currentCase: import('vue').Ref<ICase | null | undefined, ICase | null | undefined>;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {
+    currentCase: import("vue").Ref<ICase | null | undefined, ICase | null | undefined>;
     operating: (data: ILayerOperating) => void;
-}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
     actions: PreviewActions;
-}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
 export default _default;

package/dist/components/preview/index.vue.js

@@ -0,0 +1,104 @@
+import { vLoading } from 'element-plus';
+import { onMounted, onUnmounted, watch } from 'vue';
+import { storeToRefs } from 'pinia';
+import { debounce } from '@jnrs/shared/lodash';
+import { useDataStore, useAppStore } from '@/stores';
+const sharedStore = useDataStore();
+const previewStore = useAppStore();
+const { casesLoading, cases } = storeToRefs(sharedStore);
+const { updateCases } = sharedStore;
+const { currentCase } = storeToRefs(previewStore);
+const { initContainer, resizeContainer, destroyContainer, operating } = previewStore;
+const props = withDefaults(defineProps(), {
+    actions: () => ({})
+});
+// 加载 cases 数据
+const handleLoadCases = async () => {
+    if (!props.actions.loadCases) {
+        console.warn('加载 cases 数据失败，请先配置 loadCases 方法');
+        return false;
+    }
+    casesLoading.value = true;
+    try {
+        const res = await props.actions.loadCases();
+        updateCases(res);
+    }
+    catch (error) {
+        console.error('loadCases:', error);
+    }
+    finally {
+        casesLoading.value = false;
+    }
+};
+// 重置窗口大小
+const resize = debounce(() => {
+    resizeContainer();
+}, 500);
+watch(() => props.caseUuid, async (caseUuid) => {
+    if (caseUuid) {
+        // 先获取 sharedStore 内的方案列表数据，没有的话就进行获取
+        if (!cases.value || cases.value.length === 0) {
+            await handleLoadCases();
+        }
+        initContainer({
+            appDomId: 'lingshu-smart-previewApp',
+            appEditable: false,
+            actions: {
+                onTap: props.actions.onTap,
+                onMenuTap: props.actions.onMenuTap,
+                onDragEnd: props.actions.onDragEnd
+            }
+        }, caseUuid);
+    }
+}, { immediate: false });
+onMounted(async () => {
+    window.addEventListener('resize', resize);
+});
+onUnmounted(() => {
+    destroyContainer();
+    window.removeEventListener('resize', resize);
+});
+const __VLS_exposed = {
+    currentCase,
+    operating
+};
+defineExpose(__VLS_exposed);
+debugger; /* PartiallyEnd: #3632/scriptSetup.vue */
+const __VLS_defaults = {
+    actions: () => ({})
+};
+const __VLS_ctx = {
+    ...{},
+    ...{},
+    ...{},
+    ...{},
+};
+let __VLS_components;
+let __VLS_directives;
+__VLS_asFunctionalElement(__VLS_intrinsics.div, __VLS_intrinsics.div)({
+    ...{ class: "lingshu-smart" },
+    'element-loading-background': "rgba(0, 0, 0, 0.5)",
+    'element-loading-text': "方案加载中",
+});
+__VLS_asFunctionalDirective(__VLS_directives.vLoading)(null, { ...__VLS_directiveBindingRestFields, value: (__VLS_ctx.casesLoading) }, null, null);
+// @ts-ignore
+[vLoading, casesLoading,];
+__VLS_asFunctionalElement(__VLS_intrinsics.canvas, __VLS_intrinsics.canvas)({
+    id: "lingshu-smart-previewApp",
+});
+if (!__VLS_ctx.currentCase) {
+    // @ts-ignore
+    [currentCase,];
+    __VLS_asFunctionalElement(__VLS_intrinsics.div, __VLS_intrinsics.div)({
+        ...{ class: "preset" },
+    });
+    __VLS_asFunctionalElement(__VLS_intrinsics.i, __VLS_intrinsics.i)({});
+}
+/** @type {__VLS_StyleScopedClasses['lingshu-smart']} */ ;
+/** @type {__VLS_StyleScopedClasses['preset']} */ ;
+const __VLS_export = (await import('vue')).defineComponent({
+    setup: () => (__VLS_exposed),
+    __typeProps: {},
+    props: {},
+});
+export default {};

package/dist/composables/useStepRecord.d.ts

@@ -1,19 +1,27 @@
-import { EnumStepType } from '../types';
+/**
+ * @Author : TanRui
+ * @WeChat : Tan578853789
+ * @File   : useStepRecord.ts
+ * @Date   : 2026/03/05
+ * @Desc.  : 编辑操作记录 Hook (撤销/重做 + 跳转任意历史点)
+ *           TODO: 未来可迁移至 IndexedDB 以支持持久化
+ */
+import { EnumStepType } from '@/types';
 interface OperationRecordItem {
     hash: string;
     data: string;
 }
 export declare function useStepRecord(): {
     MAX_OPERATION_RECORD_LENGTH: number;
-    operationRecord: import('vue').Ref<{
+    operationRecord: import("vue").Ref<{
         hash: string;
         data: string;
     }[], OperationRecordItem[] | {
         hash: string;
         data: string;
     }[]>;
-    currentOperationRecordIndex: import('vue').Ref<number, number>;
-    operationRecordStatus: import('vue').ComputedRef<{
+    currentOperationRecordIndex: import("vue").Ref<number, number>;
+    operationRecordStatus: import("vue").ComputedRef<{
         canUndo: boolean;
         canRedo: boolean;
         totalSteps: number;

package/dist/composables/useStepRecord.js

@@ -0,0 +1,135 @@
+/**
+ * @Author : TanRui
+ * @WeChat : Tan578853789
+ * @File   : useStepRecord.ts
+ * @Date   : 2026/03/05
+ * @Desc.  : 编辑操作记录 Hook (撤销/重做 + 跳转任意历史点)
+ *           TODO: 未来可迁移至 IndexedDB 以支持持久化
+ */
+import { EnumStepType } from '@/types';
+import { storeToRefs } from 'pinia';
+import { ref, computed, watch, nextTick } from 'vue';
+import { debounce, cloneDeep } from '@jnrs/shared/lodash';
+import objectHash from 'object-hash';
+import { useDataStore } from '@/stores';
+const MAX_OPERATION_RECORD_LENGTH = 10;
+export function useStepRecord() {
+    const sharedStore = useDataStore();
+    const { cases } = storeToRefs(sharedStore);
+    const { updateCases } = sharedStore;
+    const operationRecord = ref([]);
+    const currentOperationRecordIndex = ref(-1);
+    const isRecordingLocked = ref(false);
+    const operationRecordStatus = computed(() => {
+        const len = operationRecord.value.length;
+        return {
+            canUndo: currentOperationRecordIndex.value > 0,
+            canRedo: currentOperationRecordIndex.value < len - 1,
+            totalSteps: len,
+            currentIndex: currentOperationRecordIndex.value
+        };
+    });
+    const recordOperation = debounce((caseData, hash) => {
+        if (!caseData || !hash)
+            return;
+        const caseDataString = JSON.stringify(caseData);
+        const currentLen = operationRecord.value.length;
+        if (currentOperationRecordIndex.value === currentLen - 1) {
+            if (currentLen >= MAX_OPERATION_RECORD_LENGTH) {
+                operationRecord.value.shift();
+                // 如果移除了最旧项，索引需同步调整（但此时在末尾，不影响）
+            }
+            if (currentLen > 0 && operationRecord.value[currentLen - 1]?.hash === hash) {
+                return;
+            }
+            operationRecord.value.push({ hash, data: caseDataString });
+            currentOperationRecordIndex.value = operationRecord.value.length - 1;
+        }
+        else {
+            // 在历史中间操作：截断后续
+            operationRecord.value.splice(currentOperationRecordIndex.value + 1);
+            operationRecord.value.push({ hash, data: caseDataString });
+            currentOperationRecordIndex.value = operationRecord.value.length - 1;
+        }
+    }, 300);
+    const applyStateFromIndex = (index) => {
+        const record = operationRecord.value[index];
+        try {
+            const caseData = JSON.parse(record.data);
+            updateCases(caseData);
+        }
+        catch (e) {
+            console.error('Failed to parse step record', e);
+        }
+    };
+    const handleOperationRecordChange = (type) => {
+        const { canUndo, canRedo } = operationRecordStatus.value;
+        if (type === EnumStepType.UNDO && !canUndo)
+            return;
+        if (type === EnumStepType.REDO && !canRedo)
+            return;
+        isRecordingLocked.value = true;
+        if (type === EnumStepType.UNDO) {
+            currentOperationRecordIndex.value -= 1;
+        }
+        else if (type === EnumStepType.REDO) {
+            currentOperationRecordIndex.value += 1;
+        }
+        applyStateFromIndex(currentOperationRecordIndex.value);
+        nextTick(() => {
+            isRecordingLocked.value = false;
+        });
+    };
+    /**
+     * 跳转到任意历史步骤（不修改历史记录，仅切换状态）
+     * @param index 目标历史索引（0-based）
+     */
+    const jumpToStep = (index) => {
+        const len = operationRecord.value.length;
+        if (len === 0 || index < 0 || index >= len) {
+            return;
+        }
+        // 加锁，防止触发 watch 记录
+        isRecordingLocked.value = true;
+        currentOperationRecordIndex.value = index;
+        applyStateFromIndex(index);
+        nextTick(() => {
+            isRecordingLocked.value = false;
+        });
+    };
+    const resetFlags = (data) => {
+        if (!Array.isArray(data))
+            return;
+        data.forEach((item) => {
+            if (item && typeof item === 'object') {
+                if (Array.isArray(item.layers)) {
+                    item.layers.forEach((layer) => {
+                        if (layer && typeof layer === 'object') {
+                            layer.selected = false;
+                        }
+                    });
+                }
+            }
+        });
+    };
+    watch(cases, (nv) => {
+        if (isRecordingLocked.value || !nv)
+            return;
+        const nvClone = cloneDeep(nv);
+        resetFlags(nvClone);
+        const casesNvHash = objectHash(nvClone);
+        const currentRecord = currentOperationRecordIndex.value >= 0 ? operationRecord.value[currentOperationRecordIndex.value] : null;
+        if (currentRecord && currentRecord.hash === casesNvHash) {
+            return;
+        }
+        recordOperation(nvClone, casesNvHash);
+    }, { deep: true, immediate: true });
+    return {
+        MAX_OPERATION_RECORD_LENGTH,
+        operationRecord,
+        currentOperationRecordIndex,
+        operationRecordStatus,
+        handleOperationRecordChange,
+        jumpToStep
+    };
+}

package/dist/constants/options.d.ts

@@ -1,4 +1,11 @@
-import { ICase, IModel } from '../types';
+/**
+ * @Author : TanRui
+ * @WeChat : Tan578853789
+ * @File   : options.ts
+ * @Date   : 2026/01/21
+ * @Desc.  : 编辑页面的初始值配置
+ */
+import type { ICase, IModel } from '@/types';
 /**
  * 新方案默认值
  */

package/dist/constants/options.js

@@ -0,0 +1,55 @@
+/**
+ * @Author : TanRui
+ * @WeChat : Tan578853789
+ * @File   : options.ts
+ * @Date   : 2026/01/21
+ * @Desc.  : 编辑页面的初始值配置
+ */
+/**
+ * 新方案默认值
+ */
+export const CASE_INIT = {
+    uuid: '',
+    title: '',
+    isActive: false,
+    layers: [],
+    scene: {
+        width: 1920,
+        height: 1080,
+        zoomType: 'fit',
+        fill: {
+            type: 'solid',
+            color: '#000',
+            opacity: 1,
+            stops: []
+        },
+        texture: ''
+    }
+};
+/**
+ * 新图层默认值
+ */
+export const DEFAULT_LAYER = {
+    rawData: {
+        id: ''
+    },
+    uuid: '',
+    equipmentName: '',
+    width: 0,
+    height: 0,
+    x: 0,
+    y: 0,
+    percentX: 0,
+    percentY: 0,
+    rotation: 0,
+    scale: 1,
+    zIndex: 1,
+    // 交互状态
+    visible: true,
+    clickable: true,
+    menuClickable: true,
+    draggable: false,
+    // 编辑状态
+    editable: true,
+    selected: false
+};

package/dist/controller/AppController.d.ts

@@ -1,4 +1,11 @@
-import { IScene, ILayer, IContainer, ILayerOperating } from '../types';
+/**
+ * @Author : TanRui
+ * @WeChat : Tan578853789
+ * @File   : AppController.ts
+ * @Date   : 2026/02/05
+ * @Desc.  : 主画布、模型容器控制器
+ */
+import type { IScene, ILayer, IContainer, ILayerOperating } from '@/types';
 import { App } from 'leafer';
 export declare class AppController {
     app: App;
@@ -12,8 +19,8 @@ export declare class AppController {
     destroy(): void;
     setZoom(zoomType?: 'fit' | number, duration?: number): void;
     setTree(data?: IScene): void;
-    findAll(condition: string): import('leafer').IUI[];
-    findOne(condition: string): import('leafer').IUI | undefined;
+    findAll(condition: string): import("leafer").IUI[];
+    findOne(condition: string): import("leafer").IUI | undefined;
     removeOne(condition: string): void;
     clearAll(): void;
     removeModelById(uuid: string): void;

package/dist/controller/AppController.js

@@ -0,0 +1,168 @@
+/**
+ * @Author : TanRui
+ * @WeChat : Tan578853789
+ * @File   : AppController.ts
+ * @Date   : 2026/02/05
+ * @Desc.  : 主画布、模型容器控制器
+ */
+import { createModel } from '@/ui/factories/createModel';
+import { App, Box } from 'leafer';
+const INIT_TREE_CONFIG = {
+    width: window.innerWidth,
+    height: window.innerHeight,
+    fill: undefined,
+    zoomType: 'fit'
+};
+export class AppController {
+    app;
+    treeBoxUI = null; // 主容器
+    modelsMap; // 模型容器映射，key 为 uuid，value 为模型实例
+    businessMap; // 业务模型映射，key 为 `${className}_${businessId}`，value 为模型实例
+    appEditable; // 是否可编辑
+    actions; // 事件处理
+    constructor(options = {}) {
+        const { appDomId, autoStart = true, appEditable = false, actions = {} } = options;
+        this.appEditable = appEditable;
+        this.actions = actions;
+        this.app = new App({
+            view: appDomId || window,
+            start: autoStart,
+            ground: {},
+            tree: { type: appEditable ? 'design' : 'game' },
+            editor: appEditable ? {} : undefined,
+            maxFPS: 60,
+            fill: '#424242',
+            pointer: {
+                preventDefault: true,
+                preventDefaultMenu: true
+            }
+        });
+        const treeBoxUI = new Box({
+            ...INIT_TREE_CONFIG,
+            id: 'treeBoxUI',
+            stroke: appEditable ? { type: 'solid', color: 'rgb(242, 195, 79)' } : null
+        });
+        this.treeBoxUI = treeBoxUI;
+        this.app.tree.add(treeBoxUI);
+        this.modelsMap = new Map();
+        this.businessMap = new Map();
+        this.setZoom();
+    }
+    // 启动/重启引擎
+    start() {
+        this.app.start();
+    }
+    // 销毁引擎，默认采用异步销毁，不会立即执行
+    destroy() {
+        this.clearAll();
+        this.app.destroy();
+    }
+    // 控制视图的缩放
+    setZoom(zoomType = 'fit', duration = 0.5) {
+        requestAnimationFrame(() => {
+            if (zoomType === 'fit') {
+                const padding = this.appEditable ? [30, 10, 10, 30] : 0;
+                this.app.tree.zoom('fit', padding, false, duration);
+            }
+            else {
+                this.app.tree.zoom(zoomType, 0, false, duration);
+            }
+        });
+    }
+    // 修改 tree 配置，不传参数则重置为默认配置
+    setTree(data) {
+        if (data) {
+            this.treeBoxUI?.set({
+                width: data.width,
+                height: data.height,
+                fill: data.fill
+            });
+            this.setZoom(data.zoomType);
+        }
+        else {
+            this.setTree(INIT_TREE_CONFIG);
+            this.setZoom();
+        }
+    }
+    // tree 层查找元素，返回数组
+    findAll(condition) {
+        return this.treeBoxUI?.find(condition) || [];
+    }
+    // tree 层查找一个元素，返回匹配到的第一个元素
+    findOne(condition) {
+        return this.treeBoxUI?.findOne(condition);
+    }
+    // tree 层移除指定的子元素
+    removeOne(condition) {
+        this.treeBoxUI?.remove(condition);
+    }
+    // tree 层清空所有元素（移除 + 销毁）
+    clearAll() {
+        this.modelsMap.clear();
+        this.businessMap.clear();
+        this.treeBoxUI?.clear();
+    }
+    // 根据 uuid 移除模型
+    removeModelById(uuid) {
+        const model = this.modelsMap.get(uuid);
+        if (model) {
+            model.destroyUI();
+            this.modelsMap.delete(uuid);
+            const businessId = model.config.rawData?.id;
+            if (businessId) {
+                this.businessMap.delete(businessId);
+            }
+        }
+    }
+    // 根据类型和配置添加模型
+    addModel(modelConfig) {
+        const model = createModel(modelConfig);
+        // 存储模型绑定事件
+        if (this.actions) {
+            model.init().setEventHandler({
+                onTap: (layer, data) => {
+                    this.actions.onTap?.(layer, data);
+                },
+                onMenuTap: (layer, e) => {
+                    this.actions.onMenuTap?.(layer, e);
+                },
+                onDragEnd: (layer, e) => {
+                    this.actions.onDragEnd?.(layer, e);
+                }
+            });
+        }
+        // 添加到树
+        if (this.treeBoxUI && model.ui) {
+            this.treeBoxUI.add(model.ui);
+        }
+        const uuid = modelConfig.uuid;
+        const businessId = modelConfig.rawData?.id;
+        // 存储模型引用
+        if (uuid) {
+            this.modelsMap.set(uuid, model);
+        }
+        // 存储业务模型引用
+        if (businessId) {
+            this.businessMap.set(`${modelConfig.className}_${businessId}`, model);
+        }
+    }
+    // 移除并重新添加模型
+    rerenderModel(modelConfig) {
+        if (modelConfig.uuid) {
+            this.removeModelById(modelConfig.uuid);
+        }
+        this.addModel(modelConfig);
+    }
+    // 模型操作
+    operating(data) {
+        const layer = this.businessMap.get(`${data.className}_${data.id}`);
+        if (!layer) {
+            console.warn('模型操作失败: 模型未匹配到', {
+                className: data.className,
+                id: data.id
+            });
+            return;
+        }
+        layer.handleOperation(data);
+    }
+}

package/dist/controller/EditorController.d.ts

@@ -1,5 +1,12 @@
-import { ILayer } from '../types';
-import { AppController } from './AppController';
+/**
+ * @Author : TanRui
+ * @WeChat : Tan578853789
+ * @File   : EditorController.ts
+ * @Date   : 2025/02/26
+ * @Desc.  : 图形编辑类
+ */
+import type { ILayer } from '@/types';
+import type { AppController } from './AppController';
 interface EditorOptions {
     container: AppController;
     zoomMin?: number;