From b1b68d68ef1a9196c49c58c8bf2141cd69187e5d Mon Sep 17 00:00:00 2001
From: lr <axhang1015@163.com>
Date: Tue, 18 Feb 2025 18:09:05 +0800
Subject: [PATCH] 1

---
 jiuyi2/common/js/config.js                    |    2 +
 jiuyi2/common/js/util.js                      |    6 +
 jiuyi2/components/shop/detail/footerMenu.vue  |    5 +-
 jiuyi2/pages/mine/homepage.vue                |    2 +
 jiuyi2/pages/mine/mine.vue                    |  199 +--
 jiuyi2/pages/news/chat/chat.vue               | 1122 ++++++++---------
 jiuyi2/vite.config.js                         |    4 +-
 service/App.vue                               |    5 +-
 service/common/js/util.js                     |    4 +-
 service/components/public/Mixins.js           |   46 +
 .../public/jy-commodity-information/index.vue |  187 +++
 service/pages.json                            |    6 +
 service/pages/chat/chat.vue                   |  712 +++++++++++
 .../pages/chat/components/news-temp/index.vue |  223 ++++
 service/pages/chat/emoji.js                   |   33 +
 service/pages/chat/emoji.vue                  |   42 +
 service/pages/chat/fn.js                      |   30 +
 service/pages/chat/index.scss                 |  118 ++
 service/pages/chat/jy-plus.vue                |  344 +++++
 service/pages/chat/jy-voice.vue               |  280 ++++
 service/pages/index/index.vue                 |   25 +-
 service/static/audio.png                      |  Bin 0 -> 3730 bytes
 22 files changed, 2714 insertions(+), 681 deletions(-)
 create mode 100644 service/components/public/Mixins.js
 create mode 100644 service/components/public/jy-commodity-information/index.vue
 create mode 100644 service/pages/chat/chat.vue
 create mode 100644 service/pages/chat/components/news-temp/index.vue
 create mode 100644 service/pages/chat/emoji.js
 create mode 100644 service/pages/chat/emoji.vue
 create mode 100644 service/pages/chat/fn.js
 create mode 100644 service/pages/chat/index.scss
 create mode 100644 service/pages/chat/jy-plus.vue
 create mode 100644 service/pages/chat/jy-voice.vue
 create mode 100644 service/static/audio.png

diff --git a/jiuyi2/common/js/config.js b/jiuyi2/common/js/config.js
index d9448b2f..f652f32b 100644
--- a/jiuyi2/common/js/config.js
+++ b/jiuyi2/common/js/config.js
@@ -7,6 +7,8 @@ const config = {
 	// #endif
 	// #ifndef H5
 	host: 'http://91f.xyz:8080',
+	// host: 'https://b433d23.r24.cpolar.top/',
+	// host: 'http://hvw2rn.natappfree.cc',
 	// #endif
 	// 支付方式配置
 	payType: {
diff --git a/jiuyi2/common/js/util.js b/jiuyi2/common/js/util.js
index ea7d3236..ff57358a 100644
--- a/jiuyi2/common/js/util.js
+++ b/jiuyi2/common/js/util.js
@@ -1766,6 +1766,12 @@ const util = {
 			success: (res) => {
 				if (res && res.result) {
 					let result = JSON.parse(res.result)
+					if (result.type == 'ADDFRIEND') { 
+						uni.navigateTo({
+							url: `/pages/news/addFriend?account=${result.account}`
+						});
+						return
+					}
 					if (result.key == 'user') {
 						// 跳转申请添加好友界面
 						uni.navigateTo({
diff --git a/jiuyi2/components/shop/detail/footerMenu.vue b/jiuyi2/components/shop/detail/footerMenu.vue
index 11753f50..3b92574e 100644
--- a/jiuyi2/components/shop/detail/footerMenu.vue
+++ b/jiuyi2/components/shop/detail/footerMenu.vue
@@ -99,7 +99,6 @@ function toCustomer() {
 
 			util.toChat(param)
 
-
 			uni.navigateTo({
 				url: util.setUrl('/pages/news/chat/chat', param)
 			})
@@ -131,10 +130,10 @@ function toCustomer() {
 				</view>
 			</view>
 
-			<!-- <view class="option ver" @click="toCustomer">
+			<view class="option ver" @click="toCustomer">
 				<image class="wh30" src="/static/customer-service.png" mode="aspectFit" />
 				<text class="text mt10">客服</text>
-			</view> -->
+			</view>
 		</view>
 
 		<!-- 下单 -->
diff --git a/jiuyi2/pages/mine/homepage.vue b/jiuyi2/pages/mine/homepage.vue
index d22444a0..68665713 100644
--- a/jiuyi2/pages/mine/homepage.vue
+++ b/jiuyi2/pages/mine/homepage.vue
@@ -18,6 +18,8 @@
 	import {
 		useStore,
 	} from 'vuex'
+	// api
+	import api from '@/api/index.js'
 	// 工具库
 	import util from '@/common/js/util';
 	// 代理
diff --git a/jiuyi2/pages/mine/mine.vue b/jiuyi2/pages/mine/mine.vue
index be0ee4af..67c55d99 100644
--- a/jiuyi2/pages/mine/mine.vue
+++ b/jiuyi2/pages/mine/mine.vue
@@ -1,57 +1,71 @@
 <script setup>
-	/**
-	 * 个人中心 商城
-	 */
-	// 底部菜单
-	import {
-		ref,
-		computed,
-	} from 'vue'
-	import {
-		onReachBottom,
-		onPullDownRefresh,
-		onShow,
-		onLoad,
-		onPageScroll
-	} from '@dcloudio/uni-app';
-	import {
-		useStore
-	} from 'vuex'
-	// 顶部状态栏
-	import statusBar from '@/components/header/statusBar'
+/**
+ * 个人中心 商城
+ */
+// 底部菜单
+import {
+	ref,
+	computed,
+} from 'vue'
+import {
+	onReachBottom,
+	onPullDownRefresh,
+	onShow,
+	onLoad,
+	onPageScroll
+} from '@dcloudio/uni-app';
+import {
+	useStore
+} from 'vuex'
+// 顶部状态栏
+import statusBar from '@/components/header/statusBar'
 
-	// 产品列表
-	import productList from '@/components/shop/productList/productList';
-	// 底部导航
-	import footerMneu from '@/components/footerMenu/footerMenu'
-	// 
-	import util from '@/common/js/util';
-	// 
-	const store = useStore()
-	// 用户信息
-	const userinfo = computed(() => {
-		let result = store.state.userinfo || {}
-		return result
+// 产品列表
+import productList from '@/components/shop/productList/productList';
+// 底部导航
+import footerMneu from '@/components/footerMenu/footerMenu'
+// 
+import util from '@/common/js/util';
+// 
+const store = useStore()
+// 用户信息
+const userinfo = computed(() => {
+	let result = store.state.userinfo || {}
+	return result
+})
+// 是否显示顶部
+const showHeader = ref(false)
+
+onPageScroll((ev) => {
+	if (ev.scrollTop > 44) showHeader.value = true
+	else showHeader.value = false
+})
+
+// 跳转
+function link(url) {
+	uni.navigateTo({
+		url,
 	})
-	// 是否显示顶部
-	const showHeader = ref(false)
+}
+function toCustomer() { 
+	let param = {};
+	param.type = 'C2C'
+	param.name = `${props.detail.merName}`
+	param.msgId = `${rs.data.serviceId}`
+	param.isCustomer = true
 
-	onPageScroll((ev) => {
-		if (ev.scrollTop > 44) showHeader.value = true
-		else showHeader.value = false
+	util.toChat(param)
+
+
+	uni.navigateTo({
+		url: util.setUrl('/pages/news/chat/chat', param)
 	})
-
-	// 跳转
-	function link(url) {
-		uni.navigateTo({
-			url,
-		})
-	}
+}
 </script>
 
 <template>
 	<view class="app">
-		<view class="apex" :class="{'active': showHeader}">
+		<view class="apex" :class="{ 'active': showHeader }">
 			<statusBar />
 			<view class="head rows">
 				<view class=""></view>
@@ -80,8 +94,7 @@
 
 				<view class="df">
 					<!-- 客服 -->
-					<image class="ml20 wh40" @click="link('customer_service')" src="@/static/mine-kefu.png"
-						mode="aspectFill" />
+					<image class="ml20 wh40" @click="toCustomer" src="@/static/mine-kefu.png" mode="aspectFill" />
 					<!-- 设置 -->
 					<image class="ml20 wh40" @click="link('/pages/mine/setting/setting')" src="@/static/mine-shezhi.png"
 						mode="aspectFill" />
@@ -202,55 +215,55 @@
 </template>
 
 <style lang="scss" scoped>
-	// 
-	.apex {
-		position: fixed;
-		top: 0;
-		left: 0;
-		right: 0;
-		z-index: 10;
-		opacity: 0;
-		transition: .2s;
+// 
+.apex {
+	position: fixed;
+	top: 0;
+	left: 0;
+	right: 0;
+	z-index: 10;
+	opacity: 0;
+	transition: .2s;
 
-		&.active {
-			opacity: 1;
-			background-color: #fff;
-		}
-	}
-
-	// 头部个人资料卡
-	.header {
-		.avatar {
-			background: #D8D8D8;
-		}
-	}
-
-	// 我的钱包
-	.wallet {
-		position: relative;
-
-		.right {
-
-			text {
-				font-size: 24rpx;
-				color: #999999;
-				margin-right: 20rpx;
-			}
-		}
-	}
-
-	// 模块
-	.container {
-		position: relative;
-		overflow: hidden;
-		margin: 20rpx 20rpx;
-		padding: 0 20rpx;
+	&.active {
+		opacity: 1;
 		background-color: #fff;
-		border-radius: 20rpx;
+	}
+}
 
-		.main {
-			display: grid;
-			grid-template-columns: repeat(5, 1fr);
+// 头部个人资料卡
+.header {
+	.avatar {
+		background: #D8D8D8;
+	}
+}
+
+// 我的钱包
+.wallet {
+	position: relative;
+
+	.right {
+
+		text {
+			font-size: 24rpx;
+			color: #999999;
+			margin-right: 20rpx;
 		}
 	}
+}
+
+// 模块
+.container {
+	position: relative;
+	overflow: hidden;
+	margin: 20rpx 20rpx;
+	padding: 0 20rpx;
+	background-color: #fff;
+	border-radius: 20rpx;
+
+	.main {
+		display: grid;
+		grid-template-columns: repeat(5, 1fr);
+	}
+}
 </style>
\ No newline at end of file
diff --git a/jiuyi2/pages/news/chat/chat.vue b/jiuyi2/pages/news/chat/chat.vue
index e45ff3c7..809c204c 100644
--- a/jiuyi2/pages/news/chat/chat.vue
+++ b/jiuyi2/pages/news/chat/chat.vue
@@ -1,460 +1,454 @@
 <script setup>
-	/**
-	 * 聊天页面
-	 */
-	// 腾讯云聊天
-	import TencentCloudChat from '@tencentcloud/chat';
-	import {
-		ref,
-		reactive,
-		nextTick,
-		onUnmounted,
-		onMounted,
-		computed,
-		getCurrentInstance,
-		watch,
-	} from 'vue'
-	// api
-	import api from '@/api/index.js'
-	// 工具库
-	import util from '@/common/js/util.js'
-	import {
-		onLoad,
-		onReady,
-		onPageScroll,
-		onUnload
-	} from "@dcloudio/uni-app"
+/**
+ * 聊天页面
+ */
+// 腾讯云聊天
+import TencentCloudChat from '@tencentcloud/chat';
+import {
+	ref,
+	reactive,
+	nextTick,
+	onUnmounted,
+	onMounted,
+	computed,
+	getCurrentInstance,
+	watch,
+} from 'vue'
+// api
+import api from '@/api/index.js'
+// 工具库
+import util from '@/common/js/util.js'
+import {
+	onLoad,
+	onReady,
+	onPageScroll,
+	onUnload
+} from "@dcloudio/uni-app"
 
-	// 单条消息
-	import newsTemplate from './components/news-temp'
-	// 表情
-	import emoji from './emoji.vue'
-	// 语音条
-	import JyVoice from './jy-voice.vue'
-	// 加号菜单
-	import JyPlus from './jy-plus.vue'
+// 单条消息
+import newsTemplate from './components/news-temp'
+// 表情
+import emoji from './emoji.vue'
+// 语音条
+import JyVoice from './jy-voice.vue'
+// 加号菜单
+import JyPlus from './jy-plus.vue'
 
-	import {
-		useStore
-	} from 'vuex'
-	const {
-		proxy
-	} = getCurrentInstance()
-	const store = useStore()
+import {
+	useStore
+} from 'vuex'
+const {
+	proxy
+} = getCurrentInstance()
+const store = useStore()
 
+// 聊天对象
+const msg = reactive({
 	// 聊天对象
-	const msg = reactive({
-		// 聊天对象
-		id: '',
-		// 聊天类型 C2C单聊 GROUP群聊
-		type: '',
-		// 群人数
-		num: '',
-		// 是否客服聊天
-		isCustomer: false,
+	id: '',
+	// 聊天类型 C2C单聊 GROUP群聊
+	type: '',
+	// 群人数 
+	num: '',
+	// 是否客服聊天
+	isCustomer: false,
+})
+// 输入的内容
+const content = ref('')
+// 加载
+const loading = ref(false)
+// 用户信息
+const userinfo = computed(() => {
+	let result = store.state.userinfo
+	return result
+})
+// 列表数据
+const list = reactive({
+	// 列表条数
+	limit: 20,
+	//显示的数据
+	data: [],
+	// 
+	total: 0,
+})
+// 滚动条位置
+const top = ref(0)
+// 工具条的高度
+const toolHeight = ref(0)
+// 当前操作的元素
+const messageItem = ref({})
+// 工具栏状态 voice录音 input输入框 emoji表情 plus加号菜单
+const toolStatus = ref('input')
+// video路径
+const videoUrl = ref('')
+// 视频上下文
+const videoContext = ref(null)
+// 红包对象
+const redPacket = reactive({})
+
+onLoad(option => {
+	// 标题
+	let title = ''
+	// 聊天类型
+	if (option.type) msg.type = option.type
+	// 标题
+	if (option.name) title = option.name
+	// 用户id
+	if (option.msgId) msg.id = option.msgId
+	// 如果是群组
+	if (option.type == 'GROUP') {
+		msg.num = option.num
+		title = `(${option.num})${option.name}`
+	}
+	// 标题
+	if (title) uni.setNavigationBarTitle({
+		title,
 	})
-	// 输入的内容
-	const content = ref('')
-	// 加载
-	const loading = ref(false)
-	// 用户信息
-	const userinfo = computed(() => {
-		let result = store.state.userinfo
-		return result
+	// 是否客服
+	if (option.isCustomer) msg.isCustomer = option.isCustomer
+
+	// 开启消息监听
+	addListener()
+	// 获取历史消息
+	getHistory({
+		callback: scrollToBottom
 	})
-	// 列表数据
-	const list = reactive({
-		// 列表条数
-		limit: 20,
-		//显示的数据
-		data: [],
-		// 
-		total: 0,
-	})
-	// 滚动条位置
-	const top = ref(0)
-	// 工具条的高度
-	const toolHeight = ref(0)
-	// 当前操作的元素
-	const messageItem = ref({})
-	// 工具栏状态 voice录音 input输入框 emoji表情 plus加号菜单
-	const toolStatus = ref('input')
-	// video路径
-	const videoUrl = ref('')
-	// 视频上下文
-	const videoContext = ref(null)
-	// 红包对象
-	const redPacket = reactive({})
-
-	onLoad(option => {
-		// 标题
-		let title = ''
-		// 聊天类型
-		if (option.type) msg.type = option.type
-		// 标题
-		if (option.name) title = option.name
-		// 用户id
-		if (option.msgId) msg.id = option.msgId
-		// 如果是群组
-		if (option.type == 'GROUP') {
-			msg.num = option.num
-			title = `(${option.num})${option.name}`
-		}
-		// 标题
-		if (title) uni.setNavigationBarTitle({
-			title,
-		})
-		// 是否客服
-		if (option.isCustomer) msg.isCustomer = option.isCustomer
-
-		// 开启消息监听
-		addListener()
-		// 获取历史消息
-		getHistory({
-			callback: scrollToBottom
-		})
-		// #ifdef APP
-		uni.onKeyboardHeightChange((rs) => {
-			ghostBox.value.height = rs.height + 'px'
-			nextTick(() => {
-				scrollToBottom()
-			})
-		})
-		// #endif
-	})
-
-	onReady(() => {
-		uni.createSelectorQuery().in(proxy).select('#tool').boundingClientRect((rect) => {
-			toolHeight.value = rect.height
-		}).exec();
-		// 
-		videoContext.value = uni.createVideoContext('video')
-	})
-
-	onPageScroll((ev) => {
-		onContentScroll(ev)
-	})
-
-	onUnload(() => {
-		// #ifdef APP
-		uni.offKeyboardHeightChange(() => {})
-		// #endif
-		videoContext.value.stop()
-	})
-
-	// 开启监听消息
-	function addListener() {
-		let onMessageReceived = function(event) {
-			console.log('TencentCloudChat.EVENT.MESSAGE_RECEIVED', event)
-			setTimeout(() => {
-				// 获取历史记录
-				getHistory({
-					msgId: '',
-					limit: 1,
-				})
-			}, 200)
-		}
-
-		uni.$chat.on(TencentCloudChat.EVENT.MESSAGE_RECEIVED, onMessageReceived);
-	}
-
-	// 移除监听消息
-	function removeListener() {
-		uni.$chat.on(TencentCloudChat.EVENT.MESSAGE_RECEIVED);
-	}
-
-	// 获取更多消息记录
-	function getMoreHistroy() {
-		// 获取第一条消息记录
-		if (list.total <= list.data.length) return
-		getHistory({
-			msgId: list.data[0].id
-		})
-	}
-
-	/**
-	 * 获取历史记录
-	 * @param {Object} param
-	 */
-	function getHistory(param = {}) {
-		// 验证sdk是否准备完毕
-		let isReady = uni.$chat.isReady();
-		// 
-		if (!isReady && userinfo.value.id) {
-			setTimeout(function() {
-				getHistory(param)
-			}, 200);
-			return
-		}
-		// 
-		loading.value = true
-
-		// 获取单聊聊天记录
-		let request = api.news.getUserMsgHistory
-		// 如果是群聊 获取群聊聊天记录
-		if (msg.type == 'GROUP') request = api.news.getGroupMsgHistory
-
-		// 获取历史记录
-		request({
-			query: {
-				msgId: param.msgId || '',
-				fromId: userinfo.value.id,
-				toId: msg.id,
-				groupId: msg.id,
-				limit: param.limit || list.limit,
-			},
-		}).then(res => {
-			if (res.code === 200) {
-				// 结果
-				const result = res.data
-				// 头像路径
-				list.faceUrl = result.faceUrl
-
-				// 如果是最新消息
-				if (param.limit == 1) {
-					list.data.push(...result.list.map(item => {
-						item.callbackData = JSON.parse(item.callbackJson)
-						return item
-					}))
-				} else {
-					// 追加
-					list.data.unshift(...result.list.map(item => {
-						item.callbackData = JSON.parse(item.callbackJson)
-						return item
-					}))
-				}
-				console.log('getHostory', list.data)
-				// 总数
-				list.total = result.total
-				nextTick(() => {
-					param.callback && param.callback()
-				})
-				return
-			}
-			util.alert({
-				content: res.msg,
-				showCancel: false,
-			})
-		}).catch(rs => {
-			console.log('err', rs)
-		}).finally(() => {
-			loading.value = false
-		})
-	}
-
-	// 滚动至底部
-	function scrollToBottom() {
-		uni.createSelectorQuery().in(proxy).select('#scroll-content').boundingClientRect((res) => {
-			top.value = res.height
-
-			uni.pageScrollTo({
-				scrollTop: top.value,
-				duration: 0
-			})
-			// console.log('top.value', top.value)
-		}).exec();
-	}
-
-	// 防抖
-	function debounce(func, wait = 500) {
-		let timeout = null;
-		return function(...args) {
-			clearTimeout(timeout)
-			timeout = setTimeout(() => {
-				func.apply(this, args)
-			}, wait);
-		}
-	}
-
-	// 监听内容滚动
-	function onContentScroll(ev) {
-		if (ev.scrollTop == 50) getMoreHistroy()
-		debounce(() => {
-			top.value = ev.detail.scrollTop
-		})
-	}
-
-	// 点击发送
-	function handleSend() {
-		// 发送消息
-		sendMsg({
-			query: {
-				formId: userinfo.value.id,
-				toUserId: msg.id,
-				msgType: TencentCloudChat.TYPES.MSG_TEXT,
-			},
-			data: {
-				text: content.value
-			},
-			success: () => {
-				// 清空已发送的消息
-				content.value = ''
-			}
-		})
-	}
-
-	/**
-	 * 加号菜单发送
-	 * @param {Object} message 消息对象
-	 */
-	function handlePlusSend(message) {
-		sendMsg(message)
-	}
-
-	/**
-	 * 发送消息
-	 * @param {Object} param
-	 */
-	function sendMsg(param) {
-		// 
-		let request = api.news.sendUserMsg
-		// 
-		if (msg.type == 'GROUP') request = api.news.sendGroupMsg
-		if (msg.isCustomer) request = api.news.sendCusomterService
-
-		// 发送消息
-		request({
-			query: param.query,
-			data: param.data,
-		}).then((rs) => {
-			if (rs.code == 200) {
-				param.success ? param.success() : ''
-				return
-			}
-			util.alert({
-				content: rs.msg,
-				showCancel: false,
-			})
-		}).catch((rs) => {
-			console.log('sendMsg error:', rs);
-		})
-	}
-
-	/**
-	 * 打开红包详情
-	 * @param {Object} ev
-	 */
-	function handleRedPacket(ev) {
-		messageItem.value = ev
-		api.news.getRedPacketInfo({
-			query: {
-				// 红包id
-				redPacketId: ev.callbackData.callback_json[0].businessId
-			}
-		}).then(rs => {
-			if (rs.code == 200) {
-				proxy.$refs.RedPacketRef.open()
-				Object.assign(redPacket, rs.data)
-				return
-			}
-			util.alert({
-				content: rs.msg,
-				showCancel: false,
-			})
-		})
-	}
-
-	// 领取红包
-	function handleOpenReadPacket() {
-		// 如果不能领取
-		if (redPacket.redStatus == false) return
-		// 红包过期
-		// if (redPacket.isStale == 1) return
-
-
-		// 抢红包
-		api.news.getRedPacket({
-			query: {
-				// 红包id
-				redPacketId: redPacket.id,
-				// 领取人id
-				userId: userinfo.value.id,
-				// 群聊类型
-				sendType: {
-					'C2C': '1',
-					'GROUP': '2',
-				} [msg.type],
-			}
-		}).then(rs => {
-			if (rs.code == 200) {
-				// 修改领取状态
-				redPacket.redStatus = false
-				// 获取金额
-				redPacket.amount = rs.data
-				return
-			}
-			util.alert({
-				content: rs.msg,
-				showCancel: false,
-			})
-		})
-	}
-
-	// 选择的emoji
-	function emojiTap(val) {
-		content.value = content.value + val
-	}
-
-	// 点击工具栏
-	function handleTool(val) {
-		if (toolStatus.value === val) {
-			toolStatus.value = 'input'
-			return
-		}
-		toolStatus.value = val
-	}
-
-	// 输入框聚焦
-	function onFocus() {
-		handleTool('input')
-	}
-
-	// 输入语音
-	function voiceSend(message) {
-		console.log('handlePlusSend', message)
-		sendMsg({
-			message,
-		})
-	}
-
-	// 监听滚动
-	const handleScroll = (e) => {
-		if (e.detail.scrollTop === 0) {
-			getHistory()
-		}
-	}
-
-	// 撑起键盘的高度 打开该元素
-	const showGhost = ref(false)
-	// 给元素加高度
-	const ghostBox = ref({
-		height: '0px',
-		duration: '0.25s'
-	})
-
-	// 监听键盘高度变化 
-	function keyboardheightchange(res) {
-		ghostBox.value = res.detail
+	// #ifdef APP
+	uni.onKeyboardHeightChange((rs) => {
+		ghostBox.value.height = rs.height + 'px'
 		nextTick(() => {
-			showGhost.value = res.detail.height > 0 ? true : false
+			scrollToBottom()
 		})
+	})
+	// #endif
+})
+
+onReady(() => {
+	uni.createSelectorQuery().in(proxy).select('#tool').boundingClientRect((rect) => {
+		toolHeight.value = rect.height
+	}).exec();
+	// 
+	videoContext.value = uni.createVideoContext('video')
+})
+
+onPageScroll((ev) => {
+	onContentScroll(ev)
+})
+
+onUnload(() => {
+	// #ifdef APP
+	uni.offKeyboardHeightChange(() => { })
+	// #endif
+	videoContext.value.stop()
+})
+
+// 开启监听消息
+function addListener() {
+	let onMessageReceived = function (event) {
+		console.log('TencentCloudChat.EVENT.MESSAGE_RECEIVED', event)
+		setTimeout(() => {
+			// 获取历史记录
+			getHistory({
+				msgId: '',
+				limit: 1,
+			})
+		}, 200)
 	}
 
-	/**
-	 * 看视频
-	 * @param {Object} item 聊天消息对象
-	 */
-	function handleViewVideo(item) {
-		videoUrl.value = item.payload.videoUrl
-		// 进入全屏
-		videoContext.value.requestFullScreen()
-	}
+	uni.$chat.on(TencentCloudChat.EVENT.MESSAGE_RECEIVED, onMessageReceived);
+}
 
-	// 监听视频是否全屏
-	function onScreenChange(ev) {
-		console.log('onScreenChange', ev)
-		if (!ev.fullScreen) videoContext.value.pause()
+// 监听内容滚动
+function onContentScroll(ev) {
+	if (ev.scrollTop == 50) getMoreHistroy()
+	debounce(() => {
+		top.value = ev.detail.scrollTop
+	})
+}
+
+// 点击发送
+function handleSend() {
+	// 发送消息
+	sendMsg({
+		query: {
+			formId: userinfo.value.id,
+			toUserId: msg.id,
+			msgType: TencentCloudChat.TYPES.MSG_TEXT,
+		},
+		data: {
+			text: content.value
+		},
+		success: () => {
+			// 清空已发送的消息
+			content.value = ''
+		}
+	})
+}
+
+/**
+ * 加号菜单发送
+ * @param {Object} message 消息对象
+ */
+function handlePlusSend(message) {
+	sendMsg(message)
+}
+
+/**
+ * 发送消息
+ * @param {Object} param
+ */
+function sendMsg(param) {
+	// 
+	let request = api.news.sendUserMsg
+	// 
+	if (msg.type == 'GROUP') request = api.news.sendGroupMsg
+	// if (msg.isCustomer) request = api.news.sendCusomterService
+
+	// 发送消息
+	request({
+		query: param.query,
+		data: param.data,
+	}).then((rs) => {
+		if (rs.code == 200) {
+			param.success ? param.success() : ''
+			return
+		}
+		util.alert({
+			content: rs.msg,
+			showCancel: false,
+		})
+	}).catch((rs) => {
+		console.log('sendMsg error:', rs);
+	})
+}
+
+/**
+ * 打开红包详情
+ * @param {Object} ev
+ */
+function handleRedPacket(ev) {
+	messageItem.value = ev
+	api.news.getRedPacketInfo({
+		query: {
+			// 红包id
+			redPacketId: ev.callbackData.callback_json[0].businessId
+		}
+	}).then(rs => {
+		if (rs.code == 200) {
+			proxy.$refs.RedPacketRef.open()
+			Object.assign(redPacket, rs.data)
+			return
+		}
+		util.alert({
+			content: rs.msg,
+			showCancel: false,
+		})
+	})
+}
+
+// 领取红包
+function handleOpenReadPacket() {
+	// 如果不能领取
+	if (redPacket.redStatus == false) return
+	// 红包过期
+	// if (redPacket.isStale == 1) return
+
+
+	// 抢红包
+	api.news.getRedPacket({
+		query: {
+			// 红包id
+			redPacketId: redPacket.id,
+			// 领取人id
+			userId: userinfo.value.id,
+			// 群聊类型
+			sendType: {
+				'C2C': '1',
+				'GROUP': '2',
+			}[msg.type],
+		}
+	}).then(rs => {
+		if (rs.code == 200) {
+			// 修改领取状态
+			redPacket.redStatus = false
+			// 获取金额
+			redPacket.amount = rs.data
+			return
+		}
+		util.alert({
+			content: rs.msg,
+			showCancel: false,
+		})
+	})
+}
+
+// 选择的emoji
+function emojiTap(val) {
+	content.value = content.value + val
+}
+
+// 点击工具栏
+function handleTool(val) {
+	if (toolStatus.value === val) {
+		toolStatus.value = 'input'
+		return
 	}
+}
+
+// 获取更多消息记录
+function getMoreHistroy() {
+	// 获取第一条消息记录
+	if (list.total <= list.data.length) return
+	getHistory({
+		msgId: list.data[0].id
+	})
+}
+
+/**
+ * 获取历史记录
+ * @param {Object} param
+ */
+function getHistory(param = {}) {
+	// 验证sdk是否准备完毕
+	let isReady = uni.$chat.isReady();
+	// 
+	if (!isReady && userinfo.value.id) {
+		setTimeout(function () {
+			getHistory(param)
+		}, 200);
+		return
+	}
+	// 
+	loading.value = true
+
+	// 获取单聊聊天记录
+	let request = api.news.getUserMsgHistory
+	// 如果是群聊 获取群聊聊天记录
+	if (msg.type == 'GROUP') request = api.news.getGroupMsgHistory
+
+	// 获取历史记录
+	request({
+		query: {
+			msgId: param.msgId || '',
+			fromId: userinfo.value.id,
+			toId: msg.id,
+			groupId: msg.id,
+			limit: param.limit || list.limit,
+		},
+	}).then(res => {
+		if (res.code === 200) {
+			// 结果
+			const result = res.data
+			// 头像路径
+			list.faceUrl = result.faceUrl
+
+			// 如果是最新消息
+			if (param.limit == 1) {
+				list.data.push(...result.list.map(item => {
+					item.callbackData = JSON.parse(item.callbackJson)
+					return item
+				}))
+			} else {
+				// 追加
+				list.data.unshift(...result.list.map(item => {
+					item.callbackData = JSON.parse(item.callbackJson)
+					return item
+				}))
+			}
+			console.log('getHostory', list.data)
+			// 总数
+			list.total = result.total
+			nextTick(() => {
+				param.callback && param.callback()
+			})
+			return
+		}
+		util.alert({
+			content: res.msg,
+			showCancel: false,
+		})
+	}).catch(rs => {
+		console.log('err', rs)
+	}).finally(() => {
+		loading.value = false
+	})
+}
+
+// 滚动至底部
+function scrollToBottom() {
+	uni.createSelectorQuery().in(proxy).select('#scroll-content').boundingClientRect((res) => {
+		top.value = res.height
+
+		uni.pageScrollTo({
+			scrollTop: top.value,
+			duration: 0
+		})
+		// console.log('top.value', top.value)
+	}).exec();
+}
+
+// 防抖
+function debounce(func, wait = 500) {
+	let timeout = null;
+	return function (...args) {
+		clearTimeout(timeout)
+		timeout = setTimeout(() => {
+			func.apply(this, args)
+		}, wait);
+	}
+}
+
+// 输入框聚焦
+function onFocus() {
+	handleTool('input')
+}
+
+// 输入语音
+function voiceSend(message) {
+	console.log('handlePlusSend', message)
+	sendMsg({
+		message,
+	})
+}
+
+// 监听滚动
+const handleScroll = (e) => {
+	if (e.detail.scrollTop === 0) {
+		getHistory()
+	}
+}
+
+// 撑起键盘的高度 打开该元素
+const showGhost = ref(false)
+// 给元素加高度
+const ghostBox = ref({
+	height: '0px',
+	duration: '0.25s'
+})
+
+// 监听键盘高度变化 
+function keyboardheightchange(res) {
+	ghostBox.value = res.detail
+	nextTick(() => {
+		showGhost.value = res.detail.height > 0 ? true : false
+	})
+}
+
+/**
+ * 看视频
+ * @param {Object} item 聊天消息对象
+ */
+function handleViewVideo(item) {
+	videoUrl.value = item.payload.videoUrl
+	// 进入全屏
+	videoContext.value.requestFullScreen()
+}
+
+// 监听视频是否全屏
+function onScreenChange(ev) {
+	console.log('onScreenChange', ev)
+	if (!ev.fullScreen) videoContext.value.pause()
+}
 </script>
 
 <template>
@@ -574,147 +568,147 @@
 
 
 <style lang="scss" scoped>
-	@import './index.scss';
+@import './index.scss';
 
-	// 
-	#video {
-		position: fixed;
-		top: 100%;
-		left: 0;
+// 
+#video {
+	position: fixed;
+	top: 100%;
+	left: 0;
+}
+
+// 
+.red-bag {
+	position: relative;
+	width: 528rpx;
+	height: 60vh;
+	color: #ECCD97;
+	background-color: #e0534a;
+	box-shadow: 0 0 20rpx #00000033;
+
+	.rbag_top {
+		padding-top: 60rpx;
+		height: 70%;
+		background-color: #e0534a;
+		border-radius: 0 0 500rpx 500rpx / 0 0 200rpx 200rpx;
+		box-shadow: 0 5rpx 5rpx rgba(0, 0, 0, 0.2);
+
+		.amount {
+			margin-top: 120rpx;
+			text-align: center;
+			letter-spacing: 1rpx;
+
+			.value {
+				font-size: 60rpx;
+				font-weight: bold;
+			}
+		}
 	}
 
-	// 
-	.red-bag {
-		position: relative;
-		width: 528rpx;
-		height: 60vh;
-		color: #ECCD97;
-		background-color: #e0534a;
-		box-shadow: 0 0 20rpx #00000033;
+	.open_rbag_btn {
+		width: 180rpx;
+		height: 180rpx;
+		margin: -90rpx auto 0;
+		color: #fef5e8;
+		font-size: 74rpx;
+		font-weight: bold;
+		background-color: #ffd287;
+		box-shadow: 2rpx 2rpx 6rpx rgba(0, 0, 0, 0.2);
+		border-radius: 50%;
+		z-index: 1;
+	}
 
-		.rbag_top {
-			padding-top: 60rpx;
-			height: 70%;
-			background-color: #e0534a;
-			border-radius: 0 0 500rpx 500rpx / 0 0 200rpx 200rpx;
-			box-shadow: 0 5rpx 5rpx rgba(0, 0, 0, 0.2);
+	// 打开红包
+	.open_rbag_model {
+		position: fixed;
+		top: 0;
+		left: 0;
+		width: 100%;
+		height: 100vh;
+		background-color: rgba(0, 0, 0, 0.3);
+		z-index: 1000;
 
-			.amount {
-				margin-top: 120rpx;
-				text-align: center;
-				letter-spacing: 1rpx;
-
-				.value {
-					font-size: 60rpx;
-					font-weight: bold;
-				}
-			}
-		}
-
-		.open_rbag_btn {
-			width: 180rpx;
-			height: 180rpx;
-			margin: -90rpx auto 0;
-			color: #fef5e8;
-			font-size: 74rpx;
-			font-weight: bold;
-			background-color: #ffd287;
-			box-shadow: 2rpx 2rpx 6rpx rgba(0, 0, 0, 0.2);
-			border-radius: 50%;
-			z-index: 1;
-		}
-
-		// 打开红包
-		.open_rbag_model {
-			position: fixed;
+		.rbag_conbg {
+			position: absolute;
 			top: 0;
 			left: 0;
-			width: 100%;
-			height: 100vh;
-			background-color: rgba(0, 0, 0, 0.3);
-			z-index: 1000;
+			right: 0;
+			bottom: 0;
+			width: 80%;
+			height: 840rpx;
+			margin: auto;
+			z-index: 1001;
+		}
 
-			.rbag_conbg {
-				position: absolute;
-				top: 0;
-				left: 0;
-				right: 0;
-				bottom: 0;
-				width: 80%;
-				height: 840rpx;
-				margin: auto;
-				z-index: 1001;
+		.open_rbag_con {
+			z-index: 1002;
+
+			.open_title {
+				height: 120rpx;
+				line-height: 120rpx;
+				text-align: center;
+				font-size: 38rpx;
+				letter-spacing: 2rpx;
+				color: #e46965;
 			}
 
-			.open_rbag_con {
-				z-index: 1002;
+			.rbag_detail {
+				margin-top: 90rpx;
 
-				.open_title {
-					height: 120rpx;
-					line-height: 120rpx;
+				.open_money {
 					text-align: center;
-					font-size: 38rpx;
-					letter-spacing: 2rpx;
-					color: #e46965;
-				}
-
-				.rbag_detail {
-					margin-top: 90rpx;
-
-					.open_money {
-						text-align: center;
-						font-size: 80rpx;
-						color: #c95948;
-						font-weight: bold;
-						display: flex;
-						justify-content: center;
-
-						.danwei {
-							font-size: 30rpx;
-							margin-left: 16rpx;
-							margin-top: 24rpx;
-						}
-					}
-
-					.open_tips {
-						text-align: center;
-						font-size: 30rpx;
-						color: #d26762;
-						margin-top: 30rpx;
-					}
-				}
-
-				.lookbag_box {
-					margin-top: 300rpx;
+					font-size: 80rpx;
+					color: #c95948;
+					font-weight: bold;
 					display: flex;
 					justify-content: center;
 
-					.lookbag_btn {
-						width: 70%;
-						height: 90rpx;
-						line-height: 90rpx;
-						text-align: center;
-						font-size: 32rpx;
-						color: #c95948;
-						letter-spacing: 2rpx;
-						background-color: #ffd356;
-						border-radius: 50rpx;
-						box-shadow: 0rpx 0rpx 4rpx rgba(0, 0, 0, 0.2);
+					.danwei {
+						font-size: 30rpx;
+						margin-left: 16rpx;
+						margin-top: 24rpx;
 					}
 				}
 
-				.hide_btn {
-					position: absolute;
-					bottom: -110rpx;
-					left: 0;
-					right: 0;
-					width: 80rpx;
-					height: 80rpx;
-					line-height: 80rpx;
+				.open_tips {
 					text-align: center;
-					margin: 0 auto;
+					font-size: 30rpx;
+					color: #d26762;
+					margin-top: 30rpx;
 				}
 			}
+
+			.lookbag_box {
+				margin-top: 300rpx;
+				display: flex;
+				justify-content: center;
+
+				.lookbag_btn {
+					width: 70%;
+					height: 90rpx;
+					line-height: 90rpx;
+					text-align: center;
+					font-size: 32rpx;
+					color: #c95948;
+					letter-spacing: 2rpx;
+					background-color: #ffd356;
+					border-radius: 50rpx;
+					box-shadow: 0rpx 0rpx 4rpx rgba(0, 0, 0, 0.2);
+				}
+			}
+
+			.hide_btn {
+				position: absolute;
+				bottom: -110rpx;
+				left: 0;
+				right: 0;
+				width: 80rpx;
+				height: 80rpx;
+				line-height: 80rpx;
+				text-align: center;
+				margin: 0 auto;
+			}
 		}
 	}
+}
 </style>
\ No newline at end of file
diff --git a/jiuyi2/vite.config.js b/jiuyi2/vite.config.js
index fc5535df..1b57cfd6 100644
--- a/jiuyi2/vite.config.js
+++ b/jiuyi2/vite.config.js
@@ -3,7 +3,9 @@ import {
 } from 'vite';
 import uni from '@dcloudio/vite-plugin-uni';
 
-let target = 'http://91f.xyz:8080'
+// let target = 'http://91f.xyz:8080'
+let target = 'https://b433d23.r24.cpolar.top/'
+// let target = 'http://hvw2rn.natappfree.cc'
 
 export default defineConfig({
 	plugins: [uni()],
diff --git a/service/App.vue b/service/App.vue
index d976220a..37c3626c 100644
--- a/service/App.vue
+++ b/service/App.vue
@@ -8,7 +8,7 @@ export default {
 		// 登录令牌
 		const token = uni.getStorageSync('token')
 		// 用户信息
-		const userinfo = JSON.parse(uni.getStorageSync('userinfo')) 
+		const userinfo = JSON.parse(uni.getStorageSync('userinfo'))
 
 		// 如果登录保活
 		if (token) {
@@ -19,8 +19,7 @@ export default {
 					value: userinfo
 				})
 
-
-				// 登录腾讯IM
+				// 登录腾讯IM 
 				// util.loginTencent(userinfo)
 			}
 		} else {
diff --git a/service/common/js/util.js b/service/common/js/util.js
index 745b7ad7..6e6972fc 100644
--- a/service/common/js/util.js
+++ b/service/common/js/util.js
@@ -1759,11 +1759,11 @@ const util = {
 	 */
 	toChat(option) {
 		uni.navigateTo({
-			url: util.setUrl('/pages/news/chat/chat', {
+			url: util.setUrl('/pages/chat/chat', {
 				name: option.name,
 				msgId: option.msgId,
 				type: option.type,
-				num: option.num,
+				// num: option.num,
 			})
 		})
 	},
diff --git a/service/components/public/Mixins.js b/service/components/public/Mixins.js
new file mode 100644
index 00000000..6a2eb984
--- /dev/null
+++ b/service/components/public/Mixins.js
@@ -0,0 +1,46 @@
+// 状态栏高度
+export const statusBarHeight = (isUnit) => {
+    let h = uni.getSystemInfoSync().statusBarHeight
+    h = h ? h : 0
+    return isUnit ? h : `${h}px`
+}
+// 底部安全区域高度
+export const bottomSafeAreaHeight = (isUnit) => {
+    let b = uni.getSystemInfoSync().safeAreaInsets.bottom
+    b = b ? b : 0
+    return isUnit ? b : `${b}px`
+}
+// 获取屏幕宽
+export const screenWidth = (isUnit) => {
+    let w = uni.getSystemInfoSync().screenWidth
+    w = w ? w : 0
+    return isUnit ? w : `${w}px`
+}
+// 顶部导航栏的高度
+export const windowTop = (isUnit) => {
+    let h = uni.getSystemInfoSync().windowTop
+    h = h ? h : 0
+    return isUnit ? h : `${h}px`
+}
+// 获取屏幕高 x 小数
+export const screenHeight = (isUnit) => {
+    let h = uni.getSystemInfoSync().screenHeight
+    h = h ? h : 0
+    return isUnit ? h : `${h}px`
+}
+// 判断是否有上一页 返回上一页 否则跳转首页
+export const goBack = (url) => {
+    // 获取当前页面栈
+    const pages = getCurrentPages();
+
+    // 判断是否存在上一页
+    if (pages.length > 1) {
+        return uni.navigateBack({
+            delta: 1
+        })
+    } else {
+        return uni.reLaunch({
+            url: url
+        })
+    }
+}
\ No newline at end of file
diff --git a/service/components/public/jy-commodity-information/index.vue b/service/components/public/jy-commodity-information/index.vue
new file mode 100644
index 00000000..ee0462f5
--- /dev/null
+++ b/service/components/public/jy-commodity-information/index.vue
@@ -0,0 +1,187 @@
+<!-- 页面描述 -->
+<template>
+    <view class="commodity-information" @click="emit('click', orderInfo)">
+        <uni-section>
+            <template v-slot:decoration>
+                <!-- 商品图 -->
+                <image class="shop-image" :src="orderInfo.productImage" mode="aspectFill"></image>
+            </template>
+            <template v-slot:content>
+                <!-- 订单 |  聊天-->
+                <template v-if="showType == 1 || showType == 4">
+                    <view class="commodity-name commodity-name-1">
+                        <text class="commodity-name-title t2hd">{{ orderInfo.productName }}</text>
+                        <text class="commodity-name-ks thd">{{ orderInfo.status_text }}</text>
+                        <text v-if="showType == 4">{{ orderInfo.status }}</text>
+                    </view>
+                </template>
+                <!-- 历史浏览 | 收藏 -->
+                <template v-if="showType == 2 || showType == 3">
+                    <view class="commodity-name commodity-name-2">
+                        <text class="t2hd">耳钉耳钉耳钉耳钉耳钉耳钉耳钉耳钉耳钉耳钉耳钉</text>
+                        <view class="df aic" v-if="showType == 2">
+                            <view class="df aic price mr10">
+                                <text class="f20 jg">￥</text>
+                                <text class="f28">{{ orderInfo.price }}</text>
+                            </view>
+                            <view class="df xl">
+                                <text>销量</text> <text>{{ orderInfo.sales }}</text> <text>+</text>
+                            </view>
+                        </view>
+                        <view class="df aic" v-if="showType == 3">
+                            <view class="df xl thd">
+                                <text>店铺名称</text>
+                            </view>
+                        </view>
+                    </view>
+                </template>
+                <!-- 店铺管理 -->
+                <template v-if="showType == 5">
+                    <view class="df fdc jcsb hohp">
+                        <text class="t2hd c333 f28 fw600">耳钉耳钉耳钉耳钉耳钉耳钉耳钉耳钉耳钉耳钉耳钉</text>
+                        <text class="c333 f24">销量：156151</text>
+                        <view class="df aic">
+                            <text class="f24 cFF9B27">价格：￥123</text>
+                            <text class="f24 ml40 c999">库存：x1</text>
+                        </view>
+                    </view>
+                </template>
+            </template>
+            <template v-slot:right v-if="showType != 3 && right">
+                <template v-if="showType == 1 || showType == 4">
+                    <view class="df fdc jcsb aife" style="height: 100%;align-items: flex-end">
+                        <!-- 价格 -->
+                        <view class="price-num">
+                            <view class="df aic price">
+                                <text class="f20 jg">￥</text>
+                                <text class="f28">{{ orderInfo.productPrice }}</text>
+                            </view>
+                            <!-- 数量 -->
+                            <text class="c999 f24">x{{ orderInfo.totalNum }}</text>
+                        </view>
+                        <!-- 发送到聊天 -->
+                        <view @click.stop="emit('consult', orderInfo)" class="go-buy" v-if="showType == 4">
+                            <uni-tag :inverted="true" text="去咨询" type="warning" />
+                        </view>
+                    </view>
+                </template>
+                <template v-if="showType == 2">
+                    <view class="go-buy" @click.stop="emit('buy', orderInfo)">
+                        <uni-tag :inverted="true" text="去购买" type="warning" />
+                    </view>
+                </template>
+            </template>
+        </uni-section>
+    </view>
+</template>
+
+<script setup>
+import { ref, defineEmits } from 'vue'
+const emit = defineEmits(['consult', 'click', 'buy'])
+const props = defineProps({
+    // 订单信息
+    orderInfo: {
+        type: Object,
+        default: () => {
+            return {
+                shop_logo: '',
+                shop_name: '123',
+                order_status_text: 6,
+            }
+        },
+    },
+    // 1是订单模式
+    // 2是历史浏览
+    // 3是收藏
+    // 4是聊天
+    showType: {
+        type: Number,
+        default: 1
+    },
+    // 在4的模式下是否显示销量
+    right: {
+        type: Boolean,
+        default: true
+    }
+})
+</script>
+<style scoped lang="scss">
+.commodity-information {
+    padding: 0 20rpx;
+}
+
+$h : 164rpx;
+
+.shop-image {
+    height: $h;
+    width: 164rpx;
+    background-color: #D8D8D8;
+    border-radius: 10rpx;
+    margin-right: 10rpx;
+}
+
+::v-deep .uni-section-header {
+    padding: 0 !important;
+
+    .uni-section-header__content {
+        height: $h;
+    }
+
+    .uni-section-header__slot-right {
+        height: $h;
+    }
+}
+
+.commodity-name {
+    height: 100%;
+    display: flex;
+    flex-direction: column;
+
+    &-title {
+        color: #333333;
+        font-size: 28rpx;
+        font-weight: normal;
+        margin-bottom: 8rpx;
+    }
+
+    &-ks {
+        font-size: 24rpx;
+        color: #999999;
+    }
+}
+
+.commodity-name-2 {
+    justify-content: space-between;
+
+}
+
+.commodity-name-1 {
+    justify-content: flex-start;
+
+}
+
+.go-buy {
+    height: 100%;
+    display: flex;
+    flex-direction: column-reverse;
+}
+
+.price-num {
+    display: flex;
+    flex-direction: column;
+    align-items: flex-end;
+    margin-left: 20rpx;
+
+    .price {
+        color: #3D3D3D;
+    }
+}
+
+.jg {
+    margin-right: 4rpx;
+}
+
+.xl {
+    color: #8C8C8C;
+}
+</style>
\ No newline at end of file
diff --git a/service/pages.json b/service/pages.json
index 99445172..208c4067 100644
--- a/service/pages.json
+++ b/service/pages.json
@@ -19,6 +19,12 @@
 				"navigationBarTitleText": "订单"
 			}
 		},
+		{
+			"path": "pages/chat/chat",
+			"style": {
+				"navigationBarTitleText": "聊天"
+			}
+		},
 		{
 			"path": "pages/index/article",
 			"style": {
diff --git a/service/pages/chat/chat.vue b/service/pages/chat/chat.vue
new file mode 100644
index 00000000..9fe69568
--- /dev/null
+++ b/service/pages/chat/chat.vue
@@ -0,0 +1,712 @@
+<script setup>
+/**
+ * 聊天页面
+ */
+// 腾讯云聊天
+import TencentCloudChat from '@tencentcloud/chat';
+import {
+	ref,
+	reactive,
+	nextTick,
+	onUnmounted,
+	onMounted,
+	computed,
+	getCurrentInstance,
+	watch,
+} from 'vue'
+// api
+import api from '@/api/index.js'
+// 工具库
+import util from '@/common/js/util.js'
+import {
+	onLoad,
+	onReady,
+	onPageScroll,
+	onUnload
+} from "@dcloudio/uni-app"
+
+// 单条消息
+import newsTemplate from './components/news-temp'
+// 表情
+import emoji from './emoji.vue'
+// 语音条
+import JyVoice from './jy-voice.vue'
+// 加号菜单
+import JyPlus from './jy-plus.vue'
+
+import {
+	useStore
+} from 'vuex'
+const {
+	proxy
+} = getCurrentInstance()
+const store = useStore()
+
+// 聊天对象
+const msg = reactive({
+	// 聊天对象
+	id: '',
+	// 聊天类型 C2C单聊 GROUP群聊
+	type: '',
+	// 群人数
+	num: '',
+	// 是否客服聊天
+	isCustomer: false,
+})
+// 输入的内容
+const content = ref('')
+// 加载
+const loading = ref(false)
+// 用户信息
+const userinfo = computed(() => {
+	let result = store.state.userinfo
+	return result
+})
+// 列表数据
+const list = reactive({
+	// 列表条数
+	limit: 20,
+	//显示的数据
+	data: [],
+	// 
+	total: 0,
+})
+// 滚动条位置
+const top = ref(0)
+// 工具条的高度
+const toolHeight = ref(0)
+// 当前操作的元素
+const messageItem = ref({})
+// 工具栏状态 voice录音 input输入框 emoji表情 plus加号菜单
+const toolStatus = ref('input')
+// video路径
+const videoUrl = ref('')
+// 视频上下文
+const videoContext = ref(null)
+// 红包对象
+const redPacket = reactive({})
+
+onLoad(option => { 
+	// 标题
+	let title = ''
+	// 聊天类型
+	if (option.type) msg.type = option.type
+	// 标题
+	if (option.name) title = option.name
+	// 用户id
+	if (option.msgId) msg.id = option.msgId
+	// 如果是群组
+	if (option.type == 'GROUP') {
+		msg.num = option.num
+		title = `(${option.num})${option.name}`
+	}
+	// 标题
+	if (title) uni.setNavigationBarTitle({
+		title,
+	})
+	// 是否客服
+	if (option.isCustomer) msg.isCustomer = option.isCustomer
+
+	// 开启消息监听
+	addListener()
+	// 获取历史消息
+	getHistory({
+		callback: scrollToBottom
+	})
+	// #ifdef APP
+	uni.onKeyboardHeightChange((rs) => {
+		ghostBox.value.height = rs.height + 'px'
+		nextTick(() => {
+			scrollToBottom()
+		})
+	})
+	// #endif
+})
+
+onReady(() => {
+	uni.createSelectorQuery().in(proxy).select('#tool').boundingClientRect((rect) => {
+		toolHeight.value = rect.height
+	}).exec();
+	// 
+	videoContext.value = uni.createVideoContext('video')
+})
+
+onPageScroll((ev) => {
+	onContentScroll(ev)
+})
+
+onUnload(() => {
+	// #ifdef APP
+	uni.offKeyboardHeightChange(() => { })
+	// #endif
+	videoContext.value.stop()
+})
+
+// 开启监听消息
+function addListener() {
+	let onMessageReceived = function (event) {
+		console.log('TencentCloudChat.EVENT.MESSAGE_RECEIVED', event)
+		setTimeout(() => {
+			// 获取历史记录
+			getHistory({
+				msgId: '',
+				limit: 1,
+			})
+		}, 200)
+	}
+
+	uni.$chat.on(TencentCloudChat.EVENT.MESSAGE_RECEIVED, onMessageReceived);
+}
+
+// 移除监听消息
+function removeListener() {
+	uni.$chat.on(TencentCloudChat.EVENT.MESSAGE_RECEIVED);
+}
+
+// 获取更多消息记录
+function getMoreHistroy() {
+	// 获取第一条消息记录
+	if (list.total <= list.data.length) return
+	getHistory({
+		msgId: list.data[0].id
+	})
+}
+
+/**
+ * 获取历史记录
+ * @param {Object} param
+ */
+function getHistory(param = {}) {
+	// 验证sdk是否准备完毕
+	let isReady = uni.$chat.isReady();
+	// 
+	if (!isReady && userinfo.value.id) {
+		setTimeout(function () {
+			getHistory(param)
+		}, 200);
+		return
+	}
+	// 
+	loading.value = true
+
+	// 获取单聊聊天记录
+	let request = api.news.getUserMsgHistory
+	// // 如果是群聊 获取群聊聊天记录
+	// if (msg.type == 'GROUP') request = api.news.getGroupMsgHistory
+
+	// 获取历史记录
+	request({
+		query: {
+			msgId: param.msgId || '',
+			fromId: userinfo.value.serviceId,
+			toId: msg.id,
+			// groupId: msg.id,
+			limit: param.limit || list.limit,
+		},
+	}).then(res => {
+		if (res.code === 200) {
+			// 结果
+			const result = res.data
+
+			// 如果是最新消息
+			if (param.limit == 1) {
+				list.data.push(...result.list.map(item => {
+					item.callbackData = JSON.parse(item.callbackJson)
+					return item
+				}))
+			} else {
+				// 追加
+				list.data.unshift(...result.list.map(item => {
+					item.callbackData = JSON.parse(item.callbackJson)
+					return item
+				}))
+			}
+			console.log('getHostory', list.data)
+			// 总数
+			list.total = result.total
+			nextTick(() => {
+				param.callback && param.callback()
+			})
+			return
+		}
+		util.alert({
+			content: res.msg,
+			showCancel: false,
+		})
+	}).catch(rs => {
+		console.log('err', rs)
+	}).finally(() => {
+		loading.value = false
+	})
+}
+
+// 滚动至底部
+function scrollToBottom() {
+	uni.createSelectorQuery().in(proxy).select('#scroll-content').boundingClientRect((res) => {
+		top.value = res.height
+
+		uni.pageScrollTo({
+			scrollTop: top.value,
+			duration: 0
+		})
+		// console.log('top.value', top.value)
+	}).exec();
+}
+
+// 防抖
+function debounce(func, wait = 500) {
+	let timeout = null;
+	return function (...args) {
+		clearTimeout(timeout)
+		timeout = setTimeout(() => {
+			func.apply(this, args)
+		}, wait);
+	}
+}
+
+// 监听内容滚动
+function onContentScroll(ev) {
+	if (ev.scrollTop == 50) getMoreHistroy()
+	debounce(() => {
+		top.value = ev.detail.scrollTop
+	})
+}
+
+// 点击发送
+function handleSend() {
+	// 发送消息
+	sendMsg({
+		query: {
+			formId: userinfo.value.id,
+			toUserId: msg.id,
+			msgType: TencentCloudChat.TYPES.MSG_TEXT,
+		},
+		data: {
+			text: content.value
+		},
+		success: () => {
+			// 清空已发送的消息
+			content.value = ''
+		}
+	})
+}
+
+/**
+ * 加号菜单发送
+ * @param {Object} message 消息对象
+ */
+function handlePlusSend(message) {
+	sendMsg(message)
+}
+
+/**
+ * 发送消息
+ * @param {Object} param
+ */
+function sendMsg(param) {
+	// 
+	let request = api.news.sendUserMsg
+	// 
+	if (msg.type == 'GROUP') request = api.news.sendGroupMsg
+
+	// 发送消息
+	request({
+		query: param.query,
+		data: param.data,
+	}).then((rs) => {
+		if (rs.code == 200) {
+			param.success ? param.success() : ''
+			return
+		}
+		util.alert({
+			content: rs.msg,
+			showCancel: false,
+		})
+	}).catch((rs) => {
+		console.log('sendMsg error:', rs);
+	})
+}
+
+/**
+ * 打开红包详情
+ * @param {Object} ev
+ */
+function handleRedPacket(ev) {
+	messageItem.value = ev
+	api.news.getRedPacketInfo({
+		query: {
+			// 红包id
+			redPacketId: ev.callbackData.callback_json[0].businessId
+		}
+	}).then(rs => {
+		if (rs.code == 200) {
+			proxy.$refs.RedPacketRef.open()
+			Object.assign(redPacket, rs.data)
+			return
+		}
+		util.alert({
+			content: rs.msg,
+			showCancel: false,
+		})
+	})
+}
+
+// 领取红包
+function handleOpenReadPacket() {
+	// 如果不能领取
+	if (redPacket.redStatus == false) return
+	// 红包过期
+	// if (redPacket.isStale == 1) return
+
+
+	// 抢红包
+	api.news.getRedPacket({
+		query: {
+			// 红包id
+			redPacketId: redPacket.id,
+			// 领取人id
+			userId: userinfo.value.id,
+			// 群聊类型
+			sendType: {
+				'C2C': '1',
+				'GROUP': '2',
+			}[msg.type],
+		}
+	}).then(rs => {
+		if (rs.code == 200) {
+			// 修改领取状态
+			redPacket.redStatus = false
+			// 获取金额
+			redPacket.amount = rs.data
+			return
+		}
+		util.alert({
+			content: rs.msg,
+			showCancel: false,
+		})
+	})
+}
+
+// 选择的emoji
+function emojiTap(val) {
+	content.value = content.value + val
+}
+
+// 点击工具栏
+function handleTool(val) {
+	if (toolStatus.value === val) {
+		toolStatus.value = 'input'
+		return
+	}
+	toolStatus.value = val
+}
+
+// 输入框聚焦
+function onFocus() {
+	handleTool('input')
+}
+
+// 输入语音
+function voiceSend(message) {
+	console.log('handlePlusSend', message)
+	sendMsg({
+		message,
+	})
+}
+
+// 监听滚动
+const handleScroll = (e) => {
+	if (e.detail.scrollTop === 0) {
+		getHistory()
+	}
+}
+
+// 撑起键盘的高度 打开该元素
+const showGhost = ref(false)
+// 给元素加高度
+const ghostBox = ref({
+	height: '0px',
+	duration: '0.25s'
+})
+
+// 监听键盘高度变化 
+function keyboardheightchange(res) {
+	ghostBox.value = res.detail
+	nextTick(() => {
+		showGhost.value = res.detail.height > 0 ? true : false
+	})
+}
+
+/**
+ * 看视频
+ * @param {Object} item 聊天消息对象
+ */
+function handleViewVideo(item) {
+	videoUrl.value = item.payload.videoUrl
+	// 进入全屏
+	videoContext.value.requestFullScreen()
+}
+
+// 监听视频是否全屏
+function onScreenChange(ev) {
+	console.log('onScreenChange', ev)
+	if (!ev.fullScreen) videoContext.value.pause()
+}
+</script>
+
+<template>
+	<view class="app">
+		<scroll-view class="scroll-view" scroll-y :scroll-with-animation="true" :scroll-top="top"
+			@scroll="onContentScroll" @scrolltoupper="getMoreHistroy">
+			<view id="scroll-content" style="padding: 30rpx 30rpx">
+				<view v-for="(item, index) in list.data" :key="index">
+					<!-- 普通消息 -->
+					<view class="message"
+						:class="[(item.From_Account || item.fromId) == userinfo.id ? 'self' : 'friend']">
+						<!-- 如果是我自己 -->
+						<view v-if="msg.type == 'C2C'">
+							<image :src="list.faceUrl" class="avatar wh80" mode="aspectFill" />
+						</view>
+						<view v-else>
+							<image :src="item.fromFaceUrl" class="avatar wh80" mode="aspectFill" />
+						</view>
+
+						<view class="df fdc mlr20">
+							<!-- 昵称 -->
+							<view class="df fdc" v-if="item.from != userinfo.userId">
+								<view class="name">{{ item.callbackData.from_name }}</view>
+							</view>
+							<!-- 消息 -->
+							<newsTemplate :item="item" :msg="msg" @openRedBag="handleRedPacket"
+								@viewVideo="handleViewVideo" />
+						</view>
+					</view>
+				</view>
+				<view v-if="showGhost" :style="{ height: `${ghostBox.height}px`, transition: `${ghostBox.duration}s` }">
+				</view>
+				<view class="ghost" :style="{ height: toolHeight + 'px' }"></view>
+			</view>
+		</scroll-view>
+	</view>
+
+	<view class="tool" id="tool">
+		<view class="tool-group" style="background: #F6F6F6;">
+			<!-- 语音 -->
+			<image src="/static/news-voice.png" mode="widthFix" class="thumb" @click="handleTool('voice')"></image>
+			<!-- 摁住说话 -->
+			<template v-if="toolStatus == 'voice'">
+				<JyVoice @send="voiceSend" :msg="msg" />
+			</template>
+			<!-- 输入框 -->
+			<template v-if="toolStatus != 'voice'">
+				<uni-easyinput @focus="onFocus" type="text" v-model="content" :clearable="false" class="input"
+					:adjust-position="false" @keyboardheightchange="keyboardheightchange" placeholder="请输入你的问题"
+					confirmType="发送" />
+			</template>
+			<!-- 表情 -->
+			<image src="/static/news-emoji.png" mode="widthFix" class="thumb" @click="handleTool('emoji')"></image>
+			<!-- 加号 -->
+			<template v-if="!content">
+				<image src="/static/news-plus.png" mode="widthFix" class="thumb" @click="handleTool('plus')" />
+			</template>
+			<!-- 文本发送按钮 -->
+			<template v-else>
+				<view class="send" @click="handleSend">发送</view>
+			</template>
+		</view>
+		<view v-if="showGhost" :style="{ height: `${ghostBox.height}px`, transition: `${ghostBox.duration}s` }"></view>
+		<!-- 表情 -->
+		<template v-if="toolStatus == 'emoji'">
+			<emoji @setEmoj="emojiTap"></emoji>
+		</template>
+		<!-- 加号 -->
+		<template v-if="toolStatus == 'plus'">
+			<JyPlus @send="handlePlusSend" :msg="msg"></JyPlus>
+		</template>
+	</view>
+
+	<!-- 视频 -->
+	<video :src="videoUrl" id="video" @fullscreenchange="onScreenChange" />
+
+	<!-- 红包封面 -->
+	<uni-popup ref="RedPacketRef" type="center">
+		<view class="red-bag br20" @touchmove.stop.prevent="">
+			<view class="rbag_top">
+				<view class="user fmid">
+					<view class="avatar">
+						<image class="wh80 cir" :src="redPacket.fromUrl" mode="scaleToFill" />
+					</view>
+					<view class="ml15 f32">{{ redPacket.fromName }}的红包</view>
+				</view>
+				<view class="app_name mt15 mlr30 tac f40">{{ redPacket.blessing }}</view>
+				<!--  -->
+				<view class="cfff f32 tac mt50" v-if="redPacket.isStale == 1">红包已过期</view>
+				<view class="cfff f32 tac mt50" v-else-if="redPacket.remainingCount == 0">来晚啦，红包已被抢完</view>
+
+				<!-- redPacket.redStatus true可以领取 false不可领取 -->
+				<view class="amount f32" v-if="!redPacket.redStatus">
+					<text class="">已领取</text>
+					<text class="value">{{ redPacket.amount }}</text>
+					<text class="unit" v-if="redPacket.payType == 1">余额</text>
+					<text class="unit" v-else-if="redPacket.payType == 2">积分</text>
+				</view>
+			</view>
+
+			<view class="open_rbag_btn pr fmid" @click="handleOpenReadPacket">
+				<text v-if="redPacket.amount">已</text>
+				<text>开</text>
+			</view>
+		</view>
+
+		<view class="tac mt35" @click.stop="$refs.RedPacketRef.close()">
+			<uni-icons type="close" color="#fbd977" size="32" />
+		</view>
+	</uni-popup>
+</template>
+
+
+<style lang="scss" scoped>
+@import './index.scss';
+
+// 
+#video {
+	position: fixed;
+	top: 100%;
+	left: 0;
+}
+
+// 
+.red-bag {
+	position: relative;
+	width: 528rpx;
+	height: 60vh;
+	color: #ECCD97;
+	background-color: #e0534a;
+	box-shadow: 0 0 20rpx #00000033;
+
+	.rbag_top {
+		padding-top: 60rpx;
+		height: 70%;
+		background-color: #e0534a;
+		border-radius: 0 0 500rpx 500rpx / 0 0 200rpx 200rpx;
+		box-shadow: 0 5rpx 5rpx rgba(0, 0, 0, 0.2);
+
+		.amount {
+			margin-top: 120rpx;
+			text-align: center;
+			letter-spacing: 1rpx;
+
+			.value {
+				font-size: 60rpx;
+				font-weight: bold;
+			}
+		}
+	}
+
+	.open_rbag_btn {
+		width: 180rpx;
+		height: 180rpx;
+		margin: -90rpx auto 0;
+		color: #fef5e8;
+		font-size: 74rpx;
+		font-weight: bold;
+		background-color: #ffd287;
+		box-shadow: 2rpx 2rpx 6rpx rgba(0, 0, 0, 0.2);
+		border-radius: 50%;
+		z-index: 1;
+	}
+
+	// 打开红包
+	.open_rbag_model {
+		position: fixed;
+		top: 0;
+		left: 0;
+		width: 100%;
+		height: 100vh;
+		background-color: rgba(0, 0, 0, 0.3);
+		z-index: 1000;
+
+		.rbag_conbg {
+			position: absolute;
+			top: 0;
+			left: 0;
+			right: 0;
+			bottom: 0;
+			width: 80%;
+			height: 840rpx;
+			margin: auto;
+			z-index: 1001;
+		}
+
+		.open_rbag_con {
+			z-index: 1002;
+
+			.open_title {
+				height: 120rpx;
+				line-height: 120rpx;
+				text-align: center;
+				font-size: 38rpx;
+				letter-spacing: 2rpx;
+				color: #e46965;
+			}
+
+			.rbag_detail {
+				margin-top: 90rpx;
+
+				.open_money {
+					text-align: center;
+					font-size: 80rpx;
+					color: #c95948;
+					font-weight: bold;
+					display: flex;
+					justify-content: center;
+
+					.danwei {
+						font-size: 30rpx;
+						margin-left: 16rpx;
+						margin-top: 24rpx;
+					}
+				}
+
+				.open_tips {
+					text-align: center;
+					font-size: 30rpx;
+					color: #d26762;
+					margin-top: 30rpx;
+				}
+			}
+
+			.lookbag_box {
+				margin-top: 300rpx;
+				display: flex;
+				justify-content: center;
+
+				.lookbag_btn {
+					width: 70%;
+					height: 90rpx;
+					line-height: 90rpx;
+					text-align: center;
+					font-size: 32rpx;
+					color: #c95948;
+					letter-spacing: 2rpx;
+					background-color: #ffd356;
+					border-radius: 50rpx;
+					box-shadow: 0rpx 0rpx 4rpx rgba(0, 0, 0, 0.2);
+				}
+			}
+
+			.hide_btn {
+				position: absolute;
+				bottom: -110rpx;
+				left: 0;
+				right: 0;
+				width: 80rpx;
+				height: 80rpx;
+				line-height: 80rpx;
+				text-align: center;
+				margin: 0 auto;
+			}
+		}
+	}
+}
+</style>
\ No newline at end of file
diff --git a/service/pages/chat/components/news-temp/index.vue b/service/pages/chat/components/news-temp/index.vue
new file mode 100644
index 00000000..1fa85aab
--- /dev/null
+++ b/service/pages/chat/components/news-temp/index.vue
@@ -0,0 +1,223 @@
+<script setup>
+	/**
+	 * 聊天框内容
+	 */
+	// 聊天
+	import TencentCloudChat from '@tencentcloud/chat';
+
+	import {
+		nextTick,
+		watch,
+		computed,
+		defineEmits,
+	} from 'vue'
+	import NewsAudio from '@/static/audio.png'
+	import JyCommodityInformation from '@/components/public/jy-commodity-information'
+	const props = defineProps({
+		item: {
+			type: Object,
+			default: () => {
+				{}
+			}
+		},
+		msg: {
+			type: Object,
+		}
+	})
+	import {
+		useStore
+	} from 'vuex'
+	const store = useStore()
+	const emit = defineEmits(['openRedBag', 'viewVideo'])
+	// 格式化
+	const formatData = computed(() => props.item.callbackData.callback_json[0])
+	//音频
+	const innerAudioContext = uni.createInnerAudioContext();
+	// 播放语音
+	const payAudio = (item) => {
+		innerAudioContext.src = item.payload.url
+		nextTick(() => {
+			innerAudioContext.play();
+		})
+	}
+	// 用户信息
+	const userinfo = computed(() => {
+		let result = store.state.userinfo
+		return result
+	})
+
+	// 拨打电话
+	function handleCall() {
+		uni.$TUICallKit.call({
+			userID: props.msg.id,
+			callMediaType: formatData.value.data.call_type,
+		}, res => {
+			console.log('[TUICallKit] call params: ', JSON.stringify(res));
+		});
+	}
+
+	// 开红包
+	function handleOpenRedBag() {
+		emit('openRedBag', props.item)
+	}
+
+	// 看视频
+	function handleViewVideo(item) {
+		emit('viewVideo', item)
+	}
+</script>
+
+<template>
+	<view class="content pr">
+		<!-- 图片 -->
+		<template v-if="item.callbackData.MsgType === TencentCloudChat.TYPES.MSG_IMAGE">
+			<image class="br10" :src="formatData.MsgContent.ImageInfoArray[0].URL" mode="widthFix" />
+		</template>
+		<!-- 文字 -->
+		<template v-else-if="item.callbackData.MsgType === TencentCloudChat.TYPES.MSG_TEXT">
+			<view class="p25">
+				{{ formatData.MsgContent.Text }}
+			</view>
+		</template>
+		<!-- 自定义消息 -->
+		<template v-else-if="item.callbackData.MsgType === TencentCloudChat.TYPES.MSG_CUSTOM">
+			<!-- 判断业务字段 -->
+			<template v-if="formatData.businessType">
+				<!-- 音视频通话 -->
+				<template v-if="formatData.businessType == 1">
+					<!-- 拨打电话 -->
+					<view class="p25" @click="handleCall">
+						<template v-if="formatData.actionType == TencentCloudChat.TSignaling.ACTION_TYPE_INVITE">
+							<text>[ </text>
+							<uni-icons type="videocam" color="#333" size="32rpx"
+								v-if="formatData.data.call_type == 1" />
+							<uni-icons type="phone" color="#333" size="32rpx"
+								v-else-if="formatData.data.call_type == 2" />
+							<text>发起</text>
+							<text v-if="formatData.data.call_type == 1">语音</text>
+							<text v-else-if="formatData.data.call_type == 2">视频</text>
+							<text>通话</text>
+							<text> ]</text>
+						</template>
+						<template v-if="formatData.actionType == TencentCloudChat.TSignaling.ACTION_TYPE_CANCEL_INVITE">
+							<text>[</text>
+							<uni-icons type="videocam" color="#333" size="32rpx"
+								v-if="formatData.data.call_type == 1" />
+							<uni-icons type="phone" color="#333" size="32rpx"
+								v-else-if="formatData.data.call_type == 2" />
+							<text>已取消通话 ]</text>
+						</template>
+						<template v-if="formatData.actionType == TencentCloudChat.TSignaling.ACTION_TYPE_ACCEPT_INVITE">
+							<text>[ </text>
+							<uni-icons type="videocam" color="#333" size="32rpx"
+								v-if="formatData.data.call_type == 1" />
+							<uni-icons type="phone" color="#333" size="32rpx"
+								v-else-if="formatData.data.call_type == 2" />
+							<text>已接通 ]</text>
+							<!-- <text>[ 通话时长 {{formatData.data.call_end}} ]</text> -->
+						</template>
+						<template v-if="formatData.actionType == TencentCloudChat.TSignaling.ACTION_TYPE_REJECT_INVITE">
+							<text>[ </text>
+							<uni-icons type="videocam" color="#333" size="32rpx"
+								v-if="formatData.data.call_type == 1" />
+							<uni-icons type="phone" color="#333" size="32rpx"
+								v-else-if="formatData.data.call_type == 2" />
+							<text>已拒绝通话 ]</text>
+						</template>
+						<template
+							v-if="formatData.actionType == TencentCloudChat.TSignaling.ACTION_TYPE_INVITE_TIMEOUT">
+							<text>[ </text>
+							<uni-icons type="videocam" color="#333" size="32rpx"
+								v-if="formatData.data.call_type == 1" />
+							<uni-icons type="phone" color="#333" size="32rpx"
+								v-else-if="formatData.data.call_type == 2" />
+							<text>超时未接听 ]</text>
+						</template>
+					</view>
+				</template>
+				<!-- 红包消息 -->
+				<template v-else-if="formatData.businessType == 'redPacket'">
+					<!-- 红包 -->
+					<view class="redPacket br10" :class="{'disabled': 0}"
+						@click="handleOpenRedBag">
+						<view class="df aic">
+							<image class="img fs0 mr10" src="/static/image/red-envelope.png" />
+							<view class="red-packet-text cfff">{{ formatData.data.blessing }}</view>
+						</view>
+						<!-- 分割线 -->
+						<view class="line"></view>
+						<view class="f20" style="color:#FBD3A4">{{ formatData.data.payType == 1 ? '余额红包' : '积分红包' }}</view>
+					</view>
+				</template>
+			</template>
+		</template>
+
+		<!-- 音频文件 -->
+		<template v-if="item.callbackData.MsgType == TencentCloudChat.TYPES.MSG_AUDIO">
+			<div class="df aic p25" style="width: 100rpx" @click="payAudio(item)">
+				<image class="mr20" style="width: 30rpx;height: 30rpx;z-index: 1;" :src="NewsAudio" />
+				<text>{{ item.payload.downloadFlag }}''</text>
+			</div>
+		</template>
+
+		<!-- 视频消息 -->
+		<template v-if="item.callbackData.MsgType == TencentCloudChat.TYPES.MSG_VIDEO">
+			<image :src="item.payload.snapshotUrl" mode="widthFix" />
+			<view class="window pfull" @click="handleViewVideo(item)">
+				<image class="pause pmid wh40" src="/static/pause.png" mode="aspectFit" />
+			</view>
+		</template>
+
+		<!-- 咨询订单 -->
+		<template v-if="item.callbackData.MsgType === 'order'">
+			<JyCommodityInformation :showType="4" :right="false"></JyCommodityInformation>
+		</template>
+		<!-- 咨询商品-->
+		<template v-if="item.callbackData.MsgType === 'shop'">
+			<JyCommodityInformation :showType="3"></JyCommodityInformation>
+		</template>
+	</view>
+</template>
+
+<style scoped lang="scss">
+	.content {
+		box-sizing: border-box;
+		min-height: 80rpx;
+		max-width: 60vw;
+		font-size: 28rpx;
+
+		image {
+			width: 200rpx;
+		}
+	}
+
+	// 红包消息
+	.redPacket {
+		width: 360rpx;
+		padding: 24rpx;
+		background-color: rgb(248, 162, 60);
+		color: #FCFEFD;
+
+		&.disabled {
+			opacity: .6;
+		}
+
+		.img {
+			width: 50rpx;
+			height: 60rpx;
+		}
+
+		.line {
+			display: inline-block;
+			width: 100%;
+			height: 1px;
+			background: #EF9B45;
+			margin: 10rpx 0;
+		}
+	}
+
+	// 遮罩
+	.window {
+		background-color: rgba(0, 0, 0, 0.2);
+	}
+</style>
\ No newline at end of file
diff --git a/service/pages/chat/emoji.js b/service/pages/chat/emoji.js
new file mode 100644
index 00000000..a69300bb
--- /dev/null
+++ b/service/pages/chat/emoji.js
@@ -0,0 +1,33 @@
+export default [
+    "😀", "😁", "😃", "😄", "😅", "😆", "😉", "😊", "😋", "😎", "😍",
+    "😘", "😗", "😙", "😚", "☺", "😇", "😐", "😑", "😶", "😏", "😣", "😥", "😮", "😯", "😪",
+    "😫", "😴", "😌", "😛", "😜", "😝", "😒", "😓", "😔", "😕", "😲", "😷", "😖", "😞", "😟",
+    "😤", "😢", "😭", "😦", "😧", "😨", "😬", "😰", "😱", "😳", "😵", "😡", "😠",
+    "👦", "👧", "👨", "👩", "👴", "👵", "👶", "👱", "👮", "👲", "👳", "👷", "👸", "💂", "🎅", "👰", "👼",
+    "💆", "💇", "🙍", "🙎", "🙅", "🙆", "💁", "🙋", "🙇", "🙌", "🙏", "👤", "👥", "🚶", "🏃", "👯",
+    "💃", "👫", "👬", "👭", "💏", "💑", "👪", "💪", "👈", "👉", "☝", "👆", "👇", "✌", "✋", "👌",
+    "👍", "👎", "✊", "👊", "👋", "👏", "👐", "✍", "👣", "👀", "👂", "👃", "👅", "👄", "💋", "👓",
+    "👔", "👙", "👛", "👜", "👝", "🎒", "💼", "👞", "👟", "👠", "👡", "👢", "👑",
+    "👒", "🎩", "🎓", "💄", "💅", "💍", "🌂", "📶", "📳", "📴", "♻", "🏧","🚮", "🚰", "♿", "🚹", "🚺",
+    "🚻", "🚼", "🚾", "⚠", "🚸", "⛔", "🚫", "🚳", "🚭", "🚯", "🚱", "🚷", "🔞", "💈",
+    "🙈", "🐒", "🐶", "🐕", "🐩", "🐺", "🐱","🐈", "🐯", "🐅", "🐆", "🐴", "🐎", "🐮", "🐂",
+    "🐃","🐄","🐷","🐖","🐗","🐽","🐏","🐑","🐐","🐪","🐫","🐘","🐭",
+    "🐁","🐀","🐹","🐰","🐇","🐻","🐨","🐼","🐾","🐔","🐓","🐣","🐤","🐥",
+    "🐦", "🐧", "🐸", "🐊","🐢", "🐍", "🐲", "🐉", "🐳", "🐋", "🐬", "🐟", "🐠", "🐡",
+    "🐙", "🐚", "🐌", "🐛", "🐜", "🐝", "🐞", "🦋",  "💐", "🌸", "💮", "🌹", "🌺",
+    "🌻", "🌼", "🌷", "🌱", "🌲", "🌳", "🌴", "🌵", "🌾", "🌿", "🍀", "🍁", "🍂", "🍃",
+    "🌍","🌎","🌏","🌐","🌑","🌒","🌓","🌔","🌕","🌖","🌗","🌘","🌙","🌚",
+    "🌛","🌜","☀","🌝","🌞","⭐","🌟","🌠","☁","⛅","☔","⚡","❄","🔥","💧","🌊",
+    "🏀", "🏈", "🏉", "🎾", "🎱", "🎳", "⛳", "🎣", "🎽", "🎿",
+    "😈", "👿", "👹", "👺", "💀", "☠", "👻", "👽", "👾", "💣",
+    "🌋", "🗻", "🏠", "🏡", "🏢", "🏣", "🏤", "🏥", "🏦", "🏨",
+    "⛲", "🌁", "🌃", "🌆", "🌇", "🎠", "🎡", "🎢", "🚂",
+    "🚌", "🚍", "🚎", "🚏", "🚐", "🚑", "🚒", "🚓", "🚔", "🚕", "🚖", "🚗", "🚘",
+    "💌", "💎", "🔪", "💈", "🚪", "🚽", "🚿", "🛁", "⌛", "⏳", "⌚", "⏰", "🎈", "🎉",
+    "💤", "💢", "💬", "💭", "♨", "🌀", "🔔", "🔕", "✡", "✝", "🔯", "📛", "🔰", "🔱", "⭕", "✅",
+    "☑", "✔", "✖", "❌", "❎", "➕", "➖", "➗", "➰", "➿", "〽", "✳", "✴", "❇", "‼", "⁉", "❓", "❔", "❕", "❗",
+    "🕛", "🕧", "🕐", "🕜", "🕑", "🕝", "🕒", "🕞", "🕓", "🕟", "🕔", "🕠", "🕕", "🕡",
+    "🕖", "🕢", "🕗", "🕣", "🕘", "🕤", "🕙", "🕥", "🕚", "🕦", "⏱", "⏲", "🕰",
+    "💘", "❤", "💓", "💔", "💕", "💖", "💗", "💙", "💚", "💛", "💜", "💝", "💞", "💟❣",
+    "🍇", "🍈", "🍉", "🍊", "🍋", "🍌", "🍍", "🍎", "🍏", "🍐", "🍑", "🍒", "🍓",
+]
\ No newline at end of file
diff --git a/service/pages/chat/emoji.vue b/service/pages/chat/emoji.vue
new file mode 100644
index 00000000..6868ccc3
--- /dev/null
+++ b/service/pages/chat/emoji.vue
@@ -0,0 +1,42 @@
+<template>
+	<view class="NewsPlus">
+		<scroll-view scroll-y scroll-with-animation>
+			<view append="tree" class="emoj_box">
+				<template v-for="(item, index) in emojiList" :key="index">
+					<text @click="emit('setEmoj', item)" class="emoj_box_img">{{ item }}</text>
+				</template>
+			</view>
+		</scroll-view>
+	</view>
+</template>
+<script setup>
+	import {
+		defineEmits
+	} from 'vue'
+	import emojiList from './emoji.js'
+	const emit = defineEmits(['setEmoj'])
+</script>
+
+<style scoped>
+	.NewsPlus {
+		background-color: #f6f6f6;
+	}
+
+	.scroller {
+		flex: 1;
+	}
+
+	.emoj_box {
+		flex-direction: row;
+		flex-wrap: wrap;
+		justify-content: space-between;
+	}
+
+	.emoj_box_img {
+		font-size: 45rpx;
+		width: 83rpx;
+		height: 83rpx;
+		text-align: center;
+		line-height: 83rpx;
+	}
+</style>
\ No newline at end of file
diff --git a/service/pages/chat/fn.js b/service/pages/chat/fn.js
new file mode 100644
index 00000000..56a46624
--- /dev/null
+++ b/service/pages/chat/fn.js
@@ -0,0 +1,30 @@
+// 获取历史记录
+// C2C${userID}（单聊）
+// GROUP${groupID}（群聊）
+// GROUP${topicID}（话题）
+// @TIM#SYSTEM（系统通知会话）
+/**
+ * 获取历史记录
+ * @param {String} option 聊天属性
+ * @param {String} option.chatType C2C单聊 GROUP群聊/话题 @TIM#SYSTEM系统通知会话
+ * @param {String} option.msgId 聊天对象id 单聊/群聊/话题
+ * @param {String} option.nextReqMessageID 用于分页续拉的消息 ID。第一次拉取时不要传入 nextReqMessageID，续拉时填入上次调用 getMessageList 接口返回的该字段的值
+ */
+
+export const getHistoryMsg = async (option) => {
+	let options = {
+		// 对方的用户 ID 或者群组 ID 或聊天室 ID。
+		conversationID: `${option.chatType}${option.msgId}`,
+		nextReqMessageID: option.nextReqMessageID,
+	}
+
+	console.log('options', options);
+	return new Promise((resolve, reject) => {
+		uni.$chat.getMessageList(options).then((res) => {
+			resolve(res)
+		}).catch((e) => {
+			console.log('Promise reject', e);
+			reject(e)
+		});
+	})
+}
\ No newline at end of file
diff --git a/service/pages/chat/index.scss b/service/pages/chat/index.scss
new file mode 100644
index 00000000..432323ab
--- /dev/null
+++ b/service/pages/chat/index.scss
@@ -0,0 +1,118 @@
+
+
+.scroll-view {
+	box-sizing: border-box;
+	flex: 1;
+	height: 100%;
+}
+
+.message {
+	display: flex;
+	align-items: flex-start;
+	flex-direction: row;
+	margin-bottom: 40rpx;
+
+	.avatar {
+		width: 80rpx;
+		height: 80rpx;
+		border-radius: 10rpx;
+	}
+
+	.content {
+		min-height: 80rpx;
+		max-width: 60vw;
+		font-size: 28rpx;
+
+		image {
+			width: 200rpx;
+		}
+	}
+
+	// 我自己
+	&.self {
+		flex-direction: row-reverse;
+		// justify-content: flex-end;
+
+		.content {
+			background: #d9e1ff;
+			border-radius: 24rpx 0rpx 24rpx 24rpx;
+		}
+	}
+
+	// 对方
+	&.friend {
+		.name {
+			font-size: 20rpx;
+			color: '#000000';
+			margin-bottom: 8rpx;
+		}
+
+		.content {
+			border-radius: 0rpx 24rpx 24rpx 24rpx;
+			background: #ffffff;
+		}
+	}
+}
+
+.tool {
+	position: fixed;
+	width: 100%;
+	left: 0;
+	bottom: 0;
+	padding-bottom: constant(safe-area-inset-bottom);
+	padding-bottom: calc(0 + env(safe-area-inset-bottom));
+	z-index: 1;
+
+	.tool-group {
+		display: flex;
+		flex-direction: row;
+	}
+
+	&-group {
+		height: 120rpx;
+		display: flex;
+		align-items: center;
+	}
+
+	::v-deep .uni-easyinput__content {
+		border-radius: 192rpx;
+	}
+
+	.xf-for {
+		height: 80rpx;
+		padding-bottom: 12rpx;
+		background: #eee;
+
+		.xfBtn {
+			box-sizing: border-box;
+			border: 2px solid #dcdcdc;
+			background: #ffffff;
+			padding: 12rpx 32rpx;
+			font-size: 28rpx;
+			color: rgba(0, 0, 0, 0.9);
+			border-radius: 200rpx;
+			width: fit-content;
+			margin: 10rpx 20rpx;
+		}
+	}
+
+	.NewsPlus {
+		width: 100%;
+		height: 486rpx;
+	}
+
+	.thumb {
+		width: 44rpx;
+		height: 44rpx;
+		margin: 0 10rpx;
+	}
+
+	.send {
+		border-radius: 10rpx;
+		margin: 0 10rpx;
+		padding: 10rpx 20rpx;
+		background: #ff3737;
+		color: #fff;
+		font-size: small;
+	}
+}
diff --git a/service/pages/chat/jy-plus.vue b/service/pages/chat/jy-plus.vue
new file mode 100644
index 00000000..ba0030bc
--- /dev/null
+++ b/service/pages/chat/jy-plus.vue
@@ -0,0 +1,344 @@
+<script setup>
+// + 页面
+// 腾讯云聊天
+import TencentCloudChat from '@tencentcloud/chat';
+import {
+	ref,
+	reactive,
+	nextTick,
+	computed,
+} from 'vue'
+import {
+	screenHeight
+} from '@/components/public/Mixins'
+import JyCommodityInformation from '@/components/public/jy-commodity-information'
+// api
+import api from '@/api/index.js'
+// 工具库
+import util from '@/common/js/util.js'
+import { inject } from 'vue'
+
+const { checkLink } = inject('util');
+// 
+const props = defineProps({
+	msg: {
+		type: Object,
+	},
+})
+
+// 调用父级方法
+const emit = defineEmits(['plusClick', 'send'])
+// 加号菜单
+const plusList = computed(() => {
+	let result = [
+		{
+			type: 'picture.png',
+			label: '照片',
+			value: 'chooseImage',
+		}, {
+			type: 'photograph.png',
+			label: '拍摄',
+			value: 'takePhoto',
+		}, {
+			type: 'red-envelope.png',
+			label: '红包',
+			value: 'redEnvelope',
+		}
+	]
+
+	const isCustomer = props.msg.isCustomer;
+
+	// 单聊
+	if (props.msg.type == 'C2C' && !isCustomer) result.push({
+		type: 'news-voice.png',
+		label: '音视频',
+		value: 'voice'
+	})
+	// 客服
+	if (isCustomer) result.unshift({
+		type: 'order.png',
+		label: '订单',
+		value: 'chooseOrder',
+	}, {
+		type: 'shop.png',
+		label: '商品',
+		value: 'chooseShop',
+	})
+	return result
+})
+
+const popupRef = ref(null)
+const popupRE = ref(null)
+const formData = reactive({
+	name: ''
+})
+const popupData = reactive({
+	show: false,
+	title: '选择订单'
+})
+
+// 订单列表
+const list = reactive([])
+
+// 加号方法对象
+const plusClickObj = {
+	voice: () => {
+		// 菜单
+		const menu = [{
+			name: '语音通话',
+			type: 1,
+		},
+		{
+			nanme: '视频通话',
+			type: 2,
+		}
+		]
+
+		uni.showActionSheet({
+			itemList: ['语音通话', '视频通话'],
+			success: rs => {
+				uni.$TUICallKit.call({
+					userID: props.msg.id,
+					callMediaType: menu[rs.tapIndex].type,
+					// callParams: {
+					// 	roomID: 234,
+					// 	strRoomID: '2323423',
+					// 	timeout: 30
+					// },
+				}, res => {
+					console.log('[TUICallKit] call params: ', JSON.stringify(res));
+				});
+			}
+		})
+	},
+
+	// 选择订单
+	chooseOrder: () => {
+		let param = {
+			pageSize: 10,
+			pageNum: 1,
+			merId: props.msg.id,
+		}
+		api.shop.getShopOrderList(param).then(rs => {
+			if (rs.code == 200) {
+				list.length = 0
+				list.push(...rs.rows.map(item => {
+					// 状态
+					item.status = Number(item.status)
+					// 编辑订单状态文字
+					item.status_text = {
+						'0': '待支付',
+						'1': '待发货',
+						'4': '待收货',
+						'5': '已收货',
+						'6': '已完成',
+						'9': '已取消',
+					}[item.status]
+					return item
+				}))
+
+
+				nextTick().then(() => {
+					popupRef.value.open()
+				});
+				return
+			}
+
+			util.alert({
+				content: rs.msg,
+				showCancel: false,
+			})
+		})
+
+	},
+
+	// 选择商品
+	chooseShop: () => {
+		uni.navigateTo({
+			url: `/pages/news/goodsList/index?merId=${props.msg.id}`
+		});
+	},
+
+	// 发送红包
+	redEnvelope() {
+		uni.navigateTo({
+			url: util.setUrl('/pages/news/redPacket', {
+				// 聊天对象
+				msgId: props.msg.id,
+				// 发送方式
+				sendType: {
+					'C2C': 1,
+					'GROUP': 2,
+				}[props.msg.type],
+				num: props.msg.num,
+			})
+		})
+		// popupRE.value.open()
+	},
+
+	//拍照
+	takePhoto: () => {
+		console.log('takePhoto')
+		sendMsgImg({
+			sourceType: ['album'],
+		})
+	},
+
+	//选择图片
+	chooseImage: () => {
+		console.log('chooseImage')
+		sendMsgImg({
+			sourceType: ['album'],
+		})
+	}
+}
+
+// 发送图片消息
+function sendMsgImg(option) {
+	util.upload_image({
+		count: 1,
+		type: 1,
+		success: rs => {
+			emit('send', {
+				query: {
+					toUserId: props.msg.id,
+					msgType: TencentCloudChat.TYPES.MSG_IMAGE,
+				},
+				data: {
+					imgUrl: rs.value
+				},
+			})
+		}
+	})
+	return
+	// 选择图片
+	uni.chooseImage({
+		count: 1,
+		sourceType: option.sourceType, // 从相册选择
+		success: (res) => {
+			let message = uni.$chat.createImageMessage({
+				to: props.msg.id,
+				conversationType: props.msg.type,
+				payload: {
+					file: res
+				},
+				onProgress: function (event) {
+					console.log('file uploading:', event)
+				}
+			})
+			return
+		}
+	});
+}
+
+// 咨询订单
+const consult = (content) => {
+	let obj = {
+		content,
+		type: 'order'
+	}
+	popupRef.value.close()
+}
+</script>
+
+<template>
+	<view class="jy-plus">
+		<view class="NewsPlus ptb20" style="background: #F6F6F6;">
+			<view class="df fdc aic" v-for="(item, index) in plusList" :key="index" @click="plusClickObj[item.value]">
+				<view class="imageBox fmid wh100">
+					<image class="image wh50" :src="`/static/new-${item.type}`" mode="aspectFit" />
+				</view>
+				<text class="mt20">{{ item.label }}</text>
+			</view>
+		</view>
+	</view>
+
+	<!-- 咨询订单的弹窗 -->
+	<uni-popup ref="popupRef" type="bottom">
+		<view class="jy-popup bfff" :style="{ height: `${screenHeight(true) * 0.7}px` }">
+			<view class="title">
+				<text>咨询订单</text>
+			</view>
+			<view class="close-btn" @click="popupRef.close()">×</view>
+			<view class="input-view">
+				<uni-easyinput class="easyinput" placeholder="搜索你要查询的订单">
+					<template v-slot:left>
+						<uni-icons class="ml20" type="search" size="20"></uni-icons>
+					</template>
+				</uni-easyinput>
+			</view>
+			<scroll-view scroll-y scroll-with-animation>
+				<view v-for="(item, index) in list" :key="index">
+					<view class="time">
+						下单时间：{{ item.createTime }}
+					</view>
+					<JyCommodityInformation :showType="4" :orderInfo="item" @consult="consult"></JyCommodityInformation>
+				</view>
+			</scroll-view>
+		</view>
+	</uni-popup>
+</template>
+
+<style scoped lang="scss">
+.NewsPlus {
+	// 一行四个 
+	display: grid;
+	grid-template-columns: repeat(4, 1fr);
+	grid-gap: 20rpx;
+
+	.imageBox {
+		background-color: #fff;
+		border-radius: 20rpx;
+	}
+}
+
+.jy-popup {
+	width: 100%;
+	border-radius: 20px 20px 0px 0px;
+
+	.title {
+		width: 100%;
+		display: flex;
+		justify-content: center;
+		align-items: center;
+		padding: 20rpx 0;
+		// 底部边框显示
+		color: #3D3D3D;
+		font-size: 32rpx;
+	}
+
+	.close-btn {
+		position: absolute;
+		top: 40rpx;
+		right: 40rpx;
+		height: 52rpx;
+		line-height: 52rpx;
+		width: 52rpx;
+		background: #D8D8D8;
+		color: #999999;
+		font-size: 30rpx;
+		border-radius: 50%;
+		display: flex;
+		justify-content: center;
+		align-items: center;
+		transform: translate(50%, -50%);
+	}
+
+	.input-view {
+		// 只显示上下边框不显示左右
+		border-top: 1px solid #E5E5E5;
+		border-bottom: 1px solid #E5E5E5;
+		padding: 20rpx;
+	}
+
+	.easyinput {
+		flex: 1;
+	}
+
+	.time {
+		padding: 24rpx 20rpx 0 20rpx;
+		font-size: 22rpx;
+		color: #3D3D3D;
+	}
+}
+</style>
\ No newline at end of file
diff --git a/service/pages/chat/jy-voice.vue b/service/pages/chat/jy-voice.vue
new file mode 100644
index 00000000..cc2dbedf
--- /dev/null
+++ b/service/pages/chat/jy-voice.vue
@@ -0,0 +1,280 @@
+<!-- 语音 -->
+<template>
+	<view class="voice_box" @touchstart="sv.touchstartVoice" @touchmove.stop.prevent="sv.touchmoveVoice"
+		@touchend="sv.touchendVoice" @touchcancel="sv.touchcancelVoice">
+		<text class="voice_text c000">{{ voiceText }}</text>
+	</view>
+
+	<!-- 语音状态显示 -->
+	<template v-if="voiceFlg">
+		<!-- 录音UI效果 -->
+		<view class="record" :class="voiceFlg ? '' : 'hidden'">
+			<uni-icons :class="[voiceStop ? 'cancel' : 'ing']" :type="voiceStop ? 'micoff' : 'mic'" size="100" />
+			<view class="tis" :class="voiceStop ? 'change' : ''">{{ voiceTis }}</view>
+		</view>
+	</template>
+</template>
+
+<script setup>
+	import {
+		ref,
+		defineEmits
+	} from 'vue'
+	// 腾讯云聊天
+	import TencentCloudChat from '@tencentcloud/chat';
+	const props = defineProps({
+		msg: {
+			type: Object
+		},
+	})
+	const emit = defineEmits(['send'])
+	//录音
+	// #ifdef APP-PLUS
+	const recorderManager = uni.getRecorderManager();
+	// #endif
+	// 录音时长
+	const voiceLength = ref(0);
+	// 录音定时器
+	const voiceTimer = ref(null);
+	// 录音文本
+	const voiceText = ref('按住 说话');
+	// 录音提示
+	const voiceTis = ref('手指上滑 取消发送');
+	// 录音图标显示
+	const voiceFlg = ref(false);
+	// 录音开始Y坐标
+	const voicePageY = ref(0);
+	// 录音结束
+	const voiceStop = ref(false);
+	const str = '';
+	// 录音相关
+	const sv = {
+		// 按下触发
+		touchstartVoice: (e) => {
+			voicePageY.value = (e.changedTouches[0].pageY).toFixed(2);
+			recorderManager.start({
+				duration: 60000, // 录音的时长，单位 ms，最大值 600000（10 分钟）
+				sampleRate: 44100, // 采样率
+				numberOfChannels: 1, // 录音通道数
+				encodeBitRate: 192000, // 编码码率
+				format: "mp3"
+			});
+			voiceLength.value = 0;
+			voiceFlg.value = true
+			console.log('recorder start success');
+			//录音开始,
+			voiceTimer.value = setInterval(() => {
+				voiceLength.value += 0.1;
+			}, 100);
+
+			console.log('touchstartVoice', voicePageY.value);
+		},
+		// 滑动触发
+		touchmoveVoice: (e) => {
+			// 没有展示UI不触发
+			if (!voiceFlg.value) {
+				return;
+			}
+			let numTemp = voicePageY.value - ((e.changedTouches[0].pageY).toFixed(2));
+			if (numTemp >= 60) {
+				console.log('取消发送');
+				voiceStop.value = true
+				voiceTis.value = '松开手指 取消发送'
+			} else {
+				console.log('继续发送');
+				voiceStop.value = false
+				voiceTis.value = '手指上滑 取消发送'
+			}
+		},
+		// 松开触发
+		touchendVoice: () => {
+			// 没有展示UI不触发
+			if (!voiceFlg.value) {
+				return;
+			}
+			clearInterval(voiceTimer.value);
+			voiceText.value = '按住 说话'
+			voiceTis.value = "手指上滑 取消发送"
+			console.log('touchendVoice');
+			sv.stop();
+		},
+		// 打断触发
+		touchcancelVoice: () => {
+			clearInterval(voiceTimer.value);
+			// 关闭UI
+			voiceText.value = '按住 说话'
+			voiceTis.value = "手指上滑 取消发送"
+			// 不发送语音
+			voiceStop.value = true
+			console.log('touchcancelVoice');
+			sv.stop();
+		},
+		stop: () => {
+			voiceTimer.value = null;
+			voiceFlg.value = false
+			recorderManager.stop(); // 录音结束
+			console.log('录音结束');
+		}
+	};
+	// #ifdef APP-PLUS
+	// 监听录音停止事件
+	recorderManager.onStop((res) => {
+		// 被打断等情况不发送
+		if (voiceStop.value) {
+			return
+		}
+		// 正常情况
+		if (voiceStop.value) {
+			uni.showToast({
+				icon: "none",
+				title: "取消发送",
+				duration: 2000
+			})
+			return
+		}
+		if (voiceLength.value < 1) {
+			uni.showToast({
+				icon: "none",
+				title: "语音时长过短",
+				duration: 2000
+			})
+			return
+		}
+		if (voiceLength.value > 60) {
+			uni.showToast({
+				icon: "none",
+				title: "语音时长过长",
+				duration: 2000
+			})
+			return
+		}
+		console.log('file', res)
+
+		try {
+			let message = uni.$chat.createAudioMessage({
+				to: props.msg.id,
+				conversationType: props.msg.type,
+				payload: {
+					file: res
+				},
+				// 音频上传进度回调
+				onProgress: function(event) {
+					console.log('file uploading:', event)
+				}
+			})
+			emit('send', message)
+		} catch (e) {
+			console.log('message catch', e)
+		}
+		// 
+
+	})
+	// #endif
+</script>
+<style scoped lang="scss">
+	.voice_box {
+		padding: 20rpx 0;
+		margin: 0 20rpx;
+		border-radius: 50rpx;
+		background: #fff;
+		flex: 1;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+	}
+
+	.hidden {
+		display: none !important;
+	}
+
+	.record {
+		width: 40vw;
+		height: 40vw;
+		position: fixed;
+		top: 55%;
+		left: 30%;
+		background-color: rgba(0, 0, 0, .6);
+		border-radius: 20rpx;
+
+		.ing {
+			width: 100%;
+			height: 30vw;
+			display: flex;
+			justify-content: center;
+			align-items: center;
+
+			// 模拟录音音效动画
+			@keyframes volatility {
+				0% {
+					background-position: 0% 130%;
+				}
+
+				20% {
+					background-position: 0% 150%;
+				}
+
+				30% {
+					background-position: 0% 155%;
+				}
+
+				40% {
+					background-position: 0% 150%;
+				}
+
+				50% {
+					background-position: 0% 145%;
+				}
+
+				70% {
+					background-position: 0% 150%;
+				}
+
+				80% {
+					background-position: 0% 155%;
+				}
+
+				90% {
+					background-position: 0% 140%;
+				}
+
+				100% {
+					background-position: 0% 135%;
+				}
+			}
+
+			background-image: linear-gradient(to bottom, #f09b37, #fff 50%);
+			background-size: 100% 200%;
+			animation: volatility 1.5s ease-in-out -1.5s infinite alternate;
+			-webkit-background-clip: text;
+			-webkit-text-fill-color: transparent;
+			font-size: 150rpx;
+			color: #f09b37;
+
+		}
+
+		.cancel {
+			width: 100%;
+			height: 30vw;
+			display: flex;
+			justify-content: center;
+			align-items: center;
+
+			color: #fff;
+			font-size: 150rpx;
+
+		}
+
+		.tis {
+			width: 100%;
+			height: 10vw;
+			display: flex;
+			justify-content: center;
+			font-size: 28rpx;
+			color: #fff;
+
+			&.change {
+				color: #f09b37;
+			}
+		}
+	}
+</style>
\ No newline at end of file
diff --git a/service/pages/index/index.vue b/service/pages/index/index.vue
index 0fcdf8f4..22c28fa7 100644
--- a/service/pages/index/index.vue
+++ b/service/pages/index/index.vue
@@ -73,7 +73,7 @@ function getList() {
 		if (rs.code == 200) {
 			chatList.push(...rs.data.map(item => {
 				item.callbackData = JSON.parse(item.callbackJson)
-				
+
 				if (item.callbackData.callback_json.length) {
 					let msgType = item.callbackData.callback_json[0].MsgType;
 					if (msgType == TencentCloudChat.TYPES.MSG_TEXT) {
@@ -143,20 +143,15 @@ function handleLogout() {
  * @param {Object} item
  */
 function handleChat(item) {
-	let param = {};
-	// 单聊
-	if (item.groupId == null) {
-		param.type = 'C2C'
-		param.name = `${item.callbackJson.from_name}`
-		param.msgId = `${item.callbackJson.from_id}`
-	} else {
-		// 群聊
-		param.type = 'GROUP'
-		param.name = `${item.groupChatDTO.name}`
-		param.msgId = `${item.groupId}`
-		param.num = `${item.groupChatDTO.memberCount}`
-	}
-	// 
+	console.log(111111111, item);
+
+	let param = {
+		type: 'C2C',
+		name: `${item.callbackData.from_name}`,
+		msgId: `${item.callbackData.from_id}`
+	};
+	console.log(22222222, param);
+
 	util.toChat(param)
 }
 /**
diff --git a/service/static/audio.png b/service/static/audio.png
new file mode 100644
index 0000000000000000000000000000000000000000..72c3d7beb55977429318a73d31f0d86c0cd6d156
GIT binary patch
literal 3730
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

literal 0
HcmV?d00001