add family

2023-12-16 07:17:53 -05:00
parent 8c9d086126
commit 8fc0015fc3
1 changed files with 69 additions and 42 deletions
@@ -1,50 +1,77 @@
 <div>
-  <ion-button size="small" shape="round" (click)="addStart()">Add Family</ion-button>
-</div>
+  <div>
+    <ion-button size="small" shape="round" (click)="addStart()">Add Family</ion-button>
+  </div>
+  <div *ngIf="isModalOpenBackdrop==true">
+    <div style="background-color: aliceblue; border-radius: 10px; padding: 10px; margin-top: 10px;">
+      <ion-item lines="none">
+        <ion-input type="text"  maxlength="15" placeholder="Firstname" [(ngModel)]='firstname' ></ion-input>
+      </ion-item>
+
+      <ion-item lines="none">
+        <ion-input type="text"  maxlength="15" placeholder="lastname" [(ngModel)]='lastname' ></ion-input>
+      </ion-item>
+
+      <ion-item lines="none">
+        <ion-label>Age</ion-label>
+      </ion-item>
+
+      <ion-item lines="none">
+        <ion-input type="text"  maxlength="14" placeholder="Online Name" [(ngModel)]='online_name' ></ion-input>
+      </ion-item>
+      <div style="text-align: right;">
+        {{profileMessage}}
+        <ion-button shape="round" size="small" (click)="sendUpdateProfile()">Add</ion-button>
+      </div>
+    </div>


-<div *ngIf="isModalOpenBackdrop==true">
-  <ion-backdrop [visible]="isModalOpenBackdrop"></ion-backdrop>
-  <ion-modal class="common_modal" [isOpen]="isModalOpen">

-    <ng-template>
-      <ion-header>
-        <ion-toolbar>
-          <ion-title>Add Family</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-card-content>
+  </div>

-          <ion-item lines="none">
-            <ion-input type="text"  maxlength="15" placeholder="Firstname" [(ngModel)]='firstname' ></ion-input>
-          </ion-item>
+<!--  <div *ngIf="isModalOpenBackdrop==true">-->
+<!--    &lt;!&ndash;  <ion-backdrop [visible]="isModalOpenBackdrop"></ion-backdrop>&ndash;&gt;-->
+<!--    &lt;!&ndash;  <ion-modal class="common_modal" [isOpen]="isModalOpen">&ndash;&gt;-->

-          <ion-item lines="none">
-            <ion-input type="text"  maxlength="15" placeholder="lastname" [(ngModel)]='lastname' ></ion-input>
-          </ion-item>
+<!--    <ng-template>-->
+<!--      <ion-header>-->
+<!--        <ion-toolbar>-->
+<!--          <ion-title>Add Family</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-card-content>-->

-          <ion-item lines="none">
-            <ion-input type="text"  maxlength="35" placeholder="Email" [(ngModel)]='email' ></ion-input>
-          </ion-item>
+<!--          <ion-item lines="none">-->
+<!--            <ion-input type="text"  maxlength="15" placeholder="Firstname" [(ngModel)]='firstname' ></ion-input>-->
+<!--          </ion-item>-->

-          <ion-item lines="none">
-            <ion-input type="text"  maxlength="14" placeholder="Online Name" [(ngModel)]='online_name' ></ion-input>
-          </ion-item>
-          <div style="text-align: right;">
-            {{profileMessage}}
-            <ion-button shape="round" size="small" (click)="sendUpdateProfile()">Update</ion-button>
-          </div>
-        </ion-card-content>
-      </ion-content>
-      <ion-footer>
-        <ion-toolbar>
-          <ion-button  (click)="setCloseModal()">Close</ion-button>
-        </ion-toolbar>
-      </ion-footer>
-    </ng-template>
-  </ion-modal>
-</div>
+<!--          <ion-item lines="none">-->
+<!--            <ion-input type="text"  maxlength="15" placeholder="lastname" [(ngModel)]='lastname' ></ion-input>-->
+<!--          </ion-item>-->
+
+<!--          <ion-item lines="none">-->
+<!--            <ion-input type="text"  maxlength="35" placeholder="Email" [(ngModel)]='email' ></ion-input>-->
+<!--          </ion-item>-->
+
+<!--          <ion-item lines="none">-->
+<!--            <ion-input type="text"  maxlength="14" placeholder="Online Name" [(ngModel)]='online_name' ></ion-input>-->
+<!--          </ion-item>-->
+<!--          <div style="text-align: right;">-->
+<!--            {{profileMessage}}-->
+<!--            <ion-button shape="round" size="small" (click)="sendUpdateProfile()">Update</ion-button>-->
+<!--          </div>-->
+<!--        </ion-card-content>-->
+<!--      </ion-content>-->
+<!--      <ion-footer>-->
+<!--        <ion-toolbar>-->
+<!--          <ion-button  (click)="setCloseModal()">Close</ion-button>-->
+<!--        </ion-toolbar>-->
+<!--      </ion-footer>-->
+<!--    </ng-template>-->
+<!--    &lt;!&ndash;  </ion-modal>&ndash;&gt;-->
+<!--  </div>-->
+<!--</div>-->