<div class="content-wrapper" ng-if="!myAccess.birthdayReport">
    <div class="container-fluid">
       <div class="row">
          <div class="col-sm-6 offset-sm-1 offset-md-2 offset-lg-3 mt-5">
             <div class="alert alert-warning alert-dismissible">
                <h5><i class="icon fas fa-ban"></i> 	!</h5>
                Unauthorised Access.
             </div>
          </div>
       </div>
    </div>
 </div>
 <div class="content-wrapper" class="modal-demo" ng-if="myAccess.birthdayReport">
    <section class="content-header">
       <div class="container-fluid">
          <div class="row mb-2">
             <div class="col-sm-6">
                <h1 class="text-{{page.color}}">
                   <go-back/>
                   <i class="fas {{page.icon}}"></i> Heroes Birthday Reports
                </h1>
             </div>
             <div class="col-sm-6">
                <ol class="breadcrumb float-sm-right">
                   <li class="breadcrumb-item"><a ng-href="{{baseurl}}/dashboard">Home</a></li>
                   <li class="breadcrumb-item text-blue">Heroes Birthday Reports</li>
                </ol>
             </div>
          </div>
       </div>
    </section>
    <section class="content">
       <div class="row">
          <div class="col-md-12">
             <div class="col-sm-4">
                <label for="month">Select Month</label>
                <select class="form-control" id="month" ng-model="month" ng-change="selectBirthday(month)">
                   <option value="0">Select</option>
                   <option value="1">January</option>
                   <option value="2">February</option>
                   <option value="3">March</option>
                   <option value="4">April</option>
                   <option value="5">May</option>
                   <option value="6">June</option>
                   <option value="7">July</option>
                   <option value="8">August</option>
                   <option value="9">September</option>
                   <option value="10">October</option>
                   <option value="11">November</option>
                   <option value="12">December</option>
                </select>
             </div>
             <!--  -->
             <div class="col-12 col-md-12 col-lg-12">
                <div class="card card-outline card-success">
                   <div class="card-body">
                      <h5>Heroes Birthday Reports Monthly</h5>
                      <div class="table-responsive"> 
                         <table id="" class="dataList123 table table-bordered table-sm">
                            <thead>
                               <tr>
                                  <th>#</th>
                                  <th>Hero Name</th>
                                  <th>Emp Code</th>
                                  <th>Email</th>
                                  <th>Mobile</th>
                                  <th>Revenue Ceneter</th>
                                  <th>Location</th>
                                  <th>DOB</th>
                                  <th>DOJ</th>
                               </tr>
                            </thead>
                            <tbody>
                               <tr ng-repeat="ar in reportList track by $index">
                                  <td>{{$index+1}}</td>  
                                  <td><strong>{{ar.emp_first_name | capitalize}} {{ar.emp_last_name | capitalize}}</strong></td>
                                  <td><strong>{{ar.emp_code}}</strong></td>
                                  <td><strong>{{ar.emp_email}}</strong></td>
                                  <td><strong>{{ar.emp_mobile}}</strong></td>
                                  <td><strong>{{ar.rc_name}}</strong></td>
                                  <td><strong>{{ar.country_name}}</strong></td>
                                  <td><strong ng-bind="formatDate(ar.emp_dob) | date:'dd MMM yyyy'"></strong></td>
                                  <td><strong ng-bind="formatDate(ar.emp_doj) | date:'dd MMM yyyy'"></strong></td>
                               </tr>
                            </tbody>
                         </table>
                      </div>
                   </div>
                </div>
             </div>
             <!--  -->
          </div>
       </div>
    </section>
 </div>