2022/3/9

MingGaoApp/App.vue

@@ -6,6 +6,7 @@
 			// 文本消息
 			socketTask: null,
 			urlData: "ws://114.115.147.140:12345/api/api_gateway?method=control_center.real_time.im_message",
+			// urlData: "ws://192.168.1.17:12345/api/api_gateway?method=control_center.real_time.im_message",
 			is_open_socket: false, // 确保websocket是打开状态
 			list: [],
 			userId: null, // 用户ID
@@ -42,24 +43,6 @@
 					// console.log('没有登录成功')
 				}
 			})
-			uni.getStorage({
-				key: 'session_key',
-				success: (res) => {
-					console.log(res)
-					if (res.data != "") {
-						this.getlistinfo()
-					} else {
-						uni.navigateTo({
-							url: "../login/login"
-						})
-					}
-				},
-				fail: () => {
-					uni.navigateTo({
-						url: "../login/login"
-					})
-				}
-			})
 		},
 		onShow: function() {
 			// App展示在前台
@@ -71,52 +54,6 @@
 			this.close()
 		},
 		methods: {
-			async getlistinfo() {
-				const res = await this.$myRequest({
-					url: '/api/api_gateway?method=sysmenage.usermanager.user_info',
-				})
-				if (this.globalData.app.length != 0) {
-					if (this.globalData.app[0].children[0].purview_name == "我的任务") {
-						uni.switchTab({
-							url: "../index/index"
-						})
-					} else if (this.app[0].children[0].purview_name == "监督") {
-						uni.switchTab({
-							url: "../supervise/index"
-						})
-						uni.setTabBarItem({
-							index: 0,
-							visible: false
-						});
-					} else {
-						uni.switchTab({
-							url: "../response/index"
-						})
-						uni.setTabBarItem({
-							index: 0,
-							visible: false
-						});
-						uni.setTabBarItem({
-							index: 1,
-							visible: false
-						});
-					}
-				} else {
-					uni.setTabBarItem({
-						index: 0,
-						visible: false
-					});
-					uni.setTabBarItem({
-						index: 1,
-						visible: false
-					});
-					uni.switchTab({
-						url: "../response/index"
-					})
-				}
-				// console.log(this.app)
-			},
-			
 			// 实时通信 - 初始化
 			msgInit() {
 				var that = this

MingGaoApp/pages/response/details.vue

@@ -1,33 +1,36 @@
 <template>
 	<view class="details_box" :style="'height:' +  phoneHeight + 'px'">
+
 		<!-- 对话列表 -->
-		<view class="details_ul" id="msgBox">
-			<view class="details_list" v-for="item in msg_list">
-				<!-- me -->
-				<view class="list_msgBox1" v-if="item.is_right == true">
-					<view class="list_msgText">
-						{{ item.msg_info }}
-					</view>
-					<view class="list_triangle"></view>
-					<view class="list_img">
-						<image src="../../static/image/7.png" mode=""></image>
+		<scroll-view id="scrollview" class="chat-window" scroll-y="true" :scroll-with-animation="true"
+			:scroll-top="scrollTop" @scrolltolower="lower">
+			<view class="details_ul" id="msgBox">
+				<view class="details_list" v-for="item in msg_list">
+					<!-- me -->
+					<view class="list_msgBox1" v-if="item.is_right == true">
+						<view class="list_msgText">
+							{{ item.msg_info }}
+						</view>
+						<view class="list_triangle"></view>
+						<view class="list_img">
+							<image src="../../static/image/7.png" mode=""></image>
+						</view>
 					</view>
-				</view>
 
-				<!-- you -->
-				<view class="list_msgBox2" v-if="item.is_right == false">
-					<view class="list_img">
-						<image src="../../static/image/6.png" mode=""></image>
-					</view>
-					<view class="list_triangle"></view>
-					<view class="list_msgText">
-						{{ item.msg_info }}
+					<!-- you -->
+					<view class="list_msgBox2" v-if="item.is_right == false">
+						<view class="list_img">
+							<image src="../../static/image/6.png" mode=""></image>
+						</view>
+						<view class="list_triangle"></view>
+						<view class="list_msgText">
+							{{ item.msg_info }}
+						</view>
 					</view>
 				</view>
-			</view>
-
-		</view>
 
+			</view>
+		</scroll-view>
 		<!-- input输入框 -->
 		<u--input type="text" class="details_input" maxlength="200" confirm-type="send" @confirm="search()"
 			placeholder="请输入内容" border="surround" v-model="value" @change="sendChange"></u--input>
@@ -38,7 +41,7 @@
 </template>
 
 <script>
-	import store from '@/store/index.js';//需要引入store
+	import store from '@/store/index.js'; //需要引入store
 	let App = getApp();
 	var API = App.globalData.socketTask;
 	export default {
@@ -52,17 +55,33 @@
 
 				// 警告提示
 				show: false,
+
+				// 聊天页面时时滚动样式
+				// style: {
+				// 	pageHeight: 0,
+				// 	contentViewHeight: 0,
+				// 	footViewHeight: 90,
+				// 	mitemHeight: 0
+				// },
+				scrollTop: 0,
 			}
 		},
 		watch: {
 			msg_list(val) {
 				// 实现打开聊天框后滚动条定位到最下方
-				this.$nextTick(() => {
-					var div = document.getElementById("msgBox");
-					div.scrollTop = div.scrollHeight;
-				});
+				// this.$nextTick(() => {
+				// 	// var div = document.getElementById("msgBox");
+				// 	// div.scrollTop = div.scrollHeight;
+				// 	// console.log(div.scrollHeight)
+
+				// 	// const query = uni.createSelectorQuery().in(this);
+				// 	// query.select('.details_ul').boundingClientRect(data => {
+				// 	// 	console.log(data)
+				// 	// }).exec();
+				// });
+
 			},
-			
+
 			listData(news, old) {
 				// console.log(news, old)
 				for (var i = 0; i < news.length; i++) {
@@ -71,13 +90,13 @@
 						this.msg_list = news[i].msg_list.reverse();
 					}
 				}
-				
+
 			}
-			
+
 		},
-		computed:{
-			listData () {
-				return store.state.list 
+		computed: {
+			listData() {
+				return store.state.list
 			},
 		},
 		onLoad(options) {
@@ -142,8 +161,16 @@
 					},
 				});
 			},
+
+
+
+			lower(e) {
+				console.log(e)
+			},
 		},
 
+
+
 		onReady() {
 			// 修改头部标题栏
 			uni.setNavigationBarTitle({
@@ -234,12 +261,13 @@
 		.details_input {
 			border: 0;
 			border-top: 1px solid #eaeaea;
-			position: absolute;
+			position: fixed;
 			bottom: 0;
 			left: 0;
 			width: 96%;
 			height: 90rpx;
 			border-radius: 0;
+			background: #fff;
 		}
 	}
 </style>

MingGaoApp/pages/response/index.vue

@@ -65,20 +65,20 @@
 	import store from '@/store/index.js'; //需要引入store
 	let App = getApp();
 	var API = App.globalData.socketTask;
-	import permision from "@/zego-express-video-uniapp/permission.js";
-	// import ZegoExpressEngine from '@/zego-express-video-uniapp/lib/ZegoExpressEngine';
-	import {
-		ZegoScenario,
-		ZegoRoomState,
-		ZegoUpdateType,
-		// ZegoViewMode
-	} from '@/zego-express-video-uniapp/lib/ZegoExpressDefines'
-	import {
-		AppID,
-		AppSign
-	} from '@/zego-express-video-uniapp/KeyCenter.js'
-	import ZegoLocalView from '@/zego-express-video-uniapp/zego-view/ZegoLocalView';
-	import ZegoRemoteView from '@/zego-express-video-uniapp/zego-view/ZegoRemoteView';
+	// import permision from "@/zego-express-video-uniapp/permission.js";
+	// // import ZegoExpressEngine from '@/zego-express-video-uniapp/lib/ZegoExpressEngine';
+	// import {
+	// 	ZegoScenario,
+	// 	ZegoRoomState,
+	// 	ZegoUpdateType,
+	// 	// ZegoViewMode
+	// } from '@/zego-express-video-uniapp/lib/ZegoExpressDefines'
+	// import {
+	// 	AppID,
+	// 	AppSign
+	// } from '@/zego-express-video-uniapp/KeyCenter.js'
+	// import ZegoLocalView from '@/zego-express-video-uniapp/zego-view/ZegoLocalView';
+	// import ZegoRemoteView from '@/zego-express-video-uniapp/zego-view/ZegoRemoteView';
 	export default {
 		components: {
 			// ZegoLocalView: ZegoLocalView,
@@ -196,21 +196,21 @@
 			// },
 
 			// 推流 - 展示视图
-			onPublish() {
-				// 设置视频配置
-				ZegoExpressEngine.instance().setVideoConfig(this.videoObj.room_id);
-
-				if (this.isPublishingStream) {
-					this.engine.stopPreview();
-					this.engine.stopPublishingStream();
-					this.publishBtnName = "Start Publishing";
-				} else {
-					this.engine.startPreview();
-					this.engine.startPublishingStream(this.videoObj.room_id);
-					this.publishBtnName = "Stop Publishing";
-				}
-				this.isPublishingStream = !this.isPublishingStream;
-			},
+			// onPublish() {
+			// 	// 设置视频配置
+			// 	ZegoExpressEngine.instance().setVideoConfig(this.videoObj.room_id);
+
+			// 	if (this.isPublishingStream) {
+			// 		this.engine.stopPreview();
+			// 		this.engine.stopPublishingStream();
+			// 		this.publishBtnName = "Start Publishing";
+			// 	} else {
+			// 		this.engine.startPreview();
+			// 		this.engine.startPublishingStream(this.videoObj.room_id);
+			// 		this.publishBtnName = "Stop Publishing";
+			// 	}
+			// 	this.isPublishingStream = !this.isPublishingStream;
+			// },
 		},
 
 		async onLoad() {
@@ -230,7 +230,24 @@
 
 		// 下拉刷新
 		onPullDownRefresh() {
-			console.log('刷新了')
+			// console.log('刷新了')
+			var that = this
+			if (App.globalData.is_open_socket) {
+				// websocket的服务器的原理是:发送一次消息,同时返回一组数据【否则服务器会进去死循环崩溃】
+				var obj = {
+					'action': 'list', // 动作标识，必填
+					'send_user_id': '', // 接收人用户id， 非必填
+					'data': {}
+				}
+				API.send({
+					data: JSON.stringify(obj),
+					async success(res) {
+						console.log("消息发送成功");
+					},
+				});
+			} else {
+				console.log('没有进入')
+			}
 			setTimeout(() => {
 				uni.stopPullDownRefresh()
 			}, 1000)

MingGaoApp/pages/response/video.nvue

@@ -22,11 +22,18 @@
 					</view>
 					<text class="video_view_txt">翻转镜头</text>
 				</view>
-				<view class="video_imgList2">
-					<view class="video_view">
-						<image class="video_view_img" src="../../static/image/8.png" mode=""></image>
+				<view class="video_imgList2" v-if="CameraShow">
+					<view class="video_view" @click="closeCamera">
+						<image class="video_view_img" src="../../static/image/11.png" mode=""></image>
 					</view>
-					<text class="video_view_txt">切换语音通话</text>
+					<text class="video_view_txt" style="margin: 0 0 0 30rpx;">静音</text>
+				</view>
+				
+				<view class="video_imgList2" v-else>
+					<view class="video_view" @click="openCamera">
+						<image class="video_view_img" src="../../static/image/12.png" mode=""></image>
+					</view>
+					<text class="video_view_txt" style="margin: 0 0 0 30rpx;">开启</text>
 				</view>
 			</view>
 
@@ -72,6 +79,8 @@
 				
 				allStreamList: [],
 				allUserViewObjectList: [],
+				
+				CameraShow: true, // 镜头开启关闭
 			}
 		},
 		components: {
@@ -120,6 +129,33 @@
 				this.shotShow = !this.shotShow
 				this.engine.useFrontCamera(this.shotShow)
 			},
+			
+			// 即构 - 关闭镜头 - 停止拉流 、推流
+			closeCamera() {
+				console.log('关闭摄像头')
+				this.allStreamList.forEach((item) => {
+					// this.notTensile(item.streamID); // 停止拉流
+					item.muteAudio = !item.muteAudio;
+					this.engine.mutePlayStreamAudio(item.streamID, item.muteAudio);
+				})
+				// // 停止推流
+				// this.engine.stopPreview();
+				// this.engine.stopPublishingStream();
+				this.CameraShow = false
+			},
+			// 即构 - 开启镜头 - 开启拉流、推流
+			openCamera() {
+				console.log('开启摄像头')
+				this.allStreamList.forEach((item) => {
+					// this.engine.startPlayingStream(item.streamID); // 开始拉流
+					item.muteAudio = !item.muteAudio;
+					this.engine.mutePlayStreamAudio(item.streamID, item.muteAudio);
+				})
+				// // 开始推流
+				// this.engine.startPreview();
+				// this.engine.startPublishingStream(this.videoObj.room_id);
+				this.CameraShow = true
+			},
 
 			// 切换视频显示
 			changeShow() {
@@ -264,9 +300,9 @@
 
 			// 停止拉流
 			notTensile(roomId) {
-				console.log(roomId)
+				// console.log(roomId)
 				this.serveViewModeIndex = roomId
-				console.log(this.serveViewModeIndex)
+				// console.log(this.serveViewModeIndex)
 				this.engine.stopPlayingStream(roomId)
 			},