@huzan/hz-history-message NPM

hz-history-message

Install

npm install --save @huzan/hz-history-message

Usage

import React, {Component} from 'react'

import {Messages, ViewContextModal} from '@huzan/hz-history-message'
import '@huzan/hz-history-message/style'

// 搜索查看聊天记录
class ExampleMessages extends Component {
    render() {

        const options = {
              apiHost,
              accessToken,
              requestOptions,
              fromUin,
              toUsername,
              activeSession, // 对话 {from: {uin, head_img_url, nickname, remark}, target: {username, alias, head_img_url, remark_name}}
              contentHeight, // 内容高度（搜索项和聊天记录列表）
              keyword, // 搜索关键字
              onClickImage, // 自定义图片点击 {url, images, activeIndex}
              onClickVideo, // 自定义视频点击 {url}
        }

        return <Messages {...options}/>
    }
}

// 直接查看上下文弹窗
class ExampleViewContextModal extends Component {
    render() {

        const options = {
              apiHost,
              accessToken,
              requestOptions,
              fromUin,
              toUsername,
              keyword, // 高亮关键字
              activeRecord, // 需要定位的记录 {create_time: timestamp}
              listHeight, // 聊天记录列表的高度
              renderBtn = {
                  (setTrue) => (
                      <Button
                          type="primary"
                          onClick={setTrue}
                          >
                          查看上下文
                      </Button>
                  )
              }
              modalOption = { // 自定义弹窗
                  {
                      title: '聊天记录上下文',
                      okText: '确定',
                      cancelText: '取消'
                  }
              }
              onClickImage, // 自定义图片点击 {url, images, activeIndex}
              onClickVideo, // 自定义视频点击 {url}
        }

        return <ViewContextModal {...options}/>
    }
}