[Update] 拆分replay 组件

src/app/app.module.ts

@@ -9,7 +9,7 @@ import {MAT_LABEL_GLOBAL_OPTIONS} from '@angular/material';
 // service
 import {AllServices} from '@app/services';
 
-import {AppRouterModule} from './router/router.module';
+import {AppRouterModule} from './router.module';
 import {Pipes} from './pipes/pipes';
 import {AppComponent} from './pages/app.component';
 import {PagesComponents} from './pages/pages.component';

src/app/elements/asset-tree/asset-tree.component.html

@@ -4,7 +4,6 @@
   </ul>
 
   <ul id="remoteAppsTree" class="ztree">
-    {{ "Loading"|trans }} ...
   </ul>
 </div>
 

src/app/elements/asset-tree/asset-tree.component.ts

@@ -134,7 +134,7 @@ export class ElementAssetTreeComponent implements OnInit, OnDestroy {
     };
     this._http.getMyGrantedRemoteApps().subscribe(
       resp => {
-        if (!resp) {
+        if (resp.length === 1) {
           return;
         }
         const tree = $.fn.zTree.init($('#remoteAppsTree'), setting, resp);

src/app/elements/elements.component.ts

@@ -13,8 +13,10 @@ import {ElementDialogAlertComponent} from './dialog/dialog.service';
 import {ElementGuacamoleComponent} from './guacamole/guacamole.component';
 import {ElementSshTermComponent} from './ssh-term/ssh-term.component';
 import {ElementConnectComponent, AssetTreeDialogComponent, ManualPasswordDialogComponent} from './connect/connect.component';
-import {ElementSftpComponent} from '@app/elements/sftp/sftp.component';
-import {ElementSettingComponent} from '@app/elements/setting/setting.component';
+import {ElementSftpComponent} from './sftp/sftp.component';
+import {ElementSettingComponent} from './setting/setting.component';
+import {ElementReplayGuacamoleComponent} from './replay/guacamole/guacamole.component';
+import {ElementReplayJsonComponent} from './replay/json/json.component';
 
 export const ElementComponents = [
   ElementLeftBarComponent,
@@ -33,6 +35,8 @@ export const ElementComponents = [
   ElementSshTermComponent,
   ElementConnectComponent,
   ElementSftpComponent,
+  ElementReplayGuacamoleComponent,
+  ElementReplayJsonComponent,
   AssetTreeDialogComponent,
   ChangLanWarningDialogComponent,
   ManualPasswordDialogComponent,

src/app/pages/replay/guacamole/guacamole.component.spec.ts → src/app/elements/replay/guacamole/guacamole.component.spec.ts

 import { async, ComponentFixture, TestBed } from '@angular/core/testing';
 
-import { ReplayGuacamoleComponent } from './guacamole.component';
+import { ElementReplayGuacamoleComponent } from './guacamole.component';
 
 describe('ReplayGuacamoleComponent', () => {
-  let component: ReplayGuacamoleComponent;
-  let fixture: ComponentFixture<ReplayGuacamoleComponent>;
+  let component: ElementReplayGuacamoleComponent;
+  let fixture: ComponentFixture<ElementReplayGuacamoleComponent>;
 
   beforeEach(async(() => {
     TestBed.configureTestingModule({
-      declarations: [ ReplayGuacamoleComponent ]
+      declarations: [ ElementReplayGuacamoleComponent ]
     })
     .compileComponents();
   }));
 
   beforeEach(() => {
-    fixture = TestBed.createComponent(ReplayGuacamoleComponent);
+    fixture = TestBed.createComponent(ElementReplayGuacamoleComponent);
     component = fixture.componentInstance;
     fixture.detectChanges();
   });

src/app/pages/replay/guacamole/guacamole.component.ts → src/app/elements/replay/guacamole/guacamole.component.ts

 import { Component, OnInit, Input } from '@angular/core';
 import * as Guacamole from 'guacamole-common-js/dist/guacamole-common';
-import { Replay } from '../replay.model';
+import { Replay } from '@app/model';
 
 function zeroPad(num, minLength) {
   let str = num.toString();
@@ -46,11 +46,11 @@ function formatTime(millis: number) {
 
 
 @Component({
-  selector: 'app-replay-guacamole',
+  selector: 'elements-replay-guacamole',
   templateUrl: './guacamole.component.html',
   styleUrls: ['./guacamole.component.scss']
 })
-export class ReplayGuacamoleComponent implements OnInit {
+export class ElementReplayGuacamoleComponent implements OnInit {
   isPlaying = false;
   recording: any;
   playerRef: any;

src/app/pages/replay/json/json.component.ts → src/app/elements/replay/json/json.component.ts

 import {Component, Input, OnInit} from '@angular/core';
 import {Terminal} from 'xterm';
 import {HttpService, LogService} from '@app/services';
-import {Replay} from '../replay.model';
+import {Replay} from '@app/model';
 
 function zeroPad(num, minLength) {
   let str = num.toString();
@@ -47,11 +47,11 @@ function formatTime(millis: number) {
 
 
 @Component({
-  selector: 'app-replay-json',
+  selector: 'elements-replay-json',
   templateUrl: './json.component.html',
   styleUrls: ['./json.component.css']
 })
-export class JsonComponent implements OnInit {
+export class ElementReplayJsonComponent implements OnInit {
   isPlaying = false;
   recording: any;
   playerRef: any;

src/app/model.ts

@@ -193,3 +193,16 @@ export class Setting {
   isLoadTreeAsync: string = '1';
   isSkipAllManualPassword: string = '0';
 }
+
+
+export class Replay {
+  id: string;
+  src: string;
+  type: string;
+  status: string;
+  timelist: Array<number>;
+  totalTime: number;
+  json: any;
+  height: number;
+  width: number;
+}

src/app/pages/pages.component.ts

@@ -5,20 +5,17 @@ import {PagesMonitorComponent} from './monitor/monitor.component';
 import {PagesReplayComponent} from './replay/replay.component';
 import {PagesNotFoundComponent} from './not-found/not-found.component';
 import {PagesLoginComponent} from './login/login.component';
-import {JsonComponent} from './replay/json/json.component';
 import {PagesMonitorLinuxComponent} from './monitor/linux/linux.component';
 import {PagesMonitorWindowsComponent} from './monitor/windows/windows.component';
-import {ReplayGuacamoleComponent} from './replay/guacamole/guacamole.component';
 
 export const PagesComponents = [
   PageMainComponent,
   PagesBlankComponent,
   PagesConnectComponent,
   PagesMonitorComponent,
-  PagesReplayComponent, JsonComponent,
+  PagesReplayComponent,
   PagesNotFoundComponent,
   PagesLoginComponent,
   PagesMonitorLinuxComponent,
   PagesMonitorWindowsComponent,
-  ReplayGuacamoleComponent
 ];

src/app/pages/replay/replay.component.html

-<app-replay-json [replay]="replay" *ngIf="replay.type=='json'"></app-replay-json>
-<app-replay-guacamole [replay]="replay" *ngIf="replay.type=='guacamole'"></app-replay-guacamole>
+<elements-replay-json [replay]="replay" *ngIf="replay.type=='json'"></elements-replay-json>
+<elements-replay-guacamole [replay]="replay" *ngIf="replay.type=='guacamole'"></elements-replay-guacamole>
+

src/app/pages/replay/replay.component.ts

 import {Component, OnInit} from '@angular/core';
 import {ActivatedRoute} from '@angular/router';
 import {HttpService, LogService} from '@app/services';
-import {Replay} from './replay.model';
+import {Replay} from '@app/model';
 
 @Component({
   selector: 'pages-replay',

src/app/pages/replay/replay.model.ts

-
-export class Replay {
-  id: string;
-  src: string;
-  type: string;
-  status: string;
-  timelist: Array<number>;
-  totalTime: number;
-  json: any;
-  height: number;
-  width: number;
-}

src/app/router/router.module.ts → src/app/router.module.ts

 import {NgModule} from '@angular/core';
 import {RouterModule, Routes} from '@angular/router';
 
-import {PagesBlankComponent} from '../pages/blank/blank.component';
-import {PagesConnectComponent} from '../pages/connect/connect.component';
-import {PagesReplayComponent} from '../pages/replay/replay.component';
-import {PageMainComponent} from '../pages/main/main.component';
-import {PagesMonitorComponent} from '../pages/monitor/monitor.component';
-import {ElementSftpComponent} from '../elements/sftp/sftp.component';
+import {PagesBlankComponent} from './pages/blank/blank.component';
+import {PagesConnectComponent} from './pages/connect/connect.component';
+import {PagesReplayComponent} from './pages/replay/replay.component';
+import {PageMainComponent} from './pages/main/main.component';
+import {PagesMonitorComponent} from './pages/monitor/monitor.component';
+import {ElementSftpComponent} from './elements/sftp/sftp.component';
 
 
 const appRoutes: Routes = [