Wiki source code of Demo for Smart Office, Factory

Version 63.1 by Hera Guo on 2024/11/07 10:24

version	line-number	content
51.1	1	Table of Contents:
11.1	2
51.1	3	{{toc/}}
11.1	4
	5
51.1	6
	7
	8
	9
	10
2.1	11	= 1. About this demo =
	12
	13	This demo is to show the installation for various sensors in Dragino Office, Dragino Facotry & ThingsEye Office. It covers various types of sensors such as Temperature, Humidity, CO2, Water Flow, Vibration & many many.
	14
	15	User can check this [[Public Share Link>>https://thingseye.io/dashboard/d17f70f0-6b5f-11ef-a329-6fb88c149adb?publicId=33180810-5c40-11ef-a329-6fb88c149adb ]] and see the dash board for this demo. The dash board keeps updating, while the main structure will keep the same. It has Three Level DashBoard as decribe below.
	16
	17	* First Level - Overview for all branches: This dashboard shows all branches overview status and location.
	18	* Second Level - Branch Level: This dashboard shows all sensors installation and status in the selected branch.
	19	* Third Level - Sensor Level: This dashboard shows the detail reading for a specify sensor
	20
4.1	21	[[image:Level1.png\|\|height="133" width="298"]] [[image:Arrow.png\|\|height="27" width="51"]] [[image:Level2.png\|\|height="134" width="264"]][[image:Arrow.png\|\|height="27" width="51"]] [[image:2024-09-26 23-47-06.png\|\|height="130" width="256"]]
5.1	22
	23
	24	The rest of this chapter will provide the introduction for how to set up similiar solution.
	25
	26
15.1	27	= 2.Basic configuration instructions =
5.1	28
14.1	29	When you start a complex IoT project, you first need to learn some basic configuration methods for ThingsEye.
5.1	30
14.1	31	Here are some instructions you need to know：
5.1	32
14.1	33	Dashboard creation and some basic configurations:[[https:~~/~~/wiki.thingseye.io/xwiki/bin/view/Main/How%20to%20import%20and%20use%20the%20dashboard%3F/#H3.2.2.1CreatA0alarm>>https://wiki.thingseye.io/xwiki/bin/view/Main/How%20to%20import%20and%20use%20the%20dashboard%3F/#H3.2.2.1CreatA0alarm]]
5.1	34
15.1	35	Rule chain creation:[[https:~~/~~/wiki.thingseye.io/xwiki/bin/view/Main/Basic%20configuration%20of%20rule%20chains>>https://wiki.thingseye.io/xwiki/bin/view/Main/Basic%20configuration%20of%20rule%20chains/]]
5.1	36
14.1	37	Devices connected to thingseye：[[https:~~/~~/wiki.thingseye.io/xwiki/bin/view/Main/How%20to%20connect%20my%20devices%20to%20ThingsEye%3F/>>https://wiki.thingseye.io/xwiki/bin/view/Main/How%20to%20connect%20my%20devices%20to%20ThingsEye%3F/]]
5.1	38
15.1	39	= 3.overview =
5.1	40
15.1	41	== 3.1 MHierarchical architectureore features ==
	42
	43	Before we start a project, we first need to understand the organizational structure of the project. Only with a clear outline can our project construction process be smoother
	44
	45	Assets：Dragino Office 、Dragino Factory
	46
	47	Devices：
	48
	49	Dragino Factory：temperature and humidity measurement×7、Gateway×1
	50
	51	Dragino Office：temperature and humidity measurement×2、Air quality measurement×4
	52
	53	== 3.2 Dashboard architecture ==
	54
	55	In this demo, the dashboard is divided into three layers, namely: home page, asset, and device.
	56
	57	home page:It includes three parts: map, asset list, and all alarm. From this interface, you can see how many factories, offices, and so on there are
	58
	59	asset:It includes three parts: asset map, device list, and asset alarm. From this interface, you can see how many sensors are deployed in the office or project, where they are located, and their alarm status
	60
	61	device:This section displays the specific information collected by the device, and different types of sensors have different display interfaces
	62
20.1	63	[[image:屏幕截图 2024-11-04 134645.png]]
15.1	64
	65	First floor：
	66
	67	[[image:1730702565889-204.png\|\|height="771" width="1445"]]
	68
	69	Second floor：
	70
	71	[[image:1730702622551-808.png\|\|height="756" width="1450"]]
	72
	73	Third floor：
	74
	75	[[image:1730702656725-496.png\|\|height="775" width="1455"]]
	76
	77	[[image:1730702814435-805.png\|\|height="797" width="1458"]]
	78
	79
	80	[[image:1730702688377-367.png\|\|height="770" width="1462"]]
	81
	82	* How many types of devices do you need, how many layers of third level dashboards you need to create.
	83
	84	== 3.3 Alarm rules ==
	85
	86	High Temperature、Low Temperature、High humidity、Low humidity、Low voltage、Device Disconnected
	87
33.1	88	[[image:屏幕截图 2024-11-04 135045.png]]
15.1	89
	90	= 4.configuration details =
	91
	92	After understanding the architecture and layering of the complete project, we can start configuring it
	93
	94	== 4.1 Dashboard configuration details ==
	95
16.1	96	=== 4.1.1.Data source (Entity aliases) ===
	97
20.1	98	detail:Obtain data based on dashboard status
16.1	99
18.1	100	[[image:1730709424998-915.png\|\|height="729" width="1436"]]
16.1	101
20.1	102	Alarm:Obtain alarm information
16.1	103
18.1	104	[[image:1730709479828-595.png\|\|height="696" width="1435"]]
16.1	105
20.1	106	Dragino&GXHL,Ltd:Obtain data through asset types
16.1	107
18.1	108	[[image:1730709511861-439.png\|\|height="714" width="1435"]]
16.1	109
20.1	110	Selected Supermarket:Retrieve devices by device type
16.1	111
18.1	112	[[image:1730709527720-418.png\|\|height="751" width="1433"]]
16.1	113
20.1	114	Supermarket Devices:Obtain data through device type
16.1	115
20.1	116	[[image:1730709555797-383.png\|\|height="726" width="1434"]]
16.1	117
20.1	118	LHT65N Device：Obtain data based on device type
16.1	119
20.1	120	[[image:1730857191863-514.png\|\|height="725" width="1433"]]
16.1	121
	122	=== 4.1.2.Page Configuration ===
	123
19.1	124	==== 4.1.2.1、Configure the interface of the third layer Davies. ====
15.1	125
19.1	126	==== 4.1.2.2、Configure the interface of the second layer asset ====
15.1	127
20.1	128	===== 4.1.2.2.1 Equipment distribution diagram： =====
15.1	129
19.1	130	Data：
15.1	131
19.1	132	[[image:1730770392454-317.png\|\|height="745" width="1439"]]
15.1	133
20.1	134	Appearannce：In this module, we need to arrange our devices in the corresponding positions and use icons to display our devices. Therefore, in the Appearance interface, we need to configure them
19.1	135
20.1	136	Tooltip function：This module displays the current information of the device
	137
	138	[[image:1730857537965-184.png]]
	139
19.1	140	{{code language="none"}}
	141	var msg = data
	142	if(msg.Label=="gateway" && msg.type == "gateway"){
	143	var stauts
	144	if (msg.gatewaystauts=="true"){
	145	stauts = "Connect"
	146	}
	147	else{
	148	stauts = "Disconnected"
	149	}
	150	var str = "<b>"+msg.entityName+"</b><br/><b>"+stauts+"</b><br/>"
	151	return str
	152	}
	153	else if(msg.type=="gxhl01" && msg.Label!="gateway"){
	154	var str = "<b>"+msg.entityName+"</b><br/><b>"+msg.Label+"</b><br/><b>Bat:</b>"+msg.BatV+"V<br/><b>Temperature:</b>"+ msg.TempC_SHT+ "°C<br/><b>Humidity:</b>"+msg.Hum_SHT+"%"
	155	return str
	156	}
	157	else{
	158	var str = "<b>"+msg.entityName+"</b><br/><b>"+msg.Label+"</b><br/><b>Bat:</b>"+msg.BatV+"V<br/><b>Temperature:</b>"+ msg.temperature+ "°C<br/><b>Humidity:"+msg.humidity+"%"+"</b><br/>"+
	159	"<b>Co2:"+msg.co2+"</b></br><b>Air_Pressure:"+msg.air_pressure
	160
	161	return str
	162	}
	163	{{/code}}
	164
20.1	165	(% class="wikigeneratedid" id="HMarkerimagefunctionFF1A" %)
	166	Marker image function：This module can display different icons based on different types of sensors and their status to achieve its functionality
19.1	167
20.1	168	(% class="wikigeneratedid" %)
	169	[[image:1730857750749-240.png]]
	170
19.1	171	{{code language="none"}}
	172	var res
	173	var msg = data
	174	if(msg.Label=="gateway" && msg.type=="gateway"){
	175	if (msg.gatewaystauts == "true"){
	176	res = {
	177	url: images[3],
	178	size: 40
	179	}
	180	}
	181	else{
	182	res = {
	183	url: images[2],
	184	size: 40
	185	}
	186	}}
	187	else if(msg.Label!="gateway" && msg.type=="gxhl01" ){
	188	if (msg.active=="false"){
	189	res = {
	190	url: images[1],
	191	size: 40
	192	}}
	193	else{
	194	res = {
	195	url: images[0],
	196	size: 40
	197	}
	198	}
	199	}
	200	else if(msg.type=="LWL02"){
	201	if (msg.WATER_LEAK_STATUS=="0"){
	202	res = {
	203	url: images[6],
	204	size: 40
	205	}}
	206	else{
	207	res = {
	208	url: images[7],
	209	size: 40
	210	}
	211	}
	212	}
	213	else if(msg.type=="LDS02"){
	214	if (msg.DOOR_OPEN_STATUS=="0"){
	215	res = {
	216	url: images[5],
	217	size: 40
	218	}}
	219	else{
	220	res = {
	221	url: images[8],
	222	size: 40
	223	}
	224	}
	225	}
	226	else if(msg.type=="LDS12"){
	227	res = {
	228	url: images[10],
	229	size: 40
	230	}}
	231	else if(msg.type=="SE01"){
	232	res = {
	233	url: images[9],
	234	size: 40
	235	}}
	236	else if(msg.type=="PB01"){
	237	res = {
	238	url: images[11],
	239	size: 40
	240	}}
	241	else if(msg.type=="S31b"){
	242	res = {
	243	url: images[12],
	244	size: 40
	245	}}
	246	else if(msg.type=="LHT65N"){
	247	res = {
	248	url: images[13],
	249	size: 40
	250	}}
	251	else{
	252	res = {
	253	url: images[4],
	254	size: 40
	255	}
	256	}
	257	return res;
	258	{{/code}}
	259
35.1	260	(% class="wikigeneratedid" %)
55.1	261	[[image:1730770875793-351.png\|\|height="799" width="1474"]]
19.1	262
36.1	263	(% class="wikigeneratedid" %)
	264	Actions:We need to implement the function of entering the details interface through the corresponding device icon, so in this module, we need to add actions to achieve redirection
	265
19.1	266	{{code language="none"}}
	267	var entitySubType;
	268	var $injector = widgetContext.$scope.$injector;
	269	$injector.get(widgetContext.servicesMap.get('entityService')).getEntity(entityId.entityType, entityId.id)
	270	.subscribe(function(data) {
	271	entitySubType = data.type;
	272	console.log(entitySubType)
	273	if (entitySubType == 'gateway') {
	274	openDashboardStates('gateway_detail');
	275	} else if (entitySubType == 'gxhl01') {
	276	openDashboardStates('detail');
	277	}
	278	else if(entitySubType == 'AQS01-dragino-office'){
	279	openDashboardStates("aqs01_detail")
	280	}
	281	else if (entitySubType == 'LDS12') {
	282	openDashboardStates('lds12_detail');
	283	}
	284	else if (entitySubType == 'LDS02') {
	285	openDashboardStates('lds02_detail');
	286	}
	287	else if (entitySubType == 'SE01') {
	288	openDashboardStates('se01_detail');
	289	}
	290	else if (entitySubType == 'PB01') {
	291	openDashboardStates('pb01_detail');
	292	}
	293	else if (entitySubType == 'LWL02') {
	294	openDashboardStates('lwl02_detail');
	295	}
	296	else if (entitySubType == 'LPS8N') {
	297	openDashboardStates('lps8n_detail');
	298	}
	299	else if (entitySubType == 'LHT65N') {
	300	openDashboardStates('lht65n_detail');
	301	}
	302	else if (entitySubType == 'S31b') {
	303	openDashboardStates('s31b_detail');
	304	}
	305	});
	306
	307	function openDashboardStates(statedId) {
	308	var stateParams = widgetContext.stateController.getStateParams();
	309	var params = {
	310	entityId: entityId,
	311	entityName: entityName
	312	};
	313
	314	if (stateParams.city) {
	315	params.city = stateParams.city;
	316	}
	317
	318	widgetContext.stateController.openState(statedId, params, false);
	319	}
	320
	321	{{/code}}
	322
55.1	323	[[image:1730771103096-522.png\|\|height="815" width="1503"]]
19.1	324
20.1	325	===== 4.1.2.2.2 Device List =====
19.1	326
26.1	327	(% class="wikigeneratedid" id="HDataFF1A" %)
	328	Data：
19.1	329
55.1	330	[[image:1730771199343-553.png\|\|height="802" width="1501"]]
19.1	331
20.1	332	Actions：Equipment distribution diagram: In this module, functions need to be implemented such as adding devices, editing devices, deleting devices, and jumping to the device details page. Therefore, the following actions need to be added:
19.1	333
	334	[[image:1730771228766-212.png]]
	335
20.1	336	(% class="wikigeneratedid" id="HEditdeviceFF1A" %)
38.1	337	Edit device：Implementation function: Device editing
19.1	338
20.1	339	[[image:1730771256045-238.png]]
	340
19.1	341	{{code language="none"}}
	342	let $injector = widgetContext.$scope.$injector;
	343	let customDialog = $injector.get(widgetContext.servicesMap.get('customDialog'));
	344	let deviceService = $injector.get(widgetContext.servicesMap.get('deviceService'));
	345	let attributeService = $injector.get(widgetContext.servicesMap.get('attributeService'));
	346
	347	openEditDeviceDialog();
	348
	349	function openEditDeviceDialog() {
	350	customDialog.customDialog(htmlTemplate, EditDeviceDialogController).subscribe();
	351	}
	352
	353	function EditDeviceDialogController(instance) {
	354	let vm = instance;
	355
	356	vm.device = null;
	357	vm.attributes = {};
	358
	359	vm.editDeviceFormGroup = vm.fb.group({
	360	deviceName: ['', [vm.validators.required]],
	361	deviceType: ['', [vm.validators.required]],
	362	deviceLabel: [''],
	363	attributes: vm.fb.group({
	364	latitude: [null],
	365	longitude: [null]
	366	})
	367	});
	368
	369	vm.cancel = function() {
	370	vm.dialogRef.close(null);
	371	};
	372
	373	vm.save = function() {
	374	vm.editDeviceFormGroup.markAsPristine();
	375	if (vm.editDeviceFormGroup.get('deviceType').value !== vm.device.type) {
	376	delete vm.device.deviceProfileId;
	377	}
	378	vm.device.name = vm.editDeviceFormGroup.get('deviceName').value,
	379	vm.device.type = vm.editDeviceFormGroup.get('deviceType').value,
	380	vm.device.label = vm.editDeviceFormGroup.get('deviceLabel').value
	381	deviceService.saveDevice(vm.device).subscribe(
	382	function () {
	383	saveAttributes().subscribe(
	384	function () {
	385	widgetContext.updateAliases();
	386	vm.dialogRef.close(null);
	387	}
	388	);
	389	}
	390	);
	391	};
	392
	393	getEntityInfo();
	394
	395	function getEntityInfo() {
	396	deviceService.getDevice(entityId.id).subscribe(
	397	function (device) {
	398	attributeService.getEntityAttributes(entityId, 'SERVER_SCOPE',
	399	['latitude', 'longitude']).subscribe(
	400	function (attributes) {
	401	for (let i = 0; i < attributes.length; i++) {
	402	vm.attributes[attributes[i].key] = attributes[i].value;
	403	}
	404	vm.device = device;
	405	vm.editDeviceFormGroup.patchValue(
	406	{
	407	deviceName: vm.device.name,
	408	deviceType: vm.device.type,
	409	deviceLabel: vm.device.label,
	410	attributes: {
	411	latitude: vm.attributes.latitude,
	412	longitude: vm.attributes.longitude
	413	}
	414	}, {emitEvent: false}
	415	);
	416	}
	417	);
	418	}
	419	);
	420	}
	421
	422	function saveAttributes() {
	423	let attributes = vm.editDeviceFormGroup.get('attributes').value;
	424	let attributesArray = [];
	425	for (let key in attributes) {
	426	attributesArray.push({key: key, value: attributes[key]});
	427	}
	428	if (attributesArray.length > 0) {
	429	return attributeService.saveEntityAttributes(entityId, 'SERVER_SCOPE', attributesArray);
	430	} else {
	431	return widgetContext.rxjs.of([]);
	432	}
	433	}
	434	}
	435	{{/code}}
	436
40.1	437	Delete device：Implementation function: Device deletion
	438
20.1	439	[[image:1730771318657-502.png]]
	440
19.1	441	{{code language="none"}}
	442	let $injector = widgetContext.$scope.$injector;
	443	let dialogs = $injector.get(widgetContext.servicesMap.get('dialogs'));
	444	let deviceService = $injector.get(widgetContext.servicesMap.get('deviceService'));
	445
	446	openDeleteDeviceDialog();
	447
	448	function openDeleteDeviceDialog() {
	449	let title = "Are you sure you want to delete the device " + entityName + "?";
	450	let content = "Be careful, after the confirmation, the device and all related data will become unrecoverable!";
	451	dialogs.confirm(title, content, 'Cancel', 'Delete').subscribe(
	452	function (result) {
	453	if (result) {
	454	deleteDevice();
	455	}
	456	}
	457	);
	458	}
	459
	460	function deleteDevice() {
	461	deviceService.deleteDevice(entityId.id).subscribe(
	462	function () {
	463	widgetContext.updateAliases();
	464	}
	465	);
	466	}
	467
	468	{{/code}}
	469
38.1	470	jump:Implementation function: Jump to the device details page
19.1	471
20.1	472	[[image:1730771386258-676.png]]
	473
19.1	474	{{code language="none"}}
	475	console.log(entityName)
	476	var entitySubType;
	477	var $injector = widgetContext.$scope.$injector;
	478	//console.log($injector)
	479	$injector.get(widgetContext.servicesMap.get('entityService')).getEntity(entityId.entityType, entityId.id)
	480	.subscribe(function(data) {
	481	console.log(data)
	482	entitySubType = data.type;
	483	console.log(entitySubType)
	484	if (entitySubType == 'AQS01-dragino-office') {
	485	openDashboardStates('aqs01_detail');
	486	}else if (entitySubType == 'gateway') {
	487	openDashboardStates('gateway_detail');
	488	} else if (entitySubType == 'gxhl01') {
	489	openDashboardStates('detail');
	490
	491	} else if (entitySubType == 'tank-type1') {
	492	openDashboardStates('test1');
	493	}
	494	else if (entitySubType == 'LDS12') {
	495	openDashboardStates('lds12_detail');
	496	}
	497	else if (entitySubType == 'LDS02') {
	498	openDashboardStates('lds02_detail');
	499	}
	500	else if (entitySubType == 'SE01') {
	501	openDashboardStates('se01_detail');
	502	}
	503	else if (entitySubType == 'PB01') {
	504	openDashboardStates('pb01_detail');
	505	}
	506	else if (entitySubType == 'LWL02') {
	507	openDashboardStates('lwl02_detail');
	508	}
	509	else if (entitySubType == 'LPS8N') {
	510	openDashboardStates('lps8n_detail');
	511	}
	512	else if (entitySubType == 'LHT65N') {
	513	openDashboardStates('lht65n_detail');
	514	}
	515	else if (entitySubType == 'S31b') {
	516	openDashboardStates('s31b_detail');
	517	}
	518	});
	519
	520	function openDashboardStates(statedId) {
	521	var stateParams = widgetContext.stateController.getStateParams();
	522	//console.log(stateParams)
	523	var params = {
	524	entityId: entityId,
	525	entityName: entityName
	526	};
	527	widgetContext.stateController.updateState(statedId, params, false);
	528	}
	529	{{/code}}
	530
23.1	531	(% class="wikigeneratedid" id="H-1" %)
38.1	532	Add device：Implementation function: Add device
19.1	533
20.1	534	[[image:1730771441589-122.png]]
	535
19.1	536	{{code language="none"}}
	537	let $injector = widgetContext.$scope.$injector;
	538	let customDialog = $injector.get(widgetContext.servicesMap.get('customDialog'));
	539	let deviceService = $injector.get(widgetContext.servicesMap.get('deviceService'));
	540	let attributeService = $injector.get(widgetContext.servicesMap.get('attributeService'));
	541
	542	openAddDeviceDialog();
	543
	544	function openAddDeviceDialog() {
	545	customDialog.customDialog(htmlTemplate, AddDeviceDialogController).subscribe();
	546	}
	547
	548	function AddDeviceDialogController(instance) {
	549	let vm = instance;
	550
	551	vm.addDeviceFormGroup = vm.fb.group({
	552	deviceName: ['', [vm.validators.required]],
	553	deviceType: ['', [vm.validators.required]],
	554	deviceLabel: [''],
	555	attributes: vm.fb.group({
	556	latitude: [null],
	557	longitude: [null]
	558	})
	559	});
	560
	561	vm.cancel = function() {
	562	vm.dialogRef.close(null);
	563	};
	564
	565	vm.save = function() {
	566	vm.addDeviceFormGroup.markAsPristine();
	567	let device = {
	568	name: vm.addDeviceFormGroup.get('deviceName').value,
	569	type: vm.addDeviceFormGroup.get('deviceType').value,
	570	label: vm.addDeviceFormGroup.get('deviceLabel').value
	571	};
	572	deviceService.saveDevice(device).subscribe(
	573	function (device) {
	574	saveAttributes(device.id).subscribe(
	575	function () {
	576	widgetContext.updateAliases();
	577	vm.dialogRef.close(null);
	578	}
	579	);
	580	}
	581	);
	582	};
	583
	584	function saveAttributes(entityId) {
	585	let attributes = vm.addDeviceFormGroup.get('attributes').value;
	586	let attributesArray = [];
	587	for (let key in attributes) {
	588	attributesArray.push({key: key, value: attributes[key]});
	589	}
	590	if (attributesArray.length > 0) {
	591	return attributeService.saveEntityAttributes(entityId, "SERVER_SCOPE", attributesArray);
	592	} else {
	593	return widgetContext.rxjs.of([]);
	594	}
	595	}
	596	}
	597	{{/code}}
	598
45.1	599	===== 4.1.2.2.3 Asset Alarm: =====
19.1	600
62.1	601	Data:
19.1	602
61.1	603	[[image:1730771504586-433.png\|\|height="762" width="1431"]]
57.1	604
62.1	605	==== (% id="cke_bm_373849S" style="display:none" %) (%%)4.1.2.3、Configure the first layer menu interface ====
57.1	606
62.1	607	===== 4.1.2.3.1 Map: =====
	608
	609	Data:
	610
	611	[[image:1730710271230-716.png\|\|height="729" width="1427"]]
	612
57.1	613	Actions:The map interface has two actions, among which Select supermarket can refresh the device list and related alarms on the right side to enter the location, and Supermarket_detail can jump to the second level physical interface to view the details of the location based on the selected location
	614
	615	[[image:1730710850458-781.png\|\|height="770" width="1429"]]
	616
	617	Select supermarket:Implementation function: Refresh the side page
	618
17.1	619	{{code language="none"}}
	620	var params = widgetContext.stateController.getStateParams();
	621	var selectedSupermarket = params['selectedSupermarket'];
	622	if (selectedSupermarket && selectedSupermarket.entityId.id === entityId.id) {
	623	params['selectedSupermarket'] = null;
	624	} else {
	625	params['selectedSupermarket'] = { entityId: entityId, entityName: entityName, entityLabel: entityLabel };
	626	}
	627	widgetContext.stateController.updateState(null, params);
	628	{{/code}}
	629
18.1	630	[[image:1730710875401-848.png\|\|height="767" width="1429"]]
17.1	631
38.1	632	Supermarket_detail:Implementation function: Jump to the asset details page
17.1	633
	634	{{code language="none"}}
	635	var params = JSON.parse(JSON.stringify(widgetContext.stateController.getStateParams()));
	636	params['selectedSupermarket'] = {
	637	entityId: entityId,
	638	entityName: entityName,
	639	entityLabel: entityLabel,
	640	};
	641	params['targetEntityParamName'] = 'selectedSupermarket';
	642	params['selectedDevice'] = null;
	643
	644	widgetContext.stateController.openState('svgmap', params);
	645	{{/code}}
	646
18.1	647	[[image:1730710990334-601.png\|\|height="772" width="1433"]]
17.1	648
25.1	649	* (((
	650	In this demo, exclusive map icons were set as follows:
	651	)))
17.1	652
	653	{{code language="none"}}
	654	var res = {
	655	url: images[0],
	656	size: 66
	657	};
	658	return res;
	659	{{/code}}
	660
18.1	661	[[image:1730710395303-672.png\|\|height="771" width="1438"]]
17.1	662
53.1	663	===== 4.1.2.3.2 Asset List: =====
17.1	664
20.1	665	Data:
17.1	666
18.1	667	[[image:1730710693066-349.png\|\|height="772" width="1439"]]
17.1	668
38.1	669	Actions:The Assets List interface has an action, which is the same as the Supermarket_details in the Map. You can jump to the second level entity interface to view the details of the selected location based on its location
18.1	670
	671	[[image:1730712335338-750.png\|\|height="751" width="1423"]]
	672
	673	[[image:1730712473941-913.png\|\|height="781" width="1422"]]
	674
54.1	675	===== 4.1.2.3.3 All Alarms: =====
18.1	676
	677	[[image:1730712539209-554.png\|\|height="764" width="1424"]]
	678
15.1	679	== 4.2 Alarm configuration details ==
	680
28.1	681	=== 4.2.1 High temperature ===
	682
	683	Creat:
	684
	685	[[image:1730862483514-101.png\|\|height="750" width="1407"]]
	686
	687	Clear:
	688
	689	[[image:1730862584519-902.png\|\|height="758" width="1404"]]
	690
	691	=== 4.2.2 Low Temperature ===
	692
	693	Creat:
	694
	695	[[image:1730863708259-750.png\|\|height="752" width="1403"]]
	696
	697	Clear:
	698
	699	[[image:1730863750414-979.png\|\|height="746" width="1403"]]
	700
	701	=== 4.2.3 High humidity ===
	702
	703	Creat:
	704
	705	[[image:1730864045747-876.png\|\|height="752" width="1396"]]
	706
	707	Clear:
	708
	709	[[image:1730864077395-395.png\|\|height="735" width="1393"]]
	710
	711	=== 4.2.4 Low humidity ===
	712
	713	Creat：
	714
	715	[[image:1730864117808-484.png\|\|height="741" width="1392"]]
	716
	717	Clear：
	718
	719	[[image:1730864159071-895.png\|\|height="745" width="1392"]]
	720
	721	=== 4.2.5 Low voltage ===
	722
	723	Creat：
	724
	725	[[image:1730864207037-477.png\|\|height="740" width="1388"]]
	726
	727	Clear：
	728
	729	[[image:1730864250506-111.png\|\|height="735" width="1389"]]
	730
	731	=== 4.2.6 Device Disconnected ===
	732
	733	Creat：
	734
	735	[[image:1730864293216-991.png\|\|height="739" width="1387"]]
	736
	737	Clear：
	738
	739	[[image:1730864331859-740.png\|\|height="735" width="1385"]]
	740
15.1	741	== 4.3 Rule chain configuration details ==
	742
28.1	743	[[image:1730864784118-474.png]]
	744
	745	Script：Email configuration for sending device alarm information
	746
	747	[[image:1730864676542-406.png\|\|height="732" width="1384"]]
	748
	749	{{code language="none"}}
	750	function locatime(timenumber){
	751	var date = new Date(timenumber)
	752	return date.toLocaleDateString() + ' ' + date.toLocaleTimeString()
	753	}
	754	var name = msg.name
	755	var devicename = msg.originatorName
	756	var label = msg.originatorLabel
	757	var status = msg.status
	758	var detaildata =JSON.parse(msg.details.data)
	759	var tempswitch
	760
	761	if (name != "Device Disconnected") {
	762	//detaildata=JSON.parse(msg.details.data)
	763	if (detaildata.Temperature_alarm_switch == true) {
	764	tempswitch = "open"
	765	} else {
	766	tempswitch = "close"
	767	}
	768	var humswitch
	769	if (detaildata.Humidity_alarm_switch == true) {
	770	humswitch = "open"
	771	} else {
	772	humswitch = "close"
	773	}
	774	var batswitch
	775	if (detaildata.Voltage_alarm_switch == true) {
	776	batswitch = "open"
	777	} else {
	778	batswitch = "close"
	779	}
	780	var str2 = "<p>-- Temperature alarm switch status: " +
	781	tempswitch + "</p>" +
	782	"<p>-- Humidity alarm switch status: " + humswitch +
	783	"</p>" +
	784	"<p>-- Voltage alarm switch status: " + batswitch
	785	}
	786
	787	if (name == "High Temperature" && status ==
	788	"ACTIVE_UNACK") {
	789	var emailstr =
	790	"<div><p><span style='color: black; font-weight: bold'>" +
	791	"Device " + label + " has alarm:</span></p>" +
	792	"<p><span style='color: red; font-weight: bold'>-- High Temperature Alarm</span></p>" +
	793	"<p>-- Current Temperature : " + detaildata
	794	.TempC_SHT + "</p><br>" +
	795	"<p>Device Configure:</p>" +
	796	"<p>-- Temperature Threshold : min: " + detaildata
	797	.Low_temperature_alarm + ", max: " + detaildata
	798	.High_temperature_alarm + "</p>" +
	799	"<p>-- Humidity Threshold: min: " + detaildata
	800	.Low_humidity_alarm + ", max:" + detaildata
	801	.High_humidity_alarm + "</p>" +
	802	"<p>-- Battery threshold: min: " + detaildata
	803	.Low_voltage_alarm + "</p>" + str2 + "</div>"
	804	return {
	805	msg: {
	806	"data": emailstr
	807	},
	808	metadata: metadata,
	809	msgType: msgType
	810	};
	811	} else if (name == "Low Temperature" && status ==
	812	"ACTIVE_UNACK") {
	813	var emailstr =
	814	"<div><p><span style='color: black; font-weight: bold'>" +
	815	"Device " + label + " has alarm:</span></p>" +
	816	"<p><span style='color: red; font-weight: bold'>-- Low Temperature Alarm</span></p>" +
	817	"<p>-- Current Temperature : " + detaildata
	818	.TempC_SHT + "</p><br>" +
	819	"<p>Device Configure:</p>" +
	820	"<p>-- Temperature Threshold : min: " + detaildata
	821	.Low_temperature_alarm + ", max: " + detaildata
	822	.High_temperature_alarm + "</p>" +
	823	"<p>-- Humidity Threshold: min: " + detaildata
	824	.Low_humidity_alarm + ", max:" + detaildata
	825	.High_humidity_alarm + "</p>" +
	826	"<p>-- Battery threshold: min: " + detaildata
	827	.Low_voltage_alarm + "</p>" + str2 + "</div>"
	828
	829	return {
	830	msg: {
	831	"data": emailstr
	832	},
	833	metadata: metadata,
	834	msgType: msgType
	835	};
	836
	837	} else if (name == "Device Disconnected" && status ==
	838	"ACTIVE_UNACK") {
	839	var time1 = locatime(Number(detaildata.lastActivityTime))
	840	//var time1 = detaildata.lastActivityTime
	841	// var chazhi = parseInt((detaildata.inactivityAlarmTime-detaildata.lastActivityTime)/1000/60)
	842	// var emailstr =
	843	// "<div><p><span style='color: red; font-weight: bold'>" +
	844	// "Device " + label + " has Alarm</span></p><p>Last activity time: "+time1+"</p><p>Last Uplink: 21"+"minutes ago</p></div>"
	845
	846	var emailstr ="Device " + label + " has Alarm##Last activity time: "+time1+"##Last Uplink: 21minutes ago"
	847	var newType = "POST_TELEMETRY_REQUEST"
	848	return {
	849	msg:emailstr,
	850	metadata: metadata,
	851	msgType: newType
	852	}
	853	} else if (name == "High humidity" && status ==
	854	"ACTIVE_UNACK") {
	855	var emailstr =
	856	"<div><p><span style='color: black; font-weight: bold'>" +
	857	"Device " + label + " has alarm:</span></p>" +
	858	"<p><span style='color: red; font-weight: bold'>-- High Humidity Alarm</span></p>" +
	859	"<p>-- Current Temperature : " + detaildata
	860	.Hum_SHT + "</p><br>" +
	861	"<p>Device Configure:</p>" +
	862	"<p>-- Temperature Threshold : min: " + detaildata
	863	.Low_temperature_alarm + ", max: " + detaildata
	864	.High_temperature_alarm + "</p>" +
	865	"<p>-- Humidity Threshold: min: " + detaildata
	866	.Low_humidity_alarm + ", max:" + detaildata
	867	.High_humidity_alarm + "</p>" +
	868	"<p>-- Battery threshold: min: " + detaildata
	869	.Low_voltage_alarm + "</p>" + str2 + "</div>"
	870
	871	return {
	872	msg: {
	873	"data": emailstr
	874	},
	875	metadata: metadata,
	876	msgType: msgType
	877	};
	878	} else if (name == "Low humidity" && status ==
	879	"ACTIVE_UNACK") {
	880	var emailstr =
	881	"<div><p><span style='color: black; font-weight: bold'>" +
	882	"Device " + label + " has alarm:</span></p>" +
	883	"<p><span style='color: red; font-weight: bold'>-- Low Humidity Alarm</span></p>" +
	884	"<p>-- Current Temperature : " + detaildata
	885	.Hum_SHT + "</p><br>" +
	886	"<p>Device Configure:</p>" +
	887	"<p>-- Temperature Threshold : min: " + detaildata
	888	.Low_temperature_alarm + ", max: " + detaildata
	889	.High_temperature_alarm + "</p>" +
	890	"<p>-- Humidity Threshold: min: " + detaildata
	891	.Low_humidity_alarm + ", max:" + detaildata
	892	.High_humidity_alarm + "</p>" +
	893	"<p>-- Battery threshold: min: " + detaildata
	894	.Low_voltage_alarm + "</p>" + str2 + "</div>"
	895
	896	return {
	897	msg: {
	898	"data": emailstr
	899	},
	900	metadata: metadata,
	901	msgType: msgType
	902	};
	903	} else if (name == "Low voltage" && status ==
	904	"ACTIVE_UNACK") {
	905	var emailstr =
	906	"<div><p><span style='color: black; font-weight: bold'>" +
	907	"Device " + label + " has alarm:</span></p>" +
	908	"<p><span style='color: red; font-weight: bold'>-- Low Voltage Alarm</span></p>" +
	909	"<p>-- Current Temperature : " + detaildata.BatV +
	910	"</p><br>" +
	911	"<p>Device Configure:</p>" +
	912	"<p>-- Temperature Threshold : min: " + detaildata
	913	.Low_temperature_alarm + ", max: " + detaildata
	914	.High_temperature_alarm + "</p>" +
	915	"<p>-- Humidity Threshold: min: " + detaildata
	916	.Low_humidity_alarm + ", max:" + detaildata
	917	.High_humidity_alarm + "</p>" +
	918	"<p>-- Battery threshold: min: " + detaildata
	919	.Low_voltage_alarm + "</p>" + str2 + "</div>"
	920
	921	return {
	922	msg: {
	923	"data": emailstr
	924	},
	925	metadata: metadata,
	926	msgType: msgType
	927	};
	928	} else if (name == "High Temperature" && status ==
	929	"CLEARED_UNACK") {
	930	var emailstr =
	931	"<div><p><span style='color: green; font-weight: bold'>Device " +
	932	label +
	933	" High Temperature Alarm Cleared</span></p>" +
	934	"<p>-- Current Temperature : " + detaildata
	935	.TempC_SHT + "</p><br>" +
	936	"<p>Device Configure:</p>" +
	937	"<p>-- Temperature Threshold : min: " + detaildata
	938	.Low_temperature_alarm + ", max: " + detaildata
	939	.High_temperature_alarm + "</p>" +
	940	"<p>-- Humidity Threshold: min: " + detaildata
	941	.Low_humidity_alarm + ", max:" + detaildata
	942	.High_humidity_alarm + "</p>" +
	943	"<p>-- Battery threshold: min: " + detaildata
	944	.Low_voltage_alarm + "</p>" + str2 + "</div>"
	945
	946	return {
	947	msg: {
	948	"data": emailstr
	949	},
	950	metadata: metadata,
	951	msgType: msgType
	952	};
	953	} else if (name == "Low Temperature" && status ==
	954	"CLEARED_UNACK") {
	955	var emailstr =
	956	"<div><p><span style='color: green; font-weight: bold'>Device " +
	957	label +
	958	" Low Temperature Alarm Cleared</span></p>" +
	959	"<p>-- Current Temperature : " + detaildata
	960	.TempC_SHT + "</p><br>" +
	961	"<p>Device Configure:</p>" +
	962	"<p>-- Temperature Threshold : min: " + detaildata
	963	.Low_temperature_alarm + ", max: " + detaildata
	964	.High_temperature_alarm + "</p>" +
	965	"<p>-- Humidity Threshold: min: " + detaildata
	966	.Low_humidity_alarm + ", max:" + detaildata
	967	.High_humidity_alarm + "</p>" +
	968	"<p>-- Battery threshold: min: " + detaildata
	969	.Low_voltage_alarm + "</p>" + str2 + "</div>"
	970
	971	return {
	972	msg: {
	973	"data": emailstr
	974	},
	975	metadata: metadata,
	976	msgType: msgType
	977	};
	978	} else if (name == "High humidity" && status ==
	979	"CLEARED_UNACK") {
	980	var emailstr =
	981	"<div><p><span style='color: green; font-weight: bold'>Device " +
	982	label + " High Humidity Alarm Cleared</span></p>" +
	983	"<p>-- Current Temperature : " + detaildata
	984	.Hum_SHT + "</p><br>" +
	985	"<p>Device Configure:</p>" +
	986	"<p>-- Temperature Threshold : min: " + detaildata
	987	.Low_temperature_alarm + ", max: " + detaildata
	988	.High_temperature_alarm + "</p>" +
	989	"<p>-- Humidity Threshold: min: " + detaildata
	990	.Low_humidity_alarm + ", max:" + detaildata
	991	.High_humidity_alarm + "</p>" +
	992	"<p>-- Battery threshold: min: " + detaildata
	993	.Low_voltage_alarm + "</p>" + str2 + "</div>"
	994
	995	return {
	996	msg: {
	997	"data": emailstr
	998	},
	999	metadata: metadata,
	1000	msgType: msgType
	1001	};
	1002	} else if (name == "Low humidity" && status ==
	1003	"CLEARED_UNACK") {
	1004	var emailstr =
	1005	"<div><p><span style='color: green; font-weight: bold'>Device " +
	1006	label + " Low Humidity Alarm Cleared</span></p>" +
	1007	"<p>-- Current Temperature : " + detaildata
	1008	.Hum_SHT + "</p><br>" +
	1009	"<p>Device Configure:</p>" +
	1010	"<p>-- Temperature Threshold : min: " + detaildata
	1011	.Low_temperature_alarm + ", max: " + detaildata
	1012	.High_temperature_alarm + "</p>" +
	1013	"<p>-- Humidity Threshold: min: " + detaildata
	1014	.Low_humidity_alarm + ", max:" + detaildata
	1015	.High_humidity_alarm + "</p>" +
	1016	"<p>-- Battery threshold: min: " + detaildata
	1017	.Low_voltage_alarm + "</p>" + str2 + "</div>"
	1018	return {
	1019	msg: {
	1020	"data": emailstr
	1021	},
	1022	metadata: metadata,
	1023	msgType: msgType
	1024	};
	1025	} else if (name == "Low voltage" && status ==
	1026	"CLEARED_UNACK") {
	1027
	1028	var emailstr =
	1029	"<div><p><span style='color: green; font-weight: bold'>Device " +
	1030	label + " Low Voltage Alarm Cleared</span></p>" +
	1031	"<p>-- Current Temperature : " + detaildata.BatV +
	1032	"</p><br><br>" +
	1033	"<p>Device Configure:</p>" +
	1034	"<p>-- Temperature Threshold : min: " + detaildata
	1035	.Low_temperature_alarm + ", max: " + detaildata
	1036	.High_temperature_alarm + "</p>" +
	1037	"<p>-- Humidity Threshold: min: " + detaildata
	1038	.Low_humidity_alarm + ", max:" + detaildata
	1039	.High_humidity_alarm + "</p>" +
	1040	"<p>-- Battery threshold: min: " + detaildata
	1041	.Low_voltage_alarm + "</p>" + str2 + "</div>"
	1042
	1043	return {
	1044	msg: {
	1045	"data": emailstr
	1046	},
	1047	metadata: metadata,
	1048	msgType: msgType
	1049	};
	1050	} else if (name == "Device Disconnected" && status ==
	1051	"CLEARED_UNACK") {
	1052	var time1 = locatime(Number(detaildata.lastActivityTime))
	1053	//var time1 = detaildata.lastActivityTime
	1054	// var chazhi = parseInt((detaildata.inactivityAlarmTime-detaildata.lastActivityTime)/1000/60)
	1055	// var emailstr =
	1056	// "<div><p><span style='color: green; font-weight: bold'>" +
	1057	// "Device " + label + " has Alarm Cleared</span></p><p>Last activity time: "+time1+"</p></div>"
	1058	var emailstr ="Device " + label + " has Alarm Cleared##Last activity time: "+time1
	1059	var newType = "POST_TELEMETRY_REQUEST"
	1060	return {
	1061	msg: emailstr,
	1062	metadata: metadata,
	1063	msgType: newType
	1064	}
	1065	}
	1066	{{/code}}
	1067
	1068	(% class="wikigeneratedid" %)
	1069	Generate Report：
	1070
	1071	(% class="wikigeneratedid" %)
	1072	[[image:1730865053380-293.png]]
	1073
	1074	= 5.other =
	1075
	1076	* If you want to create a similar dashboard, after understanding the case, you can download and import the dashboard, device profiles, rule chains, etc. of the case on GitHub, and make modifications based on them.
29.1	1077	* GitHub address：[[https:~~/~~/github.com/ThingsEye-io/te-platform/tree/main/case/Dragino%20Office%20%26%20Factory>>https://github.com/ThingsEye-io/te-platform/tree/main/case/Dragino%20Office%20%26%20Factory]]

Wiki source code of Demo for Smart Office, Factory

Applications

Navigation