tingwu-meeting-sdk

阿里巴巴达摩院语音实验室听悟会议 UI 组件

安装

npm install tingwu-meeting-ui-components -S

TingwuMeetingClient

参数

| 参数 | 说明 | 类型 | | ------ | ------------------------ | ------ | | server | 域名，暂用听悟服务地址。 | string | | notLoginListener | 未登陆监听(非必需) | () => void |

方法

| 参数 | 说明 | 类型 | 默认 | | ----------------- | ------------------------ | ---------------------------------------- | ---- | | setMeetingInfo | 设置会议信息 | (meetinInfo: MeetingInfo) => void | null | | setLivMeetingInfo | 设置当前进行中的会议信息 | (livMeetingInfo: LivMeetingInfo) => void | null |

MeetingList

听悟会议纪要列表 UI 组件

参数

| 参数 | 说明 | 类型 | 默认 | | -------------- | --------------------- | -------------------------------- | ----- | | onStartMeeting | 点击开始会议的回调 | ()=>void | null | | onGotoDetail | 前往会议详情的回调 | (meetingInfo: MeetingInfo)=>void | null | | onGotoLiving | 前往实时会议的回调 | (meetingInfo: MeetingInfo)=>void | null | | onGoback | 标题栏后退按钮的回调 | (...args: any[])=>void | null | | deviceStatus | 设备状态准备是否就绪 | boolean true 为准备就绪 | true | | loading | 开启会议 loading 状态 | boolean true 为加载中 | false | | listHeightValue | 控制列表页整体高度 | string | 100vh |

MeetingLive

听悟会议转写直播 UI 组件

参数

| 参数 | 说明 | 类型 | 默认 | | ---------------- | ------------------------------------ | -------------------------------------- | ---- | | mc | 拉取会议内容接口所需入参 | string | null | | onPauseRecord | 执行暂停的回调 | (transId: number)=>void | null | | onResumeRecord | 执行恢复的回调 | (transId: number)=>void | null | | onFinishRecord | 执行结束的回调 | (transId: number)=>void | null | | onChangeTitle | 执行修改标题的回调 | (transId: number)=>void | null | | onGoback | 标题栏后退按钮的回调 | (...args: any[])=>void | null | | onMeetingCreated | 进入实时会议组件后抛出组件信息的回调 | (livMeetingInfo: LivMeetingInfo)=>void | null | | liveHeightValue | 控制列表页整体高度 | string | 100vh |

MeetingDetail

听悟会议纪要详情页 UI 组件

参数

| 参数 | 说明 | 类型 | 默认 | | -------------------------- | -------------------- | --------------------------------------------------------------------------------- | ------------------------------ | | summaryInfo.buttonText | 整理纪要的按钮文案 | any | null | | summaryInfo.onSummaryCilck | 整理/查看纪要的回调 | (transId: number)=>void | null | | onDigest | 摘取纪要的回调 | (paragraphValue: string, info: ParagraphType)=>void | null | | onGoback | 标题栏后退按钮的回调 | (...args: any[])=>void | null | | fileHeightValue | 离线页面的最外层高度 | number/string | 100vh | | getVideoUrl | 获取视频 URL | (playbackIdentifier: string) => Promise<{ status: 0 / 1 / 2, videoUrl?: string, nextTime?:number }> | status: (0 计算中 1 成功 2 失败); nextTime(下次拉取时间): 默认10s | | onFullScreen | 放大视频 | (videoInfo: { title: string; url: string }) => void| null |

使用

import React from 'react';
import TingwuMeetingClient from 'tingwu-meeting-ui-components';
import "tingwu-meeting-ui-components/dist/style.css"

interface IProps {}

interface IState {}

class TinwuMeetingSdkTest extends React.Component<IProps, IState> {
  tingwuMeetingSdk: TingwuMeetingClient;

  constructor(props: IProps) {
    super(props);
    this.tingwuMeetingSdk = new TingwuMeetingClient({
      server: '',
      notLoginListener:()=>{}
    });
  }

  render() {
    const { MeetingLive, MeetingList, MeetingDetail } = this.tingwuMeetingSdk;
    return (
      <div
        style={{
          width: 310,
          height: 1000,
          margin: '0 auto',
          border: '1px solid gray',
        }}
      >
        <MeetingList
          onStartMeeting={() => {}}
          onGotoDetail={() => {}}
          onGoback={()=>{}}
          deviceStatus = {false || true}
          loading = {false || true}
          listHeightValue = '100vh'
        />
        <MeetingLive
          meetingTime={0}
          onResumeRecord={() => {}}
          onFinishRecord={() => {}}
          onPauseRecord={() => {}}
          onChangeTitle={()=>{}}
          onGoback={()=>{}}
          onMeetingCreated={()=>{}}
          liveHeightValue = '100vh'
        />
        <MeetingDetail
          transId={0}
          summaryInfo={{
             buttonText: '';
             onSummaryCilck: (transId: number) => {};
          }}
          onDigest={(paragraphValue: string, info: ParagraphType)=>{}}
          onGoback={()=>{}}
          onFullScreen={(videoInfo: { title: string; url: string })=>{}}
          fileHeightValue={`calc(100vh + ${headerHegith})`}
          // fileHeightValue={1038}
          getVideoUrl={(playbackIdentifier: string) => {
          return new Promise((resolve, reject) => {
            resolve({
              status: 1,
              videoUrl: '',
              nextTime: 10000,
            });
          })
        }}
        />
      </div>
    );
  }
}

export default TinwuMeetingSdkTest;