fix:signalR连接方式修改为分组；

src/layout/navBars/breadcrumb/telControl.vue

@@ -858,8 +858,12 @@ const callQueueFv = (data:any)=>{
 }
 // 监听消息
 const signalRStart=()=>{
-  // 开启 signalr 链接
-  signalR.start();
+  // 加入分组
+  signalR.joinGroup('CallCenter');
+  signalR.SR.on('Send', (data: any) => {
+    // 加入分组成功
+    console.log(data, '加入分组成功');
+  });
   signalR.SR.on('Ring', (data: any) => {
     // 接收来电消息
     console.log(data, '来电消息');
@@ -1106,12 +1110,16 @@ const offDutyFn = () => {
 						message: '签出成功',
 						type: 'success',
 					});
-					signalR.SR.off('Ring');
-					signalR.SR.off('Answered');
-					signalR.SR.off('Bye');
-					signalR.SR.off('RestApplyPass');
-					// 断开链接
-					signalR.stop();
+					// 离开分组
+					signalR.leaveGroup('CallCenter');
+          signalR.SR.off('Send'); // 取消监听事件
+          signalR.SR.off('Ring');
+          signalR.SR.off('Alert');
+          signalR.SR.off('Bye');
+          signalR.SR.off('Answered');
+          signalR.SR.off('RestApplyPass');
+          signalR.SR.off('Idle');
+          signalR.SR.off('CallQueue');
 					// 重置所有状态
 					useTelStatusStore.resetState();
 					state.loading = false;

src/utils/appConfig.ts

@@ -1,8 +1,8 @@
 
 let apiUrl = 'http://hotline.fw.com', // 默认请求地址
     identityUrl = 'http://identity.fengwo.com',// 身份认证地址
-    socketUrl = 'http://192.168.100.223:50110/hubs/callcenter',// socket地址
-    uploadUrl = 'http://192.168.100.223:50110/hubs/callcenter'// 上传地址
+    socketUrl = 'http://192.168.100.223:50110/hubs/hotline',// socket地址
+    uploadUrl = 'http://192.168.100.223:50110/hubs/hotline'// 上传地址
 switch (import.meta.env.VITE_MODE_NAME) {
     case 'development': // 开发环境
 

src/utils/signalR.ts

@@ -1,104 +1,109 @@
 // 官方文档：https://docs.microsoft.com/zh-cn/aspnet/core/signalr/javascript-client?view=aspnetcore-6.0&viewFallbackFrom=aspnetcore-2.2&tabs=visual-studio
-import * as signalR from '@microsoft/signalr'
-import { ElNotification } from 'element-plus'
+import * as signalR from '@microsoft/signalr';
+import { ElNotification } from 'element-plus';
 import { Session } from '/@/utils/storage';
-import { socketUrl } from "/@/utils/appConfig";
-import { storeToRefs } from 'pinia';
-import { useTelStatus } from '/@/stores/telStatus';
-
-const useTelStatusStore = useTelStatus();
-const { telStatusInfo } = storeToRefs(useTelStatusStore);
+import { socketUrl } from '/@/utils/appConfig';
 export default {
-  // signalR对象
-  SR: null as any,
-  // 失败连接重试次数
-  failNum: 4,
-  baseUrl: socketUrl,
-  init() {
-    const token = Session.get("token");
-    const connection = new signalR.HubConnectionBuilder()
-      .withUrl(this.baseUrl, { accessTokenFactory: () => token, skipNegotiation: true, transport: 1 })
-      .withAutomaticReconnect() //自动重新连接
-      .configureLogging(signalR.LogLevel.Warning)
-      .build();
-
-    this.SR = connection;
-    // 断线重连
-    connection.onclose(async () => {
-      console.log('当前链接状态:', connection.state)
-      console.assert(connection.state === signalR.HubConnectionState.Disconnected);
-      // 建议用户重新刷新浏览器
-      await this.start()
-    })
-
-    connection.onreconnected(() => {
-      console.log('断线重连成功')
-      ElNotification({
-        type: 'success',
-        title: '提示',
-        message: `断线重连成功`
-      })
-    })
-    this.receiveMsg(connection)
-    // 启动
-    // this.start();
-  },
-  /**
-   * 调用 this.signalR.start().then(async () => { await this.SR.invoke("method")})
-   * @returns 
-   */
-  async start(): Promise<boolean> {
-    const that = this
-    try {
-      //使用async和await 或 promise的then 和catch 处理来自服务端的异常
-      await this.SR.start()
-      //console.assert(this.SR.state === signalR.HubConnectionState.Connected);
-      console.log('当前链接状态:', this.SR.state)
-      return true
-    } catch (error: any) {
-      that.failNum--;
-      if (that.failNum > 0 && this.SR.state === 'Disconnected' && telStatusInfo.value.isDutyOn) { //如果是签入状态并且断开了链接就启动自动重连
-        ElNotification({
-          type: 'warning',
-          title: '提示',
-          message: `断开连接了,正在重连, 剩余自动重连次数${that.failNum} 次，如未重连成功，请刷新浏览器重试`
-        })
-        setTimeout(async () => {
-          await this.SR.start()
-        }, 5000)
-      }
-      return false
-    }
-  },
-  // 接收消息处理
-  receiveMsg(connection: any) {
-    // 接收后台手动推送消息
-    connection.on("receiveNotice", (title: string, data: any) => {
-      ElNotification({
-        type: 'info',
-        title: title,
-        message: data,
-        dangerouslyUseHTMLString: true,
-        duration: 0
-      })
-      console.log(title, data)
-    })
-  },
-  /**
-   * 关闭链接
-   * @returns 
-   */
-  async stop(): Promise<boolean> {
-    try {
-      //使用async和await 或 promise的then 和catch 处理来自服务端的异常
-      await this.SR.stop()
-      console.log(this.SR.state, '断开链接');
-      return true
-    } catch (error) {
-      console.log('signalR', error);
-      return false
-    }
-  },
-}
-
+	// signalR对象
+	SR: null as any,
+	// 失败连接重试次数
+	failNum: 4,
+	baseUrl: socketUrl,
+	groupName:'',
+	init() {
+		const token = Session.get('token');
+		const connection = new signalR.HubConnectionBuilder()
+			.withUrl(this.baseUrl, { accessTokenFactory: () => token, skipNegotiation: true, transport: 1 })
+			.withAutomaticReconnect() //自动重新连接
+			.configureLogging(signalR.LogLevel.Warning)
+			.build();
 
+		this.SR = connection;
+		// 断线重连
+		connection.onclose(async () => {
+			console.log('当前链接状态:', connection.state);
+			// 建议用户重新刷新浏览器
+			await this.start();
+		});
+		connection.onreconnected(() => {
+			console.log('断线重连成功');
+			ElNotification({
+				type: 'success',
+				title: '提示',
+				message: `断线重连成功`,
+			});
+		});
+	},
+	/**
+	 * 调用 this.signalR.start().then(async () => { await this.SR.invoke("method")})
+	 * state  Connected 已连接  Connecting 正在连接  Disconnected 断开连接 Reconnecting 正在重新连接
+	 * @returns
+	 */
+	async start() {
+		try {
+			//使用async和await 或 promise的then 和catch 处理来自服务端的异常
+			await this.SR.start();
+			console.log('当前链接状态:', this.SR.state);
+			return Promise.resolve();
+		} catch (error: any) {
+			this.failNum--;
+			if (this.failNum > 0 && this.SR.state === 'Disconnected') {
+				//断开链接重新链接
+				ElNotification({
+					type: 'warning',
+					title: '提示',
+					message: `断开连接了,正在重连, 剩余自动重连次数${this.failNum} 次，如未重连成功，请刷新浏览器重试`,
+				});
+				setTimeout(async () => {
+					await this.SR.start();
+				}, 5000);
+			}
+			return Promise.reject(error);
+		}
+	},
+	/**
+	 * 加入分组
+	 * @param groupName string 分组名称
+	 * @params CallCenter 呼叫中心
+	 * @params BigScreenDataShow 大屏数据展示
+	 * @returns
+	 */
+	async joinGroup(groupName: string) {
+		if (this.SR.state === 'Connected') {
+			// 判断是否已经建立链接 如果没有 先链接
+			await this.SR.invoke('JoinGroupAsync', {GroupName:groupName});
+		} else {
+			await this.start().then(async () => {
+				await this.SR.invoke('JoinGroupAsync', {GroupName:groupName});
+			}).catch((err) => {
+				console.log(err);
+			})
+		}
+	},
+	/**
+	 * 离开分组
+	 * @param groupName string
+	 * @params CallCenter 呼叫中心
+	 * @params BigScreenDataShow 大屏数据展示
+	 * @returns
+	 */
+	async leaveGroup(groupName: string) {
+		if (this.SR.state === 'Connected') {
+			// 判断是否已经建立链接 如果没有 先链接
+			await this.SR.invoke('LeaveGroupAsync', {GroupName:groupName});
+		}
+	},
+	/**
+	 * 关闭链接
+	 * @returns
+	 */
+	async stop() {
+		try {
+			//使用async和await 或 promise的then 和catch 处理来自服务端的异常
+			await this.SR.stop();
+			console.log(this.SR.state, '断开链接');
+		} catch (error) {
+			console.log('signalR', error);
+		}
+	},
+};

src/views/visualizing/demo1.vue

@@ -151,7 +151,7 @@ import { formatDate } from '/@/utils/formatTime';
 import { NextLoading } from '/@/utils/loading';
 import { acceptWorkOrderData, complaintHotWordsData, echartsMapData, echartsMapImages, echartsMapList } from './mock/demo1';
 import Watermark from '/@/utils/watermark';
-
+import signalR from '/@/utils/signalR';
 // 定义变量内容
 const visualizingDemo1 = ref(); // 地图
 const state = reactive({
@@ -164,7 +164,6 @@ const state = reactive({
 	},
 	myCharts: [] as EmptyArrayType,
 });
-
 // 初始化时间
 const initTime = () => {
 	state.time.txt = formatDate(new Date(), 'YYYY-mm-dd HH:MM:SS WWW QQQQ ZZZ');
@@ -1387,10 +1386,19 @@ onMounted(async () => {
 	await initComplaintHotWords(); // 投诉热词
 	await initEchartsResize(); //
 	Watermark.del(); // 清除水印
+  //  signalR 初始化signalr
+  signalR.init();
+  // 加入分组
+  signalR.joinGroup('BigScreenDataShow');
+  signalR.SR.on('Send', (data: any) => {
+    // 加入分组成功
+    console.log(data, '加入分组成功');
+  });
 });
 // 页面卸载时
 onUnmounted(() => {
 	window.clearInterval(state.time.fun);
+  signalR.SR.off('Send');
 });
 </script>