LP1819179 PCRUD selector fleshing handles maps
[working/Evergreen.git] / 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-column [sortable]="false" path="datetime_test" 
145     datatype="timestamp" [datePlusTime]="true"></eg-grid-column>
146 </eg-grid>
147
148 <br/><br/>
149
150 <h4>PCRUD auto flesh and FormatService detection</h4>
151 <div *ngIf="aMetarecord">Fingerprint: {{aMetarecord}}</div>
152