feat: import device with template,quickly migrate device

frangoteam · Oct 29, 2024 · 87ad85a · 87ad85a
1 parent ee592d1
commit 87ad85a
Show file tree

Hide file tree

Showing 4 changed files with 61 additions and 12 deletions.
diff --git a/client/src/app/device/device.component.html b/client/src/app/device/device.component.html
@@ -11,6 +11,7 @@
     <mat-icon>more_vert</mat-icon>
 </button>
 <input type="file" #fileImportInput style="display: none" id="devicesConfigFileUpload" (change)="onFileChangeListener($event)" accept=".json,.csv" />
+<input type="file" #tplFileImportInput style="display: none" id="devicesConfigTplUpload" (change)="onDevTplChangeListener($event)" accept=".json,.csv" />
 <mat-menu #optionsgMenu [overlapTrigger]="false">
     <button mat-menu-item [matMenuTriggerFor]="export" style="font-size: 14px;">{{'devices.export' | translate}}</button>
     <mat-menu #export="matMenu" xPosition="before">
@@ -19,6 +20,7 @@
       </mat-menu>
     <mat-divider class="menu-separator"></mat-divider>
     <button mat-menu-item (click)="onImport()" style="font-size: 14px;">{{'devices.import' | translate}}</button>
+    <button mat-menu-item (click)="onImportTpl()" style="font-size: 14px;">{{'devices.import-template' | translate}}</button>
 </mat-menu>
 <button mat-icon-button (click)="onReload()" class="fab-reload" [ngClass]="{'fab-reload-active': reloadActive}">
     <mat-icon>autorenew</mat-icon>
@@ -29,4 +31,4 @@
 </button>
 <button *ngIf="!readonly" mat-fab color="primary" (click)="addItem()" class="fab-add">
     <mat-icon class="">add</mat-icon>
-</button>
+</button>
diff --git a/client/src/app/device/device.component.ts b/client/src/app/device/device.component.ts
@@ -1,15 +1,15 @@
 /* eslint-disable @angular-eslint/component-class-suffix */
-import { Component, OnInit, OnDestroy, ViewChild } from '@angular/core';
-import { Subscription } from 'rxjs';
-import { Router } from '@angular/router';
-
-import { DeviceListComponent } from './device-list/device-list.component';
-import { DeviceMapComponent } from './device-map/device-map.component';
-import { Device, DeviceViewModeType, DevicesUtils } from './../_models/device';
-import { ProjectService } from '../_services/project.service';
-import { HmiService } from '../_services/hmi.service';
-import { DEVICE_READONLY } from '../_models/hmi';
-import { Utils } from '../_helpers/utils';
+import {Component, OnDestroy, OnInit, ViewChild} from '@angular/core';
+import {Subscription} from 'rxjs';
+import {Router} from '@angular/router';
+
+import {DeviceListComponent} from './device-list/device-list.component';
+import {DeviceMapComponent} from './device-map/device-map.component';
+import {Device, DEVICE_PREFIX, DevicesUtils, DeviceType, DeviceViewModeType, TAG_PREFIX} from './../_models/device';
+import {ProjectService} from '../_services/project.service';
+import {HmiService} from '../_services/hmi.service';
+import {DEVICE_READONLY} from '../_models/hmi';
+import {Utils} from '../_helpers/utils';
 
 @Component({
     selector: 'app-device',
@@ -21,6 +21,7 @@ export class DeviceComponent implements OnInit, OnDestroy {
     @ViewChild('devicelist', {static: false}) deviceList: DeviceListComponent;
     @ViewChild('devicemap', {static: false}) deviceMap: DeviceMapComponent;
     @ViewChild('fileImportInput', {static: false}) fileImportInput: any;
+    @ViewChild('tplFileImportInput',{static: false}) tplFileImportInput: any;
 
     private subscriptionLoad: Subscription;
     private subscriptionDeviceChange: Subscription;
@@ -146,6 +147,11 @@ export class DeviceComponent implements OnInit, OnDestroy {
         ele.click();
     }
 
+    onImportTpl() {
+        let ele = document.getElementById('devicesConfigTplUpload') as HTMLElement;
+        ele.click();
+    }
+
     /**
      * open Project event file loaded
      * @param event file resource
@@ -174,4 +180,43 @@ export class DeviceComponent implements OnInit, OnDestroy {
         reader.readAsText(input.files[0]);
         this.fileImportInput.nativeElement.value = null;
     }
+
+    onDevTplChangeListener(event){
+        let input = event.target;
+        let reader = new FileReader();
+        reader.onload = (data) => {
+            let devices;
+            if (Utils.isJson(reader.result)) {
+                // JSON
+                devices = JSON.parse(reader.result.toString());
+            } else {
+                // CSV
+                devices = DevicesUtils.csvToDevices(reader.result.toString());
+            }
+            //generate new id and filte fuxa
+            let importDev = [];
+            devices.forEach((device: Device) => {
+                if (device.type != DeviceType.FuxaServer) {
+                    device.id = Utils.getGUID(DEVICE_PREFIX);
+                    device.name = Utils.getShortGUID(device.name + '_', '');
+                    if (device.tags) {
+                        Object.keys(device.tags).forEach((key) => {
+                            device.tags[key].id = Utils.getGUID(TAG_PREFIX);
+                        });
+                    }
+                    importDev.push(device);
+                }
+            });
+            this.projectService.importDevices(importDev);
+            setTimeout(() => { this.projectService.onRefreshProject(); }, 2000);
+        };
+
+        reader.onerror = function() {
+            let msg = 'Unable to read ' + input.files[0];
+            // this.translateService.get('msg.project-load-error', {value: input.files[0]}).subscribe((txt: string) => { msg = txt });
+            alert(msg);
+        };
+        reader.readAsText(input.files[0]);
+        this.tplFileImportInput.nativeElement.value = null;
+    }
 }
diff --git a/client/src/assets/i18n/en.json b/client/src/assets/i18n/en.json
@@ -809,6 +809,7 @@
     "devices.export-json": "JSON",
     "devices.export-csv": "CSV",
     "devices.import": "Import devices",
+    "devices.import-template": "Import devices with template",
     "device.property-client": "Device Property",
     "device.property-server": "FUXA Server Property",
     "device.property-name": "Name",

diff --git a/client/src/assets/i18n/zh-cn.json b/client/src/assets/i18n/zh-cn.json
@@ -692,6 +692,7 @@
     "devices.export-json": "JSON",
     "devices.export-csv": "CSV",
     "devices.import": "导入设备",
+    "devices.import-template": "导入设备模板",
     "device.property-client": "设备属性",
     "device.property-server": "FUXA服务器属性",
     "device.property-name": "名称",