placeholder="yyyy-mm-dd"
class="form-control"
name="{{fieldName}}"
+ [disabled]="_disabled"
[required]="required"
[(ngModel)]="current"
(dateSelect)="onDateSelect($event)">
<div class="input-group-append">
- <button class="btn btn-outline-secondary"
+ <button class="btn btn-outline-secondary" [disabled]="_disabled"
(click)="datePicker.toggle()" type="button">
<span title="Select Date" i18n-title
class="material-icons mat-icon-in-button">calendar_today</span>
@Input() required: boolean;
@Input() fieldName: string;
+ _disabled: boolean;
+ @Input() set disabled(d: boolean) {
+ this._disabled = d;
+ }
+
current: NgbDateStruct;
@Output() onChangeAsDate: EventEmitter<Date>;
@Component({
selector: 'eg-fm-record-editor',
- templateUrl: './fm-editor.component.html'
+ templateUrl: './fm-editor.component.html',
+ /* align checkboxes when not using class="form-check" */
+ styles: ['input[type="checkbox"] {margin-left: 0px;}']
})
export class FmRecordEditorComponent
extends DialogComponent implements OnInit {
import {RecordActionsComponent} from './record/actions.component';
import {HoldingsService} from '@eg/staff/share/holdings.service';
import {BasketActionsComponent} from './basket-actions.component';
+import {HoldComponent} from './hold/hold.component';
@NgModule({
declarations: [
ResultPaginationComponent,
RecordPaginationComponent,
RecordActionsComponent,
- BasketActionsComponent
+ BasketActionsComponent,
+ HoldComponent
],
imports: [
StaffCommonModule,
--- /dev/null
+<h4>Place Hold</h4>
+
+<form class="form form-validated common-form striped-odd" autocomplete="off">
+ <div class="row">
+ <div class="col-lg-3">
+ <div class="form-check">
+ <input class="form-check-input" type="radio"
+ name="holdFor" value="patron" [(ngModel)]="holdFor"/>
+ <label class="form-check-label" i18n>
+ Place hold for patron by barcode:
+ </label>
+ </div>
+ </div>
+ <div class="col-lg-3">
+ <input type='text' class="form-control" name="patronBarcode"
+ [disabled]="holdFor!='patron'" id='patron-barcode' [(ngModel)]="patronBarcode"/>
+ </div>
+ </div>
+ <div class="row mt-2">
+ <div class="col-lg-3">
+ <div class="form-check">
+ <input class="form-check-input" type="radio"
+ name="holdFor" value="staff" [(ngModel)]="holdFor"/>
+ <label class="form-check-label" i18n>
+ Place hold for this staff account:
+ </label>
+ </div>
+ </div>
+ <div class="col-lg-3">
+ <span class="font-weight-bold">{{requestor.usrname()}}</span>
+ </div>
+ </div>
+ <div class="row mt-2">
+ <div class="col-lg-3">
+ <label i18n>Pickup Location: </label>
+ </div>
+ <div class="col-lg-3">
+ <eg-org-select [applyOrgId]="pickupLib"></eg-org-select>
+ </div>
+ </div>
+ <div class="row mt-2">
+ <div class="col-lg-3">
+ <div class="form-check">
+ <input class="form-check-input" type="checkbox" name="notifyEmail"
+ [disabled]="!user.email()" [(ngModel)]="notifyEmail"/>
+ <label class="form-check-label" i18n>Notify by Email</label>
+ </div>
+ </div>
+ <div class="col-lg-3">
+ <div class="input-group">
+ <div class="input-group-prepend">
+ <span class="input-group-text" i18n>Email Address</span>
+ </div>
+ <input type="text" class="form-control" name="userEmail"
+ [disabled]="true" value="{{user.email()}}"/>
+ </div>
+ </div>
+ </div>
+ <div class="row mt-2">
+ <div class="col-lg-3">
+ <div class="form-check">
+ <input class="form-check-input" type="checkbox"
+ name="notifyPhone" [(ngModel)]="notifyPhone"/>
+ <label class="form-check-label" i18n>Notify by Phone</label>
+ </div>
+ </div>
+ <div class="col-lg-3">
+ <div class="input-group">
+ <div class="input-group-prepend">
+ <span class="input-group-text" i18n>Phone Number</span>
+ </div>
+ <input type="text" class="form-control" [disabled]="!notifyPhone"
+ name="phoneValue" [(ngModel)]="phoneValue"/>
+ </div>
+ </div>
+ </div>
+ <div class="row mt-2">
+ <div class="col-lg-3">
+ <div class="form-check">
+ <input class="form-check-input" type="checkbox"
+ name="suspend" [(ngModel)]="suspend"/>
+ <label class="form-check-label" i18n>Suspend Hold</label>
+ </div>
+ </div>
+ <div class="col-lg-3">
+ <eg-date-select (onChangeAsISO)="activeDateSelected($event)"
+ [disabled]="!suspend">
+ </eg-date-select>
+ </div>
+ </div>
+</form>
+
+
--- /dev/null
+import {Component, OnInit, Input, ViewChild, Renderer2} from '@angular/core';
+import {Router, ActivatedRoute, ParamMap} from '@angular/router';
+import {AuthService} from '@eg/core/auth.service';
+import {PcrudService} from '@eg/core/pcrud.service';
+import {IdlObject} from '@eg/core/idl.service';
+import {CatalogSearchContext, CatalogSearchState} from '@eg/share/catalog/search-context';
+import {CatalogService} from '@eg/share/catalog/catalog.service';
+import {BibRecordService, BibRecordSummary} from '@eg/share/catalog/bib-record.service';
+import {StaffCatalogService} from '../catalog.service';
+import {BibSummaryComponent} from '@eg/staff/share/bib-summary/bib-summary.component';
+
+@Component({
+ templateUrl: 'hold.component.html'
+})
+export class HoldComponent implements OnInit {
+
+ holdType: string;
+ holdTargets: number[];
+ user: IdlObject; //
+ requestor: IdlObject;
+ holdFor: string;
+ pickupLib: number;
+ notifyEmail: boolean;
+ notifyPhone: boolean;
+ phoneValue: string;
+ suspend: boolean;
+ activeDate: string;
+
+ constructor(
+ private router: Router,
+ private route: ActivatedRoute,
+ private renderer: Renderer2,
+ private auth: AuthService,
+ private pcrud: PcrudService,
+ private bib: BibRecordService,
+ private cat: CatalogService,
+ private staffCat: StaffCatalogService
+ ) {}
+
+ ngOnInit() {
+
+ this.holdType = this.route.snapshot.params['type'];
+ this.holdTargets = this.route.snapshot.queryParams['target'];
+
+ if (!Array.isArray(this.holdTargets)) {
+ this.holdTargets = [this.holdTargets];
+ }
+
+ this.holdFor = 'patron';
+ this.requestor = this.user = this.auth.user();
+ this.pickupLib = this.auth.user().ws_ou();
+
+ // Focus barcode input
+ setTimeout(() =>
+ this.renderer.selectRootElement('#patron-barcode').focus());
+ }
+
+ holdForChanged() {
+ console.log('placing hold for ' + this.holdFor);
+
+ if (this.holdFor === 'patron') {
+ // Patron lookup occurs via onchange on the barcode
+ // input or via the patron search form.
+ } else {
+ this.user = this.requestor;
+ }
+ }
+
+ activeDateSelected(dateStr: string) {
+ this.activeDate = dateStr;
+ }
+}
+
+
import {ResultsComponent} from './result/results.component';
import {RecordComponent} from './record/record.component';
import {CatalogResolver} from './resolver.service';
+import {HoldComponent} from './hold/hold.component';
const routes: Routes = [{
path: '',
path: 'record/:id',
component: RecordComponent
}, {
+ path: 'hold/:type',
+ component: HoldComponent
+ }, {
path: 'record/:id/:tab',
component: RecordComponent
}]
.common-form label {
font-weight: bold;
}
-.common-form input[type="checkbox"] {
- /* BS adds a negative left margin */
- margin-left: 0px;
-}
+
.common-form.striped-even .row:nth-child(even) {
background-color: rgba(0,0,0,.03);
border-top: 1px solid rgba(0,0,0,.125);