b2adminui 1.0.5 → 1.0.7

package/src/app/customer-management/customer-personal-details/customer-personal-details.component.html

@@ -1,812 +0,0 @@
-<form class="form-horizontal custom-form-horizontal" name="form" role="form" #f="ngForm">
-
-    <div class="row" *ngIf="pageName == 'view'">
-        <div class="col-md-6">
-            <div class="form-group">
-                <label class="col-sm-6 control-label">ID
-                    <span class="pull-right m-l-sm">:</span>
-                </label>
-                <div class="col-sm-6 control-label text-left"> {{walletRegistrationModel.Customer.Id}}
-                </div>
-            </div>
-        </div>
-        <div class="col-md-6">
-            <div class="form-group">
-                <label class="col-sm-6 control-label">KYC Reference ID
-                    <span class="pull-right m-l-sm">:</span>
-                </label>
-                <div class="col-sm-6 control-label text-left"> {{walletRegistrationModel.Customer.ReferenceCustomerId}}
-                </div>
-            </div>
-        </div>
-    </div>
-
-    <div class="row">
-        <div class="col-md-6">
-            <div class="form-group" *ngIf="walletRegistrationModel.Customer.CustomerTypeId != customerTypeBusiness">
-                <label class="col-sm-6 control-label">Title
-                    <span class="pull-right m-l-sm">:</span>
-                </label>
-                <div class="col-sm-6">
-                    <kendo-dropdownlist class="form-control" name="title" #title="ngModel"
-                        [(ngModel)]="walletRegistrationModel.Customer.Title"
-                        [disabled]="pageName == 'view' || disableAfterVerifyKYC" [data]="titleListData"
-                        [filterable]="true" [textField]="'desc'" [valueField]="'value'"
-                        (filterChange)="titleSearchFilter($event)" [defaultItem]="defaultTitleItem"
-                        [valuePrimitive]="true">
-                    </kendo-dropdownlist>
-                </div>
-            </div>
-
-            <div class="form-group" *ngIf="walletRegistrationModel.Customer.CustomerTypeId == customerTypeBusiness">
-                <label class="col-sm-6 control-label">Business Name
-                    <span class="pull-right m-l-sm">:</span>
-                </label>
-                <div class="col-sm-6">
-                    <input [disabled]="pageName == 'view'" type="text" name="businessName" #businessName="ngModel"
-                        placeholder="Business Name" [(ngModel)]="walletRegistrationModel.Customer.FirstName"
-                        class="form-control" maxlength="100" required
-                        (paste)="common.validateSpaceBetweenWords($event)" />
-                    <div *ngIf="(f.submitted || businessName.touched) && businessName.errors && businessName.errors.required"
-                        class="message-error">
-                        <span class='img-warning'></span>Please enter Business Name.
-                    </div>
-                </div>
-            </div>
-        </div>
-
-        <div class="col-sm-6">
-            <div class="form-group">
-                <label class="col-sm-6 control-label">Customer Type
-                    <span class="pull-right m-l-sm">:</span>
-                </label>
-                <div class="col-sm-6">
-                    <kendo-dropdownlist class="form-control" name="customerType" #customerType="ngModel"
-                        [(ngModel)]="walletRegistrationModel.Customer.CustomerTypeId" [disabled]="disableCustomerType"
-                        [data]="customerTypeListData" [filterable]="true" [textField]="'customerType'"
-                        [valueField]="'customerTypeId'" [defaultItem]="defaultCustomerTypeItem" [valuePrimitive]="true"
-                        required>
-                    </kendo-dropdownlist>
-                    <div *ngIf="(f.submitted || customerType.touched) && customerType.errors && customerType.errors.required"
-                        class="message-error">
-                        <span class='img-warning'></span>Please select a customer.
-                    </div>
-                </div>
-            </div>
-        </div>
-    </div>
-
-    <div class="row" *ngIf="walletRegistrationModel.Customer.CustomerTypeId != customerTypeBusiness">
-        <div class="col-md-6">
-            <div class="form-group">
-                <label class="col-sm-6 control-label">First Name
-                    <span class="pull-right m-l-sm">:</span>
-                </label>
-                <div class="col-sm-6">
-                    <input type="text" [title]="walletRegistrationModel.Customer.FirstName"
-                        [disabled]="pageName == 'view' || disableAfterVerifyKYC" name="firstName" #firstName="ngModel"
-                        placeholder="First Name" [(ngModel)]="walletRegistrationModel.Customer.FirstName"
-                        class="form-control" maxlength="100" (change)="OnChangeEdit(true)"
-                        [required]="enableVerifyKyc && (!walletRegistrationModel.Customer.FirstName || 
-                                (walletRegistrationModel.Customer.FirstName && !walletRegistrationModel.Customer.FirstName.trim()))" />
-                    <div *ngIf="((f.submitted || firstName.touched) && enableVerifyKyc && 
-                                (!walletRegistrationModel.Customer.FirstName || 
-                                (walletRegistrationModel.Customer.FirstName && !walletRegistrationModel.Customer.FirstName.trim())))"
-                        class="message-error">
-                        <span class='img-warning'></span>Please enter First Name.
-                    </div>
-                </div>
-            </div>
-        </div>
-        <div class="col-md-6">
-            <div class="form-group">
-                <label class="col-sm-6 control-label">Last Name
-                    <span class="pull-right m-l-sm">:</span>
-                </label>
-                <div class="col-sm-6">
-                    <input type="text" [title]="walletRegistrationModel.Customer.LastName"
-                        [disabled]="pageName == 'view' || disableAfterVerifyKYC" name="lastName" #lastName="ngModel"
-                        placeholder="Last Name" [(ngModel)]="walletRegistrationModel.Customer.LastName"
-                        class="form-control" maxlength="100" (change)="OnChangeEdit(true)"
-                        [required]="enableVerifyKyc && (!walletRegistrationModel.Customer.LastName ||
-                        (walletRegistrationModel.Customer.LastName && !walletRegistrationModel.Customer.LastName.trim()))" />
-                    <div *ngIf="(f.submitted || lastName.touched) && enableVerifyKyc && 
-                                (!walletRegistrationModel.Customer.LastName ||
-                                (walletRegistrationModel.Customer.LastName && !walletRegistrationModel.Customer.LastName.trim()))"
-                        class="message-error">
-                        <span class='img-warning'></span>Please enter Last Name.
-                    </div>
-                </div>
-            </div>
-        </div>
-    </div>
-
-    <div class="row" *ngIf="walletRegistrationModel.Customer.CustomerTypeId != customerTypeBusiness">
-        <div class="col-md-6">
-            <div class="form-group">
-                <label class="col-sm-6 control-label">Middle Name
-                    <span class="pull-right m-l-sm">:</span>
-                </label>
-                <div class="col-sm-6">
-                    <input [title]="walletRegistrationModel.Customer.MiddleName"
-                        [disabled]="pageName == 'view' || disableAfterVerifyKYC" type="text" name="middleName"
-                        #middleName="ngModel" placeholder="Middle Name"
-                        [(ngModel)]="walletRegistrationModel.Customer.MiddleName" class="form-control"
-                        maxlength="150" />
-                </div>
-            </div>
-        </div>
-        <div class="col-md-6">
-            <div class="form-group">
-                <label class="col-sm-6 control-label">Title Local
-                    <span class="pull-right m-l-sm">:</span>
-                </label>
-                <div class="col-sm-6">
-                    <input [title]="walletRegistrationModel.Customer.TitleLocal" [disabled]="pageName == 'view'"
-                        type="text" name="titleLocal" #titleLocal="ngModel" placeholder="Title Local"
-                        [(ngModel)]="walletRegistrationModel.Customer.TitleLocal" class="form-control"
-                        maxlength="150" />
-                </div>
-            </div>
-        </div>
-    </div>
-
-    <div class="row" *ngIf="walletRegistrationModel.Customer.CustomerTypeId != customerTypeBusiness">
-        <div class="col-md-6">
-            <div class="form-group">
-                <label class="col-sm-6 control-label">First Name Local
-                    <span class="pull-right m-l-sm">:</span>
-                </label>
-                <div class="col-sm-6">
-                    <input [title]="walletRegistrationModel.Customer.FirstNameLocal"
-                        [disabled]="pageName == 'view' || disableAfterVerifyKYC" type="text" name="firstNameLocal"
-                        #firstNameLocal="ngModel" placeholder="First Name Local"
-                        [(ngModel)]="walletRegistrationModel.Customer.FirstNameLocal" class="form-control"
-                        maxlength="100" (change)="OnChangeEdit(true)"
-                        [required]="enableVerifyKyc && walletRegistrationModel.Customer.NationalityId == 178 && 
-                        (!walletRegistrationModel.Customer.FirstNameLocal || 
-                        (walletRegistrationModel.Customer.FirstNameLocal && !walletRegistrationModel.Customer.FirstNameLocal.trim()))" />
-                    <div class="message-error"
-                        *ngIf="(f.submitted || firstNameLocal.touched) && enableVerifyKyc && walletRegistrationModel.Customer.NationalityId == 178 && 
-                                (!walletRegistrationModel.Customer.FirstNameLocal || 
-                                (walletRegistrationModel.Customer.FirstNameLocal && !walletRegistrationModel.Customer.FirstNameLocal.trim()))">
-                        <span class='img-warning'></span>Please enter First Name Local.
-                    </div>
-                </div>
-
-            </div>
-        </div>
-        <div class="col-md-6">
-            <div class="form-group">
-                <label class="col-sm-6 control-label">Last Name Local
-                    <span class="pull-right m-l-sm">:</span>
-                </label>
-                <div class="col-sm-6">
-                    <input [title]="walletRegistrationModel.Customer.LastNameLocal"
-                        [disabled]="pageName == 'view' || disableAfterVerifyKYC" type="text" name="lastNameLocal"
-                        #lastNameLocal="ngModel" placeholder="Last Name Local"
-                        [(ngModel)]="walletRegistrationModel.Customer.LastNameLocal" class="form-control"
-                        maxlength="100" (change)="OnChangeEdit(true)"
-                        [required]="enableVerifyKyc && walletRegistrationModel.Customer.NationalityId == 178 && 
-                        (!walletRegistrationModel.Customer.LastNameLocal || 
-                        (walletRegistrationModel.Customer.LastNameLocal && !walletRegistrationModel.Customer.LastNameLocal.trim()))" />
-                    <div *ngIf="(f.submitted || lastNameLocal.touched) && enableVerifyKyc && walletRegistrationModel.Customer.NationalityId == 178 && 
-                                (!walletRegistrationModel.Customer.LastNameLocal || 
-                                (walletRegistrationModel.Customer.LastNameLocal && !walletRegistrationModel.Customer.LastNameLocal.trim()))"
-                        class="message-error">
-                        <span class='img-warning'></span>Please enter Last Name Local.
-                    </div>
-                </div>
-            </div>
-        </div>
-    </div>
-
-    <div class="row" *ngIf="walletRegistrationModel.Customer.CustomerTypeId != customerTypeBusiness">
-        <div class="col-md-6">
-            <div class="form-group">
-                <label class="col-sm-6 control-label">Middle Name Local
-                    <span class="pull-right m-l-sm">:</span>
-                </label>
-                <div class="col-sm-6">
-                    <input [title]="walletRegistrationModel.Customer.MiddleNameLocal"
-                        [disabled]="pageName == 'view' || disableAfterVerifyKYC" type="text" name="middleNameLocal"
-                        #middleNameLocal="ngModel" placeholder="Middle Name Local"
-                        [(ngModel)]="walletRegistrationModel.Customer.MiddleNameLocal" class="form-control"
-                        maxlength="150" />
-                </div>
-            </div>
-        </div>
-        <div class="col-md-6">
-            <div class="form-group">
-                <label class="col-sm-6 control-label">Business Type
-                    <span class="pull-right m-l-sm">:</span>
-                </label>
-                <div class="col-sm-6">
-                    <kendo-dropdownlist class="form-control" name="businessType" #businessType="ngModel"
-                        [(ngModel)]="walletRegistrationModel.Customer.BusinessTypeId" [disabled]="pageName === 'view'"
-                        [data]="businessTypeListData" [filterable]="true" [textField]="'nameEN'"
-                        [valueField]="'businessTypeId'" (filterChange)="businessTypeSearchFilter($event)"
-                        [defaultItem]="defaultBusinessTypeItem" [valuePrimitive]="true">
-                    </kendo-dropdownlist>
-                </div>
-            </div>
-        </div>
-    </div>
-
-    <div class="row">
-        <div class="col-md-6" *ngIf="walletRegistrationModel.Customer.CustomerTypeId != customerTypeBusiness">
-            <div class="form-group">
-                <label class="col-sm-6 control-label">Nationality
-                    <span class="pull-right m-l-sm">:</span>
-                </label>
-                <div class="col-sm-6">
-                    <kendo-dropdownlist class="form-control" name="nationality" #nationality="ngModel"
-                        [(ngModel)]="walletRegistrationModel.Customer.NationalityId"
-                        [disabled]="pageName == 'view' || disableAfterVerifyKYC" [data]="nationalityListData"
-                        [filterable]="true" [textField]="'nationalityNameEN'" [valueField]="'nationalityId'"
-                        (filterChange)="countrySearchFilter($event)" [defaultItem]="defaultCountryItem"
-                        (valueChange)="OnChangeEdit(true)" [valuePrimitive]="true"
-                        [required]="!walletRegistrationModel.Customer.NationalityId && enableVerifyKyc">
-                    </kendo-dropdownlist>
-                    <div *ngIf="(f.submitted || nationality.touched) && !walletRegistrationModel.Customer.NationalityId && enableVerifyKyc"
-                        class="message-error">
-                        <span class='img-warning'></span>Please select Nationality.
-                    </div>
-                </div>
-            </div>
-        </div>
-        <div class="col-md-6">
-            <div class="form-group">
-                <label class="col-sm-6 control-label">Type of ID
-                    <span class="pull-right m-l-sm">:</span>
-                </label>
-                <div class="col-sm-6">
-                    <kendo-dropdownlist class="form-control" name="identityId" #identityId="ngModel"
-                        [(ngModel)]="walletRegistrationModel.Customer.IdentityId"
-                        [disabled]="pageName == 'view' || disableAfterVerifyKYC" [data]="typeOfIdentityFilterListData"
-                        [filterable]="true" [textField]="'identityName'" [valueField]="'identityId'"
-                        (filterChange)="idTypeSearchFilter($event)" (valueChange)="onIdNumberChange()"
-                        [defaultItem]="defaultIdTypeItem" [valuePrimitive]="true" [required]="!walletRegistrationModel.Customer.IdentityId && 
-                        (walletRegistrationModel.Customer.CustomerTypeId === customerTypeBusiness || enableVerifyKyc)">
-                        >
-                    </kendo-dropdownlist>
-                    <div class="message-error"
-                        *ngIf="(f.submitted || identityId.touched) && !walletRegistrationModel.Customer.IdentityId && 
-                            (walletRegistrationModel.Customer.CustomerTypeId === customerTypeBusiness || enableVerifyKyc)">
-                        <span class='img-warning'></span>Please select a Type of ID.
-                    </div>
-                </div>
-            </div>
-        </div>
-    </div>
-
-    <div class="row">
-        <div class="col-md-6">
-            <div class="form-group">
-                <label class="col-sm-6 control-label">ID Number
-                    <span class="pull-right m-l-sm">:</span>
-                </label>
-                <div class="col-sm-6">
-                    <div class="input-group">
-                        <input [disabled]="pageName == 'view' || disableAfterVerifyKYC" type="text" name="idNumber"
-                            #idNumber="ngModel" placeholder="ID Number"
-                            [(ngModel)]="walletRegistrationModel.Customer.IdNumber" class="form-control inline-controls"
-                            (change)="OnChangeEdit(true)" required />
-                        <span class="input-group-addon p-r-none no-borders"
-                            *ngIf="pageName == 'edit' || pageName == 'view'">
-                            <a (click)="getIdNumber()">
-                                <i class="fa fa-eye eye-icon-style"></i>
-                            </a>
-                        </span>
-                    </div>
-                    <div *ngIf="((f.submitted || idNumber.touched) && (idNumber.errors && idNumber.errors.required)) || 
-                    (walletRegistrationModel.Customer.IdNumber && !walletRegistrationModel.Customer.IdNumber.trim())"
-                        class="message-error">
-                        <span class='img-warning'></span>Please enter ID Number.
-                    </div>
-                    <div *ngIf="((f.submitted || idNumber.touched) && (idNumber.errors && idNumber.errors.pattern))"
-                        class="message-error">
-                        <span class='img-warning'></span>Please enter valid ID.
-                    </div>
-
-                </div>
-            </div>
-        </div>
-        <div class="col-md-6" *ngIf="walletRegistrationModel.Customer.CustomerTypeId != customerTypeBusiness">
-            <div class="form-group">
-                <label class="col-sm-6 control-label">Date of Birth Type
-                    <span class="pull-right m-l-sm">:</span>
-                </label>
-                <div class="col-sm-6">
-                    <kendo-dropdownlist class="form-control" name="dateOfBirthType" #dateOfBirthType="ngModel"
-                        [(ngModel)]="walletRegistrationModel.Customer.DateOfBirthType"
-                        [disabled]="pageName == 'view' || disableAfterVerifyKYC" [data]="dateOfBirthListData"
-                        [filterable]="true" [textField]="'desc'" [valueField]="'value'"
-                        (valueChange)="dateOfBirthTypeChange($event)" [valuePrimitive]="true">
-                    </kendo-dropdownlist>
-                </div>
-            </div>
-        </div>
-    </div>
-
-    <div class="row" *ngIf="walletRegistrationModel.Customer.CustomerTypeId != customerTypeBusiness">
-        <div class="col-md-6">
-            <div class="form-group" *ngIf="walletRegistrationModel.Customer.NationalityId == 178">
-                <label class="col-sm-6 control-label">Laser ID
-                    <span class="pull-right m-l-sm">:</span>
-                </label>
-                <div class="col-sm-6">
-                    <div class="input-group">
-                        <input [title]="walletRegistrationModel.Customer.LaserId"
-                            [disabled]="pageName == 'view' || disableAfterVerifyKYC" type="text" name="laserID"
-                            class="form-control inline-controls" #laserID="ngModel" placeholder="Laser ID"
-                            [(ngModel)]="walletRegistrationModel.Customer.LaserId" class="form-control" maxlength="100"
-                            (change)="OnChangeEdit(true)" (keypress)="common.onlyAlphanumeric($event,true)"
-                            (paste)="common.validateAlphanumeric($event,true)"
-                            [required]="enableVerifyKyc && walletRegistrationModel.Customer.NationalityId == 178 &&
-                            (!walletRegistrationModel.Customer.LaserId || 
-                            (walletRegistrationModel.Customer.LaserId && !walletRegistrationModel.Customer.LaserId.trim()))" />
-                        <span class="input-group-addon p-r-none no-borders"
-                            *ngIf="pageName == 'edit' || pageName == 'view'">
-                            <a (click)="getLaserIdNumber()">
-                                <i class="fa fa-eye eye-icon-style"></i>
-                            </a>
-                        </span>
-                    </div>
-                    <div class="message-error"
-                        *ngIf="(f.submitted || laserID.touched) && enableVerifyKyc && walletRegistrationModel.Customer.NationalityId == 178 &&
-                                (!walletRegistrationModel.Customer.LaserId || 
-                                (walletRegistrationModel.Customer.LaserId && !walletRegistrationModel.Customer.LaserId.trim()))">
-                        <span class='img-warning'></span>Please enter LaserID.
-                    </div>
-                </div>
-            </div>
-        </div>
-        <div class="col-md-6" *ngIf="pageName === 'view'">
-            <div class="form-group">
-                <label class="col-sm-6 control-label">Date of Birth
-                    <span class="pull-right m-l-sm">:</span>
-                </label>
-                <div class="col-sm-6">
-                    <div class="disable" [ngClass]="{'disableDiv': disableAfterVerifyKYC}">
-                        <datetime class="dateOfBirth" [readonly]="true"
-                            [(ngModel)]="walletRegistrationModel.Customer.CustomerDateOfBirth" name="dateOfBirth"
-                            #dateOfBirth="ngModel" [timepicker]="false" [datepicker]="datepickerFromOpts">
-                        </datetime>
-                    </div>
-                </div>
-            </div>
-        </div>
-        <div class="col-md-6" *ngIf="pageName !== 'view'">
-            <div class="form-group">
-                <label class="col-sm-6 control-label">Date of Birth
-                    <span class="pull-right m-l-sm">:</span>
-                </label>
-                <div class="col-sm-6">
-                    <div [ngClass]="{'disableDiv': disableAfterVerifyKYC}">
-                        <datetime class=" dateOfBirth" name="dateOfBirth" #dateOfBirth="ngModel"
-                            [(ngModel)]="walletRegistrationModel.Customer.CustomerDateOfBirth" [timepicker]="false"
-                            [datepicker]="datepickerFromOpts" (ngModelChange)="OnChangeEdit(true)" [required]="enableVerifyKyc && 
-                            !walletRegistrationModel.Customer.CustomerDateOfBirth">
-                        </datetime>
-                        <div class="message-error" *ngIf="(f.submitted || dateOfBirth.touched) && enableVerifyKyc && 
-                                !walletRegistrationModel.Customer.CustomerDateOfBirth">
-                            <span class='img-warning'></span>Please enter Date of Birth.
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-    </div>
-
-    <div class="row" *ngIf="walletRegistrationModel.Customer.CustomerTypeId != customerTypeBusiness">
-        <div class="col-md-6">
-            <div class="form-group">
-                <label class="col-sm-6 control-label">ID Issue Country
-                    <span class="pull-right m-l-sm">:</span>
-                </label>
-                <div class="col-sm-6">
-                    <kendo-dropdownlist class="form-control" name="Issue Country" #IDIssuerCountry="ngModel"
-                        [(ngModel)]="walletRegistrationModel.Customer.IdIssueCountryCode"
-                        [disabled]="pageName == 'view'" [data]="countryListData" [filterable]="true"
-                        [textField]="'countryName'" [valueField]="'countryCode'"
-                        (filterChange)="issuecountrySearchFilter($event)" [defaultItem]="defaultIssueCountryItem"
-                        [valuePrimitive]="true">
-                    </kendo-dropdownlist>
-                </div>
-            </div>
-        </div>
-        <div class="col-md-6" *ngIf="pageName === 'view'">
-            <div class="form-group">
-                <label class="col-sm-6 control-label">ID Issue Date
-                    <span class="pull-right m-l-sm">:</span>
-                </label>
-                <div class="col-sm-6">
-                    <div class="disable">
-                        <datetime class="IdIssueDate" [readonly]="true"
-                            [(ngModel)]="walletRegistrationModel.Customer.IdIssuedDate" name="IdIssueDate"
-                            #IdIssueDate="ngModel" [timepicker]="false" [datepicker]="datepickerExpiryDate">
-                        </datetime>
-                    </div>
-                </div>
-            </div>
-        </div>
-        <div class="col-md-6" *ngIf="pageName !== 'view'">
-            <div class="form-group">
-                <label class="col-sm-6 control-label">ID Issue Date
-                    <span class="pull-right m-l-sm">:</span>
-                </label>
-                <div class="col-sm-6">
-                    <div>
-                        <datetime class="IdIssueDate" [(ngModel)]="walletRegistrationModel.Customer.IdIssuedDate"
-                            name="IdIssueDate" #IdIssueDate="ngModel" [timepicker]="false"
-                            (ngModelChange)="handleIdIssueExpiryDateChange($event)" [datepicker]="datepickerExpiryDate">
-                        </datetime>
-                    </div>
-                </div>
-            </div>
-        </div>
-    </div>
-
-    <div class="row"
-        *ngIf="walletRegistrationModel.Customer.CustomerTypeId != customerTypeBusiness && pageName === 'view'">
-        <div class="col-md-6">
-            <div class="form-group">
-                <label class="col-sm-6 control-label">Id Expiry Date
-                    <span class="pull-right m-l-sm">:</span>
-                </label>
-                <div class="col-sm-6">
-                    <div class="disable">
-                        <datetime [(ngModel)]="walletRegistrationModel.Customer.IdExpiredDate" [readonly]="true"
-                            #idExpiryDate="ngModel" name="idExpiryDate" [timepicker]="false"
-                            [datepicker]="common.datepickerFromOpts"></datetime>
-                    </div>
-                </div>
-            </div>
-        </div>
-    </div>
-
-    <div class="row" *ngIf="walletRegistrationModel.Customer.CustomerTypeId != customerTypeBusiness">
-        <div class="col-md-6">
-            <div class="form-group">
-                <label class="control-label col-sm-6">NRC Front Image
-                    <span>:</span>
-                </label>
-                <div class="col-sm-6" *ngIf="pageName =='new' || pageName=='edit'">
-                    <input type="text" name="fileIdImage" #fileIdImage="ngModel" class="form-control"
-                        [(ngModel)]="walletRegistrationModel.Customer.NrcFrontImage"
-                        [required]="enableVerifyKyc && !walletRegistrationModel.Customer.NrcFrontImage" readonly />
-                    <div class="message-error"
-                        *ngIf="(f.submitted || fileIdImage.touched) && fileIdImage.errors && fileIdImage.errors.required">
-                        <span class='img-warning'></span>Please select an NRC Front Image.
-                    </div>
-                </div>
-                <div class="col-sm-6" *ngIf="pageName =='view'">
-                    <div style="height: 120px;width: 130px;border-radius: 10px;border: 1px black solid;">
-                        <img class="image" *ngIf="walletRegistrationModel.Customer.NrcFrontImage"
-                            style="width: 128px; height: 117px;" [src]="walletRegistrationModel.Customer.NrcFrontImage" 
-                            (click)="displayImage(walletRegistrationModel.Customer.NrcFrontImage)">
-                    </div>
-                </div>
-            </div>
-        </div>
-        <div class="col-md-2" *ngIf="pageName =='new' || pageName=='edit'">
-            <input id="fileIdImage" type="file" class="hide" (change)="uploadFile($event)" accept="image/*">
-            <!-- <label class="col-sm-6 btn btn-primary" for="fileIdImage" aria-disabled="">Browse</label> -->
-            <!-- <span class="message-error col-sm-6">* .JPG, .JPEG</span> -->
-        </div>
-        <div class="col-md-4" *ngIf="pageName !== 'view'">
-            <div class="form-group">
-                <label class="col-sm-3 control-label text-left">Id Expiry Date
-                    <span class="pull-right m-l-sm">:</span>
-                </label>
-                <div class="col-sm-9">
-                    <div>
-                        <datetime class="IdExpiryDate" [(ngModel)]="walletRegistrationModel.Customer.IdExpiredDate"
-                            name="IdExpiryDate" #IDExpiryDate="ngModel" [timepicker]="false"
-                            (ngModelChange)="handleIdIssueExpiryDateChange($event)" [datepicker]="datepickerExpiryDate">
-                        </datetime>
-                    </div>
-                    <div class="message-error" *ngIf="invalidIdIssueExpiryDate">
-                        <span class='img-warning'></span>ID Expiry Date cannot be earlier than ID Issue Date.
-                    </div>
-                </div>
-            </div>
-        </div>
-        <div class="col-md-6" *ngIf="pageName === 'view'">
-            <div class="form-group">
-                <label class="control-label col-sm-6">Face Image
-                    <span>:</span>
-                </label>
-                <div class="col-sm-6">
-                    <div style="height: 120px;width: 130px;border-radius: 10px;border: 1px black solid;">
-                        <img class="image" *ngIf="walletRegistrationModel.Customer.FaceImage"
-                            style="width: 128px; height: 117px;" [src]="walletRegistrationModel.Customer.FaceImage" 
-                            (click)="displayImage(walletRegistrationModel.Customer.FaceImage)">
-                    </div>
-                </div>
-            </div>
-        </div>
-    </div>
-
-    <div class="row" *ngIf="walletRegistrationModel.Customer.CustomerTypeId != customerTypeBusiness">
-        <div class="col-md-6">
-            <div class="form-group">
-                <label class="control-label col-sm-6">NRC Back Image
-                    <span>:</span>
-                </label>
-                <div class="col-sm-6" *ngIf="pageName =='new' || pageName=='edit'">
-                    <input type="text" name="fileIdImage" #fileIdImage="ngModel" class="form-control"
-                        [(ngModel)]="walletRegistrationModel.Customer.NrcBackImage"
-                        [required]="enableVerifyKyc && !walletRegistrationModel.Customer.NrcBackImage" readonly />
-                    <div class="message-error"
-                        *ngIf="(f.submitted || fileIdImage.touched) && fileIdImage.errors && fileIdImage.errors.required">
-                        <span class='img-warning'></span>Please select an NRC Back Image.
-                    </div>
-                </div>
-                <div class="col-sm-6" *ngIf="pageName =='view'">
-                    <div style="height: 120px;width: 130px;border-radius: 10px;border: 1px black solid;">
-                        <img class="image" *ngIf="walletRegistrationModel.Customer.NrcBackImage"
-                            style="width: 128px; height: 117px;" [src]="walletRegistrationModel.Customer.NrcBackImage" 
-                            (click)="displayImage(walletRegistrationModel.Customer.NrcBackImage)">
-                    </div>
-                </div>
-            </div>
-        </div>
-    </div>
-
-    <div class="row" *ngIf="walletRegistrationModel.Customer.CustomerTypeId != customerTypeBusiness">
-        <div class="col-md-6" *ngIf="pageName =='new' || pageName=='edit'">
-            <div class="form-group">
-                <label class="control-label col-sm-6">Face Image
-                    <span>:</span>
-                </label>
-                <div class="col-sm-6">
-                    <input type="text" name="fileCustomerImage" class="form-control" #fileCustomerImage="ngModel"
-                        [(ngModel)]="walletRegistrationModel.Customer.CustomerImageName"
-                        [required]="enableVerifyKyc && !walletRegistrationModel.Customer.CustomerImageName" readonly />
-                    <div class="message-error"
-                        *ngIf="(f.submitted || fileCustomerImage.touched) && fileCustomerImage.errors && fileCustomerImage.errors.required">
-                        <span class='img-warning'></span>Please select Face Image.
-                    </div>
-                </div>
-            </div>
-        </div>
-        <div class="col-md-2" *ngIf="pageName =='new' || pageName=='edit'">
-            <input id="fileCustomerImage" type="file" class="hide" (change)="uploadFile($event)" accept="image/*">
-            <!-- <label class="col-sm-6 btn btn-primary" for="fileCustomerImage">Browse</label> -->
-            <!-- <span class="message-error col-sm-6">* .JPG, .JPEG</span> -->
-        </div>
-    </div>
-
-    <div class="row" *ngIf="walletRegistrationModel.Customer.CustomerTypeId != customerTypeBusiness">
-        <div class="col-md-6">
-            <div class="form-group">
-                <label class="col-sm-6 control-label">Customer Company Name
-                    <span class="pull-right m-l-sm">:</span>
-                </label>
-                <div class="col-sm-6">
-                    <input [title]="walletRegistrationModel.Customer.CustomerCompany" [disabled]="pageName == 'view'"
-                        type="text" name="customerCompany" placeholder="Customer Company Name"
-                        #customerCompany="ngModel" [(ngModel)]="walletRegistrationModel.Customer.CustomerCompany"
-                        class="form-control" maxlength="100" (keypress)="common.onlyAlphanumericAndThai($event,true)"
-                        (paste)="common.validateAlphanumericAndThai($event,true)" />
-                    <div *ngIf="(f.submitted || customerCompany.touched) && customerCompany.errors"
-                        class="message-error">
-                        <span class='img-warning'></span>Customer company can't be greater than 100 characters.
-                    </div>
-                </div>
-            </div>
-        </div>
-        <div class="col-md-6">
-            <div class="form-group">
-                <label class="col-sm-6 control-label">Occupation
-                    <span class="pull-right m-l-sm">:</span>
-                </label>
-                <div class="col-sm-6">
-                    <kendo-dropdownlist class="form-control" name="occupationId" #occupationId="ngModel"
-                        [(ngModel)]="walletRegistrationModel.Customer.OccupationId" [disabled]="pageName == 'view'"
-                        [data]="occupationListData" [filterable]="true" [textField]="'occupationName'"
-                        [valueField]="'occupationId'" (filterChange)="occupationSearchFilter($event)"
-                        [defaultItem]="defaultOccupationItem" [valuePrimitive]="true">
-                    </kendo-dropdownlist>
-                </div>
-            </div>
-        </div>
-    </div>
-
-    <div class="row">
-        <div class="col-md-6">
-            <div class="form-group">
-                <label class="col-sm-6 control-label">User Define 1
-                    <span class="pull-right m-l-sm">:</span>
-                </label>
-                <div class="col-sm-6">
-                    <input type="text" [title]="walletRegistrationModel.Customer.UserDefine1"
-                        [disabled]="pageName == 'view'" name="userDefineOne" #userDefineOne="ngModel"
-                        placeholder="User Define 1" [(ngModel)]="walletRegistrationModel.Customer.UserDefine1"
-                        class="form-control" />
-                </div>
-            </div>
-        </div>
-        <div class="col-md-6">
-            <div class="form-group">
-                <label class="col-sm-6 control-label">Company Name
-                    <span class="pull-right m-l-sm">:</span>
-                </label>
-                <div class="col-sm-6">
-                    <kendo-dropdownlist class="form-control" name="companyUniqueId" #companyUniqueId="ngModel"
-                        [(ngModel)]="walletRegistrationModel.Customer.CompanyUniqueId"
-                        [disabled]="(pageName != 'new' || userCompanyUniqueId != '000') || disableAfterVerifyKYC"
-                        [filterable]="true" [data]="companyListData" [textField]="'companyName'"
-                        [valueField]="'companyUniqueId'" [defaultItem]="defaultCompanyItem"
-                        (filterChange)="companySearchFilter($event)" (valueChange)="getCompanyRiskSetting($event)"
-                        [valuePrimitive]="true" required>
-                    </kendo-dropdownlist>
-                    <div *ngIf="(f.submitted || companyUniqueId.touched) && companyUniqueId.errors && companyUniqueId.errors.required"
-                        class="message-error">
-                        <span class='img-warning'></span>Please select Company Name.
-                    </div>
-                </div>
-            </div>
-        </div>
-    </div>
-
-    <div class="row">
-        <div class="col-md-6">
-            <div class="form-group">
-                <label class="col-sm-6 control-label">User Define 2
-                    <span class="pull-right m-l-sm">:</span>
-                </label>
-                <div class="col-sm-6">
-                    <input type="text" [title]="walletRegistrationModel.Customer.UserDefine2"
-                        [disabled]="pageName == 'view'" name="userDefineTwo" #userDefineTwo="ngModel"
-                        placeholder="User Define 2" [(ngModel)]="walletRegistrationModel.Customer.UserDefine2"
-                        class="form-control" />
-                </div>
-            </div>
-        </div>
-        <div class="col-md-6">
-            <div class="form-group">
-                <label class="col-sm-6 control-label">Customer Status
-                    <span class="pull-right m-l-sm">:</span>
-                </label>
-                <div class="col-sm-6">
-                    <kendo-dropdownlist class="form-control" name="userStatus" #userStatus="ngModel"
-                        [(ngModel)]="walletRegistrationModel.Customer.UserStatusId"
-                        [disabled]="pageName == 'view' || this.customerStatusDisabled" [filterable]="true"
-                        [data]="userStatusListData" [textField]="'userStatus'" [valueField]="'userStatusId'"
-                        (filterChange)="userStatusSearchFilter($event)" [valuePrimitive]="true">
-                    </kendo-dropdownlist>
-                </div>
-            </div>
-        </div>
-    </div>
-
-    <div class="row">
-        <div class="col-md-6">
-            <div class="form-group">
-                <label class="col-sm-6 control-label">Wallet Purpose
-                    <span class="pull-right m-l-sm">:</span>
-                </label>
-                <div class="col-sm-6">
-                    <kendo-dropdownlist class="form-control" name="walletPurpose" #walletPurpose="ngModel"
-                        [(ngModel)]="walletRegistrationModel.Customer.WalletPurposeId" [disabled]="pageName == 'view'"
-                        [defaultItem]="defaultWalletPurposeItem" [filterable]="true" [data]="walletPurposeListData"
-                        [textField]="'descriptionEN'" [valueField]="'walletPurposeId'"
-                        (filterChange)="walletPurposeSearchFilter($event)" [valuePrimitive]="true">
-                    </kendo-dropdownlist>
-                </div>
-            </div>
-        </div>
-        <div class="col-md-6" *ngIf="walletRegistrationModel.Customer.WalletPurposeId == 999">
-            <div class="form-group">
-                <label class="col-sm-6 control-label">Wallet Purpose's Description
-                    <span class="pull-right m-l-sm">:</span>
-                </label>
-                <div class="col-sm-6" *ngIf="pageName == 'edit' || pageName == 'new'">
-                    <input type="text" name="walletPurposeDescription" #walletPurposeDescription="ngModel"
-                        placeholder="Wallet Purpose's Description"
-                        [(ngModel)]="walletRegistrationModel.Customer.WalletPurposeDescription" class="form-control"
-                        required [maxlength]="maxWalletPurposeDescription" />
-                    <div *ngIf="((f.submitted || walletPurposeDescription.touched) && (walletPurposeDescription.errors && walletPurposeDescription.errors.required)) || 
-                    (walletRegistrationModel.Customer.WalletPurposeDescription && !walletRegistrationModel.Customer.WalletPurposeDescription.trim())"
-                        class="message-error">
-                        <span class='img-warning'></span>Please enter Wallet Purpose's description.
-                    </div>
-                </div>
-
-                <div class="col-sm-6 control-label text-left" *ngIf="pageName == 'view'">
-                    {{walletRegistrationModel.Customer.WalletPurposeDescription}}
-                </div>
-            </div>
-        </div>
-    </div>
-
-    <div class="row" *ngIf="pageName == 'view'">
-        <div class="col-md-6">
-            <div class="form-group">
-                <label class="col-sm-6 control-label">Verify KYC
-                    <span class="pull-right m-l-sm">:</span>
-                </label>
-                <div class="col-sm-6 control-label text-left"> {{walletRegistrationModel.Customer.VerifyKYC2c2p}}
-                </div>
-            </div>
-        </div>
-        <div class="col-md-6">
-            <div class="form-group">
-                <label class="col-sm-6 control-label">Verify KYC Non
-                    <span class="pull-right m-l-sm">:</span>
-                </label>
-                <div class="col-sm-6 control-label text-left"> {{walletRegistrationModel.Customer.VerifyKYCNon2c2p}}
-                </div>
-            </div>
-        </div>
-    </div>
-
-    <div class="row" *ngIf="pageName == 'view' || pageName == 'edit'">
-        <div class="col-md-6">
-            <div class="form-group">
-                <label class="col-sm-6 control-label">Risk Level
-                    <span class="pull-right m-l-sm">:</span>
-                </label>
-                <div class="col-sm-6 control-label text-left"> {{ (walletRegistrationModel.Customer.RiskLevel ?
-                    walletRegistrationModel.Customer.RiskLevel : "N/A" )}}
-                </div>
-            </div>
-        </div>
-        <div class="col-md-6">
-            <div class="form-group">
-                <label class="col-sm-6 control-label">Dip Chip Status
-                    <span class="pull-right m-l-sm">:</span>
-                </label>
-                <div class="col-sm-6 control-label text-left"> {{ (walletRegistrationModel.Customer.DipChipStatus ?
-                    "Verified" : "Not Verify") }}
-                </div>
-            </div>
-        </div>
-    </div>
-
-    <div class="row" *ngIf="pageName == 'view' || pageName == 'edit'">
-        <div class="col-md-6">
-            <div class="form-group">
-                <label class="col-sm-6 control-label">Register Date
-                    <span class="pull-right m-l-sm">:</span>
-                </label>
-                <div class="col-sm-6 control-label text-left"> {{walletRegistrationModel.Customer.RegisterDate}}
-                </div>
-            </div>
-        </div>
-        <div class="col-md-6">
-            <div class="form-group">
-                <label class="col-sm-6 control-label">Register By
-                    <span class="pull-right m-l-sm">:</span>
-                </label>
-                <div class="col-sm-6 control-label text-left"> {{walletRegistrationModel.Customer.RegisterBy}}
-                </div>
-            </div>
-        </div>
-    </div>
-
-    <div class="row" *ngIf="pageName == 'view' || pageName == 'edit'">
-        <div class="col-md-6">
-            <div class="form-group">
-                <label class="col-sm-6 control-label">Modified Date
-                    <span class="pull-right m-l-sm">:</span>
-                </label>
-                <div class="col-sm-6 control-label text-left"> {{walletRegistrationModel.Customer.ModifiedDate}}
-                </div>
-            </div>
-        </div>
-        <div class="col-md-6">
-            <div class="form-group">
-                <label class="col-sm-6 control-label">Modified By
-                    <span class="pull-right m-l-sm">:</span>
-                </label>
-                <div class="col-sm-6 control-label text-left"> {{walletRegistrationModel.Customer.ModifiedBy}}
-                </div>
-            </div>
-        </div>
-    </div>
-    <input type="submit" class="hide" #btnSubmit>
-</form>