circulation: Fees tab implementation

* Implements Fee tab for a patron account.
* Adapts existing features concerning fees.
* Create PatronTransaction service.

Co-Authored-by: Renaud Michotte <renaud.michotte@gmail.com>

projects/admin/src/app/app.component.spec.ts

@@ -19,7 +19,7 @@ import { TestBed, async } from '@angular/core/testing';
 import { RouterTestingModule } from '@angular/router/testing';
 import { AppComponent } from './app.component';
 import { MenuComponent } from './menu/menu.component';
-import { CollapseModule, BsDatepickerModule, TypeaheadModule } from 'ngx-bootstrap';
+import { CollapseModule, BsDatepickerModule, TypeaheadModule, BsDropdownModule } from 'ngx-bootstrap';
 import { RecordModule } from '@rero/ng-core';
 import { HttpClientModule } from '@angular/common/http';
 import { TranslateModule } from '@ngx-translate/core';
@@ -36,6 +36,7 @@ describe('AppComponent', () => {
         RecordModule,
         HttpClientModule,
         BsDatepickerModule.forRoot(),
+        BsDropdownModule.forRoot(),
         TranslateModule.forRoot({}),
         TypeaheadModule.forRoot()
       ],

projects/admin/src/app/app.module.ts

@@ -23,7 +23,15 @@ import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
 import { FormlyModule } from '@ngx-formly/core';
 import { TranslateLoader as BaseTranslateLoader, TranslateModule } from '@ngx-translate/core';
 import { CoreConfigService, RecordModule, TranslateService } from '@rero/ng-core';
-import { BsDatepickerModule, BsLocaleService, CollapseModule, TabsModule, TooltipModule, TypeaheadModule } from 'ngx-bootstrap';
+import {
+  BsDatepickerModule,
+  BsDropdownModule,
+  BsLocaleService,
+  CollapseModule,
+  TabsModule,
+  TooltipModule,
+  TypeaheadModule
+} from 'ngx-bootstrap';
 import { UiSwitchModule } from 'ngx-toggle-switch';
 import { AppRoutingModule } from './app-routing.module';
 import { AppComponent } from './app.component';
@@ -169,6 +177,7 @@ import { TranslateLoader } from './translate/loader/translate-loader';
     BrowserAnimationsModule,
     BrowserModule,
     BsDatepickerModule.forRoot(),
+    BsDropdownModule.forRoot(),
     CollapseModule.forRoot(),
     FormsModule,
     HttpClientModule,

projects/admin/src/app/circulation/circulation-routing.module.ts

@@ -24,6 +24,7 @@ import { MainComponent } from './patron/main/main.component';
 import { ProfileComponent } from './patron/profile/profile.component';
 import { RequestedComponent } from './patron/requested/requested.component';
 import { PickupComponent } from './patron/pickup/pickup.component';
+import { PatronTransactionsComponent } from './patron/patron-transactions/patron-transactions.component';
 
 const routes: Routes = [
   {
@@ -55,6 +56,10 @@ const routes: Routes = [
       {
         path: 'profile',
         component: ProfileComponent
+      },
+      {
+        path: 'fees',
+        component: PatronTransactionsComponent
       }
     ]
   }, {

projects/admin/src/app/circulation/circulation.module.ts

@@ -16,24 +16,37 @@
  */
 
 
-import { CommonModule } from '@angular/common';
-import { NgModule } from '@angular/core';
-import { RecordModule } from '@rero/ng-core';
 import { BsDropdownModule, CollapseModule } from 'ngx-bootstrap';
+import { CardComponent } from './patron/card/card.component';
 import { CheckoutComponent } from './checkout/checkout.component';
 import { CirculationRoutingModule } from './circulation-routing.module';
+import { CommonModule } from '@angular/common';
+import { FormlyModule } from '@ngx-formly/core';
+import { FormsModule, ReactiveFormsModule } from '@angular/forms';
 import { ItemComponent } from './item/item.component';
 import { ItemsListComponent } from './items-list/items-list.component';
-import { MainRequestComponent } from './main-request/main-request.component';
-import { CardComponent } from './patron/card/card.component';
 import { LoanComponent } from './patron/loan/loan.component';
 import { MainComponent } from './patron/main/main.component';
-import { RequestedItemsListComponent } from './requested-items-list/requested-items-list.component';
+import { MainRequestComponent } from './main-request/main-request.component';
+import { NgModule } from '@angular/core';
+import { PatronTransactionsComponent } from './patron/patron-transactions/patron-transactions.component';
+import {
+  PatronTransactionComponent
+} from './patron/patron-transactions/patron-transaction/patron-transaction.component';
+import {
+  PatronTransactionEventComponent
+} from './patron/patron-transactions/patron-transaction-event/patron-transaction-event.component';
+import {
+  PatronTransactionEventFormComponent
+} from './patron/patron-transactions/patron-transaction-event-form/patron-transaction-event-form.component';
+import { PickupComponent } from './patron/pickup/pickup.component';
+import { PickupItemComponent } from './patron/pickup/pickup-item/pickup-item.component';
 import { ProfileComponent } from './patron/profile/profile.component';
+import { RecordModule } from '@rero/ng-core';
 import { RequestedComponent } from './patron/requested/requested.component';
 import { RequestedItemComponent } from './patron/requested/requested-item/requested-item.component';
-import { PickupComponent } from './patron/pickup/pickup.component';
-import { PickupItemComponent } from './patron/pickup/pickup-item/pickup-item.component';
+import { RequestedItemsListComponent } from './requested-items-list/requested-items-list.component';
+
 
 @NgModule({
   declarations: [
@@ -49,14 +62,24 @@ import { PickupItemComponent } from './patron/pickup/pickup-item/pickup-item.com
     RequestedComponent,
     RequestedItemComponent,
     PickupComponent,
-    PickupItemComponent
+    PickupItemComponent,
+    PatronTransactionsComponent,
+    PatronTransactionComponent,
+    PatronTransactionEventComponent,
+    PatronTransactionEventFormComponent
   ],
   imports: [
     CommonModule,
     CirculationRoutingModule,
     BsDropdownModule.forRoot(),
     CollapseModule.forRoot(),
-    RecordModule
+    RecordModule,
+    FormsModule,
+    ReactiveFormsModule,
+    FormlyModule
+  ],
+  entryComponents: [
+    PatronTransactionEventFormComponent
   ]
 })
 export class CirculationModule { }

projects/admin/src/app/circulation/item/item.component.html

@@ -33,7 +33,7 @@
       [routerLink]="['/records','documents','detail', item.document.pid]">{{ item.document.title | truncateText: 12 }}</a>
   </div>
   <!-- CIRCULATION INFO -->
-  <div class="col-lg-4">
+  <div class="col-lg-3">
     <ul class="list-unstyled mb-0">
       <ng-container [ngSwitch]="item.status">
         <li *ngSwitchCase="'on_loan'">{{ item.status | translate }} <i class="fa fa-arrow-right" aria-hidden="true"></i>
@@ -51,15 +51,15 @@
       </ng-container>
       <!-- RENEWALS, FEES, REQUESTS -->
       <li>
-        <span title="{{'Renewals' | translate }}" class="badge badge-secondary font-weight-normal mr-1"
-          *ngIf="item.loan && item.loan.extension_count">
+        <span title="{{ 'Renewals' | translate }}" class="badge badge-secondary font-weight-normal mr-1"
+              *ngIf="item.loan && item.loan.extension_count">
           {{ item.loan.extension_count }} <i class="fa fa-refresh"></i>
         </span>
-        <span title="{{'Fees' | translate }}" class="badge badge-secondary font-weight-normal mr-1"
-          *ngIf="totalAmountOfFee > 0">
+        <span title="{{ 'Fees' | translate }}" class="badge badge-warning font-weight-normal mr-1"
+              *ngIf="totalAmountOfFee > 0">
           {{ totalAmountOfFee | currency: organisation.default_currency }}</span>
-        <span title="{{'Requests' | translate }}" class="badge badge-secondary font-weight-normal mr-1"
-          *ngIf="item.pending_loans && item.pending_loans.length">
+        <span title="{{ 'Requests' | translate }}" class="badge badge-secondary font-weight-normal mr-1"
+              *ngIf="item.pending_loans && item.pending_loans.length">
           {{ item.pending_loans.length }} <i class="fa fa-exclamation-circle"></i>
         </span>
       </li>