split pdf (#35)

src/app/app.module.ts

@@ -89,8 +89,10 @@ import {
   faWarning,
   faCalendar,
   faArrows,
+  faArrowsSplitUpAndLeft,
   faArrowsUpDown,
 } from '@fortawesome/free-solid-svg-icons';
+
 import { faGithub, faLinkedin } from '@fortawesome/free-brands-svg-icons';
 import { ServiceWorkerModule } from '@angular/service-worker';
 import { environment } from '@env/environment';
@@ -154,6 +156,7 @@ export class AppModule {
       faItalic,
       faArrows,
       faArrowsUpDown,
+      faArrowsSplitUpAndLeft,
       faCalendar,
       faPhone,
       faBirthdayCake,

src/app/core/service/pdf.service.ts

@@ -0,0 +1,46 @@
+import { HttpClient } from '@angular/common/http';
+import { Inject, Injectable, PLATFORM_ID } from '@angular/core';
+import { Observable } from 'rxjs';
+import { DOCUMENT, isPlatformBrowser } from '@angular/common';
+import { ConfigInitService } from '@init/config-init.service';
+
+@Injectable({
+  providedIn: 'root',
+})
+export class PdfService {
+  baseUrl: string;
+
+  constructor(
+    private http: HttpClient,
+    @Inject(DOCUMENT) private document: Document,
+    private configService: ConfigInitService,
+    @Inject(PLATFORM_ID) private platformId: any
+  ) {
+    this.baseUrl = configService.getConfig()['BACKEND_URL'] + '/api/pdf';
+  }
+
+  public split(file: File): void {
+    if (isPlatformBrowser(this.platformId)) {
+      let formData = new FormData();
+      formData.append('pdf', file);
+      this.http
+        .post(`${this.baseUrl}/split`, formData, {
+          observe: 'response',
+          responseType: 'blob' as 'json',
+        })
+        .subscribe((response: any) => {
+          let body = response.body;
+          let dataType = body.type;
+          let headers = response.headers;
+          let filename = headers.get('content-disposition').split(';')[1].split('=')[1].replace(/"/g, '');
+          let binaryData = [];
+          binaryData.push(body);
+          let downloadLink = this.document.createElement('a');
+          downloadLink.href = URL.createObjectURL(new Blob(binaryData, { type: dataType }));
+          downloadLink.setAttribute('download', filename);
+          this.document.body.appendChild(downloadLink);
+          downloadLink.click();
+        });
+    }
+  }
+}

src/app/features/administrative-document/administrative-document.module.ts

@@ -11,9 +11,10 @@ import { AutosizeModule } from 'ngx-autosize';
 import { NgxFileDropModule } from 'ngx-file-drop';
 import { ChipsModule } from 'primeng/chips';
 import { DocumentSearchFormComponent } from './document-search-form/document-search-form.component';
+import { SplitPdfComponent } from './split-pdf/split-pdf.component';
 
 @NgModule({
-  declarations: [DocumentResultComponent, DocumentEditorComponent, DocumentSearchFormComponent],
+  declarations: [DocumentResultComponent, DocumentEditorComponent, DocumentSearchFormComponent, SplitPdfComponent],
   imports: [
     CommonModule,
     SharedModule,

src/app/features/administrative-document/document-result/document-result.component.html

@@ -4,6 +4,10 @@
     <fa-icon icon="plus"></fa-icon>
     Add
   </button>
+  <button class="btn btn-outline-primary ms-1" (click)="split()">
+    <fa-icon icon="arrows-split-up-and-left"></fa-icon>
+    Split
+  </button>
 </div>
 <app-document-search-form [searchCriteria]="searchCriteria" (formSubmitted)="search($event)"></app-document-search-form>
 <ng-container *ngIf="adminDocuments">

src/app/features/administrative-document/document-result/document-result.component.ts

@@ -16,13 +16,15 @@ import { OnApplicationEvent, RegisteredEvent } from '@core/interface/on-applicat
 import { NotificationService } from '@core/service/notification.service';
 import { ArtcodedNotification } from '@core/models/artcoded.notification';
 import { OnDestroy } from '@angular/core';
+import { SplitPdfComponent } from '../split-pdf/split-pdf.component';
 
 @Component({
   selector: 'app-document-result',
   templateUrl: './document-result.component.html',
   styleUrls: ['./document-result.component.scss'],
 })
 export class DocumentResultComponent implements OnInit, OnDestroy, OnApplicationEvent {
+
   adminDocuments: Page<AdministrativeDocument>;
   pageSize: number = 5;
   searchCriteria: AdministrativeDocumentSearchCriteria;
@@ -80,14 +82,13 @@ export class DocumentResultComponent implements OnInit, OnDestroy, OnApplication
   }
 
   openRow(a: AdministrativeDocument) {
-    if(this.isPdf(a.attachment)){
+    if (this.isPdf(a.attachment)) {
       this.openPdfViewer(a.attachment);
-    }else if(this.isImage(a.attachment)){
-      this.openImageViewer(a.attachment)
-    }else{
+    } else if (this.isImage(a.attachment)) {
+      this.openImageViewer(a.attachment);
+    } else {
       this.addOrEdit(a);
     }
-
   }
   openPdfViewer(a: FileUpload) {
     let ngbModalRef = this.modalService.open(PdfViewerComponent, {
@@ -143,4 +144,9 @@ export class DocumentResultComponent implements OnInit, OnDestroy, OnApplication
   shouldMarkEventAsSeenAfterConsumed(): boolean {
     return true;
   }
+  split() {
+    const modalRef = this.modalService.open(SplitPdfComponent, {
+      size: 'sm',
+    });
+  }
 }

src/app/features/administrative-document/split-pdf/split-pdf.component.html

@@ -0,0 +1,18 @@
+<ng-container>
+    <div class="modal-header" *ngIf="activeModal">
+      <span class="modal-title text-break">Split PDF</span>
+      <button type="button" class="btn-close" aria-label="Close" (click)="activeModal?.dismiss('Cross click')"></button>
+    </div>
+    <div class="modal-body">
+        <div class="input-group mb-2 ">
+            <input type="file" class="form-control" id="inputGroupFile02" (change)="loadFile($event)"  accept=".pdf"/>
+            <div class="input-group-append">
+              <button class="input-group-text ms-1" id="" (click)="split()" [disabled]="!file">
+                <fa-icon icon="arrows-split-up-and-left"></fa-icon>
+                Split
+              </button>
+            </div>
+          </div>
+    </div>
+  </ng-container>
+

src/app/features/administrative-document/split-pdf/split-pdf.component.ts

@@ -0,0 +1,23 @@
+import { Component, OnInit, Optional } from '@angular/core';
+import { PdfService } from '@core/service/pdf.service';
+import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
+
+@Component({
+  selector: 'app-split-pdf',
+  templateUrl: './split-pdf.component.html',
+  styleUrls: ['./split-pdf.component.scss'],
+})
+export class SplitPdfComponent implements OnInit {
+  file: File;
+
+  constructor(@Optional() public activeModal: NgbActiveModal, private pdfService: PdfService) {}
+  ngOnInit(): void {}
+
+  loadFile($event) {
+    this.file = $event.target.files[0];
+  }
+
+  split(){
+    this.pdfService.split(this.file);
+  }
+}

src/app/features/dossier/dossier-import-form/dossier-import-form.component.ts

@@ -4,7 +4,7 @@ import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
 @Component({
   selector: 'app-dossier-import-form',
   templateUrl: './dossier-import-form.component.html',
-  styleUrls: ['./dossier-import-form.component.scss']
+  styleUrls: ['./dossier-import-form.component.scss'],
 })
 export class DossierImportFormComponent implements OnInit {
   @Output()
@@ -14,24 +14,20 @@ export class DossierImportFormComponent implements OnInit {
 
   file: File;
 
-  constructor(
-    @Optional() public activeModal: NgbActiveModal,
-  ) { }
+  constructor(@Optional() public activeModal: NgbActiveModal) {}
 
-  ngOnInit(): void {
-  }
+  ngOnInit(): void {}
 
   upload() {
     this.onUpload.emit(this.file);
     this.file = null;
   }
 
-  getImportExample(){
+  getImportExample() {
     this.onGetExample.emit();
   }
 
   loadFile($event) {
     this.file = $event.target.files[0];
   }
-
 }