Commit d22555eb7f67df48abeac76d967bb1ace3f73b45

Authored by ww
1 parent 8823c0f2

fix: 修复多个组件绑定同一设备属性时只会更新一个组件

1 1 import { RequestContentTypeEnum } from "@/enums/external/httpEnum";
2 2 import { CreateComponentType } from "@/packages/index.d";
3   -import { useSocketStore} from "@/store/external/modules/socketStore";
4   -import { SocketReceiveMessageType,SocketSendMessageType } from "@/store/external/modules/socketStore.d";
  3 +import { useSocketStore } from "@/store/external/modules/socketStore";
  4 +import { SocketReceiveMessageType, SocketSendMessageType } from "@/store/external/modules/socketStore.d";
5 5 import { useChartEditStore } from "@/store/modules/chartEditStore/chartEditStore";
6 6 import { getJwtToken, getShareJwtToken } from "@/utils/external/auth";
7 7 import { useWebSocket, WebSocketResult } from "@vueuse/core";
8   -import {onMounted, ref, unref} from "vue";
  8 +import { onMounted, ref, unref } from "vue";
9 9 import { ExtraRequestConfigType } from "@/store/external/modules/extraComponentInfo.d";
10 10 import { isShareMode } from "@/views/share/hook";
11 11
... ... @@ -16,14 +16,14 @@ interface SocketConnectionPoolType {
16 16 url: string
17 17 }
18 18
19   -interface SaveHistoryWsMessage{
  19 +interface SaveHistoryWsMessage {
20 20 id: string
21 21 message: SocketSendMessageType
22 22 }
23 23
24 24 const socketConnectionPool: SocketConnectionPoolType[] = []
25 25
26   -const saveHistoryWsMessage=ref([] as SaveHistoryWsMessage[])
  26 +const saveHistoryWsMessage = ref([] as SaveHistoryWsMessage[])
27 27
28 28 const parse = (value: string) => {
29 29 try {
... ... @@ -48,7 +48,7 @@ const getSocketInstance = (request: ExtraRequestConfigType) => {
48 48 if (~index) {
49 49 return socketConnectionPool[index].ws
50 50 }
51   - const token = isShareMode() ? getShareJwtToken() : getJwtToken()
  51 + const token = isShareMode() ? getShareJwtToken() : getJwtToken()
52 52 const socketUrl = `${getOriginUrl(requestOriginUrl || '')}${requestUrl}?token=${token}`
53 53
54 54 const instance = useWebSocket(socketUrl, {
... ... @@ -112,18 +112,18 @@ export const useChartDataSocket = () => {
112 112 * @param targetComponent
113 113 */
114 114 //删除组件 发送断开消息
115   - const disconnectWs=(targetComponent:CreateComponentType)=>{
116   - try{
117   - saveHistoryWsMessage.value.forEach((item)=>{
118   - if(item.id===targetComponent.id){
  115 + const disconnectWs = (targetComponent: CreateComponentType) => {
  116 + try {
  117 + saveHistoryWsMessage.value.forEach((item) => {
  118 + if (item.id === targetComponent.id) {
119 119 const { request } = unref(targetComponent)
120   - if((request.requestContentType as RequestContentTypeEnum) !== RequestContentTypeEnum.WEB_SOCKET)return
  120 + if ((request.requestContentType as RequestContentTypeEnum) !== RequestContentTypeEnum.WEB_SOCKET) return
121 121 const { send } = getSocketInstance(request)
122   - item.message.tsSubCmds[0].unsubscribe=true
  122 + item.message.tsSubCmds[0].unsubscribe = true
123 123 send(JSON.stringify(item.message))
124   - }
125   - })
126   - }catch (e) {
  124 + }
  125 + })
  126 + } catch (e) {
127 127 console.log(`
128 128 错误位置:src/hooks/external/useChartDataSocket.ts
129 129 错误原因:${e}
... ...
1 1 import { defineStore } from "pinia";
2   -import { KeyBoundComponentList, SocketComponentRecord, SocketReceiveMessageType, SocketSendMessageItemType, SocketSendMessageType, SocketStoreType, UnsubscribePoolType } from '@/store/external/modules/socketStore.d'
  2 +import { KeyBoundComponentList, SocketComponentRecord, SocketConnectionPoolType, SocketReceiveMessageType, SocketSendMessageItemType, SocketSendMessageType, SocketStoreType, UnsubscribePoolType } from '@/store/external/modules/socketStore.d'
3 3 import { CreateComponentType } from "@/packages/index.d";
4 4 import { RequestContentTypeEnum } from "@/enums/external/httpEnum";
5 5 import { useChartEditStore } from "@/store/modules/chartEditStore/chartEditStore";
... ... @@ -59,13 +59,14 @@ export const useSocketStore = defineStore({
59 59 updateConnectionPool(entityId: string, keys: string[], componentId: string) {
60 60 const isExist = Reflect.has(this.connectionPool, entityId)
61 61 if (isExist) {
62   - const temp = Reflect.get(this.connectionPool, entityId)
  62 + const temp = Reflect.get(this.connectionPool, entityId) as { [key: string]: KeyBoundComponentList[] }
63 63 keys.forEach(key => {
64 64 const isExistKey = Reflect.has(temp, key)
65 65 if (!isExistKey) {
66 66 const keyBindEntityIdList = Reflect.get(temp, key) || []
67 67 Reflect.set(temp, key, [...keyBindEntityIdList, { componentId }] as KeyBoundComponentList[])
68   -
  68 + } else {
  69 + temp[key].push({ componentId })
69 70 }
70 71 })
71 72 } else {
... ... @@ -260,53 +261,53 @@ export const useSocketStore = defineStore({
260 261 * 修改后的代码
261 262 * 修改ws绑定单个文本组件,然后有多个,并且进行分组,显示的信息为原始信息,而非过滤函数返回的信息
262 263 */
263   - chartEditStore.getComponentList.forEach(targetItem => {
264   - if (targetItem.isGroup) {
265   - /**
266   - * 如果是分组,并且request里是ws,则分组组件这个整体是接受ws绑定的,之前分组是不能绑定ws的
267   - */
268   - if(targetItem.request.requestUrl?.includes('ws')){
269   - const _value = this.getComponentValueByKeys(targetItem, value)
270   - const { filter } = targetItem
271   - const { value: filterValue, reason, flag } = useFilterFn(filter, _value)
272   - targetItem.option.dataset = flag ? filterValue : reason
273   - try{
274   - const dumpSaveHistoryInput = JSON.parse((!targetItem.saveHistoryInput ? null: targetItem.saveHistoryInput) as string) ||JSON.parse(window.localStorage.getItem('CACHE_HISTORY_INPUT_VALUE') as string)
275   - if(!dumpSaveHistoryInput) return
276   - if(!Array.isArray(dumpSaveHistoryInput)) return
277   - targetItem.groupList?.forEach((item:CreateComponentType)=>{
278   - dumpSaveHistoryInput?.forEach((inputItem:{id:string,inputValue:string})=>{
279   - if(item.id === inputItem.id){
280   - item.option.dataset= Function('res', `return ${inputItem?.inputValue}`)(targetItem.option?.dataset)
  264 + chartEditStore.getComponentList.forEach(targetItem => {
  265 + if (targetItem.isGroup) {
  266 + /**
  267 + * 如果是分组,并且request里是ws,则分组组件这个整体是接受ws绑定的,之前分组是不能绑定ws的
  268 + */
  269 + if (targetItem.request.requestUrl?.includes('ws')) {
  270 + const _value = this.getComponentValueByKeys(targetItem, value)
  271 + const { filter } = targetItem
  272 + const { value: filterValue, reason, flag } = useFilterFn(filter, _value)
  273 + targetItem.option.dataset = flag ? filterValue : reason
  274 + try {
  275 + const dumpSaveHistoryInput = JSON.parse((!targetItem.saveHistoryInput ? null : targetItem.saveHistoryInput) as string) || JSON.parse(window.localStorage.getItem('CACHE_HISTORY_INPUT_VALUE') as string)
  276 + if (!dumpSaveHistoryInput) return
  277 + if (!Array.isArray(dumpSaveHistoryInput)) return
  278 + targetItem.groupList?.forEach((item: CreateComponentType) => {
  279 + dumpSaveHistoryInput?.forEach((inputItem: { id: string, inputValue: string }) => {
  280 + if (item.id === inputItem.id) {
  281 + item.option.dataset = Function('res', `return ${inputItem?.inputValue}`)(targetItem.option?.dataset)
  282 + }
  283 + })
  284 + })
  285 + } catch (e) {
  286 + console.log(e)
281 287 }
282   - })
283   - })
284   - }catch(e){
285   - console.log(e)
286   - }
287   - }
288   - /**
289   - * 这也是分组,但这个是分组这个整体不绑定ws,而是下面的子组件都绑定了ws
290   - */
291   - targetItem.groupList?.forEach(groupItem => {
292   - if (groupItem.id === id) {
  288 + }
  289 + /**
  290 + * 这也是分组,但这个是分组这个整体不绑定ws,而是下面的子组件都绑定了ws
  291 + */
  292 + targetItem.groupList?.forEach(groupItem => {
  293 + if (groupItem.id === id) {
293 294 const _value = this.getComponentValueByKeys(groupItem, value)
294 295 const { filter } = groupItem
295 296 const { value: filterValue, reason, flag } = useFilterFn(filter, _value)
296 297 groupItem.option.dataset = flag ? filterValue : reason
  298 + }
  299 + })
  300 + } else {
  301 + //单个
  302 + if (targetItem.id === id) {
  303 + const _value = this.getComponentValueByKeys(targetItem, value)
  304 + const { filter } = targetItem
  305 + const { value: filterValue, reason, flag } = useFilterFn(filter, _value)
  306 + targetItem.option.dataset = flag ? filterValue : reason
297 307 }
298   - })
299   - } else {
300   - //单个
301   - if (targetItem.id === id) {
302   - const _value = this.getComponentValueByKeys(targetItem, value)
303   - const { filter } = targetItem
304   - const { value: filterValue, reason, flag } = useFilterFn(filter, _value)
305   - targetItem.option.dataset = flag ? filterValue : reason
306   - }
307   - }
308   - //
309   - })
  308 + }
  309 + //
  310 + })
310 311 },
311 312
312 313 /**
... ...