editlicensebasicsettings.component.html 10.2 KB
<!-- main-heading -->
<div class="row">

  <div class="col-sm-12 pageHeading" style="margin-left: 15px;">
    <h4>View/Update Profile</h4>
  </div>

  <ng-template #templatesuccess>
      <div class="modal-header">
        <h4 class="modal-title pull-left">Confirmation</h4>
        <button type="button" class="close pull-right" aria-label="Close" (click)="modalRef.hide()">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body" [innerHTML]="modalAlerts">
      </div>
      <div class="modal-footer">
      </div>
  </ng-template>

  <!-- container -->
  <div class="col-sm-10 col-sm-offset-1 col-md-8 col-md-offset-2 col-lg-6 col-lg-offset-3">       
      <div class="container-fluid main-full">
          <div class="row">

            <div class="well">		

                <div class="row" *ngIf="alerts != ''">
                    <div class="col-xs-12">
                      <div class="alert alert-danger" [innerHTML]="alerts">
                      </div>
                    </div>
                  </div>

            <div class="row">

              <div class="col-sm-12">

              <div class="panel-body">

               <!-- form -->
              <form class="form-horizontal" [formGroup]="updateLicenseBasicSettingsFrm" (submit)="UpdateLicenseBasicSettings(templatesuccess)">
                  
                <div class="form-group">
                  <label for="inputEmail3" class="col-sm-4 control-label">Account Number :</label>
                  <div class="col-sm-7">
                      <select class="form-control input-sm" id="LicenseId" formControlName="licenseId" (change)="AccountNumberChanged($event.target.value)">
                          <option value="0">Select</option>
                          <option *ngFor="let item of lstAccountNumbers" value="{{item.m_Item1}}">
                              {{item.m_Item2}}
                          </option>
                      </select>
                  </div>
                </div>

                <div class="form-group">
                  <label for="inputPassword3" class="col-sm-4 control-label">Licensee First Name <span class="red">*</span> :</label>
                    <div class="col-sm-7">
                      <input type="text" class="form-control input-sm" id="LicenseeFirstName" formControlName="licenseeFirstName" maxlength="50">
                      <div *ngIf="updateLicenseBasicSettingsFrm.controls.licenseeFirstName.hasError('required') && updateLicenseBasicSettingsFrm.controls.licenseeFirstName.dirty" class="alert alert-danger" style="padding: 2px; margin-bottom: 2px;">Licensee first name is required</div>
                    </div>
                </div>

                <div class="form-group">
                  <label for="inputPassword3" class="col-sm-4 control-label">Licensee Last Name <span class="red">*</span> :</label>
                  <div class="col-sm-7">
                      <input type="text" class="form-control input-sm" id="LicenseeLastName" formControlName="licenseeFirstName" maxlength="50">
                      <div *ngIf="updateLicenseBasicSettingsFrm.controls.licenseeLastName.hasError('required') && updateLicenseBasicSettingsFrm.controls.licenseeLastName.dirty" class="alert alert-danger" style="padding: 2px; margin-bottom: 2px;">Licensee first name is required</div>
                  </div>
                </div>

                <div class="form-group">
                  <label for="inputPassword3" class="col-sm-4 control-label">Institution Name <span class="red">*</span> :</label>
                  <div class="col-sm-7">
                      <input type="text" class="form-control input-sm" id="InstitutionName" formControlName="institutionName" maxlength="100">
                      <div *ngIf="updateLicenseBasicSettingsFrm.controls.institutionName.hasError('required') && updateLicenseBasicSettingsFrm.controls.institutionName.dirty" class="alert alert-danger" style="padding: 2px; margin-bottom: 2px;">Institution name is required</div>
                  </div>
                </div>

                <div class="form-group">
                  <label for="inputEmail3" class="col-sm-4 control-label">Email ID <span class="red">*</span> :</label>
                  <div class="col-sm-7">
                      <input type="email" class="form-control input-sm" id="Email" formControlName="emailId" maxlength="50">
                      <div *ngIf="updateLicenseBasicSettingsFrm.controls.emailId.hasError('required') && updateLicenseBasicSettingsFrm.controls.emailId.dirty" class="alert alert-danger" style="padding: 2px; margin-bottom: 2px;">Email is required</div>
                  </div>
                </div>

                <div class="form-group">
                  <label for="inputEmail3" class="col-sm-4 control-label">Address 1 <span class="red">*</span> :</label>
                  <div class="col-sm-7">
                      <input type="text" class="form-control input-sm" id="Address1" formControlName="address1" maxlength="100">
                      <div *ngIf="updateLicenseBasicSettingsFrm.controls.address1.hasError('required') && updateLicenseBasicSettingsFrm.controls.address1.dirty" class="alert alert-danger" style="padding: 2px; margin-bottom: 2px;">Address 1 is required</div>
                  </div>
                </div>

                <div class="form-group">
                  <label for="inputEmail3" class="col-sm-4 control-label">Address 2 :</label>
                  <div class="col-sm-7">
                      <input type="text" class="form-control input-sm" id="Address2" formControlName="address2" maxlength="100">
                  </div>
                </div>

                <div class="form-group">
                  <label for="inputEmail3" class="col-sm-4 control-label">City <span class="red">*</span> :</label>
                  <div class="col-sm-7">
                      <input type="text" class="form-control input-sm" id="City" formControlName="city" maxlength="50">
                      <div *ngIf="updateLicenseBasicSettingsFrm.controls.city.hasError('required') && updateLicenseBasicSettingsFrm.controls.city.dirty" class="alert alert-danger" style="padding: 2px; margin-bottom: 2px;">City is required</div>
                  </div>
                </div>

                <div class="form-group">
                  <label for="inputEmail3" class="col-sm-4 control-label">Zip <span class="red">*</span> :</label>
                  <div class="col-sm-7">
                      <input type="text" class="form-control input-sm" id="Zip" formControlName="zip" maxlength="20">
                      <div *ngIf="updateLicenseBasicSettingsFrm.controls.zip.hasError('required') && updateLicenseBasicSettingsFrm.controls.zip.dirty" class="alert alert-danger" style="padding: 2px; margin-bottom: 2px;">Zip is required</div>
                  </div>
                </div>

                <div class="form-group">
                  <label for="inputEmail3" class="col-sm-4 control-label">State (only U.S.) <span class="red">*</span> :</label>
                  <div class="col-sm-7">
                      <select class="form-control input-sm " id="State" formControlName="stateId">
                          <option value="0">Select</option>
                          <option *ngFor="let item of lstState" value="{{item.Id}}">
                              {{item.StateName}}
                          </option>
                      </select>
                  </div>
                </div>

                <div class="form-group">
                  <label for="inputEmail3" class="col-sm-4 control-label">Country <span class="red">*</span> :</label>
                  <div class="col-sm-7">
                    <select class="form-control input-sm" id="Country" formControlName="countryId">
                        <option value="0">Select</option>
                        <option *ngFor="let item of lstCountry" value="{{item.Id}}">
                           {{item.CountryName}}
                        </option>
                    </select>
                  </div>
                </div>

                <div class="form-group">
                  <label for="inputEmail3" class="col-sm-4 control-label">Phone <span class="red">*</span> :</label>
                  <div class="col-sm-7">
                      <input type="text" class="form-control input-sm" id="Phone" formControlName="phone" maxlength="30">
                      <div *ngIf="updateLicenseBasicSettingsFrm.controls.phone.hasError('required') && updateLicenseBasicSettingsFrm.controls.phone.dirty" class="alert alert-danger" style="padding: 2px; margin-bottom: 2px;">Phone is required</div>
                  </div>
                </div>		

                <div class="row">
                  <div class="col-sm-12 marginTop20 text-center">
                    <button type="submit" class="btn btn-primary btn-sm" [disabled]="!updateLicenseBasicSettingsFrm.valid"><i class="fa fa-check"></i> Update</button>
                  </div>
                </div>

            </form>
             <!-- form -->
               <!--modal-->
            <div class="modal fade bs-example-modal-sm text-left" tabindex="-1" role="dialog" id="mymodal">
                <div class="modal-dialog modal-sm" role="document">
                <div class="modal-content">
                    <div class="modal-header annotation-modal-header ui-draggable-handle">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
                    <h4 class="modal-title" id="">Alert</h4>
                    </div>
                    <div class="modal-body">
                    <h5>Please select your license account number.</h5>	
                    </div>
                    <div class="modal-footer">
                      <div class="row">
                        <div class="col-sm-12"><button class="btn btn-primary btn-sm">Ok</button></div>
                      </div>
                    </div>
                    
                  </div><!-- /.modal-content -->
                </div><!-- /.modal-dialog -->
              </div>
            </div>					
              </div>
            </div>
          </div>
        </div>
      </div>
      </div>
      <!-- container -->	
  </div>
  <!-- main-heading -->