Open-ILS/src/eg2/src/app/staff/sandbox/sandbox.component.html

   1
   2 <eg-staff-banner bannerText="Sandbox" i18n-bannerText>
   3 </eg-staff-banner>
   4
   5 <eg-title
   6   i18n-prefix i18n-suffix
   7   prefix=":) {{dynamicTitleText}}"
   8   suffix="Sandbox">
   9 </eg-title>
  10
  11 <div class="row flex pt-2">
  12   <div i18n> Modify Page Title: </div>
  13   <div class="col-lg-2">
  14     <input type="text" [(ngModel)]="dynamicTitleText" class="form-control"/>
  15   </div>
  16 </div>
  17
  18 <!-- FM Editor Experiments ----------------------------- -->
  19 <div class="row mb-3">
  20   <ng-template #descriptionTemplate
  21       let-field="field" let-record="record" let-hello="hello">
  22   <!-- example custom template for editing the 'description' field -->
  23     <textarea
  24       placeholder="{{hello}}"
  25       class="form-control"
  26       name="{{field.name}}"
  27       [readonly]="field.readOnly"
  28       [required]="field.isRequired()"
  29       [ngModel]="record[field.name]()"
  30       (ngModelChange)="record[field.name]($event)">
  31     </textarea>
  32   </ng-template>
  33   <eg-fm-record-editor #fmRecordEditor
  34       idlClass="cmrcfld" mode="create"
  35       [customFieldTemplates]="{description:{template:descriptionTemplate,context:{'hello':'goodbye'}}}"
  36       recordId="1" orgDefaultAllowed="owner">
  37   </eg-fm-record-editor>
  38   <button class="btn btn-dark" (click)="fmRecordEditor.open({size:'lg'})">
  39       Fm Record Editor
  40   </button>
  41 </div>
  42 <!-- / FM Editor Experiments ----------------------------- -->
  43
  44 <!-- Progress Dialog Experiments ----------------------------- -->
  45 <div class="row mb-3">
  46   <div class="col-lg-3">
  47     <button class="btn btn-outline-danger" (click)="progress.increment()">Increment Inline</button>
  48   </div>
  49   <div class="col-lg-3">
  50     <eg-progress-inline [max]="100" [value]="1" #progress></eg-progress-inline>
  51   </div>
  52 </div>
  53 <div class="row mb-3">
  54   <div class="col-lg-4">
  55     <eg-progress-dialog #progressDialog>
  56     </eg-progress-dialog>
  57     <button class="btn btn-light" (click)="showProgress()">Test Progress Dialog</button>
  58   </div>
  59   <div class="col-lg-3">
  60     <eg-combobox [allowFreeText]="true"
  61       placeholder="Combobox with static data"
  62       [entries]="cbEntries"></eg-combobox>
  63   </div>
  64   <div class="col-lg-3">
  65     <eg-combobox
  66       placeholder="Combobox with dynamic data"
  67       [asyncDataSource]="cbAsyncSource"></eg-combobox>
  68   </div>
  69 </div>
  70 <div class="row mb-3">
  71   <div class="col-lg-4">
  72    <button class="btn btn-info" (click)="testToast()">Test Toast Message</button>
  73   </div>
  74   <div class="col-lg-2">
  75     Org select with limit perms
  76   </div>
  77   <div class="col-lg-2">
  78     <eg-org-select [limitPerms]="['REGISTER_WORKSTATION']">
  79     </eg-org-select>
  80   </div>
  81 </div>
  82 <!-- /Progress Dialog Experiments ----------------------------- -->
  83
  84 <!-- eg strings -->
  85 <!--
  86 <div class="row mb-3">
  87     <eg-string #helloString text="Hello, {{name}}" i18n-text></eg-string>
  88     <button class="btn btn-success" (click)="testStrings()">Test Strings</button>
  89 </div>
  90 -->
  91
  92 <div class="row mb-3">
  93     <ng-template #helloStrTmpl let-name="name" i18n>Hello, {{name}}</ng-template>
  94     <!--
  95     <eg-string #helloStr key="helloKey" [template]="helloStrTmpl"></eg-string>
  96     -->
  97     <eg-string key="staff.sandbox.test" [template]="helloStrTmpl"></eg-string>
  98     <button class="btn btn-success" (click)="testStrings()">Test Strings</button>
  99 </div>
 100
 101 <div class="row">
 102   <div class="form-group">
 103     <eg-date-select (onChangeAsDate)="changeDate($event)"
 104         initialYmd="2017-03-04">
 105     </eg-date-select>
 106   </div>
 107   <div>HERE: {{testDate}}</div>
 108 </div>
 109
 110 <!-- printing -->
 111
 112 <button class="btn btn-secondary" (click)="doPrint()">Test Print</button>
 113 <ng-template #printTemplate let-context>Hello, {{context.world}}!</ng-template>
 114
 115 <br/><br/>
 116 <div class="row">
 117   <div class="col-lg-3">
 118     <eg-translate #translate [idlObject]="oneBtype" fieldName="name"></eg-translate>
 119     <button class="btn btn-info"
 120       (click)="translate.open({size:'lg'})">Translate</button>
 121   </div>
 122 </div>
 123 <br/><br/>
 124
 125 <!-- grid stuff -->
 126 <ng-template #cellTmpl let-row="row" let-col="col" let-userContext="userContext">
 127   HELLO {{userContext.hello}}
 128   <button>{{row.id()}}</button>
 129 </ng-template>
 130 <eg-grid #cbtGrid idlClass="cbt"
 131   [dataSource]="btSource"
 132   [rowClassCallback]="btGridRowClassCallback"
 133   [rowFlairIsEnabled]="true"
 134   [rowFlairCallback]="btGridRowFlairCallback"
 135   [cellClassCallback]="btGridCellClassCallback"
 136   [sortable]="true">
 137   <eg-grid-toolbar-action label="Action that needs a single row" i18n-label
 138     [action]="complimentEvergreen" [disableOnRows]="notOneSelectedRow">
 139   </eg-grid-toolbar-action>
 140   <eg-grid-column name="test" [cellTemplate]="cellTmpl"
 141     [cellContext]="btGridTestContext" [sortable]="false">
 142   </eg-grid-column>
 143   <eg-grid-column [sortable]="false" path="owner.name"></eg-grid-column>
 144 </eg-grid>
 145
 146 <br/><br/>
 147
 148