集成文档门户

1. 概述

1.1 功能概述

Wyn 支持将文档门户和管理门户嵌入到 Web 应用程序的任意 DIV 容器中。用户可以根据需求自定义门户，或者直接在自己的应用程序中配置 Wyn，从而实现无缝集成。

2. 操作步骤

2.1 安装最新的集成包

1. 安装最新的集成包：https://www.npmjs.com/package/@grapecity-software/wyn-integration。

   npm install @grapecity-software/wyn-integration

2.2 集成门户

1. 集成文档门户，示例代码入如下：

   import { WynIntegration } from "@grapecity-software/wyn-integration";
   
   let portal: any = null;
   const createPortal = (baseUrl, token, title, documentId) => {
       if (portal) {
           portal.destroy();
       }
   
       WynIntegration.createDocumentPortal({
           baseUrl: baseUrl,
           token: token,
           theme: 'default',
           language: 'zh',
       }, '#wyn-root').then(ins => {
           portal = ins;
       });
   }

• 参数说明：

  • baseURL 指 Wyn服务器的地址。

  • token 指访问Wyn服务器的令牌，在 Wyn的的「系统管理>安全设置>生成令牌」界面生成，token 所代表的用户需要具有创建仪表板的权限。具体获取方法，请详见生成令牌。

  • theme 指文档主题。

  • language 指画面语言配置。

• 更多的设置参考API文档：文档门户集成API。

2.3 集成示例

1. 集成数据源

   1）示例代码：

   import { WynIntegration } from "@grapecity-software/wyn-integration";
   
   let portal: any = null;
   const createPortal = (baseUrl, token, title, documentId) => {
       if (portal) {
           portal.destroy();
       }
   
       WynIntegration.createDocumentPortal({
           baseUrl: baseUrl,
           token: token,
           theme: 'default',
           language: 'zh',
           hideNav: true,
           entry: 'datasource',
       }, '#wyn-root').then(ins => {
           portal = ins;
       });
   }

   2）集成效果：

   
   

2. 集成可切换目录的目录列表

   1）示例代码：

   import { WynIntegration } from "@grapecity-software/wyn-integration";
   
   let portal: any = null;
   const createPortal = (baseUrl, token, title, documentId) => {
       if (portal) {
           portal.destroy();
       }
   
       WynIntegration.createDocumentPortal({
           baseUrl: baseUrl,
           token: token,
           theme: 'default',
           language: 'zh',
           hidePrimaryNav: true,
           entry: 'categories',
       }, '#wyn-root').then(ins => {
           portal = ins;
       });
   }

   2）集成效果：