## 组件说明

1. 此组件为页面组件，实现了 WebSocket连接/好友/群组/新消息/历史消息，且都是 全局配置/全局本地化存储，兼容 H5/微信小程序/安卓App <font color="gray">*（ 其它平台未测试 ）*</font>

<br><br>
## 自行准备内容

1. 此组件提供示例工程，其中的 接口服务 和 WebSocket服务 ，仅供各位开发者调试使用，正式发布需自行实现

2. 接口服务，实现 /api/chat.js 和 /api/login.js 里面的方法

3. WebSocket服务，实现 连接和心跳检测/离线消息/在线消息/已读回执4种类型消息处理

<br><br>
## 引用说明

### 1. 路由说明

导入组件后，会在 pages.json 中自动注册组件，若未注册可手动添加
``` javascript
{
	"path": "uni_modules/vrapile-im/pages/home/chatHome",
	"style": {
		"enablePullDownRefresh": false,
		"navigationBarTitleText": "消息"
	}
},
{
	"path": "uni_modules/vrapile-im/pages/chat/chatFriend",
	"style": {
		"enablePullDownRefresh": false,
		"navigationBarTitleText": "聊天"
	}
}
```

可在导航中配置 IM 消息页面

``` javascript
"tabBar": {
	"selectedColor": "#0000ff",
	"list": [
		{
			"pagePath": "uni_modules/vrapile-im/pages/home/chatHome",
			"iconPath": "static/image/tabbar/chat.png",
			"selectedIconPath": "static/image/tabbar/chat-fill.png",
			"text": "消息"
		},
		{
			"pagePath": "pages/home/user",
			"iconPath": "static/image/tabbar/user.png",
			"selectedIconPath": "static/image/tabbar/user-fill.png",
			"text": "我的"
		}
	]
},
```

### 2. 页面样式修改
  当前页面样式在 <font color="Magenta">/uni_modules/vrapile-im/static/style/</font> 下的 <font color="Magenta">nine-chat-home-001.scss</font> 和 <font color="Magenta">nine-chat-friend-001.scss</font> 

  可在 <font color="Magenta">/static/style/</font> 下的 <font color="Magenta">nine-chat-home-001.scss</font> 和 <font color="Magenta">nine-chat-friend-001.scss</font> 中重写样式替换

<br><br>
## 演示说明

<font color="gray">*以下所有工程共用一个后端，账号互通
（ 账号/密码：visitor/visitor ）*</font>
<br><br>

示例工程 [<a href="https://git.ninecloud.top/yuanlei/udemo-im.git" target="_blank"> 源码 </a>] 运行效果：

<a href="https://www.ninecloud.top/udemo/im/index.html" target="_blank">https://www.ninecloud.top/udemo/im/index.html</a>

<img src="https://fs.ninecloud.top/uniapp/udemo/im/qrcode.png" width="300">
<br><br><br>


演示商城效果：<font color="gray">（ *H5中可下载安卓App* ）</font>
<br>
<a href="https://www.ninecloud.top/unine/index.html" target="_blank">
	https://www.ninecloud.top/unine/index.html
</a>

<img src="https://fs.ninecloud.top/uniapp/unine/qrcode.png" width="300">
<br><br><br>

演示PC前端：<font color="gray">（ *与此组件无关，可用于多端消息互相发送测试* ）</font>
<br>
<a href="https://www.ninecloud.top/msw/index" target="_blank">
	https://www.ninecloud.top/msw/index
</a>
<br><br><br><br>

<font color="gray">
*注：通过以上系统新注册账号，默认添加 visitor 为好友，默认加入 客服专用群*

*以上任意系统之间，IM消息皆能同步显示*
</font>