discountcodereport.component.html 6.79 KB
<div class="row" style="margin-right: auto;">
  <div class="col-sm-12 pageHeading" style="margin-left: 15px;">
    <h4>Discount Code Report</h4>
  </div>
  <div class="col-sm-12">

    <div class="container-fluid main-full">
      <div class="row" style="margin-right:-40px">
        <div class="well no-margin-btm" [formGroup]="DiscountCodeReportForm">
            <div class="col-xs-12" *ngIf="alerts !== ''">
                <div class="alert alert-danger" [innerHTML]="alerts">
                </div>
  
              </div>
          <div class="row" >
            <div class="col-lg-4 col-sm-4">
              <div class="row">
                <div class="col-sm-12">
                  <div class="form-group marginTop5">
                    <label for="sFromDate" class="col-sm-12 col-lg-6 control-label text-right-lg paddTop7 padd-left0">From Date :</label>
                    <div class="col-sm-12 col-lg-6 padd-left0 padd-right0">
                      <div id="sFromDate" class="input-group input-group-sm input-append date">
                        <input type="text" class="form-control" [bsConfig]="bsConfig" formControlName="sFromDate" #dp1="bsDatepicker" bsDatepicker [(bsValue)]="bsValue1"
						(bsValueChange)="FromDateChange(dp1)" (change)="FromDateChange(dp1)" placeholder="mm/dd/yyyy">
                        <span class="input-group-btn add-on">
                          <button class="btn btn-default" type="button" (click)="dp1.toggle()"><i class="fa fa-calendar"></i></button>
                        </span>
                      </div>
                    </div>

                  </div>
                </div>

                <div class="col-sm-12">
                  <div class="form-group marginTop5">
                    <label for="sToDate" class="col-sm-12 col-lg-6 control-label text-right-lg paddTop7 padd-left0">To Date :</label>
                    <div class="col-sm-12 col-lg-6 padd-left0 padd-right0">
                      <div id="sToDate" class="input-group input-group-sm input-append date">
                        <input type="text" class="form-control" [bsConfig]="bsConfig" formControlName="sToDate" #dp2="bsDatepicker" bsDatepicker [(bsValue)]="bsValue2"
						(bsValueChange)="ToDateChange(dp2)" (change)="ToDateChange(dp2)" placeholder="mm/dd/yyyy">
                        <span class="input-group-btn add-on">
                          <button class="btn btn-default" type="button" (click)="dp2.toggle()"><i class="fa fa-calendar"></i></button>
                        </span>
                      </div>
                    </div>

                  </div>
                </div>
              </div>
            </div>

            <div class="col-lg-4 col-sm-4">
              <div class="row">
                <div class="col-sm-12">
                  <div class="form-group marginTop5">
                    <label for="AccountNumber" class="col-sm-12 col-lg-6 control-label text-right-lg paddTop7 padd-left0">Discount Code :</label>
                  </div>
                  <div class="col-sm-12 col-lg-6 padd-left0 padd-right0">
                    <select class="form-control input-sm" id="DiscountCode" formControlName="iDiscountCode">
                      <option selected="selected" value="0">All</option>
                      <option *ngFor="let item of lstDiscountCode" value="{{item.Id}}">{{item.DiscountCode}}</option>
                    </select>
                  </div>
                </div>

                <div class="col-sm-12">
                  <div class="form-group marginTop5">
                    <label for="AccountNumber" class="col-sm-12 col-lg-6 control-label text-right-lg paddTop7 padd-left0">Account Number :</label>
                  </div>
                  <div class="col-sm-12 col-lg-6 padd-left0 padd-right0">
                    <input type="text" class="form-control input-sm" id="AccountNumber" placeholder="" formControlName="iAccountNumber">
                  </div>
                </div>

              </div>
            </div>

            <div class="col-lg-4 col-sm-4">
              <div class="row">
                <div class="col-sm-12 hidden-xs">
                  <div class="form-group marginTop5">
                    <label for="AccountNumber" class="col-sm-12 col-lg-6 control-label text-right-lg paddTop7 padd-left0">&nbsp;</label>
                  </div>
                  <div class="col-sm-12 col-lg-6 padd-left0 padd-right0 paddTop7">
                    &nbsp;
                  </div>
                </div>

                <div class="col-sm-12">
                  <div class="form-group marginTop5">
                    <label class="col-sm-12 col-lg-6 control-label text-right-lg paddTop7 padd-left0 hidden-lg hidden-xs">&nbsp;</label>
                  </div>
                  <div class="col-sm-12 col-lg-6 padd-left0 padd-right0">
                    <button class="btn btn-primary btn-sm" data-toggle="modal" data-target="#mymodal" (click)="SearchRecords()" [disabled]="!DiscountCodeReportForm.valid || alerts != ''"><i class="fa fa-file"></i>  Generate Report</button>                 
                  </div>
                </div>

              </div>
            </div>

          </div>
          
        </div>

        <div class="well">
          <table id="fixed_hdr2" class="table-hover  ui-widget-header sorttable">
            <thead>
              <tr>
                <th id="DiscountCode">Discount Code</th>
                <th id="Percentage">Percentage</th>
                <th id="StartDate">Start Date</th>
                <th id="EndDate">End Date</th>
                <th id="DiscountStatus">Status</th>
                <th id="TotalLicenses">Total License</th>
              </tr>
            </thead>
            <tbody>
              <tr *ngIf="NoRecord !== ''">

                <td colspan="6"><b style="color: red;text-align: center; padding-left: 606px;"><span [innerHTML]="NoRecord"></span></b></td>
              </tr>
              <tr *ngFor="let item of lstDiscountCodeReport">
                <td>{{item.DiscountCode}}</td>
                <td>{{item.Percentage}}%</td>
                <td>{{item.StartDate | date: 'MM/dd/yyyy'}}</td>
                <td>{{item.EndDate | date: 'MM/dd/yyyy'}}</td>
                <td>{{item.DiscountStatus}}</td>
                <td>{{item.TotalLicenses}}</td>
              </tr>
            </tbody>
          </table>
          <admin-pager [recordCount]="recordCount" [pageNo]="pageNo" [pageLength]="pageLength" (pagerEvent)="GetDiscountReport($event)"></admin-pager>
          <div class="row">
            <div class="col-sm-12 marginTop20 text-center">
              <button type="button" class="btn btn-primary btn-sm" (click)="ExportEvent()" [ngClass]="{disabled : !buttonStatus}"><i class="fa fa-file-excel-o"></i>  Export To CSV</button>
            </div>
          </div>
        </div>

      </div>
    </div>
  </div>
</div>