add group

src/app/components/job-group/job-group.component.html

@@ -25,14 +25,16 @@
         <div style="float: left; width: 75%; padding-right: 10px; ">
           <ion-select label="Select Group"
                       [(ngModel)]='job_group'
-                      (ionChange)="refreshList()"
+                      (ionChange)="refreshGroupOnChange()"
                       style=" background-color: #3dc2ff;
                       border-radius: 10px; font-size: 12px; height: 35px;"
                       placeholder="Select Group"
                       label-placement="stacked">
             <ion-select-option value="" selected="true">Select Group</ion-select-option>
             <ion-select-option *ngFor="let item of jobGroupDataResult"
-                               value="{{item.group_id}}">{{item.group_name}}</ion-select-option>
+                               value="{{item.group_id}}"
+                               selected
+            >{{item.group_name}}</ion-select-option>
           </ion-select>
         </div>
         <div style="float: right; width: 20%;">
@@ -61,14 +63,15 @@
               <ion-item-option color="danger">Delete</ion-item-option>
             </ion-item-options>
           </ion-item-sliding>
-          <ion-item *ngIf="job_group > 0">
-            <ion-button
-                    size="small"
-                    (click)="addGroupMember()"
-                    shape="round"
-                    expand="block">Add Member</ion-button>
-          </ion-item>
+
         </ion-list>
+        <div *ngIf="job_group > 0" style="text-align: right; margin-top: 10px; width: 100%;">
+          <ion-button
+                  size="small"
+                  (click)="addGroupMember()"
+                  shape="round"
+                  >Add Member</ion-button>
+        </div>
       </div>
 
   </div>
@@ -178,14 +181,42 @@
     </ion-header>
     <ion-content class="ion-padding">
       <ion-grid style="background-color: lightgoldenrodyellow;">
+        <ion-row>
+          <ion-col>
+            {{current_group_name}}
+          </ion-col>
+        </ion-row>
         <ion-row>
           <ion-col>
             <ion-input
                     maxlength="25"
-                    (ionChange)="inVerifyNewGroup()"
-                    [(ngModel)]="new_group_name"
+                    placeholder="Firstname"
+                    (ionChange)="inVerifyNewMember()"
+                    [(ngModel)]="firstname"
                     style="background-color: aliceblue; border-radius: 10px;"
-                    label="New Group Name.">
+                    label="Firstname">
+            </ion-input>
+          </ion-col>
+          <ion-col>
+            <ion-input
+                    maxlength="25"
+                    placeholder="Lastname"
+                    (ionChange)="inVerifyNewMember()"
+                    [(ngModel)]="lastname"
+                    style="background-color: aliceblue; border-radius: 10px;"
+                    label="Lastname">
+            </ion-input>
+          </ion-col>
+        </ion-row>
+        <ion-row>
+          <ion-col>
+            <ion-input
+                    maxlength="35"
+                    placeholder="Email"
+                    (ionChange)="inVerifyNewMember()"
+                    [(ngModel)]="email"
+                    style="background-color: aliceblue; border-radius: 10px;"
+                    label="Email">
             </ion-input>
           </ion-col>
         </ion-row>
@@ -196,10 +227,10 @@
           <ion-col style="text-align: right;">
             <ion-button
                     shape="round"
-                    [disabled]="isDisabled"
+                    [disabled]="isMemberDisabled"
                     size="small"
-                    (click)="processAddGroup()">
-              Add Group
+                    (click)="processAddMember()">
+              Add Member
             </ion-button>
           </ion-col>
         </ion-row>