Merge branch 'cad_demo' into develop

.umirc.ts

@@ -34,12 +34,18 @@ export default defineConfig({
   //   },
   // ],
   // scripts: [
-  //   { src: 'http://localhost:3000/plugins/js/plugin.js' },
-  //   { src: 'http://localhost:3000/luckysheet.umd.js' },
+  //   { src: '/ZwCloud2DSDK/ZwCloud2D.js' },
+  //   { src: '/ZwCloud2DSDK/ZwWasmJs.js' },
+  //   { src: '/ZwCloud2DSDK/ZwCloud2DAPI.js' },
   // ],
+  headScripts: [
+    '/ZwCloud2DSDK/ZwCloud2D.js',
+    '/ZwCloud2DSDK/ZwWasmJs.js',
+    '/ZwCloud2DSDK/ZwCloud2DPrivateAPI.js',
+  ],
   proxy: {
     '/api': {
-      // target: 'http://47.96.12.136:8888/',
+      // target: 'http://192.168.20.232:1007/',
       target: 'http://47.96.12.136:8895/',
       // target: 'https://work.greentech.com.cn/',
       changeOrigin: true,
@@ -206,6 +212,18 @@ export default defineConfig({
       component: './PSRManage/detail',
       hideInMenu: true,
     },
+    {
+      name: 'CAD实例',
+      path: '/cad',
+      component: './Cad',
+      icon: 'https://gt-digitization.oss-cn-hangzhou.aliyuncs.com/doc/department/2023-04/manufacturerIcon.png',
+    },
+    {
+      name: 'CAD详情',
+      path: '/cad/detail',
+      component: './Cad/detail',
+      hideInMenu: true,
+    },
   ],
   npmClient: 'yarn',
 });

public/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,
+    }
+}

public/ZwCloud2DSDK/ZwCloud2DPrivateAPI.js

@@ -0,0 +1,465 @@
+let baseUrl = 'http://192.168.51.174:5199';
+let wsUrl = '';
+let dwgPath = '';
+let javaUrl = '';
+
+class Request {
+  constructor() {}
+
+  get(url, params, resType, type) {
+    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();
+      let checkUrl = type === 'java' ? javaUrl + url : baseUrl + url;
+      ajax.open('GET', checkUrl);
+      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, type) {
+    return new Promise((res, rej) => {
+      let ajax = new XMLHttpRequest();
+      let checkUrl = type === 'java' ? javaUrl + url : baseUrl + url;
+      ajax.open('POST', checkUrl);
+      resType && (ajax.responseType = resType);
+      if (!(params instanceof FormData)) {
+        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,
+      type: 1,
+    });
+  }
+
+  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');
+  }
+  getDwgFile() {
+    return this.get(
+      '/sdk/doc/download',
+      { dwgPath: dwgPath },
+      'arrayBuffer',
+      'java',
+    );
+  }
+  uploadFile(file) {
+    let formData = new FormData();
+    formData.append('file', file);
+    return this.post('/sdk/doc/upload', formData, 'json', 'java');
+  }
+}
+
+function resizeCheck() {
+  if (Date.now() - timer > 400) {
+    const windowInfo = {
+      width: window.innerWidth,
+      height: window.innerHeight,
+    };
+    console.log(windowInfo);
+    if (windowInfo.width <= 1190 || windowInfo.height <= 620) {
+      mainMobile.style.display = 'unset';
+      main.style.display = 'none';
+    } else {
+      mainMobile.style.display = 'none';
+      main.style.display = 'unset';
+    }
+    timer = Date.now();
+  }
+}
+
+ZwCloud2D.ZwDataProcessor.ZwSetConnectUrl = (url1, url2, url3) => {
+  javaUrl = url1;
+  baseUrl = url2;
+  wsUrl = url3;
+};
+
+ZwCloud2D.ZwDataProcessor.ZwSetLoadDwg = (path) => {
+  dwgPath = path;
+};
+
+ZwCloud2D.ZwDataProcessor.uploadDwg = (file) => {
+  let req = new Request();
+  return new Promise((resolve, reject) => {
+    req.uploadFile(file).then((res) => {
+      resolve(res);
+    });
+  });
+
+  // req.uploadFile(file).then(res => {
+  //     dwgPath = res.data.path;
+  //     ZwCloud2D.ZwDataProcessor.ZwLoad();
+  //     let main = document.getElementById('main');
+  //     main.style.display = "none"
+  //     let mainMobile = document.getElementById('main-mobile');
+  //     mainMobile.style.display = "none"
+  //     let showDwgBtn = document.getElementById('showDwgBtn');
+  //     let showFontBtn = document.getElementById('showFontBtn');
+  //     showDwgBtn.style.display = "unset"
+  //     showFontBtn.style.display = "unset"
+  // })
+};
+
+ZwCloud2D.ZwDataProcessor.uploadFont = (file) => {
+  let req = new Request();
+  let pArray = new Array();
+  for (let i = 0; i < file.length; i++) {
+    pArray.push(
+      new Promise((resolve, reject) => {
+        req.uploadFile(file[i]).then((res) => {
+          if (res.code === 200) {
+            resolve();
+          } else {
+            reject();
+          }
+        });
+      }),
+    );
+  }
+  Promise.all(pArray)
+    .then(() => {
+      alert('上传成功');
+    })
+    .catch(() => {
+      alert('上传失败');
+    });
+};
+
+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);
+      });
+  };
+  ZwCloud2D.ZwEditor.ZwSetUserOptions({ panel: { commentPanel: false } });
+  req
+    .getPermissionList()
+    .then((data) => {
+      ZwCloud2D.ZwDataManager.ZwSetSdkPermission(data);
+    })
+    .catch((error) => {
+      console.error(error);
+    });
+  if (!dwgPath) return;
+  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) => {
+      ZwCloud2D.ZwEditor.ZwSetLoadingState(false);
+
+      alert(error);
+      let main = document.getElementById('main');
+      main.style.display = 'unset';
+      let mainMobile = document.getElementById('main-mobile');
+      mainMobile.style.display = 'unset';
+      let showDwgBtn = document.getElementById('showDwgBtn');
+      let showFontBtn = document.getElementById('showFontBtn');
+      showDwgBtn.style.display = 'none';
+      showFontBtn.style.display = 'none';
+
+      resizeCheck();
+      window.addEventListener('resize', resizeCheck);
+      console.error(error);
+    });
+};

public/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/components/UploadModal.js

@@ -0,0 +1,17 @@
+import { Checkbox, Modal, message, Space, Divider } from 'antd';
+import { useEffect, useMemo, useRef, useState } from 'react';
+import dayjs from 'dayjs';
+
+const UploadModal = ({ open, onCancel, onOk }) => {
+  useEffect(() => {}, [open]);
+  return (
+    <Modal
+      title="上传"
+      open={open}
+      onCancel={onCancel}
+      onOk={() => onOk(values)}
+      destroyOnClose
+    ></Modal>
+  );
+};
+export default UploadModal;

src/pages/Cad/detail.js

@@ -0,0 +1,37 @@
+import { useRef, useEffect } from 'react';
+import PageContent from '@/components/PageContent';
+import { useLocation, useNavigate } from '@umijs/max';
+
+const CadDeTail = () => {
+  const cadRef = useRef();
+  const location = useLocation();
+  const {
+    state: { path },
+  } = location;
+
+  useEffect(() => {
+    console.log(window);
+    const content = document.getElementById('container');
+    window.ZwCloud2D.ZwEditor.ZwInit(content);
+
+    ZwCloud2D.ZwDataProcessor.ZwSetConnectUrl(
+      'http://222.130.26.205:9080',
+      'http://222.130.26.205:5121',
+      'ws://222.130.26.205:5121',
+    );
+    ZwCloud2D.ZwDataProcessor.ZwSetLoadDwg(path);
+    window.ZwCloud2D.ZwDataProcessor.ZwLoad();
+  }, []);
+  return (
+    <PageContent>
+      <div>CAD在线审批</div>
+      <div
+        id="container"
+        style={{ width: '100%', height: '80vh' }}
+        ref={cadRef}
+      />
+    </PageContent>
+  );
+};
+
+export default CadDeTail;

src/pages/Cad/index.js

@@ -0,0 +1,148 @@
+import { useRef, useEffect, useState } from 'react';
+import PageContent from '@/components/PageContent';
+import { queryCadList, queryCreateCad } from '@/services/cad';
+import { useRequest, useNavigate } from '@umijs/max';
+import { Table, Button, message, Space } from 'antd';
+
+const CadDemo = () => {
+  let navigate = useNavigate();
+  const columns = [
+    {
+      title: '名称',
+      dataIndex: 'name',
+      key: 'name',
+      align: 'center',
+      width: 160,
+    },
+    {
+      title: '创建人',
+      dataIndex: 'created_by',
+      key: 'created_by',
+      align: 'center',
+      width: 120,
+    },
+    {
+      title: '创建时间',
+      dataIndex: 'created_on',
+      key: 'created_on',
+      align: 'center',
+      width: 100,
+    },
+    {
+      title: '状态',
+      dataIndex: 'status',
+      key: 'status',
+      align: 'center',
+      width: 100,
+      render: (status) => {
+        let str = '';
+        let color = 'black';
+        switch (status) {
+          case 1:
+            str = '待审核';
+            color = 'blue';
+            break;
+          case 2:
+            str = '审核通过';
+            color = 'red';
+            break;
+          case 3:
+            str = '审核拒绝';
+            color = 'green';
+            break;
+        }
+        return <div style={{ color }}>{str}</div>;
+      },
+    },
+    {
+      title: '操作',
+      align: 'center',
+      width: '10%',
+      render: (record) => (
+        <Space>
+          <a
+            onClick={() =>
+              navigate('/cad/detail', {
+                state: {
+                  path: record.path,
+                },
+              })
+            }
+          >
+            详情
+          </a>
+          <a onClick={() => {}}>提审</a>
+        </Space>
+      ),
+    },
+  ];
+  const [uploading, setUpLoading] = useState(false);
+
+  //请求列表
+  const { data, run, loading } = useRequest(queryCadList);
+
+  //上传
+  const { run: runCreate } = useRequest((data) => queryCreateCad(data), {
+    manual: true,
+    onSuccess: () => {
+      run();
+      message.success('上传成功');
+      setUpLoading(false);
+    },
+  });
+
+  useEffect(() => {
+    ZwCloud2D.ZwDataProcessor.ZwSetConnectUrl(
+      'http://222.130.26.205:9080',
+      'http://222.130.26.205:5121',
+      'ws://222.130.26.205:5121',
+    );
+  }, []);
+
+  function uploadDwg(event) {
+    const selectedFile = event.target.files[0];
+    if (selectedFile) {
+      // ZwCloud2D.ZwEditor.ZwSetLoadingState(true);
+      setUpLoading(true);
+      ZwCloud2D.ZwDataProcessor.uploadDwg(selectedFile).then((res) => {
+        if (res.code == 200) {
+          runCreate({ name: res.data.name, path: res.data.path });
+        }
+        setUpLoading(false);
+      });
+    }
+  }
+  function dwgUpload() {
+    let uploadDwg = document.getElementById('uploadDwg');
+    uploadDwg.click();
+  }
+
+  return (
+    <PageContent>
+      <Button type="primary" onClick={dwgUpload}>
+        上传
+      </Button>
+      <Table
+        loading={loading}
+        columns={columns}
+        dataSource={data?.list}
+        indentSize={70}
+        // pagination={{
+        //   ...pagination,
+        //   showSizeChanger: false,
+        //   onChange: onPageChange,
+        // }}
+      />
+      {/* <div id="container"></div> */}
+      <input
+        style={{ display: 'none' }}
+        id="uploadDwg"
+        type="file"
+        onChange={uploadDwg}
+        accept=".dwg, .dxf"
+      />
+    </PageContent>
+  );
+};
+
+export default CadDemo;

src/services/cad.js

@@ -0,0 +1,10 @@
+import { request } from 'umi';
+export const queryCadList = async () => {
+  return await request('/api/contract/v1/cad');
+};
+export async function queryCreateCad(data) {
+  return request(`/api/contract/v1/cad`, {
+    method: 'POST',
+    data,
+  });
+}