caddemo

src/assets/ZwCloud2DSDK/ZwCloud2D.d.ts

@@ -0,0 +1,122 @@
+declare class Zw2DCloud {
+    /**
+     * Zw2DCloud 构造函数 传入一个div元素
+     * @param container 容器，一个div元素
+     */
+    constructor(container: HTMLDivElement)
+
+    /**
+     * 设置面板的属性：位置、大小等
+     * @param pageConfig 配置对象，详细信息请参考文档
+     */
+    ZwSetPageConfig(pageConfig: config): void
+
+    /**
+     * 进入图纸，可调用加载默认布局数据
+     * @param data lmf数据
+     */
+    ZwLoadDwgData(data: ArrayBuffer): void
+
+    /**
+     * 切换布局时，加载对应布局数据
+     * @param data lmf数据
+     */
+    ZwLoadLayoutData(data: ArrayBuffer): void
+
+    /**
+     * 设置布局信息
+     * @param info 布局信息的数组
+     */
+    ZwSetLayoutInfo(info: Array<{
+        handleId: number,
+        isDefault: 0 | 1,
+        layoutName: string,
+        order: number
+    }>): void
+
+    /**
+     * 传递图纸相关字体数据
+     * @param fontDatas 字体数据的数组
+     */
+    ZwSetFontDataList(fontDatas: Array<{
+        fontName: string,
+        fontData: ArrayBuffer
+    }>): void
+
+    /**
+     * 设置蒙版loading状态
+     * @param isLoading 布尔值，loading状态
+     */
+    ZwSetLoadingState(isLoading: boolean): void
+
+    /**
+     * 设置图纸内部图片数据
+     * @param imageDatas 图片数据的数组
+     */
+    ZwLoadImageData(imageDatas: Array<{
+        path: string,
+        data: ArrayBuffer
+    }>): void
+
+    /**
+     * 内部打印触发事件
+     * @param logInfo 打印事件抛出的信息
+     */
+    ZwEvtLogInfo(logInfo: {
+        type: 'Logger',
+        data: string
+    }): void
+
+    /**
+     * 切换布局触发的事件
+     * @param handleId 切换布局内部抛出的布局handleId
+     */
+    ZwEvtChangeLayout(handleId: number): void
+}
+
+type config = {
+    top?: number,
+    bottom?: number,
+    left?: number,
+    right?: number,
+
+    layerPanel?: {
+        WindowOrient?: "left"|"right"|"top"|"bottom",
+        WindowVisible?: "hide"|"show",
+        index?: number,
+        xval?: number,
+        yval?: number,
+        width?: number,
+        height?: number,
+        showPosition?: Array<"left" | "right" | "top" | "bottom">
+    },
+    xrefPanel?: {
+        WindowOrient?: "left" | "right" | "top" | "bottom",
+        WindowVisible?: "hide" | "show",
+        index?: number,
+        xval?: number,
+        yval?: number,
+        width?: number,
+        height?: number,
+        showPosition?: Array<"left" | "right" | "top" | "bottom">
+    },
+
+    commandPanel?: {
+        WindowOrient?: "left" | "right" | "top" | "bottom",
+        WindowVisible?: "hide" | "show",
+        index?: number,
+        xval?: number,
+        yval?: number,
+        width?: number,
+        height?: number,
+        showPosition?: Array<"left" | "right" | "top" | "bottom">
+    },
+    options?: {
+        usingWebGL?: boolean,
+        justShowTextBorder?: boolean,
+        zoomBreak?: boolean,
+        zoomNoHatch?: boolean,
+        cursorNotShow?: boolean,
+        cursorSize?: number,
+    }
+}

src/assets/ZwCloud2DSDK/ZwCloud2DPrivateAPI.js

@@ -0,0 +1,281 @@
+let baseUrl = 'http://192.168.51.174:5199'
+let wsUrl = ''
+let dwgPath = ''
+
+class Request {
+    constructor() {
+    }
+
+    get(url, params, resType) {
+        return new Promise((res, rej) => {
+            let paramsArr = []
+            for (let k in params) {
+                paramsArr.push(encodeURIComponent(k) + '=' + encodeURIComponent(params[k]))
+            }
+            url = url + '?' + paramsArr.join('&')
+            let ajax = new XMLHttpRequest()
+            ajax.open('GET', baseUrl + url)
+            resType && (ajax.responseType = resType)
+            ajax.send()
+            ajax.onload = function () {
+                if (resType) res(ajax.response)
+                else {
+                    let data = JSON.parse(ajax.response)
+                    if (data.code === 0) {
+                        res(data.data)
+                    }else{
+                        rej(data.msg)
+                    }
+                }
+            }
+        })
+    }
+
+    post(url, params, resType) {
+        return new Promise((res, rej) => {
+            let ajax = new XMLHttpRequest()
+            ajax.open('POST', baseUrl + url)
+            resType && (ajax.responseType = resType)
+            ajax.setRequestHeader('content-type', 'application/json')
+            ajax.send(params)
+            ajax.onreadystatechange = function () {
+                if (ajax.readyState === 4) {
+                    if (ajax.status === 200) {
+                        res(ajax.response)
+                    } else {
+                        rej()
+                    }
+                }
+            }
+        })
+    }
+
+    arrayBufferToBase64(buffer) {
+        let binary = '';
+        let bytes = new Uint8Array(buffer);
+        let len = bytes.byteLength;
+        for (let i = 0; i < len; i++) {
+            binary += String.fromCharCode(bytes[i]);
+        }
+        return btoa(binary);
+    }
+
+    fontDownload(fontName) {
+        return this.get('/sdk/font/download', { fontName }, 'blob')
+    }
+
+    transferDoc() {
+        return this.get('/sdk/transfer', { projectId: 0, dwgPath: dwgPath })
+    }
+
+    getDisplayData(handleId = 34) {
+        return this.get('/sdk/layout/lmf', { projectId: 0, handleId, dwgPath: dwgPath }, 'arraybuffer')
+    }
+
+    getXrefData(handleId, xrefIds) {
+        let params = { handleId: handleId, xrefIds: xrefIds, dwgPath: dwgPath }
+        params = JSON.stringify(params)
+        return this.post('/sdk/xref', params, 'arraybuffer')
+    }
+
+    getXrefRelation() {
+        return this.get('/sdk/xref/list', { dwgPath: dwgPath })
+    }
+
+    getXrefThumb(filePath) {
+        return this.get('/sdk/xref/thumb', { filePath: filePath }, 'arraybuffer').then(res => {
+            let url = this.arrayBufferToBase64(res);
+            return 'data:image/jpeg;base64,' + url;
+        })
+    }
+    getPlotData(params) {
+        let data = JSON.stringify(params)
+        return this.post('/sdk/print', data, 'arraybuffer')
+    }
+    getImageSrc(filePath) {
+        return this.get('/sdk/image/download', { filePath: filePath }, 'arraybuffer').then(res => {
+            let url = this.arrayBufferToBase64(res);
+            return 'data:image/jpeg;base64,' + url;
+        })
+    }
+    getImageData(filePath) {
+        return this.get('/sdk/image/download', { filePath: filePath }, 'arraybuffer')
+    }
+    getImageList() {
+        return this.get('/sdk/image/list')
+    }
+    getPermissionList() {
+        return this.get('/sdk/getStatus')
+    }
+    getRegenData(params) {
+        Object.assign(params, { dwgPath: dwgPath })
+        let data = JSON.stringify(params)
+        return this.post('/sdk/regen', data, 'arraybuffer')
+    }
+}
+
+ZwCloud2D.ZwDataProcessor.ZwSetConnectUrl = (url1, url2) => {
+    baseUrl = url1;
+    wsUrl = url2
+}
+ZwCloud2D.ZwDataProcessor.ZwSetLoadDwg = (path) => {
+    dwgPath = path;
+}
+
+ZwCloud2D.ZwDataProcessor.ZwLoad = () => {
+
+    let docId = new Date().getTime().toString();
+    let req = new Request();
+
+    // 切换布局时候触发回调
+    ZwCloud2D.ZwMessageCallback.ZwEvtChangeLayout = layout => {
+        req.getDisplayData(layout.handleId).then((data) => {
+            let timestamp = new Date().getTime()
+            ZwCloud2D.ZwDataManager.ZwSetDwgData(layout.handleId, data, timestamp)
+        }).catch(error=>{
+            console.error(error)
+        });
+    };
+    ZwCloud2D.ZwMessageCallback.ZwEvtLoadXrefData = data => {
+        req.getXrefData(data.handleId, data.xrefIds).then(res => {
+            ZwCloud2D.ZwDataManager.ZwSetXrefData(res);
+        }).catch(() => {
+            ZwCloud2D.ZwDataManager.ZwSetXrefData();
+        })
+    };
+    ZwCloud2D.ZwMessageCallback.ZwEvtDrawEnd = () => {
+    };
+
+    ZwCloud2D.ZwMessageCallback.ZwEvtGetRegenData = (data) => {
+        req.getRegenData(data).then(res => {
+            ZwCloud2D.ZwDataManager.ZwSetRegenData(res);
+        }).catch(() => {
+            ZwCloud2D.ZwDataManager.ZwSetRegenData(null);
+        });
+    };
+    ZwCloud2D.ZwMessageCallback.ZwEvtLoadImageData = data => {
+        let pArr = new Array();
+        let imageMap = new Map();
+        data.forEach((imageUrl) => {
+            pArr.push(new Promise((res, rej) => {
+                req.getImageData(imageUrl).then(result => {
+                    imageMap.set(imageUrl, result);
+                    res(true)
+                }).catch(err => {
+                    res(true);
+                });
+            }));
+        });
+        Promise.all(pArr).then(() => {
+            ZwCloud2D.ZwDataManager.ZwSetImageData(imageMap);
+        }).catch(error=>{
+            console.error(error)
+        });
+    };
+    ZwCloud2D.ZwMessageCallback.ZwEvtLoadImageList = () => {
+        req.getImageList().then((res) => {
+            res.forEach((image) => {
+                let path = image.completePath + image.name
+                req.getImageSrc(path).then(imageData => {
+                    let item = { name: image.name, data: imageData, completePath: image.completePath };
+                    ZwCloud2D.ZwDataManager.ZwSetImageList(item);
+                });
+            });
+        });
+    };
+    ZwCloud2D.ZwMessageCallback.ZwEvtPlotDwg = (data) => {
+        let params = Object.assign(data.params, { dwgPath: dwgPath })
+        req.getPlotData(params).then(res => {
+            ZwCloud2D.ZwDataManager.ZwSetPlotData(data, res);
+            ZwCloud2D.ZwEditor.ZwSetLoadingState(false);
+        }).catch(error=>{
+            console.error(error)
+        })
+    };
+    req.getPermissionList().then(data => {
+        ZwCloud2D.ZwDataManager.ZwSetSdkPermission(data);
+    }).catch(error=>{
+        console.error(error)
+    })
+    req.transferDoc().then(data => {
+        // 显示当前布局的数据
+        let layouts = []
+        data.layouts.forEach(layout => {
+            let res = {
+                handleId: layout.handleId,
+                isDefault: layout.isDefault === 1 ? 'YES' : 'NO',
+                name: layout.layoutName,
+                tabOrder: layout.order,
+            }
+            layouts.push(res)
+        })
+        ZwCloud2D.ZwDataManager.ZwSetDwgInfo({ id: docId, fonts: data.fontList, layouts: layouts, name: data.name }).then(res => {
+            let pArr = []
+            let fontArr = []
+            res.missingFonts.forEach(fontName => {
+                let arr = fontName.split('.');
+                let type = (arr[arr.length - 1] || '').toUpperCase();
+
+                pArr.push(req.fontDownload(fontName).then(async data => {
+                    if (data.type === 'application/octet-stream') {
+                        let arraybuffer = await data.arrayBuffer()
+                        fontArr.push(
+                            {
+                                name: fontName,
+                                type: type,
+                                data: arraybuffer,
+                            }
+                        );
+                    }
+                }));
+            });
+            Promise.all(pArr).then(() => {
+                ZwCloud2D.ZwDataManager.ZwSetFontDataList(fontArr).then(() => {
+
+                    req.getDisplayData(res.layout.handleId).then(lmfInfo => {
+                        if (res.timestamp === '') res.timestamp = new Date().getTime()
+                        ZwCloud2D.ZwDataManager.ZwSetDwgData(res.layout.handleId, lmfInfo, res.timestamp)
+                    }).catch(error=>{
+                        console.error(error)
+                    })
+
+                    req.getXrefRelation().then(xrefRelations => {
+                        let xrefPromises = [];
+                        let srcMap = new Map();
+                        xrefRelations.forEach((xrefRelation) => {
+                            if (xrefRelation.foundPath) {
+                                xrefPromises.push(new Promise((res, rej) => {
+                                    req.getXrefThumb(xrefRelation.foundPath).then(xrefThumb => {
+                                        srcMap.set(xrefRelation.foundPath, xrefThumb);
+                                        res(true);
+                                    });
+                                }));
+                            }
+                        });
+                        Promise.all(xrefPromises).then(() => {
+                            let params = { docName: data.name, xrefRelations: xrefRelations, srcMap: srcMap };
+                            ZwCloud2D.ZwDataManager.ZwSetXrefList(params);
+                        }).catch(() => {
+                            let params = { docName: data.name, xrefRelations: xrefRelations, srcMap: srcMap };
+                            ZwCloud2D.ZwDataManager.ZwSetXrefList(params);
+                        });
+                    }).catch(error=>{
+                        console.error(error)
+                    });
+
+                    if (wsUrl) {
+                        let url = wsUrl + '/CadService?sub=' +
+                            Math.floor(Math.random() * 1000) +
+                            '&docId=' + docId +
+                            '&dwgPath=' + dwgPath
+                        ZwCloud2D.ZwDataManager.ZwEntryEdit(url);
+                    }
+                })
+            }).catch(error=>{
+                console.error(error)
+            })
+        });
+    }).catch(error=>{
+        console.error(error)
+    });
+}

src/assets/ZwCloud2DSDK/ZwCloud2DRestfulAPI.js

@@ -0,0 +1,660 @@
+let baseUrl = 'http://192.168.51.174:9092'
+let userUrl = 'http://192.168.51.174:9091'
+let appKey = ''
+
+let docId = ''
+
+let fullVersionPermissions = {
+    'productName': 'ZW2D_CLOUD_FULL_2024',
+    'featureId': 167,
+    'projectId': 0,
+    'expiredTime': '2022-12-12T00:00:00',
+    'authClientNum': 10,
+    'forCloud2D': true,
+    'permissions': [
+        {
+            'description': 'DWG 100',
+            'name': 'DWG 100',
+            'permissionId': '100',
+            'type': 'SDK'
+        },
+        {
+            'description': 'DXF 101',
+            'name': 'DXF 101',
+            'permissionId': '101',
+            'type': 'SDK'
+        },
+        {
+            'description': '天正 102',
+            'name': '天正 102',
+            'permissionId': '102',
+            'type': 'SDK'
+        },
+        {
+            'description': '图纸预览图获取',
+            'name': '图纸预览图获取',
+            'permissionId': '201',
+            'type': 'SDK'
+        },
+        {
+            'description': '视口重生成',
+            'name': '视口重生成',
+            'permissionId': '202',
+            'type': 'SDK'
+        },
+        {
+            'description': '外部参照图片',
+            'name': '外部参照图片',
+            'permissionId': '203',
+            'type': 'SDK'
+        },
+        {
+            'description': 'DWG轻量数据生成',
+            'name': 'DWG轻量数据生成',
+            'permissionId': '204',
+            'type': 'SDK'
+        },
+        {
+            'description': '字体设置',
+            'name': '字体设置',
+            'permissionId': '205',
+            'type': 'SDK'
+        },
+        {
+            'description': '字体替换设置',
+            'name': '字体替换设置',
+            'permissionId': '206',
+            'type': 'SDK'
+        },
+        {
+            'description': '字体库',
+            'name': '字体库',
+            'permissionId': '207',
+            'type': 'SDK'
+        },
+        {
+            'description': '图纸二维线框显示',
+            'name': '图纸二维线框显示',
+            'permissionId': '300',
+            'type': 'SDK'
+        },
+        {
+            'description': '大图浏览（20M）',
+            'name': '大图浏览（20M）',
+            'permissionId': '301',
+            'type': 'SDK'
+        },
+        {
+            'description': '着色模式显示支持',
+            'name': '着色模式显示支持',
+            'permissionId': '302',
+            'type': 'SDK'
+        },
+        {
+            'description': '缩放',
+            'name': '缩放',
+            'permissionId': '303',
+            'type': 'SDK'
+        },
+        {
+            'description': '平移',
+            'name': '平移',
+            'permissionId': '304',
+            'type': 'SDK'
+        },
+        {
+            'description': '图片显示',
+            'name': '图片显示',
+            'permissionId': '305',
+            'type': 'SDK'
+        },
+        {
+            'description': '外部参照显示',
+            'name': '外部参照显示',
+            'permissionId': '306',
+            'type': 'SDK'
+        },
+        {
+            'description': '布局显示和切换',
+            'name': '布局显示和切换',
+            'permissionId': '307',
+            'type': 'SDK'
+        },
+        {
+            'description': '图层面板',
+            'name': '图层面板',
+            'permissionId': '308',
+            'type': 'SDK'
+        },
+        {
+            'description': '图层显示/隐藏',
+            'name': '图层显示/隐藏',
+            'permissionId': '309',
+            'type': 'SDK'
+        },
+        {
+            'description': '命令行窗口',
+            'name': '命令行窗口',
+            'permissionId': '310',
+            'type': 'SDK'
+        },
+        {
+            'description': '线宽显示',
+            'name': '线宽显示',
+            'permissionId': '311',
+            'type': 'SDK'
+        },
+        {
+            'description': '栅格显示',
+            'name': '栅格显示',
+            'permissionId': '312',
+            'type': 'SDK'
+        },
+        {
+            'description': '外部参照面板',
+            'name': '外部参照面板',
+            'permissionId': '313',
+            'type': 'SDK'
+        },
+        {
+            'description': '系统参数设置',
+            'name': '系统参数设置',
+            'permissionId': '314',
+            'type': 'SDK'
+        },
+        {
+            'description': '测量长度/面积/角度/坐标/弧长',
+            'name': '测量长度/面积/角度/坐标/弧长',
+            'permissionId': '400',
+            'type': 'SDK'
+        },
+        {
+            'description': 'Text 单行文字',
+            'name': 'Text 单行文字',
+            'permissionId': '500',
+            'type': 'SDK'
+        },
+        {
+            'description': 'Revcloud 云线',
+            'name': 'Revcloud 云线',
+            'permissionId': '501',
+            'type': 'SDK'
+        },
+        {
+            'description': 'Leader 引线',
+            'name': 'Leader 引线',
+            'permissionId': '502',
+            'type': 'SDK'
+        },
+        {
+            'description': 'MLeader 多重引线',
+            'name': 'MLeader 多重引线',
+            'permissionId': '503',
+            'type': 'SDK'
+        },
+        {
+            'description': '图片（即图章功能）',
+            'name': '图片（即图章功能）',
+            'permissionId': '504',
+            'type': 'SDK'
+        },
+        {
+            'description': 'PLine 多段线',
+            'name': 'PLine 多段线',
+            'permissionId': '505',
+            'type': 'SDK'
+        },
+        {
+            'description': 'Rectangle 矩形',
+            'name': 'Rectangle 矩形',
+            'permissionId': '506',
+            'type': 'SDK'
+        },
+        {
+            'description': 'Circle 圆',
+            'name': 'Circle 圆',
+            'permissionId': '507',
+            'type': 'SDK'
+        },
+        {
+            'description': 'Arc 弧线',
+            'name': 'Arc 弧线',
+            'permissionId': '508',
+            'type': 'SDK'
+        },
+        {
+            'description': 'DWG导出',
+            'name': 'DWG导出',
+            'permissionId': '600',
+            'type': 'SDK'
+        },
+        {
+            'description': '图片输出',
+            'name': '图片输出',
+            'permissionId': '601',
+            'type': 'SDK'
+        },
+        {
+            'description': 'PDF输出',
+            'name': 'PDF输出',
+            'permissionId': '602',
+            'type': 'SDK'
+        },
+        {
+            'description': '添加预览水印',
+            'name': '添加预览水印',
+            'permissionId': '700',
+            'type': 'SDK'
+        },
+        {
+            'description': '书签、审图',
+            'name': '书签、审图',
+            'permissionId': '800',
+            'type': 'SDK'
+        },
+        {
+            'description': '批注面版',
+            'name': '批注面版',
+            'permissionId': '801',
+            'type': 'SDK'
+        },
+        {
+            'description': '书签定义和调用接口、布局信息和坐标转换接口、缩放比例和生成截图接口等',
+            'name': '书签定义和调用接口、布局信息和坐标转换接口、缩放比例和生成截图接口等',
+            'permissionId': '900',
+            'type': 'SDK'
+        },
+    ]
+}
+
+class Request {
+    constructor() {
+    }
+
+    getData(url, ticket, params, resType) {
+        return new Promise((res, rej) => {
+            let paramsArr = []
+            for (let k in params) {
+                paramsArr.push(encodeURIComponent(k) + '=' + encodeURIComponent(params[k]))
+            }
+            if (params) {
+                url = url + '?' + paramsArr.join('&')
+            }
+            let ajax = new XMLHttpRequest()
+            let ip = ticket ? userUrl : baseUrl
+            ajax.open('GET', ip + url)
+            resType && (ajax.responseType = resType)
+            ticket && Object.keys(ticket).forEach(key => {
+                ajax.setRequestHeader(key, ticket[key])
+            })
+            ajax.send()
+            ajax.onload = function () {
+                if (resType) res(ajax.response)
+                else {
+                    let data = JSON.parse(ajax.response)
+                    if (data.code === 0) {
+                        res(data.data)
+                    } else if (data.code === 2060) {
+                        rej(data.code)
+                    } else rej(data.msg)
+                }
+            }
+        })
+    }
+
+    postData(url, ticket, params, resType) {
+        return new Promise((res, rej) => {
+            let ajax = new XMLHttpRequest()
+            let ip = ticket ? userUrl : baseUrl
+            ajax.open('POST', ip + url)
+            resType && (ajax.responseType = resType)
+            ajax.setRequestHeader('content-type', 'application/json')
+            ticket && Object.keys(ticket).forEach(key => {
+                ajax.setRequestHeader(key, ticket[key])
+            })
+            ajax.send(params)
+            ajax.onreadystatechange = function () {
+                if (ajax.readyState === 4) {
+                    if (ajax.status === 200) {
+                        res(ajax.response)
+                    } else {
+                        rej()
+                    }
+                }
+            }
+        })
+    }
+
+    get(url, params, resType) {
+        if (appKey) {
+            let ticket = { 'x-ca-key': appKey }
+            return this.getData(url, ticket, params, resType)
+        } else {
+            return this.getData('/auth/js/ticket?url=' + url).then(res => {
+                let ticket = {
+                    'x-ca-key': res.appKey,
+                    'x-ca-nonce': res.nonce,
+                    'x-ca-date': res.timestamp,
+                    'x-ca-signature': res.signature,
+                }
+                return ticket
+            }).then(ticket => {
+                return this.getData(url, ticket, params, resType)
+            })
+        }
+    }
+
+    post(url, params, resType) {
+        if (appKey) {
+            let ticket = { 'x-ca-key': appKey }
+            return this.postData(url, ticket, params, resType)
+        } else {
+            return this.getData('/auth/js/ticket?url=' + url).then(res => {
+                let ticket = {
+                    'x-ca-key': res.appKey,
+                    'x-ca-nonce': res.nonce,
+                    'x-ca-date': res.timestamp,
+                    'x-ca-signature': res.signature,
+                }
+                return ticket
+            }).then(ticket => {
+                return this.postData(url, ticket, params, resType)
+            })
+        }
+
+    }
+
+    arrayBufferToBase64(buffer) {
+        let binary = '';
+        let bytes = new Uint8Array(buffer);
+        let len = bytes.byteLength;
+        for (let i = 0; i < len; i++) {
+            binary += String.fromCharCode(bytes[i]);
+        }
+        return btoa(binary);
+    }
+
+    fontDownload(fileId) {
+        return this.get('/api/js/v1/font/gzip', { fileId: fileId, projectId: 0 }, 'arraybuffer')
+    }
+
+    getTransferStatus(){
+        let params = { id: docId }
+        params = JSON.stringify(params)
+        return this.post('/api/js/v1/doc/transferStatus', params,'json')
+    }
+
+    transferDoc() {
+        return this.get('/api/js/v1/doc/details', { docId: docId })
+    }
+
+    getDisplayData(handleId = 34) {
+        return this.get('/api/js/v1/layout/lmf', { projectId: 0, handleId, docId: docId })
+    }
+
+    filePartDownload(lmfId) {
+        return this.get('/api/js/v1/file/partDownload', { fileId: lmfId }, 'arraybuffer')
+    }
+
+    getFileInfo(lmfId) {
+        return this.get('/api/js/v1/file/info', { id: lmfId })
+    }
+
+    getXrefRelation() {
+        return this.get('/api/js/v1/xref/info', { id: docId })
+    }
+
+    getXrefThumb(fileId) {
+        return this.get('/api/js/v1/file/partDownload', { fileId: fileId }, 'arraybuffer').then(res => {
+            let url = this.arrayBufferToBase64(res);
+            return 'data:image/jpeg;base64,' + url;
+        })
+    }
+
+    getXrefFile(handleId, xrefIds) {
+        let params = { docId: docId, handleId: handleId, xrefIds: xrefIds }
+        params = JSON.stringify(params)
+        return this.post('/api/js/v1/xref', params, 'json')
+    }
+
+    getImageInfo(filePath) {
+        let params = { docId: docId, path: filePath }
+        params = JSON.stringify(params)
+        return this.post('/api/js/v1/link', params, 'json')
+    }
+
+    getImageData(fileId) {
+        return this.get('/api/js/v1/file/partDownload', { fileId: fileId }, 'arraybuffer').then(res => {
+            let url = this.arrayBufferToBase64(res);
+            return 'data:image/jpeg;base64,' + url;
+        })
+    }
+
+    getPlotData(params) {
+        let data = JSON.stringify(params)
+        return this.post('/api/js/v1/doc/print', data, 'arraybuffer')
+    }
+
+    getBatchPlot(params) {
+        let data = JSON.stringify(params)
+        return this.post('/api/js/v1/doc/batchPrint', data, 'arraybuffer')
+    }
+
+    getRegenData(params) {
+        Object.assign(params, { docId: docId })
+        let data = JSON.stringify(params)
+        return this.post('/api/js/v1/layout/regen', data, 'arraybuffer')
+    }
+}
+
+ZwCloud2D.ZwDataProcessor.ZwSetConnectUrl = (url1, url2) => {
+    userUrl = url1
+    baseUrl = url2;
+}
+
+ZwCloud2D.ZwDataProcessor.ZwSetAppKey = (key) => {
+    appKey = key
+}
+
+ZwCloud2D.ZwDataProcessor.ZwSetLoadDwg = (path) => {
+    docId = path;
+}
+
+ZwCloud2D.ZwDataProcessor.ZwLoad = () => {
+
+    let req = new Request();
+
+    // 切换布局时候触发回调
+    ZwCloud2D.ZwMessageCallback.ZwEvtChangeLayout = layout => {
+        req.getDisplayData(layout.handleId).then(result => {
+            ZwCloud2D.ZwDataProcessor.ZwGetLmfData(result.lmfId).then(lmfInfo => {
+                if (lmfInfo) {
+                    function zcGetFileInfo() {
+                        req.getFileInfo(result.lmfId).then(fileInfo => {
+
+                            let curTimestamp = new Date(fileInfo.updateTime || fileInfo.createTime).getTime();
+
+                            if (lmfInfo.hasCache && curTimestamp.toString() === lmfInfo.timestamp) {
+                                ZwCloud2D.ZwDataManager.ZwSetDwgData(result.lmfId)
+                            } else {
+                                req.filePartDownload(result.lmfId).then(lmfInfo => {
+                                    ZwCloud2D.ZwDataManager.ZwSetDwgData(result.lmfId, lmfInfo, curTimestamp)
+                                })
+                            }
+                        }).catch((res) => {
+                            if (res === 2060) {
+                                this.timer = setTimeout(() => {
+                                    clearTimeout(this.timer)
+                                    zcGetFileInfo()
+                                }, 3000);
+                            } else {
+                                console.error(res)
+                            }
+                        })
+                    }
+                    zcGetFileInfo()
+                }
+            });
+        }).catch(error => {
+            console.error(error)
+        })
+    };
+
+    ZwCloud2D.ZwMessageCallback.ZwEvtLoadXrefData = data => {
+        req.getXrefFile(data.handleId, data.xrefIds).then(xrefFile => {
+            if (xrefFile.data.fileId) {
+                req.filePartDownload(xrefFile.data.fileId).then(fileData => {
+                    ZwCloud2D.ZwDataManager.ZwSetXrefData(fileData);
+                })
+            } else {
+                ZwCloud2D.ZwDataManager.ZwSetXrefData();
+            }
+        }).catch(() => {
+            ZwCloud2D.ZwDataManager.ZwSetXrefData();
+        })
+    };
+
+    ZwCloud2D.ZwMessageCallback.ZwEvtLoadImageData = data => {
+        let pArr = new Array();
+        let imageMap = new Map();
+        data.forEach((imageUrl) => {
+            pArr.push(new Promise((res, rej) => {
+                req.getImageInfo(imageUrl).then(info => {
+                    if (info.data.fileId) {
+                        req.getImageData(info.data.fileId).then(result => {
+                            imageMap.set(imageUrl, result);
+                            res(true)
+                        })
+                    } else {
+                        res(true)
+                    }
+                }).catch(err => {
+                    res(true);
+                });
+            }));
+        });
+        Promise.all(pArr).then(() => {
+            ZwCloud2D.ZwDataManager.ZwSetImageData(imageMap);
+        }).catch(error => {
+            console.error(error)
+        });
+    };
+    ZwCloud2D.ZwMessageCallback.ZwEvtPlotDwg = (data) => {
+        let params = Object.assign(data.params, { docId: docId })
+        if (params.isZwPlot) {
+            req.getBatchPlot(params).then(res => {
+                ZwCloud2D.ZwDataManager.ZwSetPlotData(data, res);
+                ZwCloud2D.ZwEditor.ZwSetLoadingState(false);
+            })
+        } else {
+            req.getPlotData(params).then(res => {
+                ZwCloud2D.ZwDataManager.ZwSetPlotData(data, res);
+                ZwCloud2D.ZwEditor.ZwSetLoadingState(false);
+            })
+        }
+    };
+    ZwCloud2D.ZwMessageCallback.ZwEvtGetRegenData = (data) => {
+        req.getRegenData(data).then(res => {
+            ZwCloud2D.ZwDataManager.ZwSetRegenData(res);
+        }).catch(() => {
+            ZwCloud2D.ZwDataManager.ZwSetRegenData(null);
+        });
+    };
+    let ZwMain=()=>{
+        req.transferDoc().then(data => {
+
+            ZwCloud2D.ZwDataManager.ZwSetSdkPermission(fullVersionPermissions);
+    
+            // 显示当前布局的数据
+            ZwCloud2D.ZwDataManager.ZwSetDwgInfo({ fonts: data.fonts, layouts: data.layouts, name: data.name }).then(res => {
+                let pArr = []
+                let fontArr = []
+    
+                res.missingFonts.forEach(font => {
+                    let arr = font.name.split('.');
+                    let type = (arr[arr.length - 1] || '').toUpperCase();
+    
+                    pArr.push(req.fontDownload(font.fileId).then(data => {
+                        if (data.byteLength > 0) {
+                            fontArr.push(
+                                {
+                                    name: font.name,
+                                    type: type,
+                                    data: data,
+                                }
+                            );
+                        }
+                    }));
+                });
+    
+                Promise.all(pArr).then(() => {
+                    ZwCloud2D.ZwDataManager.ZwSetFontDataList(fontArr).then(() => {
+    
+                        req.getDisplayData(res.layout.handleId).then(result => {
+    
+                            req.getXrefRelation().then(xrefRelations => {
+                                let xrefPromises = [];
+                                let srcMap = new Map();
+                                xrefRelations.forEach((xrefRelation) => {
+                                    if (xrefRelation.fileId) {
+                                        xrefPromises.push(new Promise((res, rej) => {
+                                            req.getXrefThumb(xrefRelation.fileId).then(xrefThumb => {
+                                                srcMap.set(xrefRelation.fileId, xrefThumb);
+                                                res(true);
+                                            });
+                                        }));
+                                    }
+                                });
+                                Promise.all(xrefPromises).then(() => {
+                                    let params = { docName: data.name, xrefRelations: xrefRelations, srcMap: srcMap };
+                                    ZwCloud2D.ZwDataManager.ZwSetXrefList(params);
+                                }).catch(() => {
+                                    let params = { docName: data.name, xrefRelations: xrefRelations, srcMap: srcMap };
+                                    ZwCloud2D.ZwDataManager.ZwSetXrefList(params);
+                                });
+                            });
+    
+                            req.getFileInfo(result.lmfId).then(lmfInfo => {
+                                let curTimestamp = new Date(lmfInfo.updateTime || lmfInfo.createTime).getTime();
+                                if (res.hasCache && res.timestamp === curTimestamp.toString()) {
+                                    ZwCloud2D.ZwDataManager.ZwSetDwgData(result.lmfId)
+                                } else {
+                                    req.filePartDownload(result.lmfId).then(lmfInfo => {
+                                        ZwCloud2D.ZwDataManager.ZwSetDwgData(result.lmfId, lmfInfo, curTimestamp)
+                                    })
+                                }
+                            }).catch(error => {
+                                console.error(error)
+                            })
+    
+                        }).catch(error => {
+                            console.error(error)
+                        })
+                    })
+                }).catch(error => {
+                    console.error(error)
+                })
+            });
+        }).catch(error => {
+            console.error(error)
+        });
+    }
+    let getTransferStatus=()=>{
+        req.getTransferStatus().then(fileInfo=>{
+            let status=fileInfo.data.status
+            if (status === 1) {
+                let timer = setTimeout(() => {
+                    clearTimeout(timer)
+                    getTransferStatus()
+                }, 3000);
+            } else if(status === 2) {
+                ZwMain()
+            }else if(status === 3){
+                console.error(fileInfo.failedReason)
+            }
+        }).catch(err=>{
+            console.error(err)
+        })
+    }
+    getTransferStatus()
+}

src/pages/Cad/index.js

@@ -0,0 +1,38 @@
+import { useRef, useEffect } from 'react';
+import PageContent from '@/components/PageContent';
+
+const CadDemo = () => {
+  const ref = useRef();
+
+  useEffect(() => {
+    // window.Module.onRuntimeInitialized = () => {
+    //   window.ZwCloud2D.ZwEditor.ZwInit(ref.current);
+    //   // PrivateAPI
+    //   window.ZwCloud2D.ZwDataProcessor.ZwSetConnectUrl(
+    //     'http://222.130.26.205:5121/index.html',
+    //   );
+    //   window.ZwCloud2D.ZwDataProcessor.ZwSetLoadDwg('SDK-TC-001x.dwg');
+    //   // RestfulAPI
+    //   // ZwCloud2D.ZwDataProcessor.ZwSetConnectUrl('http://192.168.51.174:9091');
+    //   // ZwCloud2D.ZwDataProcessor.ZwSetLoadDwg('1595655235900768256');
+    //   window.ZwCloud2D.ZwDataProcessor.ZwLoad();
+    // };
+  }, []);
+  return (
+    <PageContent>
+      <div>CAD在线审批</div>
+      {/* <div style={{ width: '100%', height: '80%' }} ref={ref}></div> */}
+      <iframe
+        style={{
+          width: '100%',
+          height: '80vh',
+        }}
+        ref={ref}
+        onLoad={() => {}}
+        src="http://222.130.26.205:5121/index.html?dwgPath=SDK-TC-001x.dwg"
+      />
+    </PageContent>
+  );
+};
+
+export default CadDemo;