# 安装

npm install @opentapd/tapd-open-js-sdk
1

# 使用

import SDK from "@opentapd/tapd-open-js-sdk";

const sdk = SDK();

sdk.events.on('event from ', function(data){
  return 'world'; // return to tapd
})

sdk.handler('handle name', {
  hello: 'world', // You param to you service
})

sdk.navigator.openAppIndex('rul')

sdk.ui.openDialog({url: 'tencent.com'})
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

# SDK方法

# SDK-调用TAPDUI

  • 调用tapd的消息提示组件 .alert(message: string)

    sdk.ui.alert('Hello World')
    
    1
  • 调用TAPD侧的确认框 .confirm(message: string) => Promise

    sdk.ui.confirm('来个点赞3连?')
      .then(() => {
        alert('THX 😍')
      })
    
    1
    2
    3
    4
  • 调用TAPD侧弹框 .openDialog(params)

    sdk.ui.openDialog(params)
    
    1
    • 参数说明:
    title: string   (弹窗标题)
    url: string   (弹窗URL)
    height: number    (高度)
    width: number   (宽度)
    showBtn: boolean    (是否显示确认按钮)
    btnYesText: string    (确认按钮文本)
    btnNoText: string   (取消按钮文本)
    
    1
    2
    3
    4
    5
    6
    7
  • 关闭TAPD侧弹窗 .closeDialog()

    sdk.ui.closeDialog()
    
    1
  • 调整弹框大小 .resizeDialog(width: number, height: number)

    sdk.ui.resizeDialog(300, 400)
    
    1

# SKD-调用插件handler

  • function调用 .handler(handlerName: string, params = {}) => Promise <res>
    sdk.handler('story', {id: 'tsets'});
    
    1
    • 参数说明:
    handlerName: 接口名
    params: 传递给接口的参数。只支持普通对象
    
    1
    2

# SDK-调用navigator

  • 于TAPD侧打开调用sdk的嵌入应用新的页面。url 为嵌入应用的路由 .openAppIndex(url: string)

    sdk.navigator.openAppIndex('/about')
    
    1
  • 打开TAPD业务对象的详情页(目前只支持需求,任务,缺陷).openObjectWindow(params: { entityType: string, entityId: string })

    sdk.navigator.openObjectWindow({entityType: 'story', entityId: '123'})
    
    1
  • 更新当前浏览器的路由,一般用于同步嵌入应用路由与浏览器路由 .syncUrl(options: {url: string, refresh: bolean})

    sdk.navigator.syncUrl({url: 'exmaple.com', refresh: true})
    
    1
    • 参数说明:
    url: 目标路由
    refresh: 更新路由后是否刷新页面
    
    1
    2
  • 更新Tab页扩展模块的数值 .updateTabCount({count: number, refresh: bolean})

    sdk.navigator.updateTabCount({count: 100, refresh: false})
    
    1
    • 参数说明:
    count: 数值
    refresh: 更新路由后是否刷新页面(默认为false)
    
    1
    2
  • 详情页Tab切换(目前只支持需求,任务,缺陷详情页) .openObjectTab({tabName: string})

    sdk.navigator.openObjectTab({tabName: '变更历史'})
    
    1
    • 参数说明:
    tabName: Tab名称
    
    1

# SDK-获取context

  • 获取当前页面嵌入TAPD的配置信息 .getEntranceData() => Promise <entranceConfigs >

    const entranceConfigs = await sdk.context.getEntranceData() // return {appId, entranceId, code}
    
    1
    • 返回值说明:
    返回 entranceConfigs
    appId: 应用ID
    code: tapd Token
    entranceId: 挂载点ID
    
    1
    2
    3
    4
  • 更新tapd授予码code,一般用于授权码过期 .refreshOAuthCode() => Promise <code>

    const newCode = await sdk.context.refreshOAuthCode()
    
    1

# SDK-iframe通信

  • 当在TAPD的页面中有多个挂载点页面,可以通过这个方法在不同挂载点间通信 .syncPageEvent(params: {entranceId: string, data: any}) => Promise

    sdk.iframe.syncPageEvent({
      entranceId: 'app_for_obj_detail_bottom_card',
      data: {
        msg: '下次一定'
      }
    })
    
    1
    2
    3
    4
    5
    6
  • 调整应用在TAPD侧的高度 .setPageHeight(height: number)

    sdk.iframe.setPageHeight(400)
    
    1

# SDK-调用command

  • 当嵌入应用页面在tapd的业务对象(需求,任务,缺陷)详情页面,将更新页面里的附件列表 .refreshAttachmentList()

    sdk.command.refreshAttachmentList()
    
    1
  • 当嵌入应用页面在tapd的业务对象(需求,任务,缺陷)详情页面, 可以唤起挂在类型为 app_for_obj_detail_bottom_card 的挂载页面 .showObjDetailBottomCard()

    sdk.command.showObjDetailBottomCard()
    
    1

# SDK-调用request

  • 调用tapd侧的人名搜索接口 .getUserListByKeyWords(params: {key_word: string, workspace_id: string, per_page: number}, configs: {timeout: number }) => Promise <response>

    sdk.request
      .getUserListByKeyWords({
        key_word: 'tom',
        workspace_id: '1'
      })
      .then((response) => {
        console.log(response)
      })
    
    1
    2
    3
    4
    5
    6
    7
    8
    • 参数说明:
    keyword: String (搜素的关键字)
    workspace_id: String (TAPD项目ID)
    
    1
    2
    • 返回值说明:
    返回 response
    data: Array (用户列表)
    
    1
    2
  • 调用TAPD侧获取项目下人员名单接口 .getWorkspaceMemberList(params: {workspace_id: string,page_size: number, page: number }) => Promise<response>

    sdk.request
      .getWorkspaceMemberList({
        page_size: 100,
        workspace_id: '1',
        page: 1
      })
      .then((response) => {
        console.log(response)
      })
    
    1
    2
    3
    4
    5
    6
    7
    8
    9
    • 参数说明:
    page_size: Number (每页条数)
    workspace_id: String (TAPD项目ID)
    page: Number (第几页)
    
    1
    2
    3
    • 返回值说明:
    返回 response
    data: Array (用户列表)
    count: String (总人数)
    
    1
    2
    3
  • 获取对象相关成员名单 .getAllRelateMember(params: object}) => Promise

    sdk.request.getAllRelateMember({
      workspace_id: '755',
      entity_type: 'bug',
      entity_id: '1000000755089798713',
      include_self: 1
      include_relate_story_member: 0
      include_sub_story_member: 0
    })
    .then((response) => {
    console.log(response)
    })
    
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    • 参数说明:
    workspace_id: String (TAPD项目ID)
    entity_type: String (资源类型: story|bug|task)
    include_self: Number (是否包括用户: 0 | 1)
    include_relate_story_member: Number (是否包含关联需求: 0 | 1)
    include_sub_story_member: Number (是否包含子需求: 0 | 1)
    
    1
    2
    3
    4
    5
    • 返回值说明:
    返回 response
    data: Array (用户列表)
    
    1
    2

# SDK-event监听

  • 监听来着TAPD侧的事件 .on(event: string, cb: data => res, config: {once: bolean})

    sdk.events.on('ConfirmYes', function() {
      return {
        id: 'target Objct ID'
      }
    }, {
      once: true
    })
    
    1
    2
    3
    4
    5
    6
    7
    • 参数说明:
    event: 事件名
    cb: 回调函数,参数为接受的数据,当在函数中返回数据时,将会把返回的数据发回给TAPD
    once: 是否只监听一次
    
    1
    2
    3
  • 发送事件给TAPD侧 .send({event: string, params: obj})

    // 特定的挂在点接受特定的事件,如下例子为列表更多操作拓展获取筛选条件、选中项目
    const selected = await sdk.events.send({
      event: 'getSelectedContext',
    })
    
    1
    2
    3
    4
    • 参数说明:
    event: 事件名
    
    1
上次更新: 2024-05-17 19:18:27