visualization-wizard-sdk
v1.0.5
Published
The embedded js for guide modal
Downloads
13
Readme
visualization-wizard-sdk
Install
npm install visualization-wizard-sdk --save
Usage
指引内容抽屉
引入js后,会在window下挂载Drawer类,使用方法,以日常环境数据为例:
import { Button } from 'antd';
import 'visualization-wizard-sdk';
function open() {
const drawer = new Drawer({
width: 884,
afterVisibleChange: visible=> console.log('visible',visible),
stepCode: "152",
// sectionCode: ["9999987652", "22344221223wewew"],
targetOffset: 0,
userGuid: '11111111111111',
userName: '张三',
userCode: '11111111111111',
});
drawer.show();
}
ReactDOM.render(
<Button onClick={open}>打开Drawer</Button>,
mountNode,
);
props:
| 成员 | 说明 | 类型 | 默认值 | 是否必填 | | ------ | -------------------------------- | ------------------- | ------ | ------- | | width | 抽屉组件宽度 | number | 884 | 非必填 | | afterVisibleChange | 弹窗动画完成回调函数 | function | - | 非必填 | | stepCode | 二级步骤id | string | - | 必填 | | sectionCode | 根据章节标识码,渲染对应章节 | Array<string> | - | 非必填 | | targetOffset | 锚点距离窗口顶部滚动偏移量 | number | 0 | 非必填 | | userGuid | 当前系统登录用户guid | string | - | 非必填 | | userName | 当前系统登录用户账号 | string | - | 非必填 | | userCode | 当前系统登录用户Code | string | - | 非必填 |
①当只传二级步骤ID,则返回该二级步骤的全部内容进行展示。
②传二级步骤ID+章节标识码(可以多个,多个章节标识码,用英文逗号隔开),则返回该二级步骤的视频以及相应章节的内容。
方法签名如下:
/**
* @param{number} width: 抽屉组件宽度,默认为884
* @param{function} afterVisibleChange: 弹窗动画完成回调函数
* @param{string} stepCode: 二级步骤id,必填
* @param{Array<string>} sectionCode: 根据章节标识码,渲染对应章节
* @param{number} targetOffset: 锚点距离窗口顶部滚动偏移量,默认值为 0
* @param{string} userGuid: 当前系统登录用户guid
* @param{string} userName: 当前系统登录用户账号
* @param{string} userCode: 当前系统登录用户Code
* @return{undefined}
**/
interface DrawerConfig {
width?: number;
afterVisibleChange?: () => void;
stepCode: string | number;
sectionCode?: Array<string>;
targetOffset?: number;
userGuid?: string;
userName?: string;
userCode?: string;
}
declare var DrawerType: (config: DrawerConfig) => () => void;
changelog
- v1.0.0: 添加内容指引 SDK;
- v1.0.1: 修改富文本内容样式;
- v1.0.2: 章节一行展示,超出显示省略号
- v1.0.3: 添加 sdk 使用文档
备注
获取内容指引数据接口,需要配置 ng 转发, 前缀为'/utc-wizard',
日常环境转发路径为 'http://utc-gateway-daily.ingress.dayu.work',
预发环境转发路径为 'http://utc-gateway-pre.ingress.dayu.work',