From e85b9c2c0de91fb2b75921c43ca555a0b6b1a0ec Mon Sep 17 00:00:00 2001
From: Jason <chenjxlg@163.com>
Date: Tue, 18 Jan 2022 15:12:13 +0800
Subject: [PATCH] =?UTF-8?q?IM=20=E9=83=A8=E5=88=86=E9=A1=B5=E9=9D=A2?=
 =?UTF-8?q?=E9=80=BB=E8=BE=91=EF=BC=8C=E8=81=8A=E5=A4=A9=E5=88=97=E8=A1=A8?=
 =?UTF-8?q?-=E8=AF=A6=E6=83=85=E9=A1=B5?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .DS_Store                  |  Bin 0 -> 6148 bytes
 apis/interfaces/im.js      |   20 +-
 pages.json                 |   10 +-
 pages/im/chat.nvue         | 1208 ------------------------------------
 pages/im/chum.vue          |   19 -
 pages/im/detail.vue        |    9 +-
 pages/im/friends/index.vue |   14 +
 pages/im/friends/info.vue  |    8 +
 pages/im/friends/mine.vue  |    8 +
 pages/im/index.vue         |   63 +-
 store/modules/im.js        |    4 +-
 utils/im/index.js          |    4 +
 12 files changed, 94 insertions(+), 1273 deletions(-)
 create mode 100644 .DS_Store
 delete mode 100644 pages/im/chat.nvue
 delete mode 100644 pages/im/chum.vue
 create mode 100644 pages/im/friends/index.vue
 create mode 100644 pages/im/friends/info.vue
 create mode 100644 pages/im/friends/mine.vue

diff --git a/.DS_Store b/.DS_Store
new file mode 100644
index 0000000000000000000000000000000000000000..66544f017c880eea9e05fd2d544a58a0a328c19d
GIT binary patch
literal 6148
zcmeHKOKQU~5S>X)F?8c)m%2i3AWV9KT%aX^PzWxxN!DKVTsd0ad^X1I&e?=FFnZEx
zo`l}Q;}H?<&-=AVCn7D}P=0Ngo9&y=Y?ToO!g0o@>@M5y;rKNiX4!uSjQcD<a*_}D
zly7@9DnJFO02QDDRA5;Jvc9%2%O1<qr~nms00r#(P~e6&aSZfN2L^8efDOWKn0qe)
zEEWLP#4!*Nm<AOXRLvGcgN}H~yqY)$23<6p56zo3I~4WXaenc1(Hh8+3Q&Qm0#C8*
ztp2~j|LOmyB(A6c6?iBGwApMoJ)V@cb@n)`wFUkTx11~740ESo@Nx|Fa*TzQ<5y3L
aykc|g*TgZ<>4-ZW$e#hzg+>MLt-uXFauu5Z

literal 0
HcmV?d00001

diff --git a/apis/interfaces/im.js b/apis/interfaces/im.js
index e8fa10c..4c6c9b0 100644
--- a/apis/interfaces/im.js
+++ b/apis/interfaces/im.js
@@ -2,19 +2,27 @@ import {
     request
 } from '../index'
 
+const getImToken = () => {
+    return request({
+        url: 'im/token',
+    }, true)
+}
+
 const getFriends = () => {
     return request({
         url: 'im/friends',
-    })
+    }, true)
 }
 
 const getUserInfo = async (targetId) => {
-    const [err, res] = await request({
-        url: 'im/userInfo/' + targetId,
-    })
-    return res
+    const [err, res] = await uni.request({
+        url: 'http://api.zh.shangkelian.cn/api/im/userInfo/' + targetId,
+    })
+    return res.data.data
 }
 
 export {
-    getFriends
+    getImToken,
+    getFriends,
+    getUserInfo
 }
diff --git a/pages.json b/pages.json
index 8b8bd93..72c7d45 100644
--- a/pages.json
+++ b/pages.json
@@ -384,20 +384,12 @@
                         "buttons": [{
                             "float": "right",
                             "fontSrc": "/static/uniicons.ttf",
-                            "text": "\ue64d"
+                            "text": "\ue607"
                         }]
                     }
                 }
             }
         },
-        {
-            "path": "pages/im/chum",
-            "name": "ImChum",
-            "style": {
-                "navigationBarTitleText": "好友",
-                "enablePullDownRefresh": false
-            }
-        },
         {
             "path": "pages/wallet/add",
             "name": "WalletAdd",
diff --git a/pages/im/chat.nvue b/pages/im/chat.nvue
deleted file mode 100644
index e961d7f..0000000
--- a/pages/im/chat.nvue
+++ /dev/null
@@ -1,1208 +0,0 @@
-<template>
-	<view class="detail-main" :style="{height: mainHeight + 'px'}">
-		<view class="custom-nav">
-			<view class="bar-box" :style="'height: ' + (heightNum + 'px')"></view>
-			<view class="head-box">
-				<view class="flex-1 back-box" @click="goBack">
-					<image class="back-icon" src="../../static/icon/back.png"></image>
-				</view>
-				<view class="flex-1 flex-2 nav-title">
-					<text>{{currentInfo.userName}}</text>
-				</view>
-				<view class="flex-1 btn-text"></view>
-			</view>
-		</view>
-		<view class="message-box">
-			<list class="scroll-view_H" scroll-y="true" :scroll-top="scrollTop" 
-				:style="{height: scrollHeight + 'px'}" @scroll="scrollWatch">
-				<refresh v-if="hasMore" @refresh="onrefresh" class="refresh-box" @pullingdown="onpullingdown"
-					:display="refreshing ? 'show' : 'hide'">
-					<text class="loading-text">加载中...</text>
-					<loading-indicator class="loading-style"></loading-indicator>
-				</refresh>
-				<cell v-for="(item, index) in list" :key="item.id" :id="'into' + index">
-					<view class="left-bg" v-if="item.messageDirection === 2">
-						<view class="message-left flex">
-							
-							<image class="head-img" :src="currentInfo.userPortrait"></image>
-							<view>
-								<text v-if="!item.content.imageUri && !item.content.latitude && !item.content.remoteUrl"
-									class="left-info">{{item.content.content || ''}}</text>
-								<image style="width: 300upx;margin-left: 10upx;border-radius: 10upx"
-									v-if="item.content.imageUri" :src="item.content.imageUri"
-									@click="previewImg(item.content.imageUri)" mode="aspectFill"></image>
-								<view v-if="item.content.latitude" class="map-box" style="margin-left: 10upx">
-									<text class="map-text">{{item.content.poi}}</text>
-									<map class="map-style" :latitude="item.content.latitude"
-										:longitude="item.content.longitude" :markers="handleCovers(item)"></map>
-									<cover-view class="map-cover" @click="gotoLocationDetail(item)"></cover-view>
-								</view>
-								<view class="chat-box-right" style="background-color: #FFFFFF" v-if="item.content.remoteUrl && index !== chatStatus"
-									@click="openChat(item.content.remoteUrl, index)">
-									<image class="gif-icon" src="../../static/icon/msg.png"></image>
-									<text class="chat-text">{{handleDuration(item.content.duration)}}</text>
-								</view>
-								<view class="chat-box-right" style="background-color: #FFFFFF" v-if="item.content.remoteUrl && index === chatStatus"
-									@click="closeChat(item.content.remoteUrl, index)">
-									<image class="gif-icon" src="../../static/icon/msg-yellow.png"></image>
-									<text class="chat-text"
-										style="color: #FFD100;">{{handleDuration(item.content.duration)}}</text>
-								</view>
-							</view>
-						</view>
-					</view>
-					<view class="time-box" v-if="item.receivedTimeVal">
-						<text class="time-box-text">{{item.receivedTimeVal}}</text>
-					</view>
-					<view class="right-bg" v-if="item.messageDirection === 1">
-						<view class="message-right flex">
-							<view>
-								<view v-if="item.content.latitude" class="map-box" style="margin-right: 10upx">
-									<text class="map-text">{{item.content.poi}}</text>
-									<map class="map-style" :latitude="item.content.latitude"
-										:longitude="item.content.longitude" :markers="handleCovers(item)"></map>
-									<cover-view class="map-cover" @click="gotoLocationDetail(item)"></cover-view>
-								</view>
-								<text v-if="!item.content.imageUri && !item.content.latitude && !item.content.remoteUrl"
-									class="right-info">{{item.content.content || ''}}</text>
-								<view class="chat-box-right" v-if="item.content.remoteUrl && index !== chatStatus"
-									@click="openChat(item.content.remoteUrl, index)">
-									<image class="gif-icon" src="../../static/icon/msg.png"></image>
-									<text class="chat-text">{{handleDuration(item.content.duration)}}</text>
-								</view>
-								<view class="chat-box-right" v-if="item.content.remoteUrl && index === chatStatus"
-									@click="closeChat(item.content.remoteUrl, index)">
-									<image class="gif-icon" src="../../static/icon/msg-white.png"></image>
-									<text class="chat-text"
-										style="color: #FFFFFF;">{{handleDuration(item.content.duration)}}</text>
-								</view>
-								<image style="width: 300upx;margin-right: 10upx;border-radius: 10upx"
-									v-if="item.content.imageUri" :src="item.content.imageUri"
-									@click="previewImg(item.content.imageUri)" mode="aspectFill"></image>
-							</view>
-							<image class="head-img" :src="userInfo.headimg"></image>
-						</view>
-					</view>
-				</cell>
-			</list>
-		</view>
-		<view class="space-box"></view>
-		<view class="footer-bg">
-			<view class="footer-content">
-				<view class="input-box">
-					<image v-if="!isTalk" @click="openTalk"
-						style="width: 48upx;height: 48upx;margin-right: 20upx;margin-bottom: 10upx;"
-						src="../../static/message/talk-icon.png" mode=""></image>
-					<image v-if="isTalk" @click="isTalk = false"
-						style="width: 48upx;height: 48upx;margin-right: 20upx;margin-bottom: 10upx;"
-						src="../../static/message/keybord-icon.png" mode=""></image>
-					<view>
-						<view v-if="!isTalk" class="input-bg"><textarea cursor-spacing="30" class="input-style"
-								type="text" v-model="txtMsgVal" @input="handleInput" auto-height auto-blur /></view>
-						<text @touchstart="talkStart" @touchmove="talkMoveHandle" @touchend="talkEnd" v-if="isTalk"
-							class="long-btn">按住 说话</text>
-					</view>
-					<image @click="emojiHandle"
-						style="width: 48upx;height: 48upx;margin-right: 20upx;margin-bottom: 10upx;"
-						src="../../static/message/face-icon.png" mode=""></image>
-					<image v-if="!isSend" @click="showPlusHandle"
-						style="width: 48upx;height: 48upx;margin-bottom: 10upx;" src="../../static/message/add-icon.png"
-						mode=""></image>
-					<text @click="sendTxtMsg" style="margin-bottom: 5upx;" v-if="isSend" class="send-btn">发送</text>
-				</view>
-				<scroll-view v-if="isEmoji" class="emoji-box" scroll-y="true">
-					<view class="emoji-bg">
-						<text class="emoji-item" v-for="(item, index) in emojiList" :key="index"
-							@click="selectEmoji(item)">{{item.emoji}}</text>
-					</view>
-				</scroll-view>
-				<view class="plus-box" v-if="showPlus">
-					<view class="plus-item" @click="uploadPic">
-						<view class="plus-bg">
-							<image style="width: 48upx;height: 48upx;" src="../../static/message/photo-icon.png"
-								mode=""></image>
-						</view>
-						<text class="plus-text">照片</text>
-					</view>
-					<view class="plus-item" @click="chooseLocation">
-						<view class="plus-bg">
-							<image style="width: 48upx;height: 48upx;" src="../../static/message/address-icon.png"
-								mode=""></image>
-						</view>
-						<text class="plus-text">位置</text>
-					</view>
-				</view>
-			</view>
-			<view class="ios-bottom" v-if="isIphoneX"></view>
-		</view>
-		<view class="modal-box" :style="{height: mainHeight + 'px'}" v-if="showTip">
-			<view class="alert-content">
-				<text class="tip-text">{{tipContent}}</text>
-				<view class="close-btn" @click="showTip = false"><text class="close-btn-text">确定</text></view>
-			</view>
-		</view>
-		<view class="chat-record-box" :style="{height: mainHeight + 'px'}" @touchmove.stop="" v-if="showChatBg">
-			<view class="record-content">
-				<image style="width: 180upx;height: 180upx" src="../../static/icon/record-icon.png" mode=""></image>
-				<view class="record-btn-box" :style="{marginBottom: isIphoneX ? '68upx' : 0}">
-					<text class="record-tip">松开发送，上滑取消</text>
-					<text v-if="!isCancle" class="record-cancle">取消</text>
-					<text v-if="isCancle" class="record-cancle-red">取消</text>
-					<view class="record-btn">
-						<image class="record-btn-icon" src="../../static/icon/msg.png" mode=""></image>
-					</view>
-				</view>
-			</view>
-		</view>
-	</view>
-</template>
-
-<script>
-	/**
-	 * 配置好api就可以了
-	 * 其他配置文件都有了
-	 * nvue样式都是独立的
-	 * 第三方用的是 融云 IM，初始化在App.vue
-	*/
-	let recorderManager = uni.getRecorderManager();
-	let innerAudioContext = uni.createInnerAudioContext();
-	innerAudioContext.autoplay = true;
-	import api from '@/public/im'  // api路径
-	import emojiList from '../../utils/emojiData.js'
-	import * as RongIMLib from '@rongcloud/imlib-uni'
-	import util from '../../utils/index.js'
-	const dom = weex.requireModule('dom')
-
-	export default {
-		data() {
-			return {
-				emojiList: emojiList,
-				list: [],
-				isTalk: false,
-				showChatBg: false,
-				showPlus: false,
-				heightNum: 0,
-				titleTxt: '',
-				btnText: '',
-				showTip: false,
-				isIphoneX: false,
-				voicePath: '',
-				uploadInfo: {},
-				targetId: '',
-				chatUserId: '',
-				txtMsgVal: '',
-				isSend: false,
-				currentInfo: {},
-				userInfo: {},
-				isEmoji: false,
-				imgList: [],
-				scrollTop: 100,
-				scrollHeight: 0,
-				mainHeight: 0,
-				chatStatus: '',
-				innerAudioContext: '',
-				scrollTopNow: 0,
-				isCancle: false,
-				refreshing: false,
-				listParams: {
-					timestamp: 0,
-					count: 15
-				},
-				hasMore: true,
-			}
-		},
-		onLoad(options) {
-			uni.getSystemInfo({
-				success: (res) => {
-					this.mainHeight = res.windowHeight;
-					let height = res.windowHeight - res.statusBarHeight - 88
-					if (res.platform === 'ios') {
-						height = height - 34;
-					}
-					this.scrollHeight = height;
-				}
-			});
-			this.userInfo = JSON.parse(uni.getStorageSync('userInfo'));
-			this.targetId = options.targetId;
-			this.chatUserId = options.chatUserId;
-			let self = this;
-			recorderManager.onStop(function(res) {
-				if (self.isCancle) {
-					self.isCancle = false;
-					return false
-				}
-				const tempFilePaths = res.tempFilePath;
-				let temp = Date.parse(new Date());
-				let info = JSON.parse(JSON.stringify(self.uploadInfo));
-				info.key = info.dir + '/' + temp + '.mp3';
-				const innerAudioContext = uni.createInnerAudioContext();
-				innerAudioContext.autoplay = true;
-				innerAudioContext.volume = 0;
-				innerAudioContext.src = tempFilePaths;
-				innerAudioContext.onPlay(() => {
-					if (innerAudioContext.duration < 1) {
-						uni.showToast({
-							title: '时间太短了！',
-							icon: 'none'
-						})
-						innerAudioContext.stop();
-						return false;
-					}
-					uni.showLoading({
-						title: '正在发送...'
-					})
-					uni.uploadFile({
-						url: info.host, //仅为示例，非真实的接口地址
-						filePath: tempFilePaths,
-						name: 'file',
-						formData: info,
-						success: (uploadFileRes) => {
-							uni.hideLoading()
-							const url = info.host + '/' + info.key;
-							self.sendChatMsg(url, innerAudioContext.duration);
-						}
-					});
-					innerAudioContext.stop();
-				});
-
-			});
-
-			this.heightNum = uni.getSystemInfoSync().statusBarHeight;
-			wx.getSystemInfo({
-				success: res => {
-					if (res.safeArea.top > 44) { //x及以上的异形屏top为44，非异形屏为20
-						this.isIphoneX = true;
-					}
-				}
-			})
-			this.getInfo();
-			this.getOss();
-			this.getMsgListInit();
-			this.watchMsg();
-		},
-		onHide() {
-			this.showPlus = false;
-		},
-		methods: {
-			dataTimeHandle() {
-				let timestamp = 0;
-				// 判断是否在2分钟内
-				this.list.forEach((item, index) => {
-					if (item.sentTime - timestamp > 120000) {
-						timestamp = item.sentTime;
-						this.$set(this.list[index], 'receivedTimeVal', util.handleTimeCustom(timestamp))
-					}
-				})
-			},
-			onrefresh() {
-				this.getMsgList();
-			},
-			onpullingdown() {
-				this.scrollOldHeight = this.scrollTopNow;
-				// console.log(this.scrollOldHeight, '最后的距离')
-			},
-			scrollWatch(e) {
-				// console.log(e.contentSize.height, '------滑动监听-----')
-				// console.log(e.detail.scrollHeight, '-----滑动总距离-------')
-				// console.log(e.detail.scrollTop, '-----滑动中距离-------')
-				this.scrollTopNow = e.contentSize.height;
-			},
-			scrollHandle() {
-				this.showPlus = false;
-				this.isEmoji = false;
-				this.scrollTop = this.scrollTopNow;
-				setTimeout(() => {
-					this.scrollTop = this.scrollTopNow + 1000;
-				}, 0)
-			},
-			updateImgList() {
-				this.imgList = [];
-				this.list.forEach((item, index) => {
-					if (item.content.imageUri) {
-						this.imgList.push(item.content.imageUri)
-					}
-				})
-			},
-			clearRead() {
-				const im = getApp().globalData.im;
-				var conversation = im.Conversation.get({
-					targetId: this.targetId,
-					type: RongIMLib.CONVERSATION_TYPE.PRIVATE
-				});
-				conversation.read().then(function() {
-					console.log('清除未读数成功'); // im.watch conversation 将被触发
-				});
-			},
-			watchMsg() {
-				const im = getApp().globalData.im;
-				var conversation = im.Conversation.get({
-					targetId: this.targetId,
-					type: RongIMLib.CONVERSATION_TYPE.PRIVATE
-				});
-				let that = this;
-				// 添加事件监听
-				im.watch({
-					// 监听会话列表变更事件, 触发时机：会话状态变化（置顶、免打扰）、会话未读数变化（未读数增加、未读数清空）、会话 @ 信息、会话最后一条消息变化
-					conversation(event) {
-						// 假定存在 getExistedConversationList 方法，以获取当前已存在的会话列表数据
-						const conversationList = getExistedConversationList()
-						// 发生变更的会话列表
-						const updatedConversationList = event.updatedConversationList;
-						// 通过 im.Conversation.merge 计算最新的会话列表
-						const latestConversationList = im.Conversation.merge({
-							conversationList,
-							updatedConversationList
-						})
-					},
-					// 监听消息通知
-					message(event) {
-						// 新接收到的消息内容
-						const message = event.message;
-						that.list.push(message);
-						that.scrollHandle();
-						that.updateImgList();
-						that.clearRead();
-					},
-					// 监听 IM 连接状态变化
-					status(event) {
-						console.log('connection status:', event.status);
-					},
-					// 监听聊天室 KV 数据变更
-					chatroom(event) {
-						/**
-						 * 聊天室 KV 存储数据更新
-						 * @example
-						 * [
-						 *  {
-						 *    "key": "name",
-						 *    "value": "我是小融融",
-						 *    "timestamp": 1597591258338, 
-						 *    "chatroomId": "z002", 
-						 *    "type": 1 // 1: 更新（ 含:修改和新增 ）、2: 删除
-						 *  },
-						 * ]
-						 */
-						const updatedEntries = event.updatedEntries
-					},
-					expansion(event) {
-						/**
-						 * 更新的消息拓展数据
-						 * @example {
-						 *    expansion: { key: 'value' },      // 设置或更新的扩展值
-						 *    messageUId: 'URIT-URIT-ODMF-DURR' // 设置或更新扩展的消息 uid
-						 * }
-						 */
-						const updatedExpansion = event.updatedExpansion;
-						/**
-						 * 删除的消息拓展数据
-						 * @example {
-						 *    deletedKeys: ['key1', 'key2'],    // 设置或更新的扩展值
-						 *    messageUId: 'URIT-URIT-ODMF-DURR' // 设置或更新扩展的消息 uid
-						 * }
-						 */
-						const deletedExpansion = event.deletedExpansion;
-					},
-					// 监听离线消息拉取完成
-					pullFinished() {
-						console.log('拉取离线消息完成')
-						that.scrollHandle();
-					}
-				});
-			},
-			handleDuration(duration) {
-				return duration.toFixed(0) + '秒'
-			},
-			openChat(url, index) {
-				this.chatStatus = index;
-				this.innerAudioContext = uni.createInnerAudioContext();
-				this.innerAudioContext.autoplay = true;
-				this.innerAudioContext.volume = 1;
-				this.innerAudioContext.src = url;
-				this.innerAudioContext.seek = 3;
-				this.innerAudioContext.onSeeking(() => {
-					uni.showLoading({
-						title: '加载中...'
-					})
-				})
-				this.innerAudioContext.onWaiting(() => {
-					uni.showLoading({
-						title: '加载中...'
-					})
-				})
-				this.innerAudioContext.onPlay(() => {
-					console.log('开始播放');
-					uni.hideLoading();
-				});
-				this.innerAudioContext.onEnded(() => {
-					this.chatStatus = '';
-				})
-			},
-			closeChat(url) {
-				this.chatStatus = '';
-				this.innerAudioContext.stop();
-			},
-			gotoLocationDetail(info) {
-				uni.openLocation({
-					latitude: info.content.latitude,
-					longitude: info.content.longitude,
-					success: function() {
-						console.log('success');
-					}
-				});
-			},
-			handleCovers(info) {
-				return [{
-					id: 1,
-					latitude: info.content.latitude,
-					longitude: info.content.longitude,
-					iconPath: '/static/icon/location-icon.png',
-					width: 25,
-					height: 25
-				}]
-			},
-			chooseLocation() {
-				uni.chooseLocation({
-					success: (res) => {
-						const im = getApp().globalData.im;
-						let conversation = im.Conversation.get({
-							targetId: this.targetId,
-							type: RongIMLib.CONVERSATION_TYPE.PRIVATE
-						});
-						let latitude = res.latitude;
-						let longitude = res.longitude;
-						let poi = res.name;
-						let content = ''; // 位置图片 base64
-						conversation.send({
-							messageType: RongIMLib.MESSAGE_TYPE.LOCATION, // 'RC:LBSMsg'
-							content: {
-								latitude: latitude,
-								longitude: longitude,
-								poi: poi,
-								content: content
-							}
-						}).then((message) => {
-							console.log('发送位置消息成功', message);
-							this.showPlus = false;
-							this.list.push(message);
-							this.scrollHandle();
-						});
-					}
-				});
-			},
-			previewImg(url) {
-				uni.previewImage({
-					urls: this.imgList,
-					current: url
-				});
-			},
-			emojiHandle() {
-				this.showPlus = false;
-				this.isEmoji = !this.isEmoji;
-				this.isTalk = false;
-				uni.hideKeyboard();
-			},
-			selectEmoji(info) {
-				this.txtMsgVal += info.emoji;
-				this.isSend = true;
-			},
-			getInfo() {
-				util.getImUserInfo(this.targetId).then(res => {
-					this.currentInfo = res;
-				})
-			},
-			getMsgList() {
-				uni.hideKeyboard()
-				const im = getApp().globalData.im;
-				let conversation = im.Conversation.get({
-					targetId: this.targetId,
-					type: RongIMLib.CONVERSATION_TYPE.PRIVATE
-				});
-				this.refreshing = true;
-				conversation.getMessages(this.listParams).then(result => {
-					this.refreshing = false;
-					if (this.listParams.timestamp === 0) {
-						this.list = result.list; 
-					} else {
-						this.list = result.list.concat(this.list);
-					}
-					if (result.hasMore) {
-						this.listParams.timestamp = this.list[0].sentTime;
-						this.hasMore = true;
-					} else {
-						this.hasMore = false;
-					}
-					this.dataTimeHandle();
-					this.updateImgList();
-					// 调整滑动位置
-					this.showPlus = false;
-					this.isEmoji = false;
-					// this.scrollTop = 200;
-					setTimeout(() => {
-						// this.scrollTop = this.scrollTopNow - this.scrollHeight;
-						console.log(this.scrollTop, '--------调整位置--------')
-					}, 100)
-				});
-			},
-			getMsgListInit() {
-				const im = getApp().globalData.im;
-				let conversation = im.Conversation.get({
-					targetId: this.targetId,
-					type: RongIMLib.CONVERSATION_TYPE.PRIVATE
-				});
-				conversation.getMessages(this.listParams).then(result => {
-					this.list = result.list;
-					if (result.hasMore) {
-						this.listParams.timestamp = this.list[0].sentTime;
-						this.hasMore = true;
-					} else {
-						this.hasMore = false;
-					}
-					this.dataTimeHandle();
-					this.updateImgList();
-					this.clearRead();
-					this.scrollTop = 1000;
-					setTimeout(() => {
-						this.scrollTop = this.scrollTopNow + 1000;
-					}, 100)
-				});
-			},
-			handleInput(val) {
-				if (this.txtMsgVal) {
-					this.isSend = true;
-				} else {
-					this.isSend = false;
-				}
-			},
-			uploadPic() {
-				uni.chooseImage({
-					sizeType: 'compressed',
-					success: (chooseImageRes) => {
-						const tempFilePaths = chooseImageRes.tempFilePaths;
-						uni.showLoading({
-							title: '加载中...'
-						})
-						tempFilePaths.forEach((item, index) => {
-							let info = JSON.parse(JSON.stringify(this.uploadInfo));
-							let temp = Date.parse(new Date()) + index;
-							info.key = info.dir + '/' + temp + '.png';
-							uni.uploadFile({
-								url: this.uploadInfo.host, //仅为示例，非真实的接口地址
-								filePath: tempFilePaths[index],
-								name: 'file',
-								formData: info,
-								success: (uploadFileRes) => {
-									const url = info.host + '/' + info.key;
-									this.sendPhotoMsg(url);
-									if (index === tempFilePaths.length - 1) {
-										uni.hideLoading();
-									}
-								}
-							});
-						})
-					}
-				});
-			},
-			sendPhotoMsg(url) {
-				this.showPlus = false;
-				const im = getApp().globalData.im;
-				var conversation = im.Conversation.get({
-					targetId: this.targetId,
-					type: RongIMLib.CONVERSATION_TYPE.PRIVATE
-				});
-				uni.showLoading()
-				conversation.send({
-					messageType: RongIMLib.MESSAGE_TYPE.IMAGE, // 'RC:ImgMsg'
-					content: {
-						content: '', // // 压缩后的 base64 略缩图, 用来快速展示图片
-						imageUri: url // 上传到服务器的 url. 用来展示高清图片
-					}
-				}).then(message => {
-					uni.hideLoading()
-					console.log('发送图片消息成功', message);
-					this.list.push(message);
-					this.updateImgList();
-					this.scrollHandle();
-				});
-			},
-			sendTxtMsg() {
-				if (!this.txtMsgVal) {
-					return false;
-				}
-				const im = getApp().globalData.im;
-				const conversation = im.Conversation.get({
-					// targetId
-					targetId: this.targetId,
-					// 会话类型：RongIMLib.CONVERSATION_TYPE.PRIVATE | RongIMLib.CONVERSATION_TYPE.GROUP
-					type: RongIMLib.CONVERSATION_TYPE.PRIVATE
-				});
-				uni.showLoading()
-				// 向会话内发消息
-				conversation.send({
-					// 消息类型，其中 RongIMLib.MESSAGE_TYPE 为 IMLib 内部的内置消息类型常量定义
-					messageType: RongIMLib.MESSAGE_TYPE.TEXT, // 'RC:TxtMsg'
-					// 消息内容
-					content: {
-						content: this.txtMsgVal // 文本内容
-					}
-				}).then(message => {
-					uni.hideLoading()
-					this.txtMsgVal = ''
-					this.showPlus = false;
-					this.isEmoji = false;
-					this.isSend = false;
-					console.log('发送文字消息成功', message);
-					this.list.push(message);
-					this.scrollHandle();
-				}).catch(error => {
-					console.log('发送文字消息失败', error.code, error.msg);
-				});
-			},
-			sendChatMsg(url, duration) {
-				const im = getApp().globalData.im;
-				var conversation = im.Conversation.get({
-					targetId: this.targetId,
-					type: RongIMLib.CONVERSATION_TYPE.PRIVATE
-				});
-				uni.showLoading()
-				conversation.send({
-					messageType: RongIMLib.MESSAGE_TYPE.HQ_VOICE, // 'RC:HQVCMsg'
-					content: {
-						remoteUrl: url, // 音频 url, 建议格式: aac
-						duration: duration, // 音频时长
-						type: 'mp3'
-					}
-				}).then((message) => {
-					uni.hideLoading()
-					console.log('发送语音消息成功', message);
-					this.list.push(message);
-					this.scrollHandle();
-				});
-			},
-			getOss() {
-				api.getOss().then(res => {
-					this.uploadInfo = res.datas;
-				})
-			},
-			openTalk() {
-				this.isTalk = true;
-				this.isEmoji = false;
-				uni.hideKeyboard()
-			},
-			talkStart() {
-				recorderManager.start({
-					duration: 60000
-				});
-				this.showChatBg = true;
-				uni.vibrateShort({
-					success: function() {
-
-					}
-				});
-			},
-			talkEnd() {
-				recorderManager.stop();
-				this.showChatBg = false;
-			},
-			talkMoveHandle(e) {
-				const num = e.changedTouches[0].pageY;
-				if (num < -30 && num > -100) {
-					this.isCancle = true;
-				} else {
-					this.isCancle = false;
-				}
-			},
-			playVoice() {
-				if (this.voicePath) {
-					innerAudioContext.src = this.voicePath;
-					innerAudioContext.play();
-				}
-			},
-			showPlusHandle() {
-				this.isEmoji = false;
-				this.showPlus = !this.showPlus;
-				uni.hideKeyboard();
-			},
-			goBack() {
-				uni.navigateBack()
-			}
-		}
-	}
-</script>
-
-<style lang="scss" scoped>
-	.time-box {
-		align-items: center;
-		margin-bottom: 20upx;
-	}
-
-	.time-box-text {
-		font-size: 24upx;
-	}
-
-	.refresh-box {
-		flex-direction: row;
-		align-items: center;
-		justify-content: center;
-	}
-
-	.loading-text {
-		font-size: 24upx;
-		color: #FFD100;
-		text-align: center;
-		padding: 30upx;
-	}
-
-	.loading-style {
-		color: yellow;
-	}
-
-	.record-content {
-		position: absolute;
-		bottom: 0;
-		height: 700upx;
-		width: 750upx;
-		align-items: center;
-		justify-content: space-between;
-	}
-
-	.record-btn-box {
-		align-items: center;
-		justify-content: space-between;
-	}
-
-	.record-btn {
-		width: 700upx;
-		height: 120upx;
-		background-color: #C0C0C0;
-		justify-content: center;
-		align-items: center;
-		border-radius: 60upx;
-	}
-
-	.record-btn-icon {
-		width: 40upx;
-		height: 40upx;
-	}
-
-	.record-cancle,
-	.record-cancle-red {
-		background-color: #333333;
-		width: 700upx;
-		height: 100upx;
-		color: #C0C0C0;
-		align-items: center;
-		justify-content: center;
-		font-size: 30upx;
-		text-align: center;
-		line-height: 100upx;
-		margin-bottom: 30upx;
-		border-radius: 50upx;
-	}
-
-	.record-cancle-red {
-		background-color: #F03;
-		color: #FFFFFF;
-	}
-
-	.record-tip {
-		text-align: center;
-		color: #C0C0C0;
-		font-size: 28upx;
-		margin-bottom: 30upx;
-	}
-
-	.chat-record-box {
-		position: fixed;
-		top: 0;
-		left: 0;
-		width: 750upx;
-		background-color: rgba($color: #000000, $alpha: .7);
-		z-index: 10
-	}
-
-	.map-box {
-		width: 400upx;
-		height: 300upx;
-		background-color: #FFFFFF;
-		border-radius: 10upx;
-	}
-
-	.map-cover {
-		position: absolute;
-		bottom: 0;
-		left: 0;
-		width: 400upx;
-		height: 300upx;
-		background-color: rgba($color: #000000, $alpha: 0);
-	}
-
-	.chat-box-left {
-		flex-direction: row;
-		align-items: center;
-		justify-content: center;
-		width: 200upx;
-		flex-wrap: wrap;
-		padding: 16upx 24upx;
-		background-color: #FFFFFF;
-		border-radius: 20upx;
-		margin-left: 14upx;
-		font-size: 28upx;
-		font-weight: 400;
-		color: #1A1A1A;
-		line-height: 40upx;
-	}
-
-	.chat-box-right {
-		flex-direction: row;
-		align-items: center;
-		justify-content: center;
-		width: 200upx;
-		flex-wrap: wrap;
-		padding: 16upx 24upx;
-		background-color: #FFD100;
-		border-radius: 20upx;
-		margin-left: 14upx;
-		font-size: 28upx;
-		font-weight: 400;
-		color: #1A1A1A;
-		line-height: 40upx;
-		margin-right: 10upx;
-	}
-
-	.chat-text {
-		font-size: 26upx;
-	}
-
-	.gif-icon {
-		width: 30upx;
-		height: 30upx;
-		margin-right: 10upx;
-	}
-
-	.map-text {
-		font-size: 24upx;
-		padding: 12upx 10upx;
-	}
-
-	.bar-box {
-		background-color: #FFFFFF;
-	}
-
-	.modal-box {
-		position: fixed;
-		width: 750upx;
-		background-color: rgba($color: #000000, $alpha: .4);
-		align-items: center;
-		justify-content: center;
-	}
-
-	.alert-content {
-		width: 640upx;
-		height: 480upx;
-		background-color: #FFFFFF;
-		border-radius: 24upx;
-		padding: 64upx 48upx;
-	}
-
-	.close-btn {
-		width: 512upx;
-		height: 80upx;
-		background: #FFD100;
-		border-radius: 12upx;
-		align-items: center;
-		justify-content: center;
-	}
-
-	.close-btn-text {
-		color: #1A1A1A;
-		font-size: 30upx;
-	}
-
-	.tip-text {
-		font-size: 34upx;
-		line-height: 48upx;
-		margin-bottom: 52upx;
-		font-weight: 500;
-	}
-
-	.space-box {
-		height: 88upx;
-	}
-
-	.emoji-bg {
-		flex-direction: row;
-		flex-wrap: wrap;
-	}
-
-	.emoji-box {
-		height: 400upx;
-		width: 750upx;
-		flex-direction: row;
-		padding-left: 20upx;
-		padding-top: 20upx;
-	}
-
-	.emoji-item {
-		margin-right: 20upx;
-		margin-bottom: 20upx;
-	}
-
-	.send-btn {
-		padding: 0 20upx;
-		height: 60upx;
-		color: #FFFFFF;
-		background-color: #FFD100;
-		font-size: 26upx;
-		border-radius: 6upx;
-		text-align: center;
-		line-height: 60upx;
-	}
-
-	.talk-box {
-		position: fixed;
-		top: 0;
-		left: 0;
-		width: 750upx;
-		height: 100vh;
-		background-color: rgba($color: #000000, $alpha: .7);
-	}
-
-	.plus-box {
-		height: 434upx;
-		flex-direction: row;
-		padding: 60upx 30upx;
-	}
-
-	.plus-bg {
-		justify-content: center;
-		align-items: center;
-		width: 116upx;
-		height: 116upx;
-		background: #FFFFFF;
-		border-radius: 20upx;
-		margin-bottom: 6upx;
-	}
-
-	.plus-text {
-		text-align: center;
-		font-size: 22upx;
-		color: #999999;
-		line-height: 32upx;
-	}
-
-	.plus-item {
-		margin-right: 76upx;
-	}
-
-	.input-style,
-	.long-btn {
-		background-color: #FFFFFF;
-		width: 500upx;
-		padding: 10upx;
-		border-radius: 8upx;
-		margin-right: 20upx;
-		height: 72upx;
-		font-size: 28upx;
-		line-height: 36upx;
-	}
-
-	.input-bg {
-		flex-direction: row;
-		align-items: center;
-		justify-content: center;
-		padding:10upx;
-		background-color: #FFFFFF;
-		border-radius: 8upx;
-		width: 500upx;
-		margin-right: 20upx;
-	}
-
-	.input-style {
-		padding: 0;
-		width: 480upx;
-		margin-right: 0;
-		padding-top: 6upx;
-	}
-
-	.long-btn {
-		text-align: center;
-		line-height: 72upx;
-		padding: 0;
-		color: #1A1A1A;
-	}
-
-	.input-box {
-		flex-direction: row;
-		align-items: flex-end;
-		padding: 8upx 20upx;
-	}
-
-	.emoji-box {
-		width: 750upx;
-		flex-direction: column;
-	}
-
-	.detail-main {
-		justify-content: space-between;
-		background-color: #F7F7F7;
-	}
-
-	.footer-bg {
-		background-color: #F0F0F0;
-		width: 750upx;
-		position: fixed;
-		bottom: 0;
-		left: 0;
-	}
-
-	.ios-bottom {
-		height: 68upx;
-		background-color: #F7F7F7;
-	}
-
-	.message-box {}
-
-	.left-bg {
-		padding-left: 30upx;
-		width: 750upx;
-		flex-direction: row;
-		justify-content: flex-start;
-		margin-top: 20upx;
-	}
-
-	.right-bg {
-		padding-right: 30upx;
-		width: 750upx;
-		flex-direction: row;
-		justify-content: flex-end;
-	}
-
-	.message-left,
-	.message-right {
-		width: 500upx;
-		flex-direction: row;
-		margin-bottom: 40upx;
-	}
-
-	.head-img {
-		width: 72upx;
-		height: 72upx;
-		border-radius: 72upx;
-		background-color: #C0C0C0;
-	}
-
-	.message-right {
-		justify-content: flex-end;
-	}
-
-	.left-info {
-		width: 400upx;
-		flex-wrap: wrap;
-		padding: 16upx 24upx;
-		background-color: #FFFFFF;
-		border-radius: 20upx;
-		margin-left: 14upx;
-		font-size: 28upx;
-		font-weight: 400;
-		color: #1A1A1A;
-		line-height: 40upx;
-	}
-
-	.right-info {
-		width: 400upx;
-		padding: 16upx 24upx;
-		background-color: #FFD100;
-		border-radius: 20upx;
-		margin-right: 14upx;
-		font-size: 28upx;
-		font-weight: 400;
-		color: #1A1A1A;
-		line-height: 40upx;
-	}
-
-	.custom-nav {
-		width: 750upx;
-	}
-
-	.back-icon {
-		width: 18upx;
-		height: 36upx;
-	}
-
-	.head-box {
-		height: 88upx;
-		background-color: #FFFFFF;
-		font-size: 36upx;
-		line-height: 50upx;
-		flex-direction: row;
-		justify-content: space-between;
-		align-items: center;
-		color: #000000;
-		padding: 0 32upx;
-		font-weight: 600;
-	}
-
-	.message-icon {
-		width: 42upx;
-		height: 40upx;
-	}
-
-	.flex-1 {
-		flex-direction: row;
-		flex: 1;
-		text-align: center;
-		color: #333333;
-		font-size: 33upx;
-		font-weight: 500;
-	}
-
-	.flex-2 {
-		flex: 2;
-		align-items: center;
-		justify-content: center;
-	}
-
-	.message-box {
-		align-items: center;
-		justify-content: flex-end;
-		position: relative;
-	}
-
-	.red-dot {
-		position: absolute;
-		top: 0;
-		right: 0;
-		margin-top: -6upx;
-		margin-right: -6upx;
-		width: 12upx;
-		height: 12upx;
-		background: #E60012;
-		border-radius: 50%;
-	}
-
-	.back-box {
-		align-items: center;
-		justify-content: flex-start;
-	}
-
-	.left-icon {
-		width: 18upx;
-		height: 34upx;
-	}
-
-	.btn-text {
-		flex-direction: row;
-		justify-content: flex-end;
-		font-size: 24upx;
-		font-weight: 400;
-		color: #1A1A1A;
-		line-height: 34upx;
-		text-align: right;
-	}
-
-	.nav-title {
-		font-size: 32upx;
-		font-weight: bold;
-		color: #030303;
-	}
-</style>
diff --git a/pages/im/chum.vue b/pages/im/chum.vue
deleted file mode 100644
index 9005142..0000000
--- a/pages/im/chum.vue
+++ /dev/null
@@ -1,19 +0,0 @@
-<template>
-	<view>
-		好友列表
-	</view>
-</template>
-
-<script>
-	export default {
-		data() {
-			return {
-				
-			};
-		}
-	}
-</script>
-
-<style lang="scss">
-
-</style>
diff --git a/pages/im/detail.vue b/pages/im/detail.vue
index 7376366..4b04d38 100644
--- a/pages/im/detail.vue
+++ b/pages/im/detail.vue
@@ -183,7 +183,8 @@
     $footer-height: 55px;
 
     .scroll {
-        height: calc(100vh - 55px);
+        height: calc(100vh - 55px);
+        width: 100vw;
         padding: 0 $uni-spacing-col-lg;
     }
 
@@ -242,11 +243,11 @@
         }
 
         .msg {
-            font-size: $uni-font-size-lg;
+            font-size: $uni-font-size-base;
             margin: $uni-spacing-col-base;
-            padding: $uni-spacing-col-base + 5rpx;
+            padding: $uni-spacing-col-lg;
             word-wrap: break-word;
-            width: 70%;
+            width: 60%;
             border-radius: $uni-border-radius-base;
             position: relative;
 
diff --git a/pages/im/friends/index.vue b/pages/im/friends/index.vue
new file mode 100644
index 0000000..fabc223
--- /dev/null
+++ b/pages/im/friends/index.vue
@@ -0,0 +1,14 @@
+<template>
+    <div>
+
+    </div>
+</template>
+
+<script>
+    export default {
+
+    }
+</script>
+
+<style lang="scss" scoped>
+</style>
diff --git a/pages/im/friends/info.vue b/pages/im/friends/info.vue
new file mode 100644
index 0000000..48d48ea
--- /dev/null
+++ b/pages/im/friends/info.vue
@@ -0,0 +1,8 @@
+<template>
+</template>
+
+<script>
+</script>
+
+<style>
+</style>
diff --git a/pages/im/friends/mine.vue b/pages/im/friends/mine.vue
new file mode 100644
index 0000000..48d48ea
--- /dev/null
+++ b/pages/im/friends/mine.vue
@@ -0,0 +1,8 @@
+<template>
+</template>
+
+<script>
+</script>
+
+<style>
+</style>
diff --git a/pages/im/index.vue b/pages/im/index.vue
index 9009d66..c0e94ed 100644
--- a/pages/im/index.vue
+++ b/pages/im/index.vue
@@ -1,43 +1,43 @@
 <template>
     <div>
-        <u-popup overlay mode="left" closeable closeOnClickOverlay :show="showLeft" @close="showLeft = false">
-            <leftMenu></leftMenu>
-        </u-popup>
-
-        <div class="container">
-            <div class="msg-item u-border-bottom" v-for="(item, index) in conversations" @click="toDetail(item)">
-                <div class="avatar">
-                    <u-badge numberType="ellipsis" max="99" shape="horn" absolute :offset="[-7, -7]"
-                        :value="item.unreadMessageCount" />
-                    <u-avatar shape="square" :src="friend(item.targetId).portraitUrl"></u-avatar>
-                </div>
-                <div class="content ">
-                    <div class="name">
-                        <h3>{{ friend(item.targetId).name }}</h3>
-                        <span class="time">{{ item.sentTime|timeCustomCN }}</span>
+        <div v-if="$store.state.token != ''">
+            <div class="container">
+                <div class="msg-item u-border-bottom" v-for="(item, index) in conversations" @click="toDetail(item)">
+                    <div class="avatar">
+                        <u-badge numberType="ellipsis" max="99" shape="horn" absolute :offset="[-7, -7]"
+                            :value="item.unreadMessageCount" />
+                        <u-avatar shape="square" :src="friend(item.targetId).portraitUrl"></u-avatar>
+                    </div>
+                    <div class="content ">
+                        <div class="name">
+                            <h3>{{ friend(item.targetId).name }}</h3>
+                            <span class="time">{{ item.sentTime|timeCustomCN }}</span>
+                        </div>
+                        <div class="u-line-1">{{ item.latestMessage.content }}</div>
                     </div>
-                    <div class="u-line-1">{{ item.latestMessage.content }}</div>
                 </div>
             </div>
+            <u-loadmore status="nomore" />
+        </div>
+        <div v-else>
+            <button @click="toLogin">去登录</button>
         </div>
-        <u-loadmore status="nomore" />
     </div>
 </template>
 
 <script>
     import * as RongIMLib from '@rongcloud/imlib-uni'
     import im from '@/utils/im/index.js'
-    import leftMenu from './components/left_menu.vue'
+    import userAuth from '@/public/userAuth'
+    import {
+        getImToken
+    } from '@/apis/interfaces/im.js'
 
     export default {
-        components: {
-            leftMenu
-        },
         data() {
             return {
                 isShown: true, // 当前页面显示状态
-                conversations: [], // 会话列表
-                showLeft: false
+                conversations: [] // 会话列表
             }
         },
         computed: {
@@ -47,7 +47,12 @@
                 }
             }
         },
-        onLoad() {},
+        onLoad() {
+            getImToken().then(res => {
+                im.syncFriends()
+                im.connect(res.token, res.userInfo)
+            })
+        },
         onShow() {
             this.getConversationList()
             this.isShown = true
@@ -57,7 +62,6 @@
         },
         onNavigationBarButtonTap(e) {
             if (e.index == 0) {
-                this.showLeft = true
             }
         },
         watch: {
@@ -68,6 +72,15 @@
             }
         },
         methods: {
+            // 检查登录
+            toLogin() {
+                if (this.$store.state.token === '') {
+                    const Auth = new userAuth()
+                    Auth.Login()
+                    return false
+                }
+                return true
+            },
             getFriend(targetId) {
                 return this.$store.getters.userInfo(targetId)
             },
diff --git a/store/modules/im.js b/store/modules/im.js
index afea9d0..4c4f80f 100644
--- a/store/modules/im.js
+++ b/store/modules/im.js
@@ -1,6 +1,6 @@
 import {
     getUserInfo
-} from "@/apis/interfaces/im.js"
+} from "@/apis/interfaces/im.js"
 
 export default {
     state: {
@@ -19,7 +19,7 @@ export default {
             if (state.friends.filter((item) => item.userId == targetId)[0]) {
                 return state.friends.filter((item) => String(item.userId) == targetId)[0]
             } else {
-                return getUserInfo()
+                return getUserInfo(targetId)
             }
         },
         sender(state) {
diff --git a/utils/im/index.js b/utils/im/index.js
index adc615e..2920eed 100644
--- a/utils/im/index.js
+++ b/utils/im/index.js
@@ -43,6 +43,10 @@ const connect = (token, userInfo) => {
     store.dispatch('setSenderInfo', userInfo)
 
     setNotifyBadge()
+}
+
+const disconnect = () => {
+    RongIMLib.disconnect()
 }
 
 const addListeners = () => {