Open-ILS/src/eg2/src/app/staff/acq/po/summary.component.html

   1
   2 <eg-acq-cancel-dialog #cancelDialog></eg-acq-cancel-dialog>
   3 <eg-progress-dialog #progressDialog></eg-progress-dialog>
   4
   5 <div *ngIf="po()" class="p-1 border border-secondary rounded">
   6
   7   <div class="row">
   8     <div class="col-lg-9">
   9
  10       <div class="row">
  11         <div class="col-lg-3 d-flex">
  12           <div class="flex-2" i18n>PO ID:</div>
  13           <div class="flex-3">{{poId}}</div>
  14         </div>
  15         <div class="col-lg-9 d-flex">
  16           <div class="flex-1" i18n>PO Name:</div>
  17           <div class="flex-6">
  18             <ng-container *ngIf="editPoName">
  19               <input id='pl-name-input' type="text" class="form-control"
  20                 [(ngModel)]="newPoName" (keyup.enter)="toggleNameEdit(true)"
  21                 (blur)="toggleNameEdit()"/>
  22             </ng-container>
  23             <ng-container *ngIf="!editPoName">
  24               <a (click)="toggleNameEdit()" href='javascript:;'
  25                 class='font-weight-bold'>{{po().name()}}</a>
  26             </ng-container>
  27           </div>
  28         </div>
  29       </div>
  30
  31       <div class="row">
  32         <div class="col-lg-3 d-flex">
  33           <div class="flex-2" i18n>Lineitems:</div>
  34           <div class="flex-3">{{po().lineitem_count()}}</div>
  35         </div>
  36         <div class="col-lg-9 d-flex">
  37           <div class="flex-1" i18n>Provider:</div>
  38           <div class="flex-6">
  39             <a routerLink="/staff/acq/provider/{{po().provider().id()}}/details">
  40               {{po().provider().name()}}
  41             </a>
  42           </div>
  43         </div>
  44       </div>
  45       <div class="row">
  46         <div class="col-lg-3 d-flex">
  47           <div class="flex-2" i18n>Activated:</div>
  48           <div class="flex-3">
  49             <span *ngIf="po().order_date()">{{po().order_date() | date:'short'}}</span>
  50             <span *ngIf="!po().order_date()" i18n>N/A</span>
  51           </div>
  52         </div>
  53         <div class="col-lg-9 d-flex">
  54           <div class="flex-1" i18n>Status:</div>
  55           <div class="flex-6">
  56             <div class="w-50" *ngIf="canActivate === null">
  57               <eg-progress-inline></eg-progress-inline>
  58             </div>
  59
  60             <span *ngIf="po().state() == 'on-order'" i18n>On Order</span>
  61             <ng-container *ngIf="canActivate">
  62               <span *ngIf="!activationEvent" i18n>Pending / Activatable</span>
  63               <span *ngIf="activationEvent" i18n>
  64                 Activation Error: {{activationEvent.textcode}} {{activationEvent.desc}}
  65               </span>
  66             </ng-container>
  67
  68             <!-- canceled -->
  69             <ng-container *ngIf="po().cancel_reason()">
  70               <span class="text-danger" i18n>
  71                 {{po().cancel_reason().label()}} =&gt; {{po().cancel_reason().description()}}
  72               </span>
  73             </ng-container>
  74
  75             <!-- activation blocks -->
  76             <div class="text-danger" *ngFor="let evt of activationBlocks">
  77               <ng-container
  78                 *ngIf="evt.textcode == 'ACQ_FUND_EXCEEDS_STOP_PERCENT'; else fundWarn">
  79                 <span i18n>
  80                   Fund exceeds stop percent:
  81                   {{evt.payload.fund.code()}} ({{evt.payload.fund.year()}}).
  82                 </span>
  83               </ng-container>
  84               <ng-template #fundWarn>
  85                 <ng-container
  86                   *ngIf="evt.textcode == 'ACQ_FUND_EXCEEDS_WARN_PERCENT'; else noPrice">
  87                   <span i18n>
  88                     Fund exceeds warning percent:
  89                     {{evt.payload.fund.code()}} ({{evt.payload.fund.year()}}).
  90                   </span>
  91                 </ng-container>
  92               </ng-template>
  93               <ng-template #noPrice>
  94                 <ng-container
  95                   *ngIf="evt.textcode == 'ACQ_LINEITEM_NO_PRICE'; else noCopies">
  96                   <span i18n>One or more lineitems have no price.</span>
  97                 </ng-container>
  98               </ng-template>
  99               <ng-template #noCopies>
 100                 <ng-container
 101                   *ngIf="evt.textcode == 'ACQ_LINEITEM_NO_COPIES'; else otherBlock">
 102                   <span i18n>One or more lineitems have no items attached.</span>
 103                 </ng-container>
 104               </ng-template>
 105               <ng-template #otherBlock>
 106                 <span i18n>{{evt.textcode}} : {{evt.desc}}</span>
 107               </ng-template>
 108             </div>
 109           </div>
 110         </div>
 111       </div>
 112       <hr class="p-0 m-0 mt-1"/>
 113       <div class="row mt-1">
 114         <div class="col-lg-12">
 115           <a class="" href="javascript:;" (click)="showNotes=!showNotes"
 116             i18n>Notes ({{po().notes().length}})</a>
 117           <span class="pl-2 pr-2" i18n> | </span>
 118           <a [queryParams]="{f: 'acqpo:id', val1: poId}"
 119             routerLink="/staff/acq/search/invoices" i18n>Invoices ({{invoiceCount}})</a>
 120           <span class="pl-2 pr-2" i18n> | </span>
 121           <a href="/eg/acq/invoice/view?create=1&attach_po={{poId}}"
 122             i18n>Create Invoice</a>
 123           <span class="pl-2 pr-2" i18n> | </span>
 124           <a routerLink="./edi" i18n>EDI Messages ({{ediMessageCount}})</a>
 125           <span class="pl-2 pr-2" i18n> | </span>
 126           <a routerLink="./history" i18n>History</a>
 127           <span class="pl-2 pr-2" i18n> | </span>
 128           <a routerLink="./printer" i18n>Print</a>
 129           <ng-container *ngIf="po().state() == 'on-order' || po().state() == 'pending'">
 130             <span class="pl-2 pr-2" i18n> | </span>
 131             <a (click)="cancelPo()" href="javascript:;" i18n>Cancel Order</a>
 132           </ng-container>
 133           <ng-container *ngIf="canActivate === true">
 134             <span class="pl-2 pr-2" i18n> | </span>
 135             <a (click)="activatePo()" href="javascript:;" i18n>Activate Order</a>
 136           </ng-container>
 137         </div>
 138       </div>
 139     </div>
 140     <div class="col-lg-3">
 141       <div class="row">
 142         <div class="col-lg-8" i18n>Estimated Amount:</div>
 143         <div class="col-lg-4">{{po().amount_estimated() | currency}}</div>
 144       </div>
 145       <div class="row">
 146         <div class="col-lg-8" i18n>Encumbered Amount:</div>
 147         <div class="col-lg-4">{{po().amount_encumbered() | currency}}</div>
 148       </div>
 149       <div class="row">
 150         <div class="col-lg-8" i18n>Spent Amount:</div>
 151         <div class="col-lg-4">{{po().amount_spent() | currency}}</div>
 152       </div>
 153       <div class="row">
 154         <div class="col-lg-8" i18n>Prepayment Required?</div>
 155         <div class="col-lg-4">
 156           <eg-bool [value]="po().provider().prepayment_required()"></eg-bool>
 157         </div>
 158       </div>
 159     </div>
 160   </div>
 161   <div class="row" *ngIf="showNotes">
 162     <div class="col-lg-10 offset-lg-1 p-2 mt-2 shadow">
 163       <eg-po-notes [po]="po()" (closeRequested)="showNotes = false">
 164       </eg-po-notes>
 165     </div>
 166   </div>
 167 </div>
 168