You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
mohemm_srca/Mohem/src/app/authentication/sms-page/sms-page.page.html

142 lines
3.1 KiB
HTML

This file contains invisible Unicode characters!

This file contains invisible Unicode characters that may be processed differently from what appears below. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to reveal hidden characters.

<app-generic-header
showBack="true"
[headerText]="'verificationcode,verificationcode' | translate">
</app-generic-header>
<ion-content padding>
<ion-grid>
<!-- <ion-row>
<ion-col [size]="4">
<img [src]="logo" class="logo" />
<ion-img class="centerDiv" src="../assets/imgs/CS.png"></ion-img>
</ion-col>
</ion-row> -->
<br/>
<br/>
<ion-row>
<ion-col>
<p class="headerTxt" > {{'verificationcode,verificationcode' | translate}}</p>
<br/>
<p class="leftDiv">{{'verificationcode,title' | translate}}
<span class="boldTxtNav">{{'verificationcode,verificationcode' | translate}}</span>
{{'verificationcode,by' | translate}}
<span *ngIf="loginType == 1 || activeType == 1" class="boldTxtNav">{{'verificationcode , sms' | translate}}, </span>
<span *ngIf="loginType == 4 || activeType == 4" class="boldTxtNav">{{'verificationcode , whatsapp' | translate}}, </span>
{{'verificationcode,instruct' | translate}}
<span class="boldTxtNav">{{'general,submit' | translate}}</span
></p>
<!-- <p class="leftDiv">{{'verificationcode,title' | translate}}<span class="boldTxtNav">{{'verificationcode,verificationcode' | translate}}</span> {{'verificationcode,by' | translate}}<span class="boldTxtNav">{{'verificationcode,sms' | translate}}</span>{{'verificationcode,instruct' | translate}}<span class="boldTxtNav">{{'general,submit' | translate}}</span></p> -->
</ion-col>
</ion-row>
</ion-grid>
<br/><br/>
<!-- <p style="color: #c0c0c0; margin-left: 32%">{{'verificationcode.verificationcode' | translate}}</p> -->
<div>
<h1 text-center>{{displayTime}}</h1>
<br/><br/>
<!-- <ion-item>
//<ion-label>{{'verificationcode,verificationcode' | translate}}</ion-label>
// <img class="item-icon" src="assets/imgs/password.png" item-start />
<ion-input required type="tel" maxlength="4" (keyup)="checkOTPLength()" placeholder="{{translate.trPK('verificationcode','verificationcode')}}" [(ngModel)]="activationCode"></ion-input>
</ion-item> -->
<ion-row class="sms_code" dir="ltr">
<ion-col [size]="12">
<ion-input type="tel" [(ngModel)]="smc_code[0]" maxLength="4" size="4" min="0" max="9" pattern="[0-9]{1}"
inputmode="tel" (ionInput)="goToNextInput($event)" (ionChange)="onChange()" #ref autofocus="true">
</ion-input>
<ion-input type="tel" [(ngModel)]="smc_code[1]" maxLength="1" size="1" min="0" max="9" pattern="[0-9]{1}"
inputmode="tel" (ionInput)="goToNextInput($event)" (ionChange)="onChange()"></ion-input>
<ion-input type="tel" [(ngModel)]="smc_code[2]" maxLength="1" size="1" min="0" max="9" pattern="[0-9]{1}"
inputmode="tel" (ionInput)="goToNextInput($event)" (ionChange)="onChange()"></ion-input>
<ion-input type="tel" [(ngModel)]="smc_code[3]" maxLength="1" size="1" min="0" max="9" pattern="[0-9]{1}"
inputmode="tel" (ionInput)="goToNextInput($event)" (ionChange)="onChange()"></ion-input>
</ion-col>
</ion-row>
<div *ngIf="showErrorMessage"><p style="color: red; font-weight: bold; font-size: 14px; text-align: center;">{{messageValue}}</p></div>
</div>
</ion-content>
<ion-footer>
<div class="centerDiv">
<ion-button class="button-login" ion-button (click)="checkVerificationCode()">{{'general,submit' | translate}}</ion-button>
</div>
</ion-footer>