Terminal-app-sdk NPM

环境要求

Node 12+

npm包引入

适用于React、Vue以及Angular都Cli项目.通过ESModule的包形式引入.

包安装

npm install terminal-app-sdk

最佳实践

以vue-cli举例(其他框架也需要在sdk调用ready方法后进行页面挂载)

import { createApp } from "vue";
import App from "./App.vue";

import terminalSDK from "terminal-app-sdk";
const appSDK = new terminalSDK({
  requestUrl: {
    bizapi: "https://bizapi.infocloud.cc",
    sso: "https://sso.infocloud.cc",
    abos: "https://abos-service.infocloud.cc",
  },
});
appSDK.ready().then((res) => {
  // 初始化已完成
  console.log(res); // 返回sdk加载成功信息
  createApp(App).mount("#app");
});

页面引入

适用于html页面引入,表单编辑器项目在编辑器初始化之前完成sdk的初始化.

最佳实践

在表单编辑器的页面中,我们提供了initSDK函数,用于获取terminalSDK实例.通过回调函数获取到初始化完成后的实例对象.并挂载到表单编辑器的jForm.Options对象上,用于后续能力的使用

<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8" />
    <title>developer</title>
    <style media="screen">
      .hide-input-name {
        /**
				 * 开发模式打开
				 */
        display: table-row;
      }
    </style>
    <script
      src="https://bizpc-uat.infocloud.cc/sheeteditor/dev/dev.js"
      charset="utf-8"
    ></script>
      // 引入terminalSDK
    <script src="https://terminal-service-uat-static.infocloud.cc/sdk/terminalSDK/index.umd.js"></script>
    <script type="text/javascript">
      // 关键代码
      let sdkTimeOut;
      initSDK((appSDK) => {
        jForm = {};
        jForm.Option = {
          editorDomain: "http://localhost:8090/",
          datasheet: "https://bizapi-uat.infocloud.cc/sheet/",
          config: {
            terminalSDK: appSDK,  // 挂载到jForm.Options下供全局使用
          },
          authkey: "XMHFRUKIBW7********4PNROD3QA2",
        };
      });
      function initSDK(cb) {
        ifRead();
        function ifRead() {
          if (sdkTimeOut) {
            clearTimeout(sdkTimeOut);
          }
          if (window.terminalSDK) {
            let appSDK = new window.terminalSDK({
              requestUrl: {
                bizapi: "https://bizapi.infocloud.cc",
                sso: "https://sso.infocloud.cc",
                abos: "https://abos-service.infocloud.cc",
              },
            });
            appSDK.ready().then((res) => {
              cb(appSDK);
            });
          } else {
            sdkTimeOut = setTimeout(() => {
              ifRead();
            }, 100);
          }
        }
      }
    </script>
  </head>
  <body style="visibility: collapse"></body>
</html>
<script type="text/javascript">
  /**
   * 二次开发环境必须提供getDeveloperPlugin函数
   *
   * @param    plg         plugin.json文件内容
   * @param    category    plugin.json 文件按照category分类后的内容
   * @return  返回Plugin对象(参考编辑器Plugin对象定义)
   */
  function getDeveloperPlugin(plg, category) {
    return [
      {
        label: "基础",
        labelType: "base",
        sub: [
          {
            name: "演示",
            labelType: "演示",
            list: category.演示 || [],
          },
          {
            name: "常用组件",
            labelType: "常用组件",
            list: category.default || [],
          },
          {
            name: "能力组件",
            labelType: "能力组件",
            list: [],
          },
          {
            name: "其他",
            labelType: "其他",
            list: category.其他 || [],
          },
        ],
      },
      {
        label: "表单",
        labelType: "表单",
        sub: category.表单 || [],
      },
      {
        label: "图表",
        sub: [
          {
            name: "简单图表",
            labelType: "简单图表",
            list: category.简单图表 || [],
          },
        ],
      },
    ];
  }
</script>

axios vite

@everything-registry/sub-chunk-2891 @infinitebrahmanuniverse/nolb-term

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago