Commit 61ce2c23d1260faf580b251d9f3e9a56a2bd5a51
1 parent
4c16f116
fix: 修复导入xml为多页时,剩余页失效&&设备详情接口调用逻辑修改
Showing
11 changed files
with
87 additions
and
37 deletions
| ... | ... | @@ -4324,7 +4324,9 @@ App.prototype.loadFile = function (id, sameWindow, file, success, force) { | 
| 4324 | 4324 | |
| 4325 | 4325 | if (success != null) | 
| 4326 | 4326 | success() | 
| 4327 | - | |
| 4327 | + // TODO Thingskkit socket连接 | |
| 4328 | + const lightboxWebsocketService = useLightboxModeService(this) | |
| 4329 | + this.lightboxWebsocketService = lightboxWebsocketService | |
| 4328 | 4330 | this.lightboxWebsocketService?.init?.() | 
| 4329 | 4331 | } | 
| 4330 | 4332 | ... | ... | 
| ... | ... | @@ -482,14 +482,12 @@ EditorUi.prototype.initPages = function () { | 
| 482 | 482 | this.editor.addListener('pageMoved', pagesChanged); | 
| 483 | 483 | this.editor.addListener('fileLoaded', pagesChanged); | 
| 484 | 484 | |
| 485 | - // TODO Thingskit 预览模式连接socket | |
| 486 | - const lightboxWebsocketService = useLightboxModeService(this) | |
| 487 | - this.lightboxWebsocketService = lightboxWebsocketService | |
| 488 | 485 | this.editor.addListener('pageSelected', mxUtils.bind(this, function (sender, evt) { | 
| 489 | 486 | this.scrollToPage(); | 
| 490 | 487 | this.updateHashObject(); | 
| 491 | 488 | this.updateTabContainer(); | 
| 492 | 489 | this.updateDocumentTitle(); | 
| 490 | + // TODO Thingskit 预览模式连接socket 切换页面时取消数据订阅 | |
| 493 | 491 | this.lightboxWebsocketService?.onSelectPageChange?.() | 
| 494 | 492 | |
| 495 | 493 | if (this.toolbar != null) { | 
| ... | ... | @@ -923,6 +921,8 @@ EditorUi.prototype.selectPage = function (page, quiet, viewState) { | 
| 923 | 921 | |
| 924 | 922 | var change = new SelectPage(this, page, viewState); | 
| 925 | 923 | change.execute(); | 
| 924 | + const cells = this.editor.graph.createCellLookup([change.page.root]) | |
| 925 | + this.editor.fitOldConfigurationByCellsIds(Object.values(cells)) | |
| 926 | 926 | edit.add(change); | 
| 927 | 927 | edit.notify(); | 
| 928 | 928 | ... | ... | 
| ... | ... | @@ -960,6 +960,25 @@ Editor.prototype.fitOldConfiguration = function (cells) { | 
| 960 | 960 | if (componentType === 'default') { | 
| 961 | 961 | // 处理就版本的图片路径 | 
| 962 | 962 | var style = cell?.getStyle?.() || '' | 
| 963 | + | |
| 964 | + if (style.includes('img/lib/thingskit')) { | |
| 965 | + cell?.setStyle?.(style.replace('img/lib/thingskit', `${getProxyPrefix()}/webapp/images/thingskit/libs`)) | |
| 966 | + } | |
| 967 | + } | |
| 968 | + } | |
| 969 | +} | |
| 970 | + | |
| 971 | +Editor.prototype.fitOldConfigurationByCellsIds = function (cellsIds) { | |
| 972 | + for (const cellId of cellsIds) { | |
| 973 | + const [cell] = this.graph.getCellsById([cellId]) | |
| 974 | + if (!cell) continue | |
| 975 | + var componentType = cell.getAttribute('componentType') | |
| 976 | + if (!componentType) continue | |
| 977 | + this.transformOldConfigurationKey(cell, componentType) | |
| 978 | + if (componentType === 'default') { | |
| 979 | + // 处理就版本的图片路径 | |
| 980 | + var style = cell?.getStyle?.() || '' | |
| 981 | + | |
| 963 | 982 | if (style.includes('img/lib/thingskit')) { | 
| 964 | 983 | cell?.setStyle?.(style.replace('img/lib/thingskit', `${getProxyPrefix()}/webapp/images/thingskit/libs`)) | 
| 965 | 984 | } | 
| ... | ... | @@ -976,7 +995,7 @@ Editor.prototype.setGraphXml = function (node) { | 
| 976 | 995 | |
| 977 | 996 | if (node.nodeName == 'mxGraphModel') { | 
| 978 | 997 | this.graph.model.beginUpdate(); | 
| 979 | - | |
| 998 | + console.log(dec) | |
| 980 | 999 | try { | 
| 981 | 1000 | this.graph.model.clear(); | 
| 982 | 1001 | this.graph.view.scale = 1; | ... | ... | 
| 1 | 1 | import type { DeviceAttributeItemType, DeviceItemType, DeviceProfileItemType, OrganizationItemType, RpcCommandType, SendValue, ThingsModel, ThingsModelItemType } from './model' | 
| 2 | 2 | import type { CommandWayEnum } from '@/enums/commandEnum' | 
| 3 | 3 | import type { DeviceTypeEnum } from '@/enums/datasource' | 
| 4 | +import { isShareMode } from '@/utils/env' | |
| 4 | 5 | import { defHttp } from '@/utils/http' | 
| 5 | 6 | |
| 6 | 7 | enum Api { | 
| ... | ... | @@ -125,7 +126,7 @@ export const getDeviceActiveTime = (entityId: string) => { | 
| 125 | 126 | export const getDeviceInfo = (deviceId: string) => { | 
| 126 | 127 | return defHttp.get( | 
| 127 | 128 | { | 
| 128 | - url: `${Api.GET_DEVICE_DETAIL}${deviceId}`, | |
| 129 | + url: isShareMode() ? `${Api.GET_DEVICE_DETAIL}public/${deviceId}` : `${Api.GET_DEVICE_DETAIL}${deviceId}`, | |
| 129 | 130 | }, | 
| 130 | 131 | ) | 
| 131 | 132 | } | ... | ... | 
| ... | ... | @@ -3,19 +3,32 @@ import { isLightboxMode } from '@/utils/env' | 
| 3 | 3 | |
| 4 | 4 | export const getDefaultOption = (): EChartsOption => { | 
| 5 | 5 | return { | 
| 6 | - legend: [], | |
| 7 | - xAxis: { | |
| 8 | - type: 'category', | |
| 9 | - data: isLightboxMode() ? [] : ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'], | |
| 6 | + tooltip: { | |
| 7 | + trigger: 'axis', | |
| 10 | 8 | }, | 
| 11 | - yAxis: { | |
| 12 | - type: 'value', | |
| 9 | + grid: { | |
| 10 | + left: '3%', | |
| 11 | + right: '4%', | |
| 12 | + bottom: '3%', | |
| 13 | + containLabel: true, | |
| 13 | 14 | }, | 
| 15 | + dataset: { | |
| 16 | + source: isLightboxMode() | |
| 17 | + ? [] | |
| 18 | + : [ | |
| 19 | + ['product', '2015', '2016', '2017'], | |
| 20 | + ['Matcha Latte', 43.3, 85.8, 93.7], | |
| 21 | + ['Milk Tea', 83.1, 73.4, 55.1], | |
| 22 | + ['Cheese Cocoa', 86.4, 65.2, 82.5], | |
| 23 | + ['Walnut Brownie', 72.4, 53.9, 39.1], | |
| 24 | + ], | |
| 25 | + }, | |
| 26 | + xAxis: { type: 'category' }, | |
| 27 | + yAxis: {}, | |
| 28 | + // Declare several bar series, each will be mapped | |
| 29 | + // to a column of dataset.source by default. | |
| 14 | 30 | series: [ | 
| 15 | - { | |
| 16 | - data: isLightboxMode() ? [] : [150, 230, 224, 218, 135, 147, 260], | |
| 17 | - type: 'line', | |
| 18 | - }, | |
| 31 | + { type: 'line' }, | |
| 19 | 32 | ], | 
| 20 | 33 | } | 
| 21 | 34 | } | ... | ... | 
| 1 | 1 | <script lang="ts" setup> | 
| 2 | 2 | import { computed, onMounted, onUnmounted, ref, unref } from 'vue' | 
| 3 | -import type { ECharts, EChartsOption, SeriesOption, XAXisComponentOption } from 'echarts' | |
| 3 | +import type { DatasetComponentOption, ECharts, EChartsOption, SeriesOption, XAXisComponentOption } from 'echarts' | |
| 4 | 4 | import { init } from 'echarts' | 
| 5 | 5 | import { getDefaultOption } from './index.config' | 
| 6 | 6 | import type { CreateComponentType, RenderComponentExposeType } from '@/core/Library/types' | 
| ... | ... | @@ -56,16 +56,32 @@ const handlerTimeSeriesData = (commandSource: CommandSource, message: Subscripti | 
| 56 | 56 | const { deviceName } = deviceInfo || {} | 
| 57 | 57 | const { ts, latestValue } = useLatestMessageValue(message, attr) | 
| 58 | 58 | const option = unref(chartInstance)?.getOption() as EChartsOption | 
| 59 | - const xAxisData = ((option.xAxis as XAXisComponentOption[])?.[0] as { data: string[] }).data | |
| 60 | - const seriesData = ((option.series as SeriesOption[])?.[0].data) as number[] | |
| 61 | - xAxisData.push(formatToDateTime(ts)) | |
| 62 | - seriesData.push(latestValue) | |
| 59 | + const oldDataset = (option.dataset as DatasetComponentOption[])?.[0].source | |
| 60 | + // const xAxisData = ((option.xAxis as XAXisComponentOption[])?.[0] as { data: string[] }).data | |
| 61 | + // const seriesData = ((option.series as SeriesOption[])?.[0].data) as SeriesOption[] | |
| 62 | + // console.log(option) | |
| 63 | + // oldDataset. | |
| 64 | + // xAxisData.push(formatToDateTime(ts)) | |
| 65 | + // seriesData.push({ | |
| 66 | + // name: attrInfo.name, | |
| 67 | + // data: [], | |
| 68 | + // }) | |
| 69 | + | |
| 63 | 70 | unref(chartInstance)?.setOption({ | 
| 64 | 71 | title: { | 
| 65 | 72 | text: `${deviceName}-${attrInfo.name}`, | 
| 66 | 73 | }, | 
| 67 | - xAxis: { data: sliceData(xAxisData) }, | |
| 68 | - series: { data: sliceData(seriesData) }, | |
| 74 | + dataset: { | |
| 75 | + dimensions: ['ts', attr], | |
| 76 | + source: [ | |
| 77 | + { ts, [attr]: latestValue }, | |
| 78 | + ], | |
| 79 | + }, | |
| 80 | + // legend: { | |
| 81 | + // data: [attrInfo.name], | |
| 82 | + // }, | |
| 83 | + // xAxis: { data: sliceData(xAxisData) }, | |
| 84 | + // series: { data: sliceData(seriesData) }, | |
| 69 | 85 | } as EChartsOption) | 
| 70 | 86 | } | 
| 71 | 87 | |
| ... | ... | @@ -97,8 +113,7 @@ defineExpose<RenderComponentExposeType>({ onMessage }) | 
| 97 | 113 | <template> | 
| 98 | 114 | <div class="w-full h-full justify-center flex items-center"> | 
| 99 | 115 | <div | 
| 100 | - ref="chartElRef" | |
| 101 | - :style="{ width: `${getCellBounds.width}px`, height: `${getCellBounds.height}px` }" | |
| 116 | + ref="chartElRef" :style="{ width: `${getCellBounds.width}px`, height: `${getCellBounds.height}px` }" | |
| 102 | 117 | class="w-full h-full" | 
| 103 | 118 | /> | 
| 104 | 119 | </div> | ... | ... | 
| ... | ... | @@ -36,15 +36,13 @@ export class LightboxModeWebsocketService extends TelemetryWebsockerService { | 
| 36 | 36 | super() | 
| 37 | 37 | this.nodeUtils = new NodeUtils(App) | 
| 38 | 38 | this.dataSource = [] | 
| 39 | - this.openSocket() | |
| 40 | 39 | this.messageHandler = new MessageHandler(this) | 
| 41 | 40 | this.eventHandler = new EventHandler(this) | 
| 42 | 41 | } | 
| 43 | 42 | |
| 44 | 43 | init() { | 
| 45 | - this.unsubscribeCurrentPageData() | |
| 46 | - this.getSelectPageNodeData() | |
| 47 | - this.getAllDataSubscribers() | |
| 44 | + this.openSocket() | |
| 45 | + this.onSelectPageChange() | |
| 48 | 46 | } | 
| 49 | 47 | |
| 50 | 48 | getAllDataSubscribers() { | 
| ... | ... | @@ -123,7 +121,9 @@ export class LightboxModeWebsocketService extends TelemetryWebsockerService { | 
| 123 | 121 | } | 
| 124 | 122 | |
| 125 | 123 | onSelectPageChange() { | 
| 126 | - this.init() | |
| 124 | + this.unsubscribeCurrentPageData() | |
| 125 | + this.getSelectPageNodeData() | |
| 126 | + this.getAllDataSubscribers() | |
| 127 | 127 | } | 
| 128 | 128 | |
| 129 | 129 | checkDataSourceNeedSubscribe(dataSource?: NodeDataDataSourceJsonType): dataSource is NodeDataDataSourceJsonType { | ... | ... | 
| ... | ... | @@ -32,20 +32,20 @@ export function checkStatus( | 
| 32 | 32 | |
| 33 | 33 | break | 
| 34 | 34 | case 403: | 
| 35 | - errMessage = ErrorEnum.ERR_MSG_403 | |
| 35 | + errMessage = msg || ErrorEnum.ERR_MSG_403 | |
| 36 | 36 | break | 
| 37 | 37 | // 404请求不存在 | 
| 38 | 38 | case 404: | 
| 39 | - errMessage = ErrorEnum.ERR_MSG_404 | |
| 39 | + errMessage = msg || ErrorEnum.ERR_MSG_404 | |
| 40 | 40 | break | 
| 41 | 41 | case 405: | 
| 42 | - errMessage = ErrorEnum.ERR_MSG_405 | |
| 42 | + errMessage = msg || ErrorEnum.ERR_MSG_405 | |
| 43 | 43 | break | 
| 44 | 44 | case 408: | 
| 45 | 45 | errMessage = ErrorEnum.ERR_MSG_408 | 
| 46 | 46 | break | 
| 47 | 47 | case 500: | 
| 48 | - errMessage = ErrorEnum.ERR_MSG_500 | |
| 48 | + errMessage = msg || ErrorEnum.ERR_MSG_500 | |
| 49 | 49 | break | 
| 50 | 50 | case 501: | 
| 51 | 51 | errMessage = ErrorEnum.ERR_MSG_501 | ... | ... | 
| ... | ... | @@ -10,7 +10,7 @@ export enum ErrorEnum { | 
| 10 | 10 | NETWORK_EXCEPTION = '网络异常', | 
| 11 | 11 | NETWORK_EXCEPTION_MSG = '网络异常,请检查您的网络连接是否正常!', | 
| 12 | 12 | ERR_MSG_401 = '用户没有权限(令牌、用户名、密码错误)!', | 
| 13 | - ERR_MSG_403 = '用户得到授权,但是访问是被禁止的。!', | |
| 13 | + ERR_MSG_403 = '用户得到授权,但是访问是被禁止的 !', | |
| 14 | 14 | ERR_MSG_404 = '网络请求错误,未找到该资源!', | 
| 15 | 15 | ERR_MSG_405 = '网络请求错误,请求方法未允许!', | 
| 16 | 16 | ERR_MSG_408 = '网络请求超时!', | ... | ... | 
| ... | ... | @@ -131,7 +131,7 @@ const transform: AxiosTransform = { | 
| 131 | 131 | responseInterceptorsCatch: (_axiosInstance: AxiosInstance, error: any) => { | 
| 132 | 132 | const { response, code, message, config } = error || {} | 
| 133 | 133 | const errorMessageMode = config?.requestOptions?.errorMessageMode || 'none' | 
| 134 | - const msg: string = response?.data?.error?.message ?? '' | |
| 134 | + const msg: string = response?.data?.message ?? '' | |
| 135 | 135 | const err: string = error?.toString?.() ?? '' | 
| 136 | 136 | let errMessage = '' | 
| 137 | 137 | if (axios.isCancel(error)) | 
| ... | ... | @@ -157,7 +157,6 @@ const transform: AxiosTransform = { | 
| 157 | 157 | catch (error) { | 
| 158 | 158 | throw new Error(error as unknown as string) | 
| 159 | 159 | } | 
| 160 | - | |
| 161 | 160 | checkStatus(error?.response?.status, msg, errorMessageMode) | 
| 162 | 161 | |
| 163 | 162 | // 添加自动重试机制 保险起见 只针对GET请求 | ... | ... |