ing

@overflow/model/meta/MetaHostType.ts

@@ -0,0 +1,23 @@
+export interface MetaHostType {
+  id?: number;
+  key?: string;
+  name?: string;
+  createDate?: Date;
+}
+
+export enum MetaHostTypeEnum {
+  Host = 'HOST',
+  NAS = 'NAS',
+  Printer = 'PRINTER',
+  Router = 'ROUTER',
+}
+
+export const toMetaHostTypeEnum = (v: MetaHostType): MetaHostTypeEnum => {
+  return MetaHostTypeEnum[v.key];
+};
+
+export const toMetaHostType = (v: MetaHostTypeEnum): MetaHostType => {
+  return {
+    key: v,
+  };
+};

@overflow/model/meta/MetaServiceType.ts

@@ -0,0 +1,29 @@
+export interface MetaServiceType {
+  id?: number;
+  key?: string;
+  name?: string;
+  createDate?: Date;
+}
+
+export enum MetaServiceTypeEnum {
+  UNKNOWN = 'UNKNOWN',
+  Network = 'NETWORK',
+  Monitoring = 'MONITORING',
+  Directory = 'DIRECTORY',
+  Database = 'DATABASE',
+  NoSQL = 'NOSQL',
+  Mail = 'MAIL',
+  Search = 'SEARCH',
+  Web = 'WEB',
+  WAS = 'WAS',
+}
+
+export const toMetaServiceTypeEnum = (v: MetaServiceType): MetaServiceTypeEnum => {
+  return MetaServiceTypeEnum[v.key];
+};
+
+export const toMetaServiceType = (v: MetaServiceTypeEnum): MetaServiceType => {
+  return {
+    key: v,
+  };
+};

src/app/pages/home/home-page.component.html

@@ -32,14 +32,14 @@
           </g>
           <g *ngIf="node.group === 'host'">
             <image [attr.x]="-node.r" [attr.y]="-node.r" [attr.width]="node.r * 2" [attr.height]="node.r * 2"
-              attr.xlink:href="../../assets/image/icon/icon_{{node.target.deviceType | lowercase}}.svg"></image>
+              attr.xlink:href="../../assets/image/icon/icon_{{node.target.hostType | lowercase}}.svg"></image>
           </g>
-          <g *ngIf="node.group === 'host' && node.target.deviceType === 'HOST'">
+          <g *ngIf="node.group === 'host' && node.target.hostType === 'HOST'">
             <image [attr.x]="-node.r" [attr.y]="-node.r" [attr.width]="node.r * 2" [attr.height]="node.r * 2"
               attr.xlink:href="../../assets/image/logo/logo_{{node.target.osType | lowercase}}.svg"></image>
           </g>
-          <g *ngIf="node.group === 'host' && node.target.deviceType !== 'HOST' && node.target.deviceVendor !== ''">
+          <g *ngIf="node.group === 'host' && node.target.hostType !== 'HOST' && node.target.hostVendor !== ''">
-            <text class="textClass" [attr.y]="(node.r - 30) / 10 + 'em'" text-anchor="middle">{{node.target.deviceVendor}}</text>
+            <text class="textClass" [attr.y]="(node.r - 30) / 10 + 'em'" text-anchor="middle">{{node.target.hostVendor}}</text>
           </g>
           <g *ngIf="node.group === 'service'">
             <image [attr.x]="-node.r" [attr.y]="-node.r" [attr.width]="node.r * 2" [attr.height]="node.r * 2"

src/app/pages/home/home-page.component.ts

@@ -124,7 +124,7 @@ export class HomePageComponent implements OnInit, OnDestroy {
 
     this.nodes.push(
       { id: '192.168.1.0/24', group: 'zone', target: this.zone, fx: width / 2, fy: height / 2, r: 60 },
-      // { id: '192.168.1.1', group: 'host', target: { address: '192.168.1.1', zone: this.zone, deviceType: 'NAS' }, r: 40 },
+      // { id: '192.168.1.1', group: 'host', target: { address: '192.168.1.1', zone: this.zone, hostType: 'NAS' }, r: 40 },
       // { id: '192.168.1.1' },
       // { id: '192.168.1.2' },
     );