1

src/app/pages/body/index/index.component.html

@@ -1,4 +1,5 @@
 <nz-layout>
+  <!--  start 头部 start-->
   <nz-header>
     <div nz-row>
       <!-- logo -->
@@ -7,55 +8,45 @@
       </div>
       <!-- logo -->
 
-      <!--  start 顶部菜单 start-->
       <div class="menu" nz-col nzSpan="16">
         <ul>
           <li *ngFor="let item of menuData" [ngClass]="{'li-selected' : item.selected}" (click)="isSelected(item)">{{item.menuName}}</li>
         </ul>
       </div>
-      <!-- end 顶部菜单 end -->
-
     </div>
   </nz-header>
+  <!-- end 头部 end -->
   <nz-layout>
-    <nz-sider>
+    <!--  start 侧边 start-->
-      <!-- start 左侧导航栏 start -->
+    <nz-sider nzCollapsible [(nzCollapsed)]="isCollapse" [nzTrigger]="null" [nzCollapsedWidth]="0" >
-      <div  [@openClose]="isCollapse ? 'open' : 'closed'" class="side_menu">
+      <div  class="side_menu">
-        <div class="side_menu_top" (click)="isCollapse =  false">
+      <span
-          <div class="side_menu_top_icon">
+        class="trigger"
-            <span nz-icon nzType="menu-fold" nzTheme="outline"></span>
+        nz-icon
-          </div>
+        [nzType]="isCollapse ? 'menu-unfold' : 'menu-fold'"
-          <span style="font-size: 14px;">收起</span>
+        (click)="isCollapse = !isCollapse"
+      ></span>
       </div>
-
       <!-- start 菜单内容 end-->
-        <div class="side_menu_content">
+      <div>
         <ul nz-menu nzMode="inline">
-            <li nz-submenu nzOpen *ngFor="let item of leftMenuData" nzTitle="{{item.menuName}}" nzIcon="{{item.menuUrlImg}}" >
+          <li nz-submenu *ngFor="let item of leftMenuData" nzTitle="{{item.menuName}}" nzIcon="{{item.menuUrlImg}}" >
             <ul>
-                <li nz-menu-group>
+              <li nz-menu-item *ngFor="let childMenu of item['childMenuList']">
-                  <ul>
+                <a [routerLink]="[item['menuUrl'], childMenu['menuUrl']]" [queryParams]="{title: item['menuName']}">{{childMenu['menuName']}}</a>
-                    <li nz-menu-item nzMatchRouter *ngFor="let childMenu of item['childMenuList']">
-                      <a [routerLink]="[item['menuUrl'], childMenu['menuUrl']]" [queryParams]="{title: item['menuName']}" (click)="clickMenu(childMenu)">{{childMenu['menuName']}}</a>
-                    </li>
-                  </ul>
               </li>
             </ul>
           </li>
         </ul>
       </div>
       <!-- start 菜单内容 end -->
-      </div>
-      <!-- end 左侧导航栏 end -->
     </nz-sider>
-    <nz-content class="inner-content">
+    <!-- end 侧边 end -->
-      <!--  主体内容-->
+    <!--  start 主体 start-->
-      <div class="content" [ngClass]="{'content-width' : isCollapse}">
+    <nz-content>
         <app-tab></app-tab>
-      </div>
     </nz-content>
+    <!-- end 主体 end -->
   </nz-layout>
-
-
 </nz-layout>
 

src/app/pages/body/index/index.component.less

@@ -34,51 +34,23 @@ nz-header {
   }
 }
 
-nz-breadcrumb {
+nz-sider {
-  margin: 16px 0;
+  background: #fff;
-}
-
-nz-footer {
-  text-align: center;
-}
-
-.inner-content {
-  div {
-    float: left;
-  }
-  .side_menu {
-    height: 100%;
-    color: #595959;
   box-shadow: 2px 0 8px rgba(0,0,0,.15);
-    .side_menu_top {
+  height: calc(100vh - 64px);;
-      width: 100%;
+
-      margin-top: 8px;
+  .trigger {
     font-size: 18px;
-      height: 26px;
+    line-height: 50px;
-      line-height: 23px;
+    padding: 0 24px;
-      margin-left: 14px;
+    cursor: pointer;
-      .side_menu_top_icon {
+    transition: color 0.3s;
-        height: 26px;
-        line-height: 26px;
-      }
-      span {
-        margin-left: 6px;
-      }
-    }
-    .side_menu_content {
-      margin-top: 10px;
-      width: 100%;
-      height: 100%;
   }
 
+  .trigger:hover {
+    color: #1890ff;
   }
-  height: calc(100vh - 64px);
 }
-.content {
+nz-content {
-  width:100vw;
+  padding: 0 0 0 4px;
 }
-.content-width {
-  width: calc(100vw - 280px);
-}
-
-

src/app/pages/body/index/index.component.ts

@@ -9,7 +9,7 @@ import {
 } from "ng-zorro-antd/layout";
 import {NzBreadCrumbComponent, NzBreadCrumbItemComponent} from "ng-zorro-antd/breadcrumb";
 import {NzColDirective, NzRowDirective} from "ng-zorro-antd/grid";
-import {NzMenuDirective, NzMenuItemComponent, NzSubMenuComponent} from "ng-zorro-antd/menu";
+import {NzMenuDirective, NzMenuGroupComponent, NzMenuItemComponent, NzSubMenuComponent} from "ng-zorro-antd/menu";
 import {menuData} from "../../../data/menu/menu.namespace";
 import {NgClass, NgForOf} from "@angular/common";
 import {animate, state, style, transition, trigger} from "@angular/animations";
@@ -42,29 +42,11 @@ import {DATA} from "../../../data/login/localStorage.namespace";
     NzTabComponent,
     NzTabSetComponent,
     TabComponent,
-    NzSiderComponent
+    NzSiderComponent,
+    NzMenuGroupComponent
   ],
   templateUrl: './index.component.html',
   styleUrl: './index.component.less',
-  animations: [
-    // animation triggers go here
-    trigger('openClose', [
-      state('open', style({
-        width: '280px',
-        backgroundColor: 'white'
-      })),
-      state('closed', style({
-        overflow: 'hidden',
-        width: '0',
-      })),
-      transition('open => closed', [
-        animate('0.1s')
-      ]),
-      transition('closed => open', [
-        animate('0.1s')
-      ]),
-    ]),
-  ]
 })
 export class IndexComponent {
   // 菜单数据
@@ -77,27 +59,18 @@ export class IndexComponent {
   leftMenuData: any = [];
 
   // 侧边菜单展示开关
-  isCollapse = false;
+  isCollapse = true;
 
   constructor(private storage: BrowserStorageService) {
     this.menuData = this.menuData.concat(this.storage.get(DATA)['menuTree']);
   }
 
-
-  clickMenu(menu: object) {
-
-  }
-
   // 选择操作
   isSelected(item: any) {
     this.menuData.map((data: any) => {
       data.selected = data.menuName === item.menuName;
     });
     this.leftMenuData = item['childMenuList'];
-    if (item['menuName'] === '首页') {
+    this.isCollapse = item['menuName'] === '首页';
-      this.isCollapse = false;
-    } else {
-      this.isCollapse = true;
-    }
   }
 }

src/app/pages/body/index/index1.component.html

@@ -0,0 +1,61 @@
+<nz-layout>
+  <nz-header>
+    <div nz-row>
+      <!-- logo -->
+      <div class="logo" nz-col nzSpan="4">
+        <h2>普惠GO管理平台</h2>
+      </div>
+      <!-- logo -->
+
+      <!--  start 顶部菜单 start-->
+      <div class="menu" nz-col nzSpan="16">
+        <ul>
+          <li *ngFor="let item of menuData" [ngClass]="{'li-selected' : item.selected}" (click)="isSelected(item)">{{item.menuName}}</li>
+        </ul>
+      </div>
+      <!-- end 顶部菜单 end -->
+
+    </div>
+  </nz-header>
+  <nz-layout>
+    <nz-sider nzCollapsible [nzCollapsedWidth]="0" >
+      <!-- start 左侧导航栏 start -->
+      <div  [@openClose]="isCollapse ? 'open' : 'closed'" class="side_menu">
+        <div class="side_menu_top" (click)="isCollapse =  false">
+          <div class="side_menu_top_icon">
+            <span nz-icon nzType="menu-fold" nzTheme="outline"></span>
+          </div>
+          <span style="font-size: 14px;">收起</span>
+        </div>
+
+        <!-- start 菜单内容 end-->
+        <div class="side_menu_content">
+          <ul nz-menu nzMode="inline">
+            <li nz-submenu nzOpen *ngFor="let item of leftMenuData" nzTitle="{{item.menuName}}" nzIcon="{{item.menuUrlImg}}" >
+              <ul>
+                <li nz-menu-group>
+                  <ul>
+                    <li nz-menu-item nzMatchRouter *ngFor="let childMenu of item['childMenuList']">
+                      <a [routerLink]="[item['menuUrl'], childMenu['menuUrl']]" [queryParams]="{title: item['menuName']}" (click)="clickMenu(childMenu)">{{childMenu['menuName']}}</a>
+                    </li>
+                  </ul>
+                </li>
+              </ul>
+            </li>
+          </ul>
+        </div>
+        <!-- start 菜单内容 end -->
+      </div>
+      <!-- end 左侧导航栏 end -->
+    </nz-sider>
+    <nz-content class="inner-content">
+      <!--  主体内容-->
+      <div class="content" [ngClass]="{'content-width' : isCollapse}">
+        <app-tab></app-tab>
+      </div>
+    </nz-content>
+  </nz-layout>
+
+
+</nz-layout>
+

src/app/pages/body/index/index1.component.less

@@ -0,0 +1,84 @@
+nz-header {
+  background: #181f47;
+  padding: 0 26px;
+  .logo {
+    h2 {
+      color: white;
+    }
+  }
+  .menu {
+    width: 52%;
+    display: flex;
+    justify-content: center;
+    ul {
+      li {
+        height: 56px;
+        float: left;
+        color: #fff;
+        opacity: .65;
+        font-size: 14px;
+        padding: 0 20px;
+        cursor: pointer;
+      }
+      .li-selected {
+        opacity: 1;
+        border-bottom: 2px solid #1890ff;
+      }
+      li:hover {
+        opacity: 1;
+        border-bottom: 2px solid #1890ff;
+      }
+      list-style-type: none; /* 移除列表的标记，如果需要的话 */
+      padding: 0; /* 移除padding，如果需要的话 */
+    }
+  }
+}
+
+nz-breadcrumb {
+  margin: 16px 0;
+}
+
+nz-footer {
+  text-align: center;
+}
+
+.inner-content {
+  div {
+    float: left;
+  }
+  .side_menu {
+    height: 100%;
+    color: #595959;
+    box-shadow: 2px 0 8px rgba(0,0,0,.15);
+    .side_menu_top {
+      width: 100%;
+      margin-top: 8px;
+      font-size: 18px;
+      height: 26px;
+      line-height: 23px;
+      margin-left: 14px;
+      .side_menu_top_icon {
+        height: 26px;
+        line-height: 26px;
+      }
+      span {
+        margin-left: 6px;
+      }
+    }
+    .side_menu_content {
+      margin-top: 10px;
+      width: 100%;
+      height: 100%;
+    }
+
+  }
+  height: calc(100vh - 64px);
+}
+.content {
+  width:100vw;
+}
+.content-width {
+  width: calc(100vw - 280px);
+}
+
+

src/app/utils/Interceptor.service.ts

@@ -23,8 +23,6 @@ export class InterceptorService implements HttpInterceptor {
     const token = this.storage.get(USER_TOKEN);
     if (token != null) {
       modifiedHeaders = req.headers.set('Authorization', token);
-      modifiedHeaders = req.headers.set( 'Cache-Control', 'no-cache',)
-      modifiedHeaders = req.headers.set( 'Pragma', 'no-cache',)
     }
 
     secureReq = req.clone({