+
+
+
+
+
+
+
+ {{ element.title }}
+
+
+
+
+ {{ element.totalInterested }}
+
+
+
+
+ {{ element.daysInShowcase }}
+
+
+
+
+ {{ element.chooseDate | date: 'dd/MM/yyyy' }}
+
+
+
+
+ {{ element.trackingNumber }}
+
+
+
+
+
+ {{ getTranslatedStatusDescription(element.status) }}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
Nenhum registro encontrado.
+
+
Voltar
diff --git a/src/app/components/book/donations/donations.component.spec.ts b/src/app/components/book/donations/donations.component.spec.ts
index c0a5e871..cdd6a707 100644
--- a/src/app/components/book/donations/donations.component.spec.ts
+++ b/src/app/components/book/donations/donations.component.spec.ts
@@ -1,6 +1,9 @@
import { ToastrModule } from 'ngx-toastr';
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
-import { Ng2SmartTableModule } from 'ng2-smart-table';
+import { MatTableModule } from '@angular/material/table';
+import { MatSortModule } from '@angular/material/sort';
+import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
+import { MatInputModule } from '@angular/material/input';
import { NgbModule, NgbModalModule } from '@ng-bootstrap/ng-bootstrap';
import { DonationsComponent } from './donations.component';
@@ -9,6 +12,8 @@ import { AppConfigModule } from '../../../app-config.module';
import { NO_ERRORS_SCHEMA } from '@angular/core';
import { ConfirmationDialogService } from 'src/app/core/services/confirmation-dialog/confirmation-dialog.service';
import { RouterTestingModule } from '@angular/router/testing';
+import { HttpClientTestingModule } from '@angular/common/http/testing';
+import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
describe('DonationsComponent', () => {
let component: DonationsComponent;
@@ -19,12 +24,17 @@ describe('DonationsComponent', () => {
declarations: [DonationsComponent],
schemas: [NO_ERRORS_SCHEMA],
imports: [
- Ng2SmartTableModule,
+ MatTableModule,
AppConfigModule,
- NgbModule.forRoot(),
+ MatSortModule,
+ MatInputModule,
+ MatProgressSpinnerModule,
+ NgbModule,
NgbModalModule,
ToastrModule.forRoot(),
RouterTestingModule,
+ HttpClientTestingModule,
+ BrowserAnimationsModule
],
providers: [ConfirmationDialogService],
}).compileComponents();
diff --git a/src/app/components/book/donations/donations.component.ts b/src/app/components/book/donations/donations.component.ts
index f3e943a2..893a1f6d 100644
--- a/src/app/components/book/donations/donations.component.ts
+++ b/src/app/components/book/donations/donations.component.ts
@@ -1,9 +1,9 @@
-import { DatePipe } from '@angular/common';
-import { Component, OnInit, OnDestroy } from '@angular/core';
+import { MyDonation } from '../../../core/models/MyDonation';
+import { Component, OnInit, OnDestroy, ViewChild, AfterViewInit } from '@angular/core';
import { Router, ActivatedRoute } from '@angular/router';
-import { DomSanitizer } from '@angular/platform-browser';
-import { Subject } from 'rxjs';
-import { takeUntil } from 'rxjs/operators';
+import { BehaviorSubject, Subject } from 'rxjs';
+import { takeUntil, finalize } from 'rxjs/operators';
+import { MatSort } from '@angular/material/sort';
import { BookService } from '../../../core/services/book/book.service';
import { BookDonationStatus } from '../../../core/models/BookDonationStatus';
@@ -13,23 +13,29 @@ import { ConfirmationDialogService } from 'src/app/core/services/confirmation-di
import { ToastrService } from 'ngx-toastr';
import { getStatusDescription } from 'src/app/core/utils/getStatusDescription';
import { WinnerUsersComponent } from '../winner-users/winner-users.component';
+import { MatTableDataSource } from '@angular/material/table';
@Component({
selector: 'app-donations',
templateUrl: './donations.component.html',
styleUrls: ['./donations.component.css'],
})
-export class DonationsComponent implements OnInit, OnDestroy {
- donatedBooks = new Array
();
+export class DonationsComponent implements OnInit, AfterViewInit, OnDestroy {
+ displayedColumns: string[] = ['title', 'totalInterested', 'daysInShowcase', 'chooseDate', 'trackingNumber', 'status', 'action'];
+ donatedBooks = new MatTableDataSource();
+
tableSettings: any;
- isLoading: boolean;
+
statusBtnWinner: boolean;
+ @ViewChild(MatSort) sort: MatSort;
+
private _destroySubscribes$ = new Subject();
+ public isLoadingSubject = new BehaviorSubject(false);
+ public isLoading$ = this.isLoadingSubject.asObservable();
constructor(
private _bookService: BookService,
- private _sanitizer: DomSanitizer,
private _modalService: NgbModal,
private _toastr: ToastrService,
private _confirmationDialogService: ConfirmationDialogService,
@@ -39,7 +45,6 @@ export class DonationsComponent implements OnInit, OnDestroy {
ngOnInit() {
this.getDonations();
-
// Carrega Status do ENUM BookDonationStatus
const myBookDonationStatus = new Array();
Object.keys(BookDonationStatus).forEach((key) => {
@@ -48,140 +53,66 @@ export class DonationsComponent implements OnInit, OnDestroy {
title: BookDonationStatus[key],
});
});
+ }
- const btnDonate =
- '' +
- ' ';
- const btnRenewChooseDate =
- '' +
- ' ';
- const btnTrackNumber =
- '' +
- ' ';
- const btnCancelDonation =
- '' +
- ' ';
+ ngAfterViewInit(): void {
+ this.donatedBooks.sort = this.sort;
+ }
- const btnShowWinnerInfo =
- '' +
- ' ';
+ public getTranslatedStatusDescription(status: string): string {
+ return getStatusDescription(status);
+ }
- this.tableSettings = {
- columns: {
- title: {
- title: 'Titulo',
- width: '27%',
- },
- totalInterested: {
- title: 'Total interessados',
- width: '08%',
- },
- daysInShowcase: {
- title: 'Dias na vitrine',
- width: '08%',
- },
- chooseDate: {
- title: 'Data Escolha',
- width: '10%',
- type: 'html',
- valuePrepareFunction: (cell, row) => {
- return new DatePipe('en-US').transform(cell, 'dd/MM/yyyy');
- },
- },
- trackingNumber: {
- title: 'Código Ratreio',
- width: '15%',
- },
- status: {
- title: 'Status',
- width: '15%',
- type: 'html',
- valuePrepareFunction: (value) => {
- return this._sanitizer.bypassSecurityTrustHtml(
- `${getStatusDescription(value)} `
- );
- },
- filter: {
- type: 'list',
- config: {
- selectText: 'Selecionar...',
- list: myBookDonationStatus,
- },
- },
- },
- },
- actions: {
- delete: false,
- edit: false,
- add: false,
- update: false,
- custom: [
- {
- name: 'donate',
- title: btnDonate,
- },
- {
- name: 'renewChooseDate',
- title: btnRenewChooseDate,
- },
- {
- name: 'trackNumber',
- title: btnTrackNumber,
- },
- {
- name: 'CancelDonation',
- title: btnCancelDonation,
- },
- {
- name: 'ShowWinnerInfo',
- title: btnShowWinnerInfo,
- },
- ],
- position: 'right', // left|right
- },
- attr: {
- class: 'table table-bordered table-hover table-striped',
- },
- noDataMessage: 'Nenhum registro encontrado.',
- };
+ public getStatusBadgeBackgroundColor(status) {
+ switch (status) {
+ case BookDonationStatus.WAITING_APPROVAL:
+ case BookDonationStatus.WAITING_DECISION:
+ case BookDonationStatus.WAITING_SEND:
+ case BookDonationStatus.SENT:
+ return '#ffc107'; // warning
+ case BookDonationStatus.AVAILABLE:
+ case BookDonationStatus.RECEIVED:
+ return '#28a745'; // success
+ case BookDonationStatus.CANCELED:
+ return '#dc3545'; // danger
+ default:
+ return '#6c757d'; // secondary
+ }
}
- private getStatusBadge(status) {
+ public getStatusBadgeTextColor(status) {
switch (status) {
case BookDonationStatus.WAITING_APPROVAL:
case BookDonationStatus.WAITING_DECISION:
case BookDonationStatus.WAITING_SEND:
case BookDonationStatus.SENT:
- return 'warning';
+ return '#212529';
case BookDonationStatus.AVAILABLE:
case BookDonationStatus.RECEIVED:
- return 'success';
+ return '#fff';
case BookDonationStatus.CANCELED:
- return 'danger';
+ return '#fff';
default:
- return 'secondary';
+ return '#fff';
}
}
getDonations() {
- this.isLoading = true;
-
+ this.isLoadingSubject.next(true);
this._bookService
.getDonatedBooks()
- .pipe(takeUntil(this._destroySubscribes$))
- .subscribe((resp) => {
- this.donatedBooks = resp;
- this.isLoading = false;
+ .pipe(
+ takeUntil(this._destroySubscribes$),
+ finalize(() => this.isLoadingSubject.next(false)))
+ .subscribe((resp: MyDonation[]) => {
+ this.donatedBooks.data = resp;
});
}
- onCustom(event) {
- switch (event.action) {
+ onCustom(iconClicked: string, param: MyDonation) {
+ switch (iconClicked) {
case 'donate': {
-
- this._router.navigate([`book/donate/${event.data.slug}`], {
+ this._router.navigate([`book/donate/${param.slug}`], {
queryParams: {
returnUrl: this._activatedRoute.snapshot.url.join('/'),
},
@@ -190,16 +121,16 @@ export class DonationsComponent implements OnInit, OnDestroy {
}
case 'renewChooseDate': {
- if (event.data.status !== BookDonationStatus.WAITING_DECISION) {
+ if (param.status !== BookDonationStatus.WAITING_DECISION) {
alert(
`Não é possível renovar doação. \nstatus requerido = ${BookDonationStatus.WAITING_DECISION}\n` +
- `status atual = ${event.data.status}`
+ `status atual = ${param.status}`
);
return;
}
const chooseDate = Math.floor(
- new Date(event.data.chooseDate).getTime() / (3600 * 24 * 1000)
+ new Date(param.chooseDate).getTime() / (3600 * 24 * 1000)
);
const todayDate = Math.floor(new Date().getTime() / (3600 * 24 * 1000));
@@ -211,7 +142,7 @@ export class DonationsComponent implements OnInit, OnDestroy {
.then((confirmed) => {
if (confirmed) {
this._bookService
- .renewChooseDate(event.data.id)
+ .renewChooseDate(param.id)
.pipe(takeUntil(this._destroySubscribes$))
.subscribe(
() => {
@@ -230,12 +161,12 @@ export class DonationsComponent implements OnInit, OnDestroy {
}
case 'trackNumber': {
if (
- event.data.status !== BookDonationStatus.WAITING_SEND &&
- event.data.status !== BookDonationStatus.SENT
+ param.status !== BookDonationStatus.WAITING_SEND &&
+ param.status !== BookDonationStatus.SENT
) {
alert(
`Não é possível informar código de rastreio. \nstatus requerido = ${BookDonationStatus.WAITING_SEND} ` +
- `ou ${BookDonationStatus.SENT}\nstatus atual = ${event.data.status}`
+ `ou ${BookDonationStatus.SENT}\nstatus atual = ${param.status}`
);
return;
}
@@ -258,19 +189,19 @@ export class DonationsComponent implements OnInit, OnDestroy {
}
);
- modalRef.componentInstance.bookId = event.data.id;
- modalRef.componentInstance.bookTitle = event.data.title;
- modalRef.componentInstance.trackingNumber = event.data.trackingNumber;
+ modalRef.componentInstance.bookId = param.id;
+ modalRef.componentInstance.bookTitle = param.title;
+ modalRef.componentInstance.trackingNumber = param.trackingNumber;
break;
}
case 'CancelDonation': {
// chamada do modal de confirmação antes de efetuar a ação do btnCancelDonation
if (
- event.data.status === BookDonationStatus.RECEIVED ||
- event.data.status === BookDonationStatus.CANCELED
+ param.status === BookDonationStatus.RECEIVED ||
+ param.status === BookDonationStatus.CANCELED
) {
alert(
- `Não é possível cancelar essa doação com status = ${event.data.status}`
+ `Não é possível cancelar essa doação com status = ${param.status}`
);
return;
}
@@ -279,7 +210,7 @@ export class DonationsComponent implements OnInit, OnDestroy {
.then((confirmed) => {
if (confirmed) {
this._bookService
- .cancelDonation(event.data.id)
+ .cancelDonation(param.id)
.pipe(takeUntil(this._destroySubscribes$))
.subscribe((resp) => {
if (resp['success']) {
@@ -294,9 +225,9 @@ export class DonationsComponent implements OnInit, OnDestroy {
}
case 'ShowWinnerInfo': {
- if (event.data.status !== BookDonationStatus.WAITING_SEND &&
- event.data.status !== BookDonationStatus.SENT &&
- event.data.status !== BookDonationStatus.RECEIVED) {
+ if (param.status !== BookDonationStatus.WAITING_SEND &&
+ param.status !== BookDonationStatus.SENT &&
+ param.status !== BookDonationStatus.RECEIVED) {
alert(
`Você ainda não escolheu o ganhador.`
);
@@ -307,14 +238,18 @@ export class DonationsComponent implements OnInit, OnDestroy {
centered: true,
});
- modalRef.componentInstance.bookId = event.data.id;
- modalRef.componentInstance.bookTitle = event.data.title;
+ modalRef.componentInstance.bookId = param.id;
+ modalRef.componentInstance.bookTitle = param.title;
break;
}
}
}
+ public doFilter = (value: string) => {
+ this.donatedBooks.filter = value.trim().toLocaleLowerCase();
+ }
+
ngOnDestroy() {
this._destroySubscribes$.next();
this._destroySubscribes$.complete();
diff --git a/src/app/components/book/donor-modal/donor-modal.component.spec.ts b/src/app/components/book/donor-modal/donor-modal.component.spec.ts
index 60443cba..4aa27a57 100644
--- a/src/app/components/book/donor-modal/donor-modal.component.spec.ts
+++ b/src/app/components/book/donor-modal/donor-modal.component.spec.ts
@@ -1,6 +1,9 @@
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
+import { HttpClientTestingModule } from '@angular/common/http/testing';
import { DonorModalComponent } from './donor-modal.component';
+import { AppConfigModule } from '../../../app-config.module';
describe('DonorModalComponent', () => {
let component: DonorModalComponent;
@@ -8,9 +11,14 @@ describe('DonorModalComponent', () => {
beforeEach(async(() => {
TestBed.configureTestingModule({
- declarations: [ DonorModalComponent ]
+ declarations: [DonorModalComponent],
+ imports: [
+ HttpClientTestingModule,
+ AppConfigModule
+ ],
+ providers: [NgbActiveModal]
})
- .compileComponents();
+ .compileComponents();
}));
beforeEach(() => {
diff --git a/src/app/components/book/form/form.component.html b/src/app/components/book/form/form.component.html
index 76d62f44..cc597e0e 100644
--- a/src/app/components/book/form/form.component.html
+++ b/src/app/components/book/form/form.component.html
@@ -1,36 +1,20 @@
-