LP1823393 FMEditor component i18n translate buttons
authorBill Erickson <berickxx@gmail.com>
Fri, 5 Apr 2019 18:59:43 +0000 (14:59 -0400)
committerJane Sandberg <sandbej@linnbenton.edu>
Fri, 24 May 2019 17:56:12 +0000 (10:56 -0700)
When editing a record in the fieldmapper editor component, offer a
translate option for each i18n field on the object, in the form of a
button next to the field.  Once clicked, the translate component dialog
appears and allows the user to add/modify translations on the selected
field.

Signed-off-by: Bill Erickson <berickxx@gmail.com>
Signed-off-by: Galen Charlton <gmc@equinoxinitiative.org>
Signed-off-by: Jane Sandberg <sandbej@linnbenton.edu>
Open-ILS/src/eg2/src/app/share/fm-editor/fm-editor.component.html
Open-ILS/src/eg2/src/app/share/fm-editor/fm-editor.component.ts
Open-ILS/src/eg2/src/app/staff/share/translate/translate.component.ts

index aad65d1..1b0935f 100644 (file)
@@ -1,3 +1,6 @@
+<!-- idlObject and fieldName applied programmatically -->
+<eg-translate #translator></eg-translate>
+
 <ng-template #dialogContent>
   <div class="modal-header bg-info">
     <h4 class="modal-title" i18n>Record Editor: {{recordLabel}}</h4>
@@ -10,7 +13,7 @@
   <div class="modal-body">
     <form #fmEditForm="ngForm" role="form" class="form-validated common-form striped-odd">
       <div class="form-group row" *ngFor="let field of fields">
-        <div class="col-lg-3 offset-lg-1">
+        <div class="col-lg-3">
           <label for="{{idPrefix}}-{{field.name}}">{{field.label}}</label>
         </div>
         <div class="col-lg-7">
             </ng-container>
           </ng-container> <!-- switch -->
         </div>
+        <div class="col-lg-1" *ngIf="field.i18n && !field.readOnly">
+          <a (click)="openTranslator(field.name)"
+            i18n-title title="Translate">
+            <button class="btn btn-outline-info mat-icon-in-button">
+              <span class="material-icons">translate</span>
+            </button>
+          </a>
+        </div>
       </div>
     </form>
   </div>
index 14aa386..e9a4531 100644 (file)
@@ -1,4 +1,4 @@
-import {Component, OnInit, Input,
+import {Component, OnInit, Input, ViewChild,
     Output, EventEmitter, TemplateRef} from '@angular/core';
 import {IdlService, IdlObject} from '@eg/core/idl.service';
 import {Observable} from 'rxjs';
@@ -8,6 +8,8 @@ import {PcrudService} from '@eg/core/pcrud.service';
 import {DialogComponent} from '@eg/share/dialog/dialog.component';
 import {NgbModal, NgbModalOptions} from '@ng-bootstrap/ng-bootstrap';
 import {ComboboxEntry} from '@eg/share/combobox/combobox.component';
+import {TranslateComponent} from '@eg/staff/share/translate/translate.component';
+
 
 interface CustomFieldTemplate {
     template: TemplateRef<any>;
@@ -129,6 +131,8 @@ export class FmRecordEditorComponent
     // Emit an error message when the save action fails.
     @Output() onError$ = new EventEmitter<string>();
 
+    @ViewChild('translator') private translator: TranslateComponent;
+
     // IDL info for the the selected IDL class
     idlDef: any;
 
@@ -212,13 +216,15 @@ export class FmRecordEditorComponent
             update: pc.update ? pc.update.perms : [],
         };
 
+        this.pkeyIsEditable = !('pkey_sequence' in this.idlDef);
+
         if (this.mode === 'update' || this.mode === 'view') {
 
             let promise;
             if (this.record && this.recId === null) {
                 promise = Promise.resolve(this.record);
             } else {
-                promise = 
+                promise =
                     this.pcrud.retrieve(this.idlClass, this.recId).toPromise();
             }
 
@@ -235,14 +241,12 @@ export class FmRecordEditorComponent
             });
         }
 
-        // create a new record from scratch or from a stub record
-        // provided by the caller.
-        this.pkeyIsEditable = !('pkey_sequence' in this.idlDef);
-        if (!this.record || this.recId) {
-            // user provided no seed record, create one.
-            this.recId = null;
-            this.record = this.idl.create(this.idlClass);
-        }
+        // In 'create' mode.
+        //
+        // Create a new record from the stub record provided by the
+        // caller or a new from-scratch record
+        this.setRecord(this.record || this.idl.create(this.idlClass));
+
         return this.getFieldList();
     }
 
@@ -517,6 +521,21 @@ export class FmRecordEditorComponent
         // datatype == text / interval / editable-pkey
         return 'text';
     }
+
+    openTranslator(field: string) {
+        this.translator.fieldName = field;
+        this.translator.idlObject = this.record;
+
+        // TODO: will need to change once LP1823041 is merged
+        this.translator.open().then(
+            newValue => {
+                if (newValue) {
+                    this.record[field](newValue);
+                }
+            },
+            () => {} // avoid console error
+        );
+    }
 }
 
 
index 9c7361c..4880973 100644 (file)
@@ -116,7 +116,7 @@ export class TranslateComponent
             this.pcrud.update(entry).toPromise().then(
                 ok => {
                     if (!this.nextString) {
-                        this.close('Translation updated');
+                        this.close(this.translatedValue);
                     }
                 },
                 err => console.error(err)
@@ -134,7 +134,7 @@ export class TranslateComponent
         this.pcrud.create(entry).toPromise().then(
             ok => {
                 if (!this.nextString) {
-                    this.close('Translation created');
+                    this.close(this.translatedValue);
                 }
             },
             err => console.error('Translation creation failed')