139 lines
5.7 KiB
HTML
139 lines
5.7 KiB
HTML
<ion-header class="ion-no-border">
|
|
<ion-toolbar>
|
|
<ion-buttons slot="start" (click)="onBack()">
|
|
<ion-button>
|
|
<ion-icon name="arrow-back-outline"></ion-icon>
|
|
</ion-button>
|
|
</ion-buttons>
|
|
<ion-title>Invite Friends</ion-title>
|
|
</ion-toolbar>
|
|
</ion-header>
|
|
|
|
<ion-content class="ion-padding">
|
|
<div class="boxed_contents">
|
|
<div class="inv-head">Invite Friends</div>
|
|
<ion-toolbar>
|
|
<ion-buttons slot="start">
|
|
<ion-button style="background-color: #fcf7ee; color: black; font-size: 14px; font-weight: bolder;" (click)="setTabMode(100);">Name & Email</ion-button>
|
|
<ion-button style="background-color: aliceblue; color: black; font-size: 14px; font-weight: bolder;" (click)="setTabMode(200);">From Contacts</ion-button>
|
|
<ion-button style="background-color: #ebe4ee; color: black; font-size: 14px; font-weight: bolder;" (click)="setTabMode(300);">Links</ion-button>
|
|
</ion-buttons>
|
|
</ion-toolbar>
|
|
|
|
<div *ngIf="tabMode == 100 " class="lesson">
|
|
<div class="ion-padding" slot="content" style="background-color: white; padding: 5px">
|
|
<div style="margin-top: 10px; background-color: #fcf7ee; border-radius: 10px; padding: 5px">
|
|
<ion-grid style="margin: 0px; padding: 0px; background-color: #fcf7ee; border-radius: 10px;">
|
|
<ion-row style="margin: 0px; padding: 10px 0px;">
|
|
<ion-col style="margin: 0px; padding: 0px 5px 0px 0px;"><ion-input style="background-color: white; border-radius: 5px;" type="text" placeholder="Firstname" maxlength="15" [(ngModel)]='ref_firstname'></ion-input></ion-col>
|
|
<ion-col style="margin: 0px; padding: 0px;"><ion-input style="background-color: white; border-radius: 5px;" type="text" placeholder="Lastname" maxlength="15" [(ngModel)]='lastname'></ion-input></ion-col>
|
|
</ion-row>
|
|
|
|
<ion-row style="margin: 0px; padding: 10px 0px; ">
|
|
<ion-col style="margin: 0px; padding: 0px;">
|
|
<ion-input style="background-color: white; border-radius: 5px; " type="email" placeholder="Email" maxlength="55" [(ngModel)]='email'></ion-input>
|
|
</ion-col>
|
|
</ion-row>
|
|
</ion-grid>
|
|
</div>
|
|
|
|
<div style="padding: 10px 10px 0px 10px;">
|
|
<ion-button
|
|
shape="round"
|
|
expand="block"
|
|
size="small"
|
|
(click)="sendRefer()">
|
|
Send Invite
|
|
</ion-button>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
|
|
<div *ngIf="tabMode == 200 " class="lesson">
|
|
<div class="ion-padding" slot="content" style="background-color: white; padding: 5px">
|
|
<div style="margin-top: 10px; background-color: aliceblue; min-height: 150px; border-radius: 10px;">
|
|
<ion-grid>
|
|
<ion-row style="padding: 0px; margin: 0px;">
|
|
<ion-col style="padding: 0px; margin: 0px;">
|
|
<ion-searchbar animated="true" placeholder="Search Contacts" style="margin: 0px;"></ion-searchbar>
|
|
</ion-col>
|
|
</ion-row>
|
|
<ion-row>
|
|
<ion-col>
|
|
|
|
</ion-col>
|
|
</ion-row>
|
|
</ion-grid>
|
|
</div>
|
|
<div style="padding:10px 10px 0px 10px;">
|
|
<ion-button (click)="refreshContacts()"
|
|
shape="round"
|
|
expand="block"
|
|
size="small">Refresh Contacts</ion-button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div *ngIf="tabMode == 300 " class="lesson">
|
|
<div class="ion-padding" slot="content" style="padding: 5px">
|
|
<div style="margin-top: 10px; background-color: whitesmoke; min-height: 100px; border-radius: 10px;">
|
|
<ion-grid>
|
|
<ion-row style="padding: 0px; margin: 0px;">
|
|
<ion-col style="padding: 0px; margin: 0px;">
|
|
<ion-textarea [readonly]="true" style="background-color: #eff2f4;
|
|
border-radius: 5px;
|
|
padding: 20px 1px 10px 1px;
|
|
height: 60px;
|
|
border-color: #3dc2ff;">
|
|
{{refer_link}}
|
|
</ion-textarea>
|
|
</ion-col>
|
|
</ion-row>
|
|
<ion-row>
|
|
<ion-col style="text-align: right;">
|
|
<ion-button shape="round" size="small" color="secondary" (click)="sendToMyEmail()"> Send link to my email</ion-button>
|
|
</ion-col>
|
|
</ion-row>
|
|
</ion-grid>
|
|
|
|
|
|
</div>
|
|
<!-- <div style="padding: 10px 10px 0px 10px;">-->
|
|
<!-- <ion-button (click)="sendtoMyEmail()"-->
|
|
<!-- shape="round"-->
|
|
<!-- expand="block"-->
|
|
<!-- size="small">Send to my Email</ion-button>-->
|
|
<!-- </div>-->
|
|
|
|
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<div class="lesson" style="background-color: white; padding: 5px;">
|
|
<div style="flex-direction: column;">
|
|
<div class="inv-head">Previous Invitations</div>
|
|
<div style="font-size: 10px;">Uncompleted signup will be removed automatically after 7 days</div>
|
|
</div>
|
|
|
|
|
|
<div class="video" *ngFor="let item of referData;" >
|
|
<div class="left">
|
|
<div class="bg_image back_image" [style.backgroundImage]="'url(https://www.wrenchboard.com/assets/images/apps/invite-friend.svg)'"></div>
|
|
<div class="text">
|
|
<div class="bold_text" >{{item.firstname}} {{item.lastname}} </div>
|
|
<div class="msg_text"> {{item.email}}</div>
|
|
<ion-label class="due_date">{{item.added_date}} - {{item.status}}</ion-label>
|
|
</div>
|
|
</div>
|
|
<div class="right">
|
|
<ion-icon name="chevron-forward-outline" color="medium"></ion-icon>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</ion-content>
|