fix:update

src/app/app-routing.module.ts

@@ -2,13 +2,33 @@ import { NgModule } from '@angular/core';
 import { RouterModule, Routes } from '@angular/router';
 import { HomeComponent } from './page/home/home.component';
 import { LoginComponent } from './page/login/login.component';
+import { AdminSystemComponent } from './page/admin/admin-system/admin-system.component';
+import { UserManageComponent } from './page/admin/user-manage/user-manage.component';
 
 const routes:Routes = [
   { path: 'login', component: LoginComponent },
   {
     path: 'home',
-    component: HomeComponent
+    component: HomeComponent,
+    children: [
+      {
+        path: 'admin',
+        component: AdminSystemComponent,
+        children: [
+          {
+            path: '',
+            redirectTo: '/home/admin/users',
+            pathMatch: 'full',
+          },
+          {
+            path: 'users',
+            component: UserManageComponent,
+          },
+        ],
+      },
+    ]
   }
+
 ];
 
 @NgModule({

src/app/app.module.ts

@@ -21,13 +21,21 @@ import { AppRoutingModule } from './app-routing.module';
 import { AppComponent } from './app.component';
 import { LoginComponent } from './page/login/login.component';
 import { HomeComponent } from './page/home/home.component';
+import { ToolbarComponent } from './page/common/toolbar/toolbar.component';
+import { NavigationComponent } from './page/common/navigation/navigation.component';
+import { AdminSystemComponent } from './page/admin/admin-system/admin-system.component';
+import { UserManageComponent } from './page/admin/user-manage/user-manage.component';
 
 
 @NgModule({
   declarations: [
     AppComponent,
     LoginComponent,
-    HomeComponent],
+    HomeComponent,
+    ToolbarComponent,
+    NavigationComponent,
+    AdminSystemComponent,
+    UserManageComponent],
   imports: [
     BrowserModule,
     HttpClientModule,

src/app/page/admin/admin-system/admin-system.component.html

+<div class="admin-wrap">
+    <div class="content">
+      <router-outlet></router-outlet>
+    </div>
+  </div>
+  
\ No newline at end of file

src/app/page/admin/admin-system/admin-system.component.ts

+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-admin-system',
+  templateUrl: './admin-system.component.html',
+  styleUrls: ['./admin-system.component.scss']
+})
+export class AdminSystemComponent implements OnInit {
+  constructor() { }
+
+  ngOnInit():void {
+  }
+}

src/app/page/admin/user-manage/user-manage.component.html

+<p>user-manage works!</p>

src/app/page/admin/user-manage/user-manage.component.ts

+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-user-manage',
+  templateUrl: './user-manage.component.html',
+  styleUrls: ['./user-manage.component.scss']
+})
+export class UserManageComponent implements OnInit {
+
+  constructor() { }
+
+  ngOnInit(): void {
+  }
+
+}

src/app/page/common/navigation/navigation.component.html

+<p>navigation works!</p>

src/app/page/common/navigation/navigation.component.ts

+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-navigation',
+  templateUrl: './navigation.component.html',
+  styleUrls: ['./navigation.component.scss']
+})
+export class NavigationComponent implements OnInit {
+
+  constructor() { }
+
+  ngOnInit(): void {
+  }
+
+}

src/app/page/common/toolbar/toolbar.component.html

+<p>toolbar works!</p>

src/app/page/common/toolbar/toolbar.component.ts

+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-toolbar',
+  templateUrl: './toolbar.component.html',
+  styleUrls: ['./toolbar.component.scss']
+})
+export class ToolbarComponent implements OnInit {
+
+  constructor() { }
+
+  ngOnInit(): void {
+  }
+
+}

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

@@ -78,7 +78,9 @@
         <nz-breadcrumb-item>List</nz-breadcrumb-item>
         <nz-breadcrumb-item>App</nz-breadcrumb-item>
       </nz-breadcrumb> -->
-      <div class="inner-content">Content</div>
+      <div class="inner-content">
+        <router-outlet></router-outlet>
+      </div>
     </nz-content>
     <!-- <nz-footer>Ant Design ©2020 Implement By Angular</nz-footer> -->
   </nz-layout>

src/app/page/home/home.component.scss

@@ -45,8 +45,8 @@
 }
 
 ::ng-deep .ant-badge-dot {
-    top: .7rem;
-    right: .6rem;
+    top: 0.7rem;
+    right: 0.6rem;
     width: 1.3rem;
     height: 1.3rem;
 }
\ No newline at end of file

src/styles.scss

@@ -17,7 +17,7 @@ body {
     height: 100%;
     width: 100%;
     font-family: Helvetica, Tahoma, Arial, STXihei, "华文细黑", "Microsoft YaHei", "微软雅黑", SimSun, "宋体", Heiti, "黑体", sans-serif;
-    min-width: 1024px;
+    min-width: 102.4rem;
     overflow-y: hidden;
 }
 
@@ -29,10 +29,10 @@ body {
         position: absolute;
         top: 0;
         left: 0;
-        width: 60px;
-        height: 50px;
+        width: 6rem;
+        height: 5rem;
         display: block;
-        background-size: 28px 28px;
+        background-size: 2.8rem 2.8rem;
         background-repeat: no-repeat;
         background-position: center;
         z-index: 1;
@@ -44,30 +44,30 @@ body {
         background-image: url(assets/icons/proj-switch.svg);
     }
     .ant-select-selector {
-        height: 50px !important;
-        padding-left: 60px !important;
-        border-radius: 10px !important;
+        height: 5rem !important;
+        padding-left: 6rem !important;
+        border-radius: 1rem !important;
         border: 0 !important;
-        box-shadow: 0 4px 10px 0 #70707080;
+        box-shadow: 0 0.4rem 1rem 0 #70707080;
         .ant-select-selection-search {
-            left: 60px;
+            left: 6rem;
             .ant-select-selection-search-input {
-                height: 50px !important;
+                height: 5rem !important;
 
             }
         }
         .ant-select-selection-item,
         .ant-select-selection-placeholder {
-            line-height: 50px !important;
+            line-height: 5rem !important;
         }
         .ant-select-selection-item {
             .label-main {
-                line-height: 20px !important;
-                padding-top: 5px;
+                line-height: 2rem !important;
+                padding-top: 0.5rem;
             }
             .label-child {
-                line-height: 20px !important;
-                font-size: 12px;
+                line-height: 2rem !important;
+                font-size: 1.2rem;
                 font-family: Helvetica;
                 font-weight: 100;
                 color: #b3b3b3;
@@ -79,7 +79,7 @@ body {
 .login-select{
     .ant-select-item-option {
         &:not(:last-child) {
-            border-bottom: 1px solid #ccc;
+            border-bottom: 0.1rem solid #ccc;
         }
     }
     .option-manage {
@@ -89,15 +89,15 @@ body {
         font-weight: 100;
         color: #bbb;
         white-space: initial;
-        padding-bottom: 5px;
+        padding-bottom: 0.5rem;
     }
 }
 
 nz-header {
-    padding: 0 25px;
+    padding: 0 2.5rem;
 }
 
 nz-content {
-    height: calc(100% - 64px);
+    height: calc(100% - 6.4rem);
     background: #fff;
 }