1/fore-end/pages/chat/chat.js

// pages/chat/chat.js
const {
	getUserInfoList,
	getChattingRecord,
	getGoodsInfo,
	setWsConnect,
	getUserInfo
} = require('../../API/appraise');
const {
	formatTime
} = require('../../utils/util')
import messageMap from '../../utils/util'
var socketMsgQueue = {
	from: wx.getStorageSync('uid'),
	to: '',
	msgType: 1,
	time: '',
	content: ''
}
var getUserInfoListOption = {
	data: {
		id: []
	}
}
var getChattingRecordOption = {
	uid: wx.getStorageSync('uid'),
	target: ''
}
var getGoodsInfoOption = {
	id: '',
	uid: '',
	date: ''
}

var getChattingRecordOption = {
	uid: '',
	target: ''
}
var setWsConnectOption = {
	uid: wx.getStorageSync('uid')
}
Page({

	/**
	 * 页面的初始数据
	 */
	data: {
		toUid: '',
		goodsId: '',
		goods: {
			pic: '',
			name: '',
			price: 0,
		},
		//登录用户的信息
		login: {
			id: wx.getStorageSync('uid')
		},
		chatList: [
			// {
			// 	from: '7385700531999608832',
			// 	to: '7384540497554968576',
			// 	nickname:'daisy',
			// 	avatar: 'http://192.168.31.30:8084/pics/1698753512AiD8PaNrvqsDb1493fda534929a5b5d05f80a8cf3d16.jpg',
			// 	message: '你好',
			// 	type: 'text',
			// 	time: '11-8 20:52'
			// },
			// {
			// 	to: '7385700531999608832',
			// 	from: '7384540497554968576',
			// 	nickname:'无情的敲代码机器人',
			// 	avatar: 'http://192.168.31.30:8084/pics/1699175056BvtgC8vv8gSzd85dedb14362dc3a251c6c85705ec495.jpg',
			// 	message: '你好',
			// 	type: 'text',
			// 	time: '11-8 20:52'
			// }
		]


	},

	/**
	 * 生命周期函数--监听页面加载
	 */
	onLoad(options) {
		//获取商品信息
		this.data.toUid = options.toUid;
		this.data.goodsId = options.goodsId;
		this.data.goods.pic = options.pic;
		getChattingRecordOption.target = this.data.toUid;
		let time = new Date().getTime();
		getGoodsInfoOption = {
			id: this.data.goodsId,
			uid: wx.getStorageSync('uid'),
			date: time
		}
		let targetId = '';
		getGoodsInfo(getGoodsInfoOption).then((res) => {
			// console.log(res);
			const good = res.data.data;
			if (good.Pic == null) {
				good.Pic = this.data.goods.pic
			}
			this.setData({
				goods: {
					name: good.Title,
					price: good.Price,
					pic: good.Pic
				}
			})
		}).catch((err) => {
			console.log(err);
		})
		//获取对方用户信息
		getUserInfoListOption.data.id = [this.data.toUid];
		getUserInfoList(getUserInfoListOption).then((res) => {
			console.log(res);
			const {
				users
			} = res.data.data;
			targetId = users[0].uid;
			getChattingRecordOption.target = targetId;
			wx.setStorageSync('anotherNickName', users[0].name);
			wx.setStorageSync('anotherAvatar', users[0].avatar);
		}).catch((err) => {
			console.log(err);
		})

		//获取用户本人信息
		getUserInfo().then((res) => {
			console.log(res);
			let data = res.data.data;
			wx.setStorageSync('avatar', data.avatar);
			wx.setStorageSync('nickname', data.name);
		}).catch((err) => {
			console.log(err);
		})

		//获取聊天记录
		getChattingRecordOption.uid = wx.getStorageSync('uid');
		console.log(getChattingRecordOption);
		getChattingRecord(getChattingRecordOption).then((res) => {
			let data = res.data.data;
			console.log(data);
			data.sort(sortBy('time', 1));
			let chatList1 = [];
			for (let i = 0; i < data.length; i++) {
				let message = {};
				message['from'] = data[i].from;
				message['to'] = data[i].to;
				message['message'] = data[i].content;
				message['type'] = data[i].msgType == 1 ? 'text' : 'pic';
				message['time'] = formatTime(data[i].time);
				if (data[i].from === wx.getStorageSync('uid')) {
					message['nickname'] = wx.getStorageSync('nickname');
					message['avatar'] = wx.getStorageSync('avatar');
				} else {
					message['nickname'] = wx.getStorageSync('anotherNickName');
					message['avatar'] = wx.getStorageSync('anotherAvatar');
				}
				console.log(message);
				chatList1.push(message);
				console.log(chatList1);
			}
			this.setData({
				chatList: chatList1,
			})
		}).catch((err) => {
			console.log(err);
		})


		function sortBy(attr, rev) {
			if (rev == undefined) {
				rev = 1
			} else {
				(rev) ? 1: -1;
			}
			return function (a, b) {
				a = a[attr];
				b = b[attr];
				if (a < b) {
					return rev * -1
				}
				if (a > b) {
					return rev * 1
				}
				return 0;
			}
		}
		//建立ws连接
		setWsConnect(setWsConnectOption).then((res) => {
			console.log(res);
		})
		// 监听服务器的数据返回
		wx.onSocketMessage((result) => {
			console.log("服务器的数据返回", result);
			const res = JSON.parse(result.data);
			if (res.msgType == 1) {
				//获取当前时间
				let date = new Date();
				console.log(date);
				//处理数据
				if (res.from == this.data.toUid) {
					let msg = {
						from: res.from,
						to: res.to,
						message: res.content,
						type: 'text',
						time: formatTime(date),
						nickname: wx.getStorageSync('anotherNiakName'),
						avatar: wx.getStorageSync('anotherAvatar')
					}
					console.log(msg);
					this.setData({
						chatList: list.concat(msg)
					}, () => {
						that.scrollToBottom();
						that.setData({
							content: ''
						})
					})
				}

			}
		})

		this.scrollToBottom();
	},

	/**
	 * 生命周期函数--监听页面初次渲染完成
	 */
	onReady() {

	},

	/**
	 * 生命周期函数--监听页面显示
	 */
	onShow() {

	},

	/**
	 * 生命周期函数--监听页面隐藏
	 */
	onHide() {

	},

	/**
	 * 生命周期函数--监听页面卸载
	 */
	onUnload() {
		wx.closeSocket();
		console.log('websocket 已关闭!');
	},

	/**
	 * 页面相关事件处理函数--监听用户下拉动作
	 */
	onPullDownRefresh() {

	},

	/**
	 * 页面上拉触底事件的处理函数
	 */
	onReachBottom() {

	},

	/**
	 * 用户点击右上角分享
	 */
	onShareAppMessage() {

	},
	// 输入监听
	inputClick(e) {
		this.setData({
			content: e.detail.value
		})
	},
	// 发送监听
	sendClick() {
		let that = this;
		let list = this.data.chatList;
		// 获取当前时间
		let date = new Date();
		let month = date.getMonth() + 1;
		let day = date.getDate();
		let hour = date.getHours();
		let minu = date.getMinutes();
		let now1 = month < 10 ? '0' + month : month;
		let now2 = day < 10 ? '0' + day : day;
		// 组装数据
		let msg = {
			from: wx.getStorageSync('uid'),
			to: this.data.toUid,
			nickname: wx.getStorageSync('nickName'),
			avatar: wx.getStorageSync('avatarUrl'),
			message: this.data.content,
			type: 'text',
			time: now1 + '-' + now2 + ' ' + hour + ':' + minu
		}
		console.log(msg);
		this.setData({
			chatList: list.concat(msg)
		}, () => {
			that.scrollToBottom();
			that.setData({
				content: ''
			})
		})
		let socketMsg = socketMsgQueue;
		socketMsg.msgType = 1;
		socketMsg.content = this.data.content;
		socketMsg.to = this.data.toUid;
		console.log(this.data.toUid);
		let time = new Date().getTime();
		console.log(time);
		socketMsg.time = time;
		console.log(socketMsg);
		wx.sendSocketMessage({
			data: JSON.stringify(socketMsg),
		})
	},



	// 滑动到最底部
	scrollToBottom() {
		setTimeout(() => {
			wx.pageScrollTo({
				scrollTop: 200000,
				duration: 3
			});
		}, 600)
	},
})