VOLCOPY Item attr batch component
authorBill Erickson <berickxx@gmail.com>
Wed, 17 Jun 2020 20:35:58 +0000 (16:35 -0400)
committerBill Erickson <berickxx@gmail.com>
Wed, 17 Jun 2020 20:35:58 +0000 (16:35 -0400)
Signed-off-by: Bill Erickson <berickxx@gmail.com>
Open-ILS/src/eg2/src/app/staff/share/holdings/batch-item-attr.component.html
Open-ILS/src/eg2/src/app/staff/share/holdings/batch-item-attr.component.ts

index 8597d91..e8f00a2 100644 (file)
@@ -4,7 +4,8 @@
     {{label}} <span *ngIf="hasChanged" class="text-danger">*</span>
   </div>
   <div *ngIf="!editing" tabindex="0" class="p-2"
-    [ngClass]="{'has-changes': hasChanged}" (click)="toggleEditMode()">
+    [ngClass]="{'has-changes': hasChanged}" (keyup.enter)="toggleEditMode()" 
+      (click)="toggleEditMode()">
     <div class="d-flex" 
       *ngFor="let count of labelCounts | keyvalue">
       <div class="flex-1">
index fe10d34..408ebf9 100644 (file)
@@ -1,4 +1,4 @@
-import {Component, OnInit, Input, Output, ViewChild, Renderer2, TemplateRef,
+import {Component, OnInit, Input, Output, ViewChild, TemplateRef,
     EventEmitter} from '@angular/core';
 import {StringComponent} from '@eg/share/string/string.component';
 
@@ -30,6 +30,8 @@ export class BatchItemAttrComponent {
     // interact with the template in any way.
     @Input() editTemplate: TemplateRef<any>;
 
+    @Input() editInputDomId = '';
+
     // In some cases, we can map display labels to something more
     // human friendly.
     @Input() displayAs: 'bool' | 'currency' = null;
@@ -62,8 +64,17 @@ export class BatchItemAttrComponent {
     }
 
     toggleEditMode() {
-        if (!this.readOnly) {
-            this.editing = !this.editing;
+        if (this.readOnly) { return; }
+
+        this.editing = !this.editing;
+
+        // Avoid using selectRootElement to focus.
+        // https://stackoverflow.com/a/36059595
+        if (this.editing && this.editInputDomId) {
+            setTimeout(() => {
+                const node = document.getElementById(this.editInputDomId);
+                if (node) { node.focus(); }
+            });
         }
     }
 }