diff --git a/src/app/app-routing.module.ts b/src/app/app-routing.module.ts
index fad259a..f6284ca 100644
--- a/src/app/app-routing.module.ts
+++ b/src/app/app-routing.module.ts
@@ -6,7 +6,7 @@ import { RouterModule, Routes } from '@angular/router';
 import { SelectivePreloadingStrategy } from './preloading-strategy';
 
 /* 引入路由权限控制 */
-import {LoginAuthService} from './services/login-auth.service'
+import { LoginAuthService } from './services/login-auth.service'
 
 
 /* 定义路由 */
@@ -15,18 +15,19 @@ const appRoutes: Routes = [
     {
         path: 'login',
         loadChildren: './login/login.module#LoginModule',
-        canActivate:[LoginAuthService],
+        canActivate: [LoginAuthService],
+        data: { preload: false, reuse: false }
     },
     {
         path: 'register',
         loadChildren: './register/register.module#RegisterModule',
-        // data: { preload: false }
+        data: { preload: false, reuse: false }
     },
     {
         path: 'app',
         loadChildren: './pages/pages.module#PagesModule',
-        canActivate:[LoginAuthService],
-        data: { preload: false }
+        canActivate: [LoginAuthService],
+        data: { preload: false, reuse: true }
     }
 ]
 
diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index 60b74b6..36ff455 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -1,5 +1,6 @@
 import { BrowserModule } from '@angular/platform-browser';
-import { BrowserAnimationsModule } from '@angular/platform-browser/animations'
+import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
+import { RouteReuseStrategy } from '@angular/router';
 import { NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common'
 import { HttpClientModule } from '@angular/common/http'
@@ -25,6 +26,9 @@ import { LoginAuthService } from './services/login-auth.service';
 /* websocket */
 import { WebsocketService } from './services/websocket.service';
 
+/* 路由缓存策略 */
+import { AppReuseStrategy } from './router-reuse-strategy';
+
 @NgModule({
     declarations: [
         AppComponent
@@ -43,7 +47,8 @@ import { WebsocketService } from './services/websocket.service';
         LoginAuthService,
         HttpService,
         HttpClientService,
-        WebsocketService
+        WebsocketService,
+        { provide: RouteReuseStrategy, useClass: AppReuseStrategy }
     ],
     bootstrap: [AppComponent]
 })
diff --git a/src/app/login/login-routing.module.ts b/src/app/login/login-routing.module.ts
index f3c9374..7710a68 100644
--- a/src/app/login/login-routing.module.ts
+++ b/src/app/login/login-routing.module.ts
@@ -6,7 +6,8 @@ import { LoginComponent } from './login.component'
 const loginRoutes: Routes = [
     {
         path: '',
-        component: LoginComponent
+        component: LoginComponent,
+        data: { preload: false, reuse: false }
     }
 ]
 
diff --git a/src/app/pages/basic-data/basic-data-routing.module.ts b/src/app/pages/basic-data/basic-data-routing.module.ts
index eb8ba7a..2d7bf98 100644
--- a/src/app/pages/basic-data/basic-data-routing.module.ts
+++ b/src/app/pages/basic-data/basic-data-routing.module.ts
@@ -21,57 +21,75 @@ const basicDataRoutes: Routes = [
         path: '',
         component: BasicDataComponent,
         children:[
+            {
+                path:'',
+                redirectTo:'chekingroup',
+                pathMatch:'full'
+            },
             {
                 path:'checkingroup',
-                component:CheckinGroupComponent
+                component:CheckinGroupComponent,
+                data: { preload: true, reuse: false }
             },
             {
                 path:'gate',
-                component:GateComponent
+                component:GateComponent,
+                data: { preload: true, reuse: false }
             },
             {
                 path:'terminal',
                 component:TerminalComponent,
+                data: { preload: true, reuse: false }
             },
             {
                 path:'chut',
-                component:ChutComponent
+                component:ChutComponent,
+                data: { preload: true, reuse: false }
             },
             {
                 path:'stand',
-                component:StandComponent
+                component:StandComponent,
+                data: { preload: true, reuse: false }
             },
             {
                 path:'carousel',
-                component:CarouselComponent
+                component:CarouselComponent,
+                data: { preload: true, reuse: false }
             },
             {
                 path:'checkindesk',
-                component:CheckinDeskComponent
+                component:CheckinDeskComponent,
+                data: { preload: true, reuse: false }
             },
             {
                 path:'airport',
-                component:AirportComponent
+                component:AirportComponent,
+                data: { preload: true, reuse: false }
             },
             {
                 path:'city',
-                component:CityComponent
+                component:CityComponent,
+                data: { preload: true, reuse: false }
             },
             {
                 path:'aircrafttype',
-                component:AircraftTypeComponent
+                component:AircraftTypeComponent,
+                data: { preload: true, reuse: false }
             },
             {
                 path:'aircraft',
-                component:AircraftComponent
+                component:AircraftComponent,
+                data: { preload: true, reuse: false }
             },
             {
                 path:'terminalarea',
-                component:TerminalAreaComponent
+                component:TerminalAreaComponent,
+                data: { preload: true, reuse: false }
             },
             {
                 path:'airline',
-                component:AirlineComponent
+                component:AirlineComponent,
+                data: { preload: true, reuse: false }
             }
         ]
     }
diff --git a/src/app/pages/historical-data/historical-data-routing.module.ts b/src/app/pages/historical-data/historical-data-routing.module.ts
index b62e70b..4014ea0 100644
--- a/src/app/pages/historical-data/historical-data-routing.module.ts
+++ b/src/app/pages/historical-data/historical-data-routing.module.ts
@@ -6,7 +6,8 @@ import { HistoricalDataComponent } from './historical-data.component';
 const historicalDataRoutes: Routes = [
     {
         path: '',
-        component: HistoricalDataComponent
+        component: HistoricalDataComponent,
+        data: { preload: true, reuse: false }
     }
 ]
 
diff --git a/src/app/pages/main/main-routing.module.ts b/src/app/pages/main/main-routing.module.ts
index 952014b..1fa5d67 100644
--- a/src/app/pages/main/main-routing.module.ts
+++ b/src/app/pages/main/main-routing.module.ts
@@ -5,7 +5,8 @@ import { MainComponent } from './main.component'
 const mainRoutes: Routes = [
     {
         path: '',
-        component: MainComponent
+        component: MainComponent,
+        data: { preload: true, reuse: true }
     }
 ]
 
diff --git a/src/app/pages/main/main.component.html b/src/app/pages/main/main.component.html
index 5b9bc66..9540874 100644
--- a/src/app/pages/main/main.component.html
+++ b/src/app/pages/main/main.component.html
@@ -18,10 +18,7 @@
                     <input class="form-control" [(ngModel)]="SEARCH" type="text" (keyup.enter)="inputEnter()">
                 </div>
                 <div class="line-operator-right mb-3 col-xlg-4 col-mlg-4 col-xl-4 col-lg-1">
-                    <!-- <button type="button" class="btn btn-info mr-3">灯光关闭</button>
-                                                        <button type="button" class="btn btn-info mr-3">查看开关灯记录</button> -->
                     <button type="button" class="btn btn-info mr-3" (click)="refresh()">刷新</button>
-                    <!-- <button type="button" class="btn btn-info">航班动态信息</button> -->
                 </div>
             </div>
 
@@ -53,12 +50,6 @@
                         <option value="">VIP</option>
                     </select>
                 </div>
-                <!-- <div class="input-container mr-4">
-                                                        <label for="">航班任务：&nbsp;&nbsp;</label>
-                                                        <select class="form-control" name="" id="">
-                                                            <option value=""></option>
-                                                        </select>
-                                                    </div> -->
                 <div class="input-container mr-4">
                     <label for="">到达/出发：</label>
                     <select [(ngModel)]="filterItems.MVIN" (ngModelChange)="selectChange()" class="form-control">
@@ -151,7 +142,8 @@
                             [ngClass]="{'selected':row_state['renderFlight']['FLNO']===airline_row['renderFlight']['FLNO']}">
                             <td>{{i+1}}</td>
                             <td>{{isLast}}</td>
-                            <td *ngFor="let airline_col of col_lists" [ngClass]="getPosition(airline_col.COL_CODE,airline_row)" [ngStyle]="{'background-color':getColor(airline_col.COL_CODE,airline_row)}">{{airline_row['renderFlight'][airline_col.COL_CODE]}}</td>
+                            <td *ngFor="let airline_col of col_lists" [ngClass]="getPosition(airline_col.COL_CODE,airline_row)"
+                                [ngStyle]="{'background-color':getColor(airline_col.COL_CODE,airline_row)}">{{airline_row['renderFlight'][airline_col.COL_CODE]}}</td>
                         </tr>
                     </tbody>
                 </table>
diff --git a/src/app/pages/main/main.component.scss b/src/app/pages/main/main.component.scss
index 2647a46..3ea2897 100644
--- a/src/app/pages/main/main.component.scss
+++ b/src/app/pages/main/main.component.scss
@@ -1,4 +1,5 @@
 .main-page {
+    position: relative;
     width: 100%;
     height: 100%;
     overflow-y: auto;
@@ -122,6 +123,18 @@
     }
 }
 
+.page-loading{
+    width: 100%;
+    height: 100%;
+    background-image: url('../../../assets/images/page-loading.gif');
+    background-repeat: no-repeat;
+    background-size: 100% 100%;
+    position: absolute;
+    top: 0;
+    left: 0;
+    z-index: 999;
+}
+
 // @media screen and (min-width: 1200px){
 //     .line-operator-right{
 //         text-align: left;
diff --git a/src/app/pages/main/main.component.ts b/src/app/pages/main/main.component.ts
index baa72ba..9911830 100644
--- a/src/app/pages/main/main.component.ts
+++ b/src/app/pages/main/main.component.ts
@@ -46,13 +46,14 @@ export class MainComponent implements OnInit {
 
     constructor(
         private basicDataService: BasicDataService,
-        // private operateSpinServiceService:OperateSpinServiceService,
+        private operateSpinServiceService: OperateSpinServiceService,
         private httpCilent: HttpClientService,
         private changeDetectorRef: ChangeDetectorRef,
         private toastService: ToastService,
         private websocketService: WebsocketService
     ) {
         console.log(new Date().getTime())
+        this.operateSpinServiceService.showSpin();
     }
     public tabClose: boolean = true;
     public isSpinning: boolean = true;
@@ -108,12 +109,13 @@ export class MainComponent implements OnInit {
     }
 
     ngOnInit() {
+        
         this.websocketService.dynamicsMessage().subscribe(
             event => {
                 console.log(event);
             }
         )
-        // this.getBasicData()
+
         this.changeDetectorRef.detach();
         /* 获取显示列 */
         this.httpCilent.get('/assets/mock-data/airline-col_code.json').subscribe(
@@ -397,17 +399,13 @@ export class MainComponent implements OnInit {
         sequenceData.forEach(element => {
             element['ORDER'] = this.sequence(element);
         })
-
         sequenceData.sort(function (a, b) {
             return (a['ORDER'] - b['ORDER']);
         })
-
         this.render_data = sequenceData;
         this.row_state = this.render_data.length > 0 ? this.render_data[0] : { renderFlight: {} };
-        console.log(new Date().getTime() + '---');
         this.changeDetectorRef.detectChanges();
-        console.log(new Date().getTime() + '---');
-
+        this.operateSpinServiceService.hideSpin()
     }
 
     /**
@@ -440,9 +438,7 @@ export class MainComponent implements OnInit {
      */
     refresh() {
         this.render_data.reverse();
-        console.log('=====');
         this.changeDetectorRef.detectChanges();
-        console.log('-----');
     }
 
 
@@ -482,92 +478,94 @@ export class MainComponent implements OnInit {
      * 下拉框选择筛选
      */
     selectChange() {
-        // this.operateSpinServiceService.showSpin()
-        let filter_data = [];
-        let filterItems = this.filterItems;
-        this.combined_data.forEach(item => {
-            filter_data.push(Object.assign({}, item));
-        })
-        //下拉框筛选
-        filter_data = filter_data.filter(item => {
-            if (this.isArriFlight(item)) {
-                let is_satis = true;
-                for (const key in filterItems) {
-                    if (filterItems.hasOwnProperty(key) && filterItems[key]) {
-                        if (item['preFlight'][key] === filterItems[key]) {
-                            is_satis = true;
-                            continue;
-                        } else {
-                            is_satis = false;
-                            break;
+        this.operateSpinServiceService.showSpin();
+        setTimeout(() => {
+            let filter_data = [];
+            let filterItems = this.filterItems;
+            this.combined_data.forEach(item => {
+                filter_data.push(Object.assign({}, item));
+            })
+            //下拉框筛选
+            filter_data = filter_data.filter(item => {
+                if (this.isArriFlight(item)) {
+                    let is_satis = true;
+                    for (const key in filterItems) {
+                        if (filterItems.hasOwnProperty(key) && filterItems[key]) {
+                            if (item['preFlight'][key] === filterItems[key]) {
+                                is_satis = true;
+                                continue;
+                            } else {
+                                is_satis = false;
+                                break;
+                            }
+
                         }
-
                     }
-                }
-                return is_satis;
-            } else if (this.isDeptFlight(item)) {
-                let is_satis = true;
-                for (const key in filterItems) {
-                    if (filterItems.hasOwnProperty(key) && filterItems[key]) {
-                        if (item['reaFlight'][key] === filterItems[key]) {
-                            is_satis = true;
-                            continue;
-                        } else {
-                            is_satis = false;
-                            break;
+                    return is_satis;
+                } else if (this.isDeptFlight(item)) {
+                    let is_satis = true;
+                    for (const key in filterItems) {
+                        if (filterItems.hasOwnProperty(key) && filterItems[key]) {
+                            if (item['reaFlight'][key] === filterItems[key]) {
+                                is_satis = true;
+                                continue;
+                            } else {
+                                is_satis = false;
+                                break;
+                            }
+
                         }
-
                     }
-                }
-                return is_satis;
-            } else {
-                let pre_satis = true;
-                let rea_satis = true;
-                for (const key in filterItems) {
-                    if (filterItems.hasOwnProperty(key) && filterItems[key]) {
-                        if (item['preFlight'][key] === filterItems[key]) {
-                            pre_satis = true;
-                            continue;
-                        } else {
-                            pre_satis = false;
-                            break;
-                        }
-
-                    }
-                }
-                for (const key in filterItems) {
-                    if (filterItems.hasOwnProperty(key) && filterItems[key]) {
-                        if (item['reaFlight'][key] === filterItems[key]) {
-                            rea_satis = true;
-                            continue;
-                        } else {
-                            rea_satis = false;
-                            break;
-                        }
-
-                    }
-                }
-
-                if (pre_satis && !rea_satis) {
-                    item['renderFlight'] = item['renderPreFlight'];
-                    return pre_satis;
-                } else if (!pre_satis && rea_satis) {
-                    item['renderFlight'] = item['renderReaFlight'];
-                    return rea_satis;
-                } else if (pre_satis && rea_satis) {
-                    return pre_satis && rea_satis;
+                    return is_satis;
                 } else {
-                    return false;
+                    let pre_satis = true;
+                    let rea_satis = true;
+                    for (const key in filterItems) {
+                        if (filterItems.hasOwnProperty(key) && filterItems[key]) {
+                            if (item['preFlight'][key] === filterItems[key]) {
+                                pre_satis = true;
+                                continue;
+                            } else {
+                                pre_satis = false;
+                                break;
+                            }
+
+                        }
+                    }
+                    for (const key in filterItems) {
+                        if (filterItems.hasOwnProperty(key) && filterItems[key]) {
+                            if (item['reaFlight'][key] === filterItems[key]) {
+                                rea_satis = true;
+                                continue;
+                            } else {
+                                rea_satis = false;
+                                break;
+                            }
+
+                        }
+                    }
+
+                    if (pre_satis && !rea_satis) {
+                        item['renderFlight'] = item['renderPreFlight'];
+                        return pre_satis;
+                    } else if (!pre_satis && rea_satis) {
+                        item['renderFlight'] = item['renderReaFlight'];
+                        return rea_satis;
+                    } else if (pre_satis && rea_satis) {
+                        return pre_satis && rea_satis;
+                    } else {
+                        return false;
+                    }
                 }
+            })
+            if (this.FLT_POS === 1) {
+                this.inputFilter(filter_data);
+            } else {
+                this.render_data = filter_data;
+                this.row_state = this.render_data.length > 0 ? this.render_data[0] : { renderFlight: {} };
+                this.changeDetectorRef.detectChanges();
             }
-        })
-        if (this.FLT_POS === 1) {
-            this.inputFilter(filter_data);
-        } else {
-            this.render_data = filter_data;
-            this.row_state = this.render_data.length > 0 ? this.render_data[0] : { renderFlight: {} };
-            this.changeDetectorRef.detectChanges();
-        }
+        }, 10)
     }
 
     /**
@@ -625,6 +623,7 @@ export class MainComponent implements OnInit {
         this.render_data = filterData;
         this.row_state = this.render_data.length > 0 ? this.render_data[0] : { renderFlight: {} };
         this.changeDetectorRef.detectChanges();
+        this.operateSpinServiceService.hideSpin()
     }
 
     /**
diff --git a/src/app/pages/operate-spin-service.service.ts b/src/app/pages/operate-spin-service.service.ts
index 38e17ff..239f383 100644
--- a/src/app/pages/operate-spin-service.service.ts
+++ b/src/app/pages/operate-spin-service.service.ts
@@ -16,6 +16,8 @@ export class OperateSpinServiceService {
 
     public hideSpin() {
         this.isSpinning = false;
-        this.spinSubject.next(this.isSpinning);
+        setTimeout(() => {
+            this.spinSubject.next(this.isSpinning);
+        }, 500)
     }
 }
diff --git a/src/app/pages/pages-routing.module.ts b/src/app/pages/pages-routing.module.ts
index 6dd2ecc..58cfe3f 100644
--- a/src/app/pages/pages-routing.module.ts
+++ b/src/app/pages/pages-routing.module.ts
@@ -15,23 +15,28 @@ const pagesRoutes: Routes = [
             },
             {
                 path:'main',
-                loadChildren:'./main/main.module#MainModule'
+                loadChildren:'./main/main.module#MainModule',
+                data: { preload: true, reuse: true }
             },
             {
                 path:'season',
-                loadChildren:'./seasonal-plan/seasonal-plan.module#SeasonalPlanModule'
+                loadChildren:'./seasonal-plan/seasonal-plan.module#SeasonalPlanModule',
+                data: { preload: true, reuse: false }
             },
             {
                 path:'history',
-                loadChildren:'./historical-data/historical-data.module#HistoricalDataModule'
+                loadChildren:'./historical-data/historical-data.module#HistoricalDataModule',
+                data: { preload: true, reuse: false }
             },
             {
                 path:'basic',
-                loadChildren:'./basic-data/basic-data.module#BasicDataModule'
+                loadChildren:'./basic-data/basic-data.module#BasicDataModule',
+                data: { preload: true, reuse: false }
             },
             {
                 path:'system',
-                loadChildren:'./system-management/system-management.module#SystemManagementModule'
+                loadChildren:'./system-management/system-management.module#SystemManagementModule',
+                data: { preload: true, reuse: false }
             }
         ]
     }
diff --git a/src/app/pages/pages.component.html b/src/app/pages/pages.component.html
index 2ab9d34..d8c1c2a 100644
--- a/src/app/pages/pages.component.html
+++ b/src/app/pages/pages.component.html
@@ -83,10 +83,8 @@
             </div>
         </div>
         <div class="right-wrapper" [ngClass]="{'right-wrapper-c': menuClose,'right-wrapper-o': !menuClose}">
-            <!-- <nz-spin [nzSpinning]="isSpinning" [nzDelay]="500"> -->
-                <router-outlet></router-outlet>
-            <!-- </nz-spin> -->
-
+            <router-outlet></router-outlet>
+            <div *ngIf="isSpinning" class="page-loading"></div>
         </div>
     </div>
 </div>
\ No newline at end of file
diff --git a/src/app/pages/pages.component.scss b/src/app/pages/pages.component.scss
index 9a92bbc..095070a 100644
--- a/src/app/pages/pages.component.scss
+++ b/src/app/pages/pages.component.scss
@@ -110,6 +110,7 @@
             }
         }
         .right-wrapper {
+            position: relative;
             height: calc(100% - 66px);
             margin-left: 235px;
         }
@@ -128,3 +129,16 @@
         }
     }
 }
+
+.page-loading{
+    width: 100%;
+    height: 100%;
+    // background-image: url('../../assets/images/page-loading.gif');
+    background-color: rgba(0, 0, 0, 0.5);
+    background-repeat: no-repeat;
+    background-size: 100% 100%;
+    position: absolute;
+    top: 0;
+    left: 0;
+    z-index: 999;
+}
\ No newline at end of file
diff --git a/src/app/pages/pages.component.ts b/src/app/pages/pages.component.ts
index 68fcd56..5cbe838 100644
--- a/src/app/pages/pages.component.ts
+++ b/src/app/pages/pages.component.ts
@@ -18,7 +18,7 @@ import { filter } from 'rxjs/operators';
 })
 export class PagesComponent implements OnInit {
     public menuClose: boolean = false;
-    public isSpinning: any = false;
+    public isSpinning: any = true;
     menuData = [
         {
             "name": "航班动态",
@@ -192,7 +192,7 @@ export class PagesComponent implements OnInit {
     constructor(
         private router: Router,
         private basicDataService: BasicDataService,
-        // private operateSpinService: OperateSpinServiceService,
+        private operateSpinService: OperateSpinServiceService,
         private httpClient: HttpClientService,
         private toastService: ToastService,
     ) {
@@ -209,9 +209,9 @@ export class PagesComponent implements OnInit {
             this.selectActiveMenu(this.menuData, event['urlAfterRedirects'])
         });
 
-        // this.operateSpinService.spinSubject.subscribe(
-        //     val => this.isSpinning = val
-        // )
+        this.operateSpinService.spinSubject.subscribe(
+            val => this.isSpinning = val
+        )
 
     }
 
diff --git a/src/app/pages/pages.module.ts b/src/app/pages/pages.module.ts
index 3e96edd..b5faecc 100644
--- a/src/app/pages/pages.module.ts
+++ b/src/app/pages/pages.module.ts
@@ -20,6 +20,6 @@ import { OperateSpinServiceService } from './operate-spin-service.service';
         PagesRoutingModule,
     ],
     declarations: [PagesComponent],
-    providers: [BasicDataService]
+    providers: [BasicDataService, OperateSpinServiceService]
 })
 export class PagesModule { }
diff --git a/src/app/pages/seasonal-plan/seasonal-plan-routing.module.ts b/src/app/pages/seasonal-plan/seasonal-plan-routing.module.ts
index 060585e..f415337 100644
--- a/src/app/pages/seasonal-plan/seasonal-plan-routing.module.ts
+++ b/src/app/pages/seasonal-plan/seasonal-plan-routing.module.ts
@@ -6,7 +6,8 @@ import { SeasonalPlanComponent } from './seasonal-plan.component';
 const seasonalPlanRoutes: Routes = [
     {
         path: '',
-        component: SeasonalPlanComponent
+        component: SeasonalPlanComponent,
+        data: { preload: true, reuse: false }
     }
 ]
 
diff --git a/src/app/pages/system-management/system-management-routing.module.ts b/src/app/pages/system-management/system-management-routing.module.ts
index f52016b..a0002b7 100644
--- a/src/app/pages/system-management/system-management-routing.module.ts
+++ b/src/app/pages/system-management/system-management-routing.module.ts
@@ -22,31 +22,38 @@ const systemManagementRoutes: Routes = [
             },
             {
                 path: 'settings',
-                component: PersonalSettingsComponent
+                component: PersonalSettingsComponent,
+                data: { preload: true, reuse: false }
             },
             {
                 path: 'roles',
-                component: RoleManagementComponent
+                component: RoleManagementComponent,
+                data: { preload: true, reuse: false }
             },
             {
                 path: 'users',
                 component: UserManagementComponent,
+                data: { preload: true, reuse: false }
             },
             {
                 path: 'departments',
-                component: DepartmentManagementComponent
+                component: DepartmentManagementComponent,
+                data: { preload: true, reuse: false }
             },
             {
                 path: 'logs',
-                component: OperationLogsComponent
+                component: OperationLogsComponent,
+                data: { preload: true, reuse: false }
             },
             {
                 path: 'synchronization',
-                component: DataSynchronizeComponent
+                component: DataSynchronizeComponent,
+                data: { preload: true, reuse: false }
             },
             {
                 path: 'users/modify',
-                component: UserManagementModifyComponent
+                component: UserManagementModifyComponent,
+                data: { preload: true, reuse: false }
             }
         ]
     }
diff --git a/src/app/register/register-routing.module.ts b/src/app/register/register-routing.module.ts
index af8b654..d8d289e 100644
--- a/src/app/register/register-routing.module.ts
+++ b/src/app/register/register-routing.module.ts
@@ -6,7 +6,8 @@ import { RegisterComponent } from './register.component'
 const registerRoutes: Routes = [
     {
         path: '',
-        component: RegisterComponent
+        component: RegisterComponent,
+        data: { preload: false, reuse: false }
     }
 ]
 
diff --git a/src/app/router-reuse-strategy.ts b/src/app/router-reuse-strategy.ts
new file mode 100644
index 0000000..32c6b55
--- /dev/null
+++ b/src/app/router-reuse-strategy.ts
@@ -0,0 +1,85 @@
+import { ActivatedRouteSnapshot, DetachedRouteHandle, RouteReuseStrategy } from '@angular/router';
+import { Injectable } from '@angular/core';
+
+interface IRouteConfigData {
+    reuse: boolean;
+}
+
+interface ICachedRoute {
+    handle: DetachedRouteHandle;
+    data: IRouteConfigData;
+}
+@Injectable()
+export class AppReuseStrategy implements RouteReuseStrategy {
+    private routeCache = new Map<string, ICachedRoute>();
+
+    shouldReuseRoute(future: ActivatedRouteSnapshot, curr: ActivatedRouteSnapshot): boolean {
+        return future.routeConfig === curr.routeConfig;
+    }
+
+    shouldDetach(route: ActivatedRouteSnapshot): boolean {
+        const data = this.getRouteData(route);
+        return data && data.reuse;
+    }
+
+    store(route: ActivatedRouteSnapshot, handle: DetachedRouteHandle): void {
+        const url = this.getFullRouteUrl(route);
+        const data = this.getRouteData(route);
+        this.routeCache.set(url, { handle, data });
+        this.addRedirectsRecursively(route);
+    }
+
+    shouldAttach(route: ActivatedRouteSnapshot): boolean {
+        const url = this.getFullRouteUrl(route);
+        return this.routeCache.has(url);
+    }
+
+    retrieve(route: ActivatedRouteSnapshot): DetachedRouteHandle {
+        console.log(route)
+        const url = this.getFullRouteUrl(route);
+        const data = this.getRouteData(route);
+        console.log(this.routeCache.get(url));
+        return data && data.reuse && this.routeCache.has(url)
+            ? this.routeCache.get(url).handle
+            : null;
+    }
+
+    private addRedirectsRecursively(route: ActivatedRouteSnapshot): void {
+        const config = route.routeConfig;
+        if (config) {
+            if (!config.loadChildren) {
+                const routeFirstChild = route.firstChild;
+                const routeFirstChildUrl = routeFirstChild
+                    ? this.getRouteUrlPaths(routeFirstChild).join('/')
+                    : '';
+                const childConfigs = config.children;
+                if (childConfigs) {
+                    const childConfigWithRedirect = childConfigs.find(c => c.path === '' && !!c.redirectTo);
+                    if (childConfigWithRedirect) {
+                        childConfigWithRedirect.redirectTo = routeFirstChildUrl;
+                    }
+                }
+            }
+            route.children.forEach(childRoute => this.addRedirectsRecursively(childRoute));
+        }
+    }
+
+    private getFullRouteUrl(route: ActivatedRouteSnapshot): string {
+        return this.getFullRouteUrlPaths(route).filter(Boolean).join('/');
+    }
+
+    private getFullRouteUrlPaths(route: ActivatedRouteSnapshot): string[] {
+        const paths = this.getRouteUrlPaths(route);
+        return route.parent
+            ? [...this.getFullRouteUrlPaths(route.parent), ...paths]
+            : paths;
+    }
+
+    private getRouteUrlPaths(route: ActivatedRouteSnapshot): string[] {
+        return route.url.map(urlSegment => urlSegment.path);
+    }
+
+    private getRouteData(route: ActivatedRouteSnapshot): IRouteConfigData {
+        return route.routeConfig && route.routeConfig.data as IRouteConfigData;
+    }
+}
\ No newline at end of file
diff --git a/src/app/services/websocket.service.ts b/src/app/services/websocket.service.ts
index 3a9dcae..a9123b7 100644
--- a/src/app/services/websocket.service.ts
+++ b/src/app/services/websocket.service.ts
@@ -28,6 +28,7 @@ export class WebsocketService {
                 ob.error("连接失败")
             }
             this.websocket.onclose = () => {
+                console.log('websocket was complete')
                 ob.complete();
             }
         })
diff --git a/src/assets/images/page-loading.gif b/src/assets/images/page-loading.gif
new file mode 100644
index 0000000..4e6ad96
Binary files /dev/null and b/src/assets/images/page-loading.gif differ