job group

2023-12-26 17:08:08 -05:00
parent 9147a7aed9
commit 113fe6f5af
3 changed files with 285 additions and 8 deletions
@@ -8,7 +8,12 @@
      </ion-row>
      <ion-row>
        <ion-col>
-          <ion-button size="small" shape="round" expand="block" (click)="addGroup()">Create a group</ion-button>
+          <ion-button
+                  size="small"
+                  shape="round"
+                  id="open-modal-new"
+                  expand="block"
+                  (click)="addGroup()">Create a group</ion-button>
        </ion-col>
      </ion-row>
    </ion-grid>
@@ -34,6 +39,7 @@
          <ion-button
                  (click)="addGroup()"
                  style="height: 35px;"
+                  id="open-modal"
                  size="small" >+Group</ion-button>
        </div>
      </div>
@@ -55,13 +61,13 @@
              <ion-item-option color="danger">Delete</ion-item-option>
            </ion-item-options>
          </ion-item-sliding>
-<ion-item>
-  <ion-button
-          size="small"
-          (click)="addGroupMember()"
-          shape="round"
-          expand="block">Add Member</ion-button>
-</ion-item>
+          <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>

@@ -70,4 +76,180 @@

 </div>

+<div *ngIf="isModalOpenBackdrop==true">
+  <ion-backdrop [visible]="isModalOpenBackdrop"></ion-backdrop>
+  <ion-modal class="common_modal" [isOpen]="isModalOpen"><ng-template>
+    <ion-header  class="modal-head">
+      <ion-toolbar>
+        <ion-title>Job Groups</ion-title>
+        <ion-buttons slot="end">
+          <ion-button (click)="setCloseModal()">Close</ion-button>
+        </ion-buttons>
+      </ion-toolbar>
+    </ion-header>
+    <ion-content class="ion-padding">
+      <ion-grid style="background-color: lightgoldenrodyellow;">
+        <ion-row>
+          <ion-col>
+            <ion-input
+                    maxlength="25"
+                    (ionChange)="inVerifyNewGroup()"
+                    [(ngModel)]="new_group_name"
+                    style="background-color: aliceblue; border-radius: 10px;"
+                    label="New Group Name.">
+            </ion-input>
+          </ion-col>
+        </ion-row>
+        <ion-row>
+          <ion-col>
+            {{group_created_result}}
+          </ion-col>
+          <ion-col style="text-align: right;">
+          <ion-button
+                  shape="round"
+                  [disabled]="isDisabled"
+                  size="small"
+                  (click)="processAddGroup()">
+           Add Group
+          </ion-button>
+          </ion-col>
+        </ion-row>
+      </ion-grid>
+      <ion-list>
+        <ion-item-sliding  *ngFor="let item of jobGroupDataResult">
+          <ion-item>
+            <ion-label>{{item.group_name}}</ion-label>
+          </ion-item>

+          <ion-item-options>
+            <ion-item-option color="danger">Delete</ion-item-option>
+          </ion-item-options>
+        </ion-item-sliding>
+
+      </ion-list>
+
+
+    </ion-content>
+    <ion-footer>
+      <ion-grid style="background-color: lightgray;">
+        <ion-row>
+          <ion-col>
+<!--            <ion-button-->
+<!--                    (click)="setCloseModal()"-->
+<!--                    shape="round"-->
+<!--                    size="small"-->
+<!--                    color="danger">-->
+<!--              Close-->
+<!--            </ion-button>-->
+          </ion-col>
+          <ion-col></ion-col>
+          <ion-col>
+            <ion-button
+                    (click)="setCloseModal()"
+                    shape="round"
+                    size="small"
+                    color="danger">
+              Close
+            </ion-button>
+<!--            -->
+<!--            <ion-button-->
+<!--                    shape="round"-->
+<!--                    size="small"-->
+<!--                    (click)="processCreateJob()">Create Job</ion-button>-->
+          </ion-col>
+        </ion-row>
+      </ion-grid>
+    </ion-footer>
+  </ng-template>
+  </ion-modal>
+</div>
+
+
+<div *ngIf="isModalMemberOpenBackdrop==true">
+  <ion-backdrop [visible]="isModalMemberOpenBackdrop"></ion-backdrop>
+  <ion-modal class="common_modal" [isOpen]="isModalMemberOpen"><ng-template>
+    <ion-header  class="modal-head">
+      <ion-toolbar>
+        <ion-title>Groups Members</ion-title>
+        <ion-buttons slot="end">
+          <ion-button (click)="setCloseMemberModal()">Close</ion-button>
+        </ion-buttons>
+      </ion-toolbar>
+    </ion-header>
+    <ion-content class="ion-padding">
+      <ion-grid style="background-color: lightgoldenrodyellow;">
+        <ion-row>
+          <ion-col>
+            <ion-input
+                    maxlength="25"
+                    (ionChange)="inVerifyNewGroup()"
+                    [(ngModel)]="new_group_name"
+                    style="background-color: aliceblue; border-radius: 10px;"
+                    label="New Group Name.">
+            </ion-input>
+          </ion-col>
+        </ion-row>
+        <ion-row>
+          <ion-col>
+            {{group_created_result}}
+          </ion-col>
+          <ion-col style="text-align: right;">
+            <ion-button
+                    shape="round"
+                    [disabled]="isDisabled"
+                    size="small"
+                    (click)="processAddGroup()">
+              Add Group
+            </ion-button>
+          </ion-col>
+        </ion-row>
+      </ion-grid>
+      <ion-list>
+        <ion-item-sliding  *ngFor="let item of jobGroupListFilterdData">
+          <ion-item>
+            <ion-label>{{item.firstname}} {{item.lastname}}</ion-label>
+            <ion-label>{{item.email}} </ion-label>
+          </ion-item>
+
+          <ion-item-options>
+            <ion-item-option color="danger">Delete</ion-item-option>
+          </ion-item-options>
+        </ion-item-sliding>
+
+      </ion-list>
+
+
+    </ion-content>
+    <ion-footer>
+      <ion-grid style="background-color: lightgray;">
+        <ion-row>
+          <ion-col>
+            <!--            <ion-button-->
+            <!--                    (click)="setCloseModal()"-->
+            <!--                    shape="round"-->
+            <!--                    size="small"-->
+            <!--                    color="danger">-->
+            <!--              Close-->
+            <!--            </ion-button>-->
+          </ion-col>
+          <ion-col></ion-col>
+          <ion-col>
+            <ion-button
+                    (click)="setCloseMemberModal()"
+                    shape="round"
+                    size="small"
+                    color="danger">
+              Close
+            </ion-button>
+            <!--            -->
+            <!--            <ion-button-->
+            <!--                    shape="round"-->
+            <!--                    size="small"-->
+            <!--                    (click)="processCreateJob()">Create Job</ion-button>-->
+          </ion-col>
+        </ion-row>
+      </ion-grid>
+    </ion-footer>
+  </ng-template>
+  </ion-modal>
+</div>