<div ng-controller="campaignsController">
    <div class="col-md-6 pull-right" style="width: auto">
    <label>Period</label> &nbsp;&nbsp; 
      <div id="advance-daterange" class="btn btn-white">
        <span id="txndtSpan"></span>
        <i class="fa fa-angle-down fa-fw"></i>
      </div>
  </div>
  <div class="row">
      <div class="col-md-6">
          <h1 class="page-header">
            Transactional Campaigns
          </h1>
      </div>
  </div>
  
   
  <div id="content" class=" content-container">      
     <div class="row" style="padding-left:10px;padding-right:10px;">
       <div class="panel panel-inverse panel-with-tabs" data-sortable-id="ui-unlimited-tabs-1">
         <div class="p-0 campaign-panel-heading">
           <div class="tab-overflow">
             <ul class="nav nav-tabs nav-tabs-inverse" style="width: 100%;">
               <li class="active" style="width: 20%;"><a href="#" data-toggle="tab" id="btnActive">Active Campaigns</a></li>
               <li class="" style="width: 20%;"><a href="#" data-toggle="tab" id="btnDraft">Draft Campaigns</a></li>
               <li class="" style="width: 20%;"><a href="#" data-toggle="tab" id="btnPast">Past Campaigns</a></li>
               <li id="downloadTxnCSV" attr-tableid="campaignTable"><i id="u-downloadLink" class="fa fa-2x fa-download" title="Campaign csv" style="font-size: 18px;position: relative;top: 6px;right: 14px;float: right;cursor: pointer;"></i></li>
             </ul>
           </div>
         </div>
         <div class="tab-content" style="padding-top: 0px;">
           <div class="tab-pane fade active in" id="active">
             <div class="panel-body">
               <div class="table-responsive margin-top-15">
                   <table class="table table-bordered" id="tblCampaigns" >
                    <thead >
                      <th>
                        <input type="checkbox" id="selectAllCheckbox">
                        <label for="selectAllCheckbox">Select All</label>
                    </th>
                      <th>Type</th>
                      <th>Name</th>
                      <th>Audience Segment</th>
                      <th>Reachable Audience</th>
                      <th>Sent</th>
                      <th id="receivedTo">Received</th>   
                      <th id="impressionRate">Impression Rate</th>
                      <th id="clickedTo">Clicked</th>
                      <th id="ctr" >CTR</th>
                      <th id="conversion">Conversion</th>
                      <th>Start Date</th>
                      <th>End Date</th>
                      <th>Action</th>
                    </thead>
                      <tbody ></tbody>
                 </table>
               </div>
             </div>
           </div>
         </div>
       </div>
     </div>
   </div>
  </div>
  
