提交代码

src/components/mt-edit/composables/index.ts

@@ -0,0 +1,160 @@
+import type { IExportDoneJson, IExportJson } from '../components/types'
+import { leftAsideStore } from '../store/left-aside'
+import type {
+    IDoneJson,
+    IGlobalStoreCanvasCfg,
+    IGlobalStoreGridCfg,
+    ILeftAsideConfigItem,
+    ILeftAsideConfigItemPublicProps
+} from '../store/types'
+import { objectDeepClone } from '../utils'
+
+export const genExportJson = (
+    canvasCfg: IGlobalStoreCanvasCfg,
+    gridCfg: IGlobalStoreGridCfg,
+    doneJson: IDoneJson[]
+) => {
+    // 先创建原始的 export_done_json
+    let export_done_json: IExportDoneJson[] = []
+    export_done_json = objectDeepClone<IDoneJson[]>(doneJson).map(m => {
+        if (m.symbol) {
+            delete m.symbol
+        }
+        let new_props = {}
+        for (const key in m.props) {
+            new_props = { ...new_props, ...{ [key]: m.props[key].val } }
+        }
+        return {
+            ...m,
+            props: new_props,
+            active: false
+        }
+    })
+
+    // const list = [
+    //     'c53cccb8c65201c192d8c57fbdb4d993-RdNsoqHYOZ',
+    //     'c53cccb8c65201c192d8c57fbdb4d993-O4jAyCBz1A',
+    //     'c53cccb8c65201c192d8c57fbdb4d993-XBd70oZ3kH'
+    // ]
+
+    // const message = [
+    //     { id: 'c53cccb8c65201c192d8c57fbdb4d993-RdNsoqHYOZ', text: '发生时刻:2023-07-05 12:00:00' },
+    //     { id: 'c53cccb8c65201c192d8c57fbdb4d993-O4jAyCBz1A', text: '传输中1111......' },
+    //     { id: 'c53cccb8c65201c192d8c57fbdb4d993-XBd70oZ3kH', text: '发生时刻:2023-07-06 14:20:00' }
+    // ]
+
+    // 查找传输设备图元并添加文字图元
+    // const transportDevices = export_done_json.filter(item =>
+    //     // 假设传输设备有特定的标识，比如ID包含特定关键词或type为特定值
+    //     // item.title?.includes('传输')
+    //     // list.some(id => item.id?.includes(id))
+    //     list.includes(item.id)
+    // )
+
+    // 为每个传输设备添加旁边的文字图元
+    const textElementsToAdd: IExportDoneJson[] = []
+
+    // 先删除旧图元
+    // 用于存储需要移除的旧文本图元的 ID
+    const idsToRemove: string[] = []
+
+    // transportDevices.forEach((device, index) => {
+    //     // 构造预期的旧文本图元 ID 模式 (基于设备 ID)
+    //     const expectedIdPrefix = `auto-text-${device.id}-`
+
+    //     // 查找所有与当前设备关联的现有文本图元
+    //     const existingTextElements = export_done_json.filter(item => item.id?.startsWith(expectedIdPrefix))
+
+    //     // 将这些旧图元的 ID 添加到待删除列表
+    //     idsToRemove.push(...existingTextElements.map(item => item.id!))
+
+    //     // 获取对应的消息文本
+    //     const deviceMessage = message.find(m => m.id === device.id)?.text || '默认提示信息'
+
+    //     // 创建新的文本图元
+    //     const textElement: IExportDoneJson = {
+    //         id: `auto-text-${device.id}-${index}`, // 使用时间戳确保唯一性
+    //         title: '动态文字',
+    //         type: 'vue',
+    //         tag: 'text-vue',
+    //         props: {
+    //             text: deviceMessage || '默认提示信息', // 添加安全检查
+    //             fontFamily: '黑体',
+    //             fontSize: 14,
+    //             fill: 'red',
+    //             vertical: false
+    //         },
+    //         common_animations: {
+    //             val: '',
+    //             delay: 'delay-0s',
+    //             speed: 'slow',
+    //             repeat: 'infinite'
+    //         },
+    //         binfo: {
+    //             left: (device.binfo?.left || 0) + (device.binfo?.width || 0) + 10,
+    //             top: (device.binfo?.top || 0) + (device.binfo?.height || 0) / 2 - 10 + (index % 2 === 0 ? 20 : -20), // 偶数下移20px，奇数上移20px
+    //             width: 200,
+    //             height: 50,
+    //             angle: 0
+    //         },
+    //         resize: true,
+    //         rotate: true,
+    //         lock: false,
+    //         active: false,
+    //         hide: false,
+    //         UIDName: '',
+    //         events: []
+    //     }
+    //     textElementsToAdd.push(textElement)
+    // })
+
+    // // 从 export_done_json 中移除旧的文本图元
+    // export_done_json = export_done_json.filter(item => !idsToRemove.includes(item.id!))
+
+    // // 合并原始图元和新增的文字图元
+    // export_done_json = [...export_done_json, ...textElementsToAdd]
+
+    const exportJson: IExportJson = {
+        canvasCfg,
+        gridCfg,
+        json: export_done_json
+    }
+    return { exportJson }
+}
+export const useExportJsonToDoneJson = (json: IExportJson) => {
+    // 取出所有图形的初始配置
+    let init_configs: ILeftAsideConfigItem[] = []
+    for (const iterator of leftAsideStore.config.values()) {
+        if (iterator.length > 0) {
+            init_configs = [...init_configs, ...iterator]
+        }
+    }
+    const importDoneJson: IDoneJson[] = json.json.map(m => {
+        let props: ILeftAsideConfigItemPublicProps = {}
+        let symbol = undefined
+        // 找到原始的props
+        const find_item = init_configs.find(f => f?.id == m.tag)
+        const find_props = find_item?.props
+        if (find_props) {
+            props = { ...props, ...objectDeepClone(find_props) }
+        }
+        for (const key in m.props) {
+            if (props[key] !== undefined) {
+                props[key].val = m.props[key]
+            }
+        }
+        if (find_item?.symbol) {
+            symbol = find_item.symbol
+        }
+        return {
+            ...m,
+            props,
+            symbol
+        }
+    })
+    return {
+        canvasCfg: json.canvasCfg,
+        gridCfg: json.gridCfg,
+        importDoneJson
+    }
+}