导入导出

src/app/services/main.service.ts

@@ -798,4 +798,11 @@ export class MainService {
       headers: this.headers,
     });
   }
+  // 模板导出
+  exportExcel(model, data): any {
+    return this.http.post(host.host + "/user/data/exportExcel/" + model, data, {
+      headers: this.exportHeader,
+      responseType: "arraybuffer",
+    });
+  }
 }

src/app/services/tool.service.ts

@@ -101,6 +101,12 @@ export class ToolService {
         case "export":
           coopBtns.export = true; //导出
           break;
+        case "import":
+          coopBtns.import = true; //导入
+          break;
+        case "templateDownload":
+          coopBtns.templateDownload = true; //模板下载
+          break;
         case "isStartUp":
           coopBtns.isStartUp = true; //是否启用
           break;

src/app/share/excel-import/excel-import.component.html

@@ -0,0 +1,36 @@
+<div
+  class="save add display_flex align-items_center justify-content_flex-center excelUpload"
+  *ngIf="isShow"
+>
+  <div class="modalBody">
+    <div class="title"> 选择导入的文件<i class="icon_transport transport-guanbi" (click)="hideModal()"></i>
+    </div>
+    <div class="content">
+      <div>
+        <nz-upload [(nzFileList)]="fileList" [nzBeforeUpload]="beforeUpload" nzType="drag" nzFileType="application/vnd.ms-excel,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet">
+          <p class="ant-upload-drag-icon">
+            <i nz-icon nzType="inbox"></i>
+          </p>
+          <p class="ant-upload-text">单击或将文件拖到此区域以上传</p>
+        </nz-upload>
+      </div>
+    </div>
+    <div class="display_flex justify-content_flex-center">
+      <button
+        nzType="primary"
+        nz-button
+        (click)="submitForm()"
+      >
+        确认导入
+      </button>
+      <button
+        class="btn cancel"
+        nz-button
+        nzType="default"
+        (click)="hideModal()"
+      >
+        取消
+      </button>
+    </div>
+  </div>
+</div>

src/app/share/excel-import/excel-import.component.less

@@ -0,0 +1,76 @@
+.save {
+  position: fixed;
+  left: 0;
+  top: 0;
+  width: 100%;
+  height: 100%;
+  background: rgba(0, 0, 0, 0.4);
+  z-index: 999;
+  &.excelUpload ::ng-deep .ant-upload-list-item .anticon-close{
+    opacity: 1!important;
+    transition: all 0.2s;
+  }
+  .modalBody {
+    width: 350px;
+    background: #fff;
+    border-radius: 5px;
+    padding: 10px 20px;
+    color: #333;
+
+    .title {
+      width: 100%;
+      text-align: center;
+      font-size: 18px;
+      position: relative;
+
+      i {
+        position: absolute;
+        right: 0;
+        top: 0;
+        font-size: 20px;
+        color: #666;
+        cursor: pointer;
+        padding: 0 5px;
+      }
+    }
+
+    .content {
+      width: 100%;
+      height: 117px;
+      background: #f9fafb;
+      border: 1px solid #e5e9ed;
+      border-radius: 5px;
+      overflow: hidden;
+      margin-top: 12px;
+    }
+
+    button {
+      margin-top: 10px;
+
+      &.btn {
+        margin-left: 8px;
+      }
+    }
+  }
+
+  // 新增
+  &.add {
+    .modalBody {
+      width: 480px;
+      height: auto;
+
+      .content {
+        width: 100%;
+        padding: 14px;
+        height: 200px;
+        .isNumOrIntegral {
+          margin: 24px 0;
+        }
+      }
+
+      button:nth-child(1) {
+        margin-right: 20px;
+      }
+    }
+  }
+}

src/app/share/excel-import/excel-import.component.ts

@@ -0,0 +1,39 @@
+import { Component, OnInit, Output, Input } from "@angular/core";
+import { EventEmitter } from "@angular/core";
+import { UploadFile, NzMessageService} from 'ng-zorro-antd';
+
+
+@Component({
+  selector: "app-excel-import",
+  templateUrl: "./excel-import.component.html",
+  styleUrls: ["./excel-import.component.less"],
+})
+export class ExcelImportComponent implements OnInit {
+  @Output() submitFormHand = new EventEmitter();
+  @Output() hideFormHand = new EventEmitter();
+  @Input() isShow: boolean = false; //模态框
+  fileList: UploadFile[] = [];
+
+  constructor(private message: NzMessageService) {}
+
+  beforeUpload = (file: UploadFile): boolean => {
+    if(this.fileList.length === 0){
+      this.fileList = this.fileList.concat(file);
+    }
+    return false;
+  };
+
+  ngOnInit() {}
+  // 隐藏模态框
+  hideModal() {
+    this.hideFormHand.emit();
+  }
+  // 表单提交
+  submitForm(): void {
+    if(this.fileList.length === 0){
+      this.message.warning('请选择一个文件');
+      return;
+    }
+    this.submitFormHand.emit({fileList: this.fileList});
+  }
+}

src/app/share/share.module.ts

@@ -28,6 +28,7 @@ import { CollapsePanelComponent } from './collapse-panel/collapse-panel.componen
 import { HtmlTransformPipe } from '../pipes/html-transform.pipe';
 import { BxPromptModalComponent } from './bx-prompt-modal/bx-prompt-modal.component';
 import { ExcelExportComponent } from './excel-export/excel-export.component';
+import { ExcelImportComponent } from './excel-import/excel-import.component';
 import { FilterSelfPipe } from '../pipes/filter-self.pipe';
 import { LogPromptModalComponent } from './log-prompt-modal/log-prompt-modal.component';
 import { DetailBxComponent } from './detail-bx/detail-bx.component';
@@ -74,6 +75,7 @@ import { OutgoingRecordDetailComponent } from './outgoing-record-detail/outgoing
     HtmlTransformPipe,
     FilterSelfPipe,
     ExcelExportComponent,
+    ExcelImportComponent,
     LogPromptModalComponent,
     DetailBxComponent,
     IncidentDetailsComponent,
@@ -130,6 +132,7 @@ import { OutgoingRecordDetailComponent } from './outgoing-record-detail/outgoing
     HtmlTransformPipe,
     FilterSelfPipe,
     ExcelExportComponent,
+    ExcelImportComponent,
     LogPromptModalComponent,
     DetailBxComponent,
     IncidentDetailsComponent,

src/app/views/building-floor/building-floor.component.html

@@ -1,6 +1,12 @@
 <div class="groupManagement">
   <div class="groupInfo">
-    <div class="title">楼栋楼层</div>
+    <div class="title">
+      楼栋楼层
+      <div>
+        <button nz-button nzType="primary" *ngIf="coopBtns.templateDownload" nzSize="small"  (click)="excelExport()">模板下载</button>
+        <button class="ml8" nz-button nzType="primary" *ngIf="coopBtns.import" nzSize="small" (click)="excelImport()">导入</button>
+      </div>
+    </div>
     <div class="operate">
       <div *ngIf="coopBtns.add" class="add item" (click)="showCoopModal('add')">新增</div>
       <div *ngIf="coopBtns.edit" class="edit item" (click)="showCoopModal('edit')">编辑</div>
@@ -131,3 +137,8 @@
 <app-prompt-modal *ngIf="promptModalShow" [content]="promptContent" [success]="ifSuccess" [show]="promptModalShow"
   [info]="promptInfo">
 </app-prompt-modal>
+
+<!-- 遮罩 -->
+<app-mask *ngIf="maskFlag"></app-mask>
+
+<app-excel-import [isShow]="isShow" (hideFormHand)="hideExcelImport($event)" *ngIf="isShow" (submitFormHand)="submitExcelImport($event)"></app-excel-import>

src/app/views/building-floor/building-floor.component.less

@@ -29,10 +29,14 @@
       height: 40px;
       line-height: 40px;
       padding-left: 16px;
+      padding-right: 16px;
       border-bottom: 1px solid #e5e9ed;
       position: relative;
       background: #fff;
       z-index: 2;
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
     }
 
     .operate {

src/app/views/building-floor/building-floor.component.ts

@@ -8,6 +8,10 @@ import { ToolService } from "../../services/tool.service";
 import { GenerateFloorComponent } from "src/app/share/generate-floor/generate-floor.component";
 import { NzMessageService } from "ng-zorro-antd";
 
+import host from "../../../assets/js/http";
+import { HttpRequest, HttpResponse, HttpClient } from '@angular/common/http';
+import { filter } from 'rxjs/operators';
+
 @Component({
   selector: "app-building-floor",
   templateUrl: "./building-floor.component.html",
@@ -42,13 +46,15 @@ export class BuildingFloorComponent implements OnInit {
   isDelSingle: boolean = false; //是否单个删除楼层
   generateModal: boolean = false; //生成楼层的模态框
   isAllDisplayDataChecked = false; //当前页是否全选
+  maskFlag: any = false;
 
   constructor(
     private fb: FormBuilder,
     private route: ActivatedRoute,
     private mainService: MainService,
-    private msg: NzMessageService,
-    private tool: ToolService
+    private message: NzMessageService,
+    private tool: ToolService,
+    private http: HttpClient,
   ) {}
 
   @ViewChild("osComponentRef1", {
@@ -66,6 +72,76 @@ export class BuildingFloorComponent implements OnInit {
     this.tableHeight = document.body.clientHeight - 312;
   }
 
+  // 模板导出
+  excelExport(){
+    this.maskFlag = this.message.loading("下载模板中..", {
+      nzDuration: 0,
+    }).messageId;
+    this.mainService.exportExcel("building", {}).subscribe(
+      (data) => {
+        this.message.remove(this.maskFlag);
+        this.maskFlag = false;
+        this.message.success('下载模板成功');
+        var file = new Blob([data], {
+          type: "application/vnd.ms-excel",
+        });
+        //trick to download store a file having its URL
+        var fileURL = URL.createObjectURL(file);
+        var a = document.createElement("a");
+        a.href = fileURL;
+        a.target = "_blank";
+        a.download = "楼栋楼层导入模板.xls";
+        document.body.appendChild(a);
+        a.click();
+      },
+      (err) => {
+        this.message.remove(this.maskFlag);
+        this.maskFlag = false;
+        this.message.error('下载模板失败');
+      }
+    );
+  }
+
+  // 导入---start
+  // model-取消
+  isShow = false;
+  hideExcelImport() {
+    this.isShow = false;
+  }
+  // 触发
+  excelImport() {
+    this.isShow = true;
+  }
+  submitExcelImport({fileList}){
+    this.isShow = false;
+    const formData = new FormData();
+    fileList.forEach((file: any) => {
+      formData.append('file', file);
+    });
+    this.maskFlag = this.message.loading("正在导入中..", {
+      nzDuration: 0,
+    }).messageId;
+    const req = new HttpRequest('Post', host.host + '/user/data/importExcel/building', formData, {
+      reportProgress: true
+    });
+    this.http
+      .request(req)
+      .pipe(filter(e => e instanceof HttpResponse))
+      .subscribe(
+        () => {
+          this.message.remove(this.maskFlag);
+          this.maskFlag = false;
+          this.message.success('导入成功');
+        },
+        () => {
+          this.message.remove(this.maskFlag);
+          this.maskFlag = false;
+          this.message.error('导入失败');
+        },
+      );
+  }
+  // 导入---end
+
   // 楼栋列表
   getBuildingList() {
     let postData = {
@@ -147,7 +223,7 @@ export class BuildingFloorComponent implements OnInit {
   // 新增/编辑楼栋模态框
   showCoopModal(type) {
     if (type == "edit" && !this.checkedBuilding.id) {
-      this.msg.create("warning", "请选择需要编辑的楼栋！");
+      this.message.create("warning", "请选择需要编辑的楼栋！");
       return;
     }
     this.coopModal = true;
@@ -320,7 +396,7 @@ export class BuildingFloorComponent implements OnInit {
   //删除楼栋
   showDelModal() {
     if (!this.checkedBuilding.id) {
-      this.msg.create("warning", "请选择需要删除的楼栋！");
+      this.message.create("warning", "请选择需要删除的楼栋！");
       return;
     }
     this.delModal = true;

src/app/views/jurisdiction-management/jurisdiction-management.component.html

@@ -29,8 +29,8 @@
         信息权限
       </div>
     </div>
-    <div *ngIf="!loading2&&!loading3">
-      <overlay-scrollbars #osComponentRef1 class="views menuViews" *ngIf="menuType==1">
+    <div [hidden]="loading2 || loading3">
+      <overlay-scrollbars #osComponentRef1 class="views menuViews" [hidden]="menuType!=1">
         <div class="tree">
           <div nz-row class="checkedAll">
             <div nz-col nzSpan="8">
@@ -65,7 +65,7 @@
           <button nzType="primary" [nzLoading]="saveLoading" nz-button (click)="saveMenus()">保存</button>
         </div>
       </overlay-scrollbars>
-      <overlay-scrollbars #osComponentRef2 class="views infoViews" *ngIf="menuType==2">
+      <overlay-scrollbars #osComponentRef2 class="views infoViews" [hidden]="menuType!=2">
         <div class="con">
           <div class="hospital">
             <div class="title">

src/app/views/office-management/office-management.component.html

@@ -48,6 +48,8 @@
           (click)="print($event,true)" *ngIf="coopBtns.print">批量打印</button>
         <button class="btn default ml8" nzType="primary" nz-button *ngIf="coopBtns.del"
           [disabled]="!checkedDepIds.length" (click)="showDelModal($event,true,checkedDepIds)">批量删除</button>
+        <button nz-button *ngIf="coopBtns.templateDownload" class="btn ml8 default" (click)="excelExport()">模板下载</button>
+        <button nz-button *ngIf="coopBtns.import" class="btn ml8 default" (click)="excelImport()">导入</button>
       </div>
     </div>
     <div class="list-template__bottom">
@@ -276,3 +278,4 @@
 <router-outlet></router-outlet>
 <!-- 遮罩 -->
 <app-mask *ngIf="maskFlag"></app-mask>
+<app-excel-import [isShow]="isShow" (hideFormHand)="hideExcelImport($event)" *ngIf="isShow" (submitFormHand)="submitExcelImport($event)"></app-excel-import>

src/app/views/office-management/office-management.component.ts

@@ -13,7 +13,9 @@ import { ToolService } from "../../services/tool.service";
 import { format } from "date-fns";
 import { NzMessageService } from "ng-zorro-antd";
 import { Subject } from "rxjs";
-import { debounceTime } from "rxjs/operators";
+import { debounceTime, filter } from "rxjs/operators";
+import host from "../../../assets/js/http";
+import { HttpRequest, HttpResponse, HttpClient } from '@angular/common/http';
 
 @Component({
   selector: "app-office-management",
@@ -32,7 +34,8 @@ export class OfficeManagementComponent implements OnInit {
     private route: ActivatedRoute,
     private router: Router,
     private mainService: MainService,
-    private tool: ToolService
+    private tool: ToolService,
+    private http: HttpClient,
   ) {}
 
   ngOnInit() {
@@ -79,6 +82,75 @@ export class OfficeManagementComponent implements OnInit {
   searchParentDeptSubject = new Subject();
   // 初始化增删改按钮
   coopBtns: any = {};
+  // 模板导出
+  excelExport(){
+    this.maskFlag = this.message.loading("下载模板中..", {
+      nzDuration: 0,
+    }).messageId;
+    this.mainService.exportExcel("department", {}).subscribe(
+      (data) => {
+        this.message.remove(this.maskFlag);
+        this.maskFlag = false;
+        this.message.success('下载模板成功');
+        var file = new Blob([data], {
+          type: "application/vnd.ms-excel",
+        });
+        //trick to download store a file having its URL
+        var fileURL = URL.createObjectURL(file);
+        var a = document.createElement("a");
+        a.href = fileURL;
+        a.target = "_blank";
+        a.download = "科室导入模板.xls";
+        document.body.appendChild(a);
+        a.click();
+      },
+      (err) => {
+        this.message.remove(this.maskFlag);
+        this.maskFlag = false;
+        this.message.error('下载模板失败');
+      }
+    );
+  }
+
+  // 导入---start
+  // model-取消
+  isShow = false;
+  hideExcelImport() {
+    this.isShow = false;
+  }
+  // 触发
+  excelImport() {
+    this.isShow = true;
+  }
+  submitExcelImport({fileList}){
+    this.isShow = false;
+    const formData = new FormData();
+    fileList.forEach((file: any) => {
+      formData.append('file', file);
+    });
+    this.maskFlag = this.message.loading("正在导入中..", {
+      nzDuration: 0,
+    }).messageId;
+    const req = new HttpRequest('Post', host.host + '/user/data/importExcel/department', formData, {
+      reportProgress: true
+    });
+    this.http
+      .request(req)
+      .pipe(filter(e => e instanceof HttpResponse))
+      .subscribe(
+        () => {
+          this.message.remove(this.maskFlag);
+          this.maskFlag = false;
+          this.message.success('导入成功');
+        },
+        () => {
+          this.message.remove(this.maskFlag);
+          this.maskFlag = false;
+          this.message.error('导入失败');
+        },
+      );
+  }
+  // 导入---end
   //搜索父级科室
   changeInp(e) {
     this.isLoading = true;

src/app/views/users-management/users-management.component.html

@@ -1,7 +1,7 @@
 <div class="list-template">
   <div class="list-template__content">
     <div class="list-template__top" nz-row>
-      <div nz-col nzXl='18' class="list-template__searchBox">
+      <div nz-col nzXl='16' class="list-template__searchBox">
         <div class="list-template__searchItem">
           <span class="label">用户类型</span>：
           <nz-select class="formItem" [nzDropdownMatchSelectWidth]="false" nzShowSearch nzAllowClear
@@ -39,10 +39,12 @@
           <input nz-input class="formItem" [(ngModel)]="name" placeholder="请输入姓名" nzSize="default" />
         </div>
       </div>
-      <div nz-col nzXl='6' class="list-template__btns">
+      <div nz-col nzXl='8' class="list-template__btns">
         <button nz-button class="btn default" (click)='search()'>搜索</button>
         <button nz-button class="btn ml8 default" (click)='reset()'>重置</button>
         <button nz-button *ngIf="coopBtns.add" class="btn ml8 default" (click)="showModal()">新增</button>
+        <button nz-button *ngIf="coopBtns.templateDownload" class="btn ml8 default" (click)="excelExport()">模板下载</button>
+        <button nz-button *ngIf="coopBtns.import" class="btn ml8 default" (click)="excelImport()">导入</button>
       </div>
     </div>
     <div class="list-template__bottom">
@@ -219,3 +221,5 @@
 
 <!-- 遮罩 -->
 <app-mask *ngIf="maskFlag"></app-mask>
+
+<app-excel-import [isShow]="isShow" (hideFormHand)="hideExcelImport($event)" *ngIf="isShow" (submitFormHand)="submitExcelImport($event)"></app-excel-import>

src/app/views/users-management/users-management.component.ts

@@ -6,9 +6,12 @@ import { MainService } from "../../services/main.service";
 import { OverlayScrollbarsComponent } from "overlayscrollbars-ngx";
 import { ToolService } from "../../services/tool.service";
 import { forkJoin, Subject } from "rxjs";
-import { debounceTime } from "rxjs/operators";
+import { debounceTime, filter } from "rxjs/operators";
 import { NzMessageService } from "ng-zorro-antd";
 
+import host from "../../../assets/js/http";
+import { HttpRequest, HttpResponse, HttpClient } from '@angular/common/http';
+
 @Component({
   selector: "app-users-management",
   templateUrl: "./users-management.component.html",
@@ -26,7 +29,8 @@ export class UsersManagementComponent implements OnInit {
     private route: ActivatedRoute,
     private router: Router,
     private mainService: MainService,
-    private tool: ToolService
+    private tool: ToolService,
+    private http: HttpClient,
   ) {}
 
   listOfData: any[] = []; //表格数据
@@ -75,6 +79,76 @@ export class UsersManagementComponent implements OnInit {
 
   // 初始化增删改按钮
   coopBtns: any = {};
+
+  // 模板导出
+  excelExport(){
+    this.maskFlag = this.message.loading("下载模板中..", {
+      nzDuration: 0,
+    }).messageId;
+    this.mainService.exportExcel("user", {}).subscribe(
+      (data) => {
+        this.message.remove(this.maskFlag);
+        this.maskFlag = false;
+        this.message.success('下载模板成功');
+        var file = new Blob([data], {
+          type: "application/vnd.ms-excel",
+        });
+        //trick to download store a file having its URL
+        var fileURL = URL.createObjectURL(file);
+        var a = document.createElement("a");
+        a.href = fileURL;
+        a.target = "_blank";
+        a.download = "用户导入模板.xls";
+        document.body.appendChild(a);
+        a.click();
+      },
+      (err) => {
+        this.message.remove(this.maskFlag);
+        this.maskFlag = false;
+        this.message.error('下载模板失败');
+      }
+    );
+  }
+
+  // 导入---start
+  // model-取消
+  isShow = false;
+  hideExcelImport() {
+    this.isShow = false;
+  }
+  // 触发
+  excelImport() {
+    this.isShow = true;
+  }
+  submitExcelImport({fileList}){
+    this.isShow = false;
+    const formData = new FormData();
+    fileList.forEach((file: any) => {
+      formData.append('file', file);
+    });
+    this.maskFlag = this.message.loading("正在导入中..", {
+      nzDuration: 0,
+    }).messageId;
+    const req = new HttpRequest('Post', host.host + '/user/data/importExcel/user', formData, {
+      reportProgress: true
+    });
+    this.http
+      .request(req)
+      .pipe(filter(e => e instanceof HttpResponse))
+      .subscribe(
+        () => {
+          this.message.remove(this.maskFlag);
+          this.maskFlag = false;
+          this.message.success('导入成功');
+        },
+        () => {
+          this.message.remove(this.maskFlag);
+          this.maskFlag = false;
+          this.message.error('导入失败');
+        },
+      );
+  }
+  // 导入---end
   // 搜索
   search() {
     this.pageIndex = 1;