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请求 | ... | ... |