dendi-wang/thingsboard
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

UI: Added support mobileQrEnabled settings in tenant admin home page dashboard

Browse Source
This commit is contained in:
Vladyslav_Prykhodko 2024-05-07 18:05:22 +03:00
parent 034ed6219b
commit 2bbeb6ab34
5 changed files with 167 additions and 52 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
ui-ngx/src/app/core/auth/auth.models.ts
View File

@ -24,6 +24,7 @@ export interface SysParamsState {
hasRepository: boolean;
tbelEnabled: boolean;
persistDeviceStateToTelemetry: boolean;
mobileQrEnabled: boolean;
userSettings: UserSettings;
maxResourceSize: number;
}

1
ui-ngx/src/app/core/auth/auth.reducer.ts
View File

@ -29,6 +29,7 @@ const emptyUserAuthState: AuthPayload = {
hasRepository: false,
tbelEnabled: false,
persistDeviceStateToTelemetry: false,
mobileQrEnabled: false,
maxResourceSize: 0,
userSettings: initialUserSettings
};

11
ui-ngx/src/app/core/auth/auth.selectors.ts
View File

@ -78,6 +78,17 @@ export const selectPersistDeviceStateToTelemetry = createSelector(
(state: AuthState) => state.persistDeviceStateToTelemetry
);
export const selectMobileQrEnabled = createSelector(
selectAuthState,
(state: AuthState) => state.mobileQrEnabled
);
export const selectPersistDeviceStateToTelemetryAndMobileQrEnabled = createSelector(
selectPersistDeviceStateToTelemetry,
selectMobileQrEnabled,
(persistDeviceStateToTelemetry, mobileQrEnabled) => ({persistDeviceStateToTelemetry, mobileQrEnabled})
);
export const selectUserSettings = createSelector(
selectAuthState,
(state: AuthState) => state.userSettings

17
ui-ngx/src/app/modules/home/pages/home-links/home-links-routing.module.ts
View File

@ -25,7 +25,7 @@ import { DashboardService } from '@core/http/dashboard.service';
import { select, Store } from '@ngrx/store';
import { AppState } from '@core/core.state';
import { map } from 'rxjs/operators';
import { getCurrentAuthUser, selectPersistDeviceStateToTelemetry } from '@core/auth/auth.selectors';
import { getCurrentAuthUser, selectPersistDeviceStateToTelemetryAndMobileQrEnabled } from '@core/auth/auth.selectors';
import { EntityKeyType } from '@shared/models/query/query.models';
import { ResourcesService } from '@core/services/resources.service';
@ -35,16 +35,25 @@ const customerUserHomePageJson = '/assets/dashboard/customer_user_home_page.json
const updateDeviceActivityKeyFilterIfNeeded = (store: Store<AppState>,
dashboard$: Observable<HomeDashboard>): Observable<HomeDashboard> =>
store.pipe(select(selectPersistDeviceStateToTelemetry)).pipe(
mergeMap((persistToTelemetry) => dashboard$.pipe(
store.pipe(select(selectPersistDeviceStateToTelemetryAndMobileQrEnabled)).pipe(
mergeMap((params) => dashboard$.pipe(
map((dashboard) => {
if (persistToTelemetry) {
if (params.persistDeviceStateToTelemetry) {
for (const filterId of Object.keys(dashboard.configuration.filters)) {
if (['Active Devices', 'Inactive Devices'].includes(dashboard.configuration.filters[filterId].filter)) {
dashboard.configuration.filters[filterId].keyFilters[0].key.type = EntityKeyType.TIME_SERIES;
}
}
}
if (params.mobileQrEnabled) {
for (const widgetId of Object.keys(dashboard.configuration.widgets)) {
if (dashboard.configuration.widgets[widgetId].config.title === 'Select show mobile QR code') {
dashboard.configuration.widgets[widgetId].config.settings.markdownTextFunction =
(dashboard.configuration.widgets[widgetId].config.settings.markdownTextFunction as string)
.replace('\'${mobileQrEnabled}\'', String(params.mobileQrEnabled));
}
}
}
return dashboard;
})
))

189
ui-ngx/src/assets/dashboard/tenant_admin_home_page.json
View File

@ -101,38 +101,6 @@
"id": "867f82cf-ecf2-2d5c-35cb-08c6f2edc3a4",
"typeFullFqn": "system.home_page_widgets.documentation_links"
},
"a23185ad-dc46-806c-0e50-5b21fb080ace": {
"type": "static",
"sizeX": 7.5,
"sizeY": 6.5,
"config": {
"datasources": [],
"timewindow": {
"realtime": {
"timewindowMs": 60000
}
},
"showTitle": false,
"backgroundColor": "rgb(255, 255, 255)",
"color": "rgba(0, 0, 0, 0.87)",
"padding": "16px",
"settings": {
"columns": 3
},
"title": "Getting started",
"dropShadow": false,
"enableFullscreen": false,
"widgetStyle": {},
"widgetCss": "",
"pageSize": 1024,
"noDataDisplayMessage": "",
"showLegend": false
},
"row": 0,
"col": 0,
"id": "a23185ad-dc46-806c-0e50-5b21fb080ace",
"typeFullFqn": "system.home_page_widgets.getting_started"
},
"ebbd0a6e-8a47-e770-5086-7f4974250f2d": {
"type": "static",
"sizeX": 7.5,
@ -1144,7 +1112,108 @@
"col": 0,
"id": "8e71a398-caf5-540d-cec5-6e5dc264343e"
},
"b9d704a2-f579-dbff-f123-f953d92081fd": {
"35bda856-2495-4f72-e35e-925bac8b8da7": {
"typeFullFqn": "system.cards.markdown_card",
"type": "latest",
"sizeX": 5,
"sizeY": 3.5,
"config": {
"datasources": [],
"timewindow": {
"displayValue": "",
"selectedTab": 0,
"realtime": {
"realtimeType": 1,
"interval": 1000,
"timewindowMs": 60000,
"quickInterval": "CURRENT_DAY"
},
"history": {
"historyType": 0,
"interval": 1000,
"timewindowMs": 60000,
"fixedTimewindow": {
"startTimeMs": 1715005524783,
"endTimeMs": 1715091924783
},
"quickInterval": "CURRENT_DAY"
},
"aggregation": {
"type": "AVG",
"limit": 25000
}
},
"showTitle": false,
"backgroundColor": "#fff",
"color": "rgba(0, 0, 0, 0.87)",
"padding": "0px",
"settings": {
"useMarkdownTextFunction": true,
"markdownTextPattern": "### Markdown/HTML card\n - **Current entity**: ${entityName}.\n - **Current value**: ${Random}.",
"markdownTextFunction": "let html = '<div style=\"width: 100%; height: 100%;\">';\nlet supportMobile = '${mobileQrEnabled}' || false;\nif (supportMobile && typeof supportMobile === 'boolean') {\n html += '<tb-dashboard-state stateId=\"mobile_app_qr_code\" [ctx]=\"ctx\"></tb-dashboard-state>';\n} else {\n html += '<tb-getting-started-widget style=\"padding: 16px;\"></tb-getting-started-widget>';\n}\nhtml += '</div>';\nreturn html;",
"applyDefaultMarkdownStyle": false,
"markdownCss": ""
},
"title": "Select show mobile QR code",
"showTitleIcon": false,
"iconColor": "rgba(0, 0, 0, 0.87)",
"iconSize": "24px",
"titleTooltip": "",
"dropShadow": true,
"enableFullscreen": false,
"widgetStyle": {
"border": "none",
"boxShadow": "none",
"padding": 0
},
"titleStyle": {
"fontSize": "16px",
"fontWeight": 400
},
"showLegend": false,
"useDashboardTimewindow": true,
"displayTimewindow": true,
"widgetCss": "",
"pageSize": 1024,
"noDataDisplayMessage": ""
},
"row": 0,
"col": 0,
"id": "35bda856-2495-4f72-e35e-925bac8b8da7"
},
"ed33e56f-293b-aaaa-ad19-0cf499dc926f": {
"type": "static",
"sizeX": 7.5,
"sizeY": 6.5,
"config": {
"datasources": [],
"timewindow": {
"realtime": {
"timewindowMs": 60000
}
},
"showTitle": false,
"backgroundColor": "rgb(255, 255, 255)",
"color": "rgba(0, 0, 0, 0.87)",
"padding": "16px",
"settings": {
"columns": 3
},
"title": "Getting started",
"dropShadow": false,
"enableFullscreen": false,
"widgetStyle": {},
"widgetCss": "",
"pageSize": 1024,
"noDataDisplayMessage": "",
"showLegend": false
},
"row": 0,
"col": 0,
"id": "ed33e56f-293b-aaaa-ad19-0cf499dc926f",
"typeFullFqn": "system.home_page_widgets.getting_started"
},
"8c5207d8-7103-4dc2-db48-d61c0c8c61fd": {
"typeFullFqn": "system.home_page_widgets.home_mobile_app_qr_code",
"type": "static",
"sizeX": 6,
@ -1183,7 +1252,7 @@
},
"row": 0,
"col": 0,
"id": "b9d704a2-f579-dbff-f123-f953d92081fd"
"id": "8c5207d8-7103-4dc2-db48-d61c0c8c61fd"
}
},
"states": {
@ -1208,13 +1277,6 @@
"col": 28,
"mobileHide": true
},
"a23185ad-dc46-806c-0e50-5b21fb080ace": {
"sizeX": 35,
"sizeY": 42,
"row": 0,
"col": 85,
"mobileHide": true
},
"ebbd0a6e-8a47-e770-5086-7f4974250f2d": {
"sizeX": 28,
"sizeY": 16,
@ -1254,13 +1316,11 @@
"col": 43,
"mobileOrder": 0
},
"b9d704a2-f579-dbff-f123-f953d92081fd": {
"35bda856-2495-4f72-e35e-925bac8b8da7": {
"sizeX": 35,
"sizeY": 16,
"row": 42,
"col": 85,
"mobileOrder": 5,
"mobileHeight": 7
"sizeY": 58,
"row": 0,
"col": 85
}
},
"gridSettings": {
@ -1330,6 +1390,39 @@
}
}
}
},
"mobile_app_qr_code": {
"name": "Mobile App QR code",
"root": false,
"layouts": {
"main": {
"widgets": {
"ed33e56f-293b-aaaa-ad19-0cf499dc926f": {
"sizeX": 120,
"sizeY": 45,
"row": 0,
"col": 0
},
"8c5207d8-7103-4dc2-db48-d61c0c8c61fd": {
"sizeX": 120,
"sizeY": 17,
"row": 45,
"col": 0
}
},
"gridSettings": {
"backgroundColor": "#eeeeee",
"columns": 120,
"margin": 12,
"outerMargin": false,
"backgroundSizeMode": "100%",
"autoFillHeight": true,
"backgroundImageUrl": null,
"mobileAutoFillHeight": false,
"mobileRowHeight": 20
}
}
}
}
},
"entityAliases": {
@ -1465,4 +1558,4 @@
}
},
"name": "Tenant Administrator Home Page"
}
}