prefix details

reqtool/ReqmanAngular11/src/app/components/boilerplate-details/boilerplate-details.component.html

+<app-prefix-list></app-prefix-list>
 <div>
     <div *ngIf="currentboilerplate.id" class="edit-form">
       <h4>Boilerplate</h4>
@@ -13,14 +14,13 @@
           />
         </div>
         <div style="display: flex; flex-grow: grow">
-          <form class="example-form form-inline">
+          <form class="form-group form-inline ">
               <mat-checkbox class="example-full-width"
                 [(ngModel)]="currentboilerplate.has_prefix"
                 name="has_prefix"
               >Prefix
               </mat-checkbox>
           </form>
-          
             <app-prefix-details></app-prefix-details>
         </div>
         <div class="form-group">

reqtool/ReqmanAngular11/src/app/components/boilerplate-details/boilerplate-details.component.scss

@@ -12,3 +12,7 @@
   .example-full-width {
     width: auto;
   }
+
+  .form-group{
+    min-width: 150px; 
+  }
\ No newline at end of file

reqtool/ReqmanAngular11/src/app/components/prefix-details/prefix-details.component.html

-<app-prefix-list></app-prefix-list>
-<form class="form-group form-inline">
+<div class="form-row">
+  <div class="col">
+    <form class="form-group form-inline">
       <mat-form-field class="example-full-width">
         <mat-label>Prefix</mat-label>
         <input type="text"
@@ -15,8 +16,10 @@
           </mat-option>
         </mat-autocomplete>
       </mat-form-field>
-</form>
-<form class="example-form form-inline">
+    </form>
+  </div>
+  <div class="col">
+    <form class="example-form form-inline">
       <mat-form-field>
         <mat-label>Subject</mat-label>
         <input type="text"
@@ -32,14 +35,77 @@
           </mat-option>
         </mat-autocomplete>
       </mat-form-field>
-</form>
-<button
+    </form>
+    </div>
+    <div class="col">
+      <form class="example-form form-inline">
+        <mat-form-field>
+          <mat-label>Verb or State</mat-label>
+          <input type="text"
+                placeholder="Pick one"
+                aria-label="Number"
+                matInput
+                [formControl]="verbsControl"
+                [matAutocomplete]="autoverb"
+                >
+          <mat-autocomplete autoActiveFirstOption #autoverb="matAutocomplete">
+            <mat-option *ngFor="let option of verbsfilteredOptions  | async" [value]="option">
+              {{option}}
+            </mat-option>
+          </mat-autocomplete>
+        </mat-form-field>
+      </form>
+      </div>
+      <div class="col">
+        <form class="example-form form-inline">
+          <mat-form-field>
+            <mat-label>Object</mat-label>
+            <input type="text"
+                  placeholder="Pick one"
+                  aria-label="Number"
+                  matInput
+                  [formControl]="objectsControl"
+                  [matAutocomplete]="autobjects"
+                  >
+            <mat-autocomplete autoActiveFirstOption #autobjects="matAutocomplete">
+              <mat-option *ngFor="let option of objectsfilteredOptions  | async" [value]="option">
+                {{option}}
+              </mat-option>
+            </mat-autocomplete>
+          </mat-form-field>
+        </form>
+        </div>
+        <div class="col">
+          <form class="example-form form-inline" >
+            <fieldset disabled>
+            <mat-form-field>
+              <mat-label>Logic connectivity</mat-label>
+              <input type="text"
+                    placeholder="Pick one"
+                    aria-label="Number"
+                    matInput
+                    [formControl]="logic_conControl"
+                    [matAutocomplete]="autolog_con"
+                    >
+              <mat-autocomplete autoActiveFirstOption #autolog_con="matAutocomplete">
+                <mat-option *ngFor="let option of logic_confilteredOptions  | async" [value]="option">
+                  {{option}}
+                </mat-option>
+              </mat-autocomplete>
+            </mat-form-field>
+            </fieldset>
+          </form>
+          </div>
+    <div class="col">
+      <button
         type="submit"
         class="badge badge-success mb-2"
         (click)="updatePrefix()"
->
+      >
         Update
-</button>
+      </button>
+    </div>
+    </div>
 
 
 <!--

reqtool/ReqmanAngular11/src/app/components/prefix-details/prefix-details.component.ts

@@ -23,12 +23,22 @@ export class PrefixDetailsComponent implements OnInit {
   subjects:string[] = [];
   subjectsfilteredOptions: Observable<string[]>;
 
-  verbs = [];
-  objects = [];
-  logic_con = [];
+  verbsControl = new FormControl();
+  verbs:string[] = [];
+  verbsfilteredOptions: Observable<string[]>;
+
+  objectsControl = new FormControl();
+  objects:string[] = [];
+  objectsfilteredOptions: Observable<string[]>;
+
+  logic_conControl = new FormControl();
+  logic_con:string[] = [];
+  logic_confilteredOptions: Observable<string[]>;
+
 
   public static id: any [] = [];
   private readonly notifier: NotifierService;
+  disable = true;
 
   //for the moment only one prefix can showed/updates
   currentprefix: Prefix  = {
@@ -53,6 +63,18 @@ export class PrefixDetailsComponent implements OnInit {
         startWith(""),
         map(value => this._filter(this.subjects, value))
       );
+      this.verbsfilteredOptions = this.verbsControl.valueChanges.pipe(
+        startWith(""),
+        map(value => this._filter(this.verbs, value))
+      );
+      this.objectsfilteredOptions = this.objectsControl.valueChanges.pipe(
+        startWith(""),
+        map(value => this._filter(this.objects, value))
+      );
+      this.logic_confilteredOptions = this.logic_conControl.valueChanges.pipe(
+        startWith(""),
+        map(value => this._filter(this.logic_con, value))
+      );
      }
 
   ngOnInit(): void { 
@@ -65,9 +87,6 @@ export class PrefixDetailsComponent implements OnInit {
    
   private _filter(data:string[], value: string): string[] {
     const filterValue = value.toLowerCase();
-    this.currentprefix.prefix = this.simpleprefixControl.value;
-    this.currentprefix.system_fun_item = this.subjectsControl.value;
-
     return data.filter(option => option.toLowerCase().indexOf(filterValue) === 0);
   }
   
@@ -80,8 +99,12 @@ export class PrefixDetailsComponent implements OnInit {
           this.currentprefix = data;
           console.log(data)
           this.simpleprefixControl.setValue(this.currentprefix.prefix);
-          //make it null need solution
-          //this.subjectsControl.setValue(this.currentprefix.system_fun_item);
+          this.subjectsControl.setValue(this.currentprefix.system_fun_item);
+          this.verbsControl.setValue(this.currentprefix.state_or_verb);
+          this.objectsControl.setValue(this.currentprefix.item_function_flow_statevalue);
+          this.logic_conControl.setValue(this.currentprefix.logic_connective);
+          
+          
 
         },
         error => {
@@ -91,11 +114,16 @@ export class PrefixDetailsComponent implements OnInit {
 
 
   updatePrefix(): void {
+    this.currentprefix.prefix = this.simpleprefixControl.value;
+    this.currentprefix.system_fun_item = this.subjectsControl.value;
+    this.currentprefix.state_or_verb = this.verbsControl.value;
+    this.currentprefix.item_function_flow_statevalue = this.objectsControl.value;
+    this.currentprefix.logic_connective = this.logic_conControl.value;
     for (let i=0; i<PrefixDetailsComponent.id.length; i++){
     this.prefixService.update(this.route.snapshot.params.id, PrefixDetailsComponent.id[i], this.currentprefix)
       .subscribe(
         response => {
-          console.log(response);
+          this.notifier.notify("success",JSON.stringify("Prefix updated"));
           this.message = response.message;
         },
         error => {
@@ -119,7 +147,8 @@ export class PrefixDetailsComponent implements OnInit {
   this.prefixService.getlogcon()
     .subscribe(
       data => {
-        this.logic_con = data;
+        for (let x=0; x < data.length; x++ ){
+          this.logic_con.push(data[x][1]);}
       },
       error => {
         console.log(error);
@@ -127,7 +156,8 @@ export class PrefixDetailsComponent implements OnInit {
   this.prefixService.getverb()
     .subscribe(
       data => {
-        this.verbs = data;
+        for (let x=0; x < data.length; x++ ){
+          this.verbs.push(data[x][1]);}
       },
       error => {
         console.log(error);
@@ -137,7 +167,6 @@ export class PrefixDetailsComponent implements OnInit {
       data => {
         for (let x=0; x < data.length; x++ ){
           this.subjects.push(data[x][1]);}
-        //this.subjects = data;
       },
       error => {
         console.log(error);
@@ -145,7 +174,8 @@ export class PrefixDetailsComponent implements OnInit {
   this.prefixService.getoobject()
     .subscribe(
       data => {
-        this.objects = data;
+        for (let x=0; x < data.length; x++ ){
+          this.objects.push(data[x][1]);}
       },
       error => {
         console.log(error);

reqtool/ReqmanAngular11/src/app/components/prefix-list/prefix-list.component.html

-<p>prefix-list works!</p>