[新增]新增导出excel功能

src/app/app-routing.module.ts

@@ -20,7 +20,7 @@ import {ViewUnitDetailsPlanComponent} from './key-unit/view-unit-details-plan/vi
 import { TestComponent } from './test/test.component';
 import { ExternalLinksPlanComponent } from './external-links-plan/external-links-plan.component';
 import { CreatePlanOnlineFiveComponent } from './plan-management/create-plan-online-five/create-plan-online-five.component'
-
+import { ExportExcelComponent } from './export-excel/export-excel.component'
 
 const routes: Routes = [
   {path:'',redirectTo:'login',pathMatch:'full'},
@@ -43,7 +43,8 @@ const routes: Routes = [
   {path:'planAudit/planpass', component: PlanPassComponent , canActivate: [AuthGuard]},
   {path:'test', component: TestComponent },
   {path:'linksPlan', component: ExternalLinksPlanComponent },
-  {path:'CreatePlanOnlineFive',component:CreatePlanOnlineFiveComponent}
+  {path:'CreatePlanOnlineFive',component:CreatePlanOnlineFiveComponent},
+  {path:'exportExcel',component:ExportExcelComponent, canActivate: [AuthGuard]},
 ];
 
 @NgModule({

src/app/app.module.ts

@@ -25,6 +25,7 @@ import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
 import { TestComponent } from './test/test.component';
 import { ExternalLinksPlanComponent } from './external-links-plan/external-links-plan.component';
 import { SearchDownList } from '../modules/map/declare/component/SearchDownListPlugins/SearchDownList';
+import { ExportExcelComponent } from './export-excel/export-excel.component';
 
 @NgModule({
     declarations: [
@@ -33,7 +34,8 @@ import { SearchDownList } from '../modules/map/declare/component/SearchDownListP
         MTokenK1Component,
         TestComponent,
         ExternalLinksPlanComponent,
-        SearchDownList
+        SearchDownList,
+        ExportExcelComponent
     ],
     imports: [
         BrowserModule,

src/app/export-excel/export-excel.component.html

@@ -0,0 +1,3 @@
+<div class="box">
+    <button mat-raised-button color="primary" (click)="export()">导出excel表格</button>
+</div>

src/app/export-excel/export-excel.component.scss

@@ -0,0 +1,7 @@
+.box{
+    width: 100%;
+    height: 100%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}

src/app/export-excel/export-excel.component.spec.ts

@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { ExportExcelComponent } from './export-excel.component';
+
+describe('ExportExcelComponent', () => {
+  let component: ExportExcelComponent;
+  let fixture: ComponentFixture<ExportExcelComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ ExportExcelComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(ExportExcelComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/export-excel/export-excel.component.ts

@@ -0,0 +1,31 @@
+import { HttpClient } from '@angular/common/http';
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-export-excel',
+  templateUrl: './export-excel.component.html',
+  styleUrls: ['./export-excel.component.scss']
+})
+export class ExportExcelComponent implements OnInit {
+
+  constructor(public http:HttpClient) { }
+
+  ngOnInit(): void {
+  }
+  export(){
+    const httpOptions = {
+      responseType: 'blob' as 'json'
+    };
+    this.http.get('/api/StatisticsAnalysis/ExportToExcel',httpOptions).subscribe((data:any) => {
+      // // 文件名中有中文 则对文件名进行转码
+      const link = document.createElement('a');
+      const blob = new Blob([data], {type: 'application/vnd.ms-excel'});
+      link.setAttribute('href', window.URL.createObjectURL(blob));
+      link.setAttribute('download', '统计信息'+'.xlsx');
+      link.style.visibility = 'hidden';
+      document.body.appendChild(link);
+      link.click();
+      document.body.removeChild(link);
+    })
+  }
+}