# i3v-meet-system

> ``` npm install i3v-meet-system ```

Latest version **2.9.35** (published 2025-11-27) · ISC license · 0 weekly downloads

## Install

```sh
npm install i3v-meet-system
pnpm add i3v-meet-system
yarn add i3v-meet-system
bun add i3v-meet-system
```

## Health

**Score 50/100 (C)** — status: stable.

Positive: esm support; no vulnerabilities.

Warnings: low downloads; no types.

## Facts

| | |
|---|---|
| Version | 2.9.35 |
| Published | 2025-11-27 |
| First published | 2024-03-18 |
| Weekly downloads | 0 |
| License | ISC |
| TypeScript types | none |
| Module format | ESM + CommonJS |
| Dependencies | 7 |
| Unpacked size | 5.2 MB |
| Known vulnerabilities | 0 (+1 in 1 direct dependencies) |
| Install scripts | no |
| Author | junhe |
| Maintainers | technologylulu, xk_c |
| Keywords | i3v-meet-system |

## Links

- npm: https://www.npmjs.com/package/i3v-meet-system
- Repository: http://220.168.85.72:3000/public-services/i3vmeet-web
- npm.io page: https://npm.io/package/i3v-meet-system

## Dependencies (7)

- [ws](https://npm.io/package/ws.md) ^8.17.1
- [vue](https://npm.io/package/vue.md) ^2.6.14
- [axios](https://npm.io/package/axios.md) ^1.8.2
- [bowser](https://npm.io/package/bowser.md) ^2.11.0
- [exceljs](https://npm.io/package/exceljs.md) ^4.4.0
- [element-ui](https://npm.io/package/element-ui.md) ^2.15.13
- [globalthis](https://npm.io/package/globalthis.md) ^1.0.3

## Recent versions

- 2.9.35 (latest) — 2025-11-27
- 2.9.34 — 2025-11-03
- 2.9.33 — 2025-10-27
- 2.9.32 — 2025-10-17
- 2.9.31 — 2025-10-11
- 2.9.30 — 2025-09-23
- 2.9.29 — 2025-09-19
- 2.9.28 — 2025-09-19
- 2.9.27 — 2025-09-12
- 2.9.26 — 2025-09-12
- 2.9.25 — 2025-09-05
- 2.9.24 — 2025-08-29
- 2.9.23 — 2025-08-22
- 2.9.22 — 2025-07-31
- 2.9.21 — 2025-07-29
- … 157 more at https://npm.io/package/i3v-meet-system/versions

## README

# 百雀会议网页端(I3V-Meet-System For WebSite)

## 推荐使用的集成开发环境及插件组(Recommended IDE And Plugin Setup)

- 集成开发环境：
- [Visual Studio Code](https://code.visualstudio.com/) 
- 插件：
- (必要)*1、[Vue Language Features (Volar)](https://marketplace.visualstudio.com/items?itemName=Vue.volar) (and disable Vetur)
- 2、[Chinese (Simplified) (VS Code的简体中文语言包)](https://marketplace.visualstudio.com/items?itemName=MS-CEINTL.vscode-language-pack-zh-hans)
- (推荐)3、[npm Intellisense](https://marketplace.visualstudio.com/items?itemName=christian-kohler.npm-intellisense)，此插件可以一键执行相应package.json中的脚本
- 4、[TypeScript Vue Plugin (Volar)](https://marketplace.visualstudio.com/items?itemName=Vue.vscode-typescript-vue-plugin)

## 首次打开本项目需要了解的操作(Necessary Operations Before First Development)
请按步骤检查以下配置：


### 1、node.js运行时环境
如果您的设备没有下载过node.js运行时环境,请[前往下载](https://nodejs.org/zh-cn)，有则通过此步骤



#### 准备体验npm Intellisense插件的便携性
以下2~5中的对应命令【……】，您可以通过[npm Intellisense]插件执行package.json的文件中对应的脚本命令，他们是效果完全相同的

### 2、安装/更新依赖
请在终端中cd到本项目的目录并执行命令【npm install】


### 3、启动本机测试
在终端中cd到本项目的目录并执行命令【vue-cli-service serve】

等待出现
- App running at:
- \- Local:   https://localhost:8080
- \- Network: ……

后就可以在本地浏览器输入对应链接后打开测试了，每次保存文件都会自动热重载


### 4、打包前准备
你需要检查一些关键设置！！！在 “MeetSystem-website\src\data-center\environmentCenter.js” 中：
- 1、EXPLORER_TYPE 决定打包内容的浏览器类型 (网页端为 "normal", electron 客户端为 "electron", 手机客户端为 "mobile")
- 2、EnvironmentSelector 决定使用的后端

MeetSystem-website\package.json文件的version需要修改为新版本

MeetSystem-website\src\data-center\descriptionCenter.js的帮助文本需要新增新版说明

MeetSystem-website\src\components\MainContent\MeetingPanel\C31_MeetingLobby.vue中的readyDownload中的客户端安装包需要更新(更新为相应版本)

### 5、打包项目
终端中cd到本项目目录并执行命令【vue-cli-service build】

稍等打包完成后，与网站有关的所有内容将在dist文件夹中
- 如需部署站点，直接复制dist文件夹内所有内容到站点文件夹中即可
- 如需用于客户端，直接复制dist文件夹内所有内容到【MeetSystem-electron】项目的web目录（如无需自行创建）中，也可以通过执行命令将dist文件夹复制到指定目录

【rimraf ../MeetSystem-electron/web && xcopy dist ..\\MeetSystem-electron\\web\\ /E】

#### 如果在打包时就确定需要直接用于客户端，可执行以下命令，打包后直接复制到对应目录，更便捷

【rimraf ../MeetSystem-electron/web && vue-cli-service build && xcopy dist ..\\MeetSystem-electron\\web\\ /E】


#### 体验npm Intellisense插件的便携性
上述2~5中的对应命令，您可以通过[npm Intellisense]插件执行package.json的文件中对应的脚本命令，他们是效果完全相同的



# 以上是由Luyi新撰写的README文件，以下为保留的旧README参考文件






# 支持的环境

```dependencies
vue ^2.6.14
```

```devDependencies
@vue/cli-plugin-babel": "~5.0.0"
@vue/cli-plugin-eslint": "~5.0.0"
@vue/cli-plugin-router": "~5.0.0"
@vue/cli-plugin-vuex": "~5.0.0"
@vue/cli-service": "~5.0.0"
```

# 安装

```js
npm install i3v-chat-system
npm install -D @babel/plugin-proposal-private-methods
```

# 配置

```js
# 在babel.config.cjs文件添加以下配置
plugins: ["@babel/plugin-proposal-private-methods"],

```

## 初始化

```js
import { $tinode } from  "i3v-chat-system"

//  初始化$tinode(只应该执行一次)
// 填写配置初始化
$tinode.init({
    appName : 'appName', // 必填
    host : 'host', // 必填
    apiKey : 'apiKey', // 必填
    transport : 'transport',
    secure : 'secure'
    onSetupCompleted = () => { console.log('初始化完成') },
})

// 检查是否连接到聊天服务器
const isConnected =await $tinode.connect()
if(!isConnected) {
  console.log("无法连接到聊天服务器")
  return
}

// 通过用户名和密码登录
const { code } = await $tinode.loginBasic({ username: "登录名一般是手机号", password: "密码一般是sass系统或者业务系统的token"})
if(code === 200){
  console.log("登录成功,可以使用聊天界面组件了")
}
```

## 退出聊天系统

```js
$tinode.instance.disconnect();
```

## 使用内置聊天组件

```js
// 引入组件
import { ChatMenu, MessageAndInput } from "i3v-chat-system"
components:{
  ChatMenu, MessageAndInput
}
//  判断是否已经授权
const isAuthenticated = $tinode.instance.isAuthenticated()
// 输出聊天好友列表
<ChatMenu v-if="isAuthenticated" @on-set-topic="onSetTopic" :filter="(topic) => true" />
// 其中filter是一个函数，用于过滤列表。

// 点击列表中的一项选择当前的topic，并且可以把它传参给MessageAndInput
onSetTopic(topic){
  this.topic = topic
}

// 如果不使用聊天列表组件，可以通过如下方法获取可聊天的话题数组:
const topicList = $tinode.getState('topicList')

// 使用聊天信息和输入界面,传入选择到的topic参数
// hasCloser： 是否显示关闭按钮;如果使用，用户按关闭按钮时，通过订阅"tinode-askClose"执行
// autoScrollBottom 是否自动滚动到底部，默认值是false
<MessageAndInput v-if="isAuthenticated" :topicId="topic.topic" :hasCloser="true" :autoScrollBottom="autoScrollBottom" />
```

## 使用对接业务系统的批量显示组件 BizDataDisplay

```js
import { BizDataDisplay } from "i3v-chat-system"

// 显示系统通知界面，包括任务通知等
<BizDataDisplay
  :topicId="topicId"
  :dataList="dataList"
  :uid="myUserBizId"
  :typeAlias="typeAlias"
  :msgAlias="msgAlias"
  @on-emit="handleEmit"
/>

// 参数说明
  topicId: 聊天机器人id
  dataList: 业务系统取得的分页系统消息数据
  uid: 业务系统的用户id
  typeAlias: String, // dataList元素中"busType"字段的别名；如果dataList元素里业务类型字段名是businessType,可以通过设置 typeAlias: "businessType"做映射
  msgAlias: String, // dataList元素中"msgContent"字段的别名；如果dataList元素里消息内容字段名是msgContent,可以通过设置 typeAlias: "msgContent"做映射

// dataList是从业务系统传来的数据，必须包含以下字段:
{
  id: String, // 消息的id，必须是唯一值
  isRead: Boolean, // 是否已读
  busType: String, // 业务类型，如'2','approval'等
  msgContent: String // 包含消息内容的JSON字符串
  creatTime: String // 创建时间
  ...  // 其它数据
}

// handleEmit参数如下：
{
  operation: "操作字符串",
  data: {} // 是从dataList传入的的元素
}
```

### operation 包含以下值

```js
// operation的可能值列表
"ask-comment-task"; // 要求对任务评论
"ask-detail-task"; // 要求查看任务详情
"ask-confirm-task"; // 要求确认任务
"ask-reject-task"; // 要求拒绝任务
"ask-detail-tenent"; // 要求查看企业详情
"ask-confirm-tenent"; // 要求要求确认加入企业的申请
"ask-reject-tenent"; // 要求拒绝加入企业的申请
"ask-detail-project"; // 要求查看项目详情
"ask-confirm-task-attention"; // 要求确认任务关注
"ask-reject-task-attention"; // 要求拒绝任务关注
"ask-comment-approval"; // 要求评论立项审批
"ask-detail-approval"; // 要求查看立项审批详情
"ask-detail-project-report"; // 要求要求查看项目报告详情
"ask-comment-result-approval"; // 要求评论业绩审批
"ask-detail-result-approval"; // 要求查看业绩审批详情
"ask-mark-read"; // 要求对一条记录标记为已读
"ask-detail-clue"; // 要求查看线索详情
"ask-assign-clue"; // 要求分配线索
"ask-appoint-other-assign-clue"; // 要求指定他人分配线索
"ask-focus-clue"; // 要求关注线索
"ask-back-clue"; // 要求退回线索
"ask-change-clue"; // 要求转交线索
"ask-sure-clue"; // 要求确认线索
"on-scroll-top"; // 当滚动到顶部
"on-scroll-bottom"; // 当滚动到底部
"ask-detail-business"; // 要求查看商机详
"ask-detail-follow-up"; // 要求查看跟进详情
"ask-change-task"; // 要求转交任务
"ask-continue-task"; // 要求继续任务
"ask-accecptance-task"; // 要求验收任务
```

### 业务系统与 BizDataDisplay 的数据交换

    业务系统对每一个 operation 做处理后更新数据，应该使用$set

- this.$set(data, 'isRead', true) // 标记已读
- this.$set(this.dataList, idx, newData) // 更新一条数据
- this.dataList.push(...nextPageDataList) // 添加一页数据

## 使用对接业务系统的单条显示组件 BizDisplay

```js
  <BizDisplay
    :bizData="bizData"
    :uid="myUserBizId"
    :typeAlias="typeAlias"
    :msgAlias="msgAlias"
    @on-emit="handleEmit"
  />
```

# 使用 pubsub 与组件和聊天系统交互

```js
import PubSub from "pubsub-js";

/**
 * @description: 发布消息
 * @param {String} topic 订阅主题
 * @param {any} payload 负载
 * @return {token}
 */
function publish(topic, payload) {
  PubSub.publish(topic, payload);
}

/**
 * @description: 订阅消息
 * @param {Array} tokens 订阅列表
 * @param {String} topic 如on-click-row
 * @param {Function} callback 回调函数
 * @return {void}
 */
function subscribe(tokens, topic, callback) {
  validateTopic(topic);
  if (typeof callback === "function") {
    tokens.push(PubSub.subscribe(topic, (_, payload) => callback(payload)));
  }
}

/**
 * @description: 销毁订阅
 * @param {Array} tokens 订阅列表
 * @return {void}
 */
function unsubscribe(tokens) {
  tokens.forEach((token) => {
    PubSub.unsubscribe(token);
  });
  tokens.length = 0;
}
export default {
  publish,
  subscribe,
  unsubscribe,
};
```

```js
// 获取到未读消息总数
$pubsub.subscribe("tinode-totalUnreadCount", (number) => {
  console.log("未读消息总数：", number);
});

// 关闭聊天界面
$pubsub.subscribe("tinode-askClose", () => {
  /**业务系统关闭聊天界面*/
});
```

---
_Source: https://npm.io/package/i3v-meet-system · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._