<app-all-menus></app-all-menus>
<div id="toast">
  <div id="desc">{{data_descip}}</div>
</div>
<div class="container-fluid" style="padding-top: 6%;">
    <div class="headerStyle" style="background-color: #426e86;margin-bottom: 5px;">
      <!-- <button md-tooltip="{{'Add Distributer' | translate}}"
        style="border:1px solid transparent;float:left; background-color: transparent;" (click)="adddev()"> -->
        <!-- <md-icon style="float: right;width:30px;height:30px;">add</md-icon> -->
        <i class="fas fa-plus-circle" (click)="adddev()" mdTooltip="{{'Add Distributer' | translate}}"
          style="box-shadow: 3px 1px 5px 0px #b2b0ae;cursor: pointer; float: left;margin-top: 13px; font-size: 24px;border-radius: 50px;margin-left: 20px;"></i>
      <!-- </button>  -->

                <!-- <i class="fas fa-plus-circle" (click)="addDealer()" mdTooltip="{{'Add Dealer' | translate}}"
                  style="box-shadow: 3px 1px 5px 0px #b2b0ae;cursor: pointer; float: left; font-size: 24px;border-radius: 50px;margin-left: 20px;"></i> -->

      
      <span style="margin-right: 342px;font-weight: 600;margin-left: 314px;">{{'DISTRIBUTERS' | translate}}</span>
      <div style="display: inline-flex;padding-bottom: 3px;">
        <input type="search" class="form-control" id="myInput" name="myInput" type="text" [(ngModel)]="myInput"
          style="margin-top: 9px; margin-right: 13px;height: 29px;" (ngModelChange)="searchFilter($event)"
          placeholder="Search Distributer" />
        <!-- <label style="width: inherit;margin-top: 11px">{{'From Date' | translate}}</label> -->
        <input id="from_date" placeholder="From Date" bsDatepicker class="form-control form-control-sm" style="margin-top: 9px;" [bsConfig]="bsConfig"
          [(ngModel)]="from_date" type="text">
        <!-- <label style="width: inherit;margin-top: 11px">{{'To Date' | translate}}</label> -->
        <input id="to_date" placeholder="To date" bsDatepicker class="form-control form-control-sm" style="margin-top: 9px;" [bsConfig]="bsConfig"
          name="todate" [(ngModel)]="to_date" type="text">
      </div>

              <button md-raised-button
                style=" background: #31428c; color: white; float: right;margin-right: 12px;"
                (click)="Distributers()"> {{'Get Detail' | translate}} </button>


      </div>
  <!-- <div class="filterDiv">
    <div class="row" style="margin-bottom: 20px;"> -->
      <!-- <div class="col-12" style="text-align: center;margin-top: 30px;">   -->
        <!-- <button  md-tooltip="{{'Add Distributer' | translate}}" style="border:1px solid transparent;float:left; background-color: transparent;" (click)="adddev()" ><md-icon style="float: right;width:30px;height:30px;">add</md-icon></button>      -->
        <!-- <div style="display: inline-flex; width: 64%;padding-bottom: 3px;">
          <input type="search" class="form-control" id="myInput" name="myInput" type="text" [(ngModel)]="myInput" style="height: 90%; margin-top: 4px; margin-right: 20px;" (ngModelChange)="searchFilter($event)" placeholder="Search Distributer" />
          <label style="width: inherit;margin-top: 11px">{{'From Date' | translate}}</label>
            <input id="from_date" bsDatepicker class="form-control form-control-sm" style="margin-top: 4px;" [bsConfig]="bsConfig"  [(ngModel)]="from_date" type="text" >  
            <label style="width: inherit;margin-top: 11px">{{'To Date' | translate}}</label>
          <input id="to_date" bsDatepicker class="form-control form-control-sm" style="margin-top: 4px;" [bsConfig]="bsConfig"   name="todate"  [(ngModel)]="to_date" type="text" >          
        </div> -->
        <!-- <button md-raised-button style="width: 190px; background: #31428c; color: white; height: 37px; line-height: 40px; margin-left: 25px;" (click)="Distributers()"> {{'Get Detail' | translate}} </button> -->
        <!-- <button md-raised-button style="width: 190px; background: #1d8216; color: white;" (click)="exportExcel()">Export To Excel</button> -->
        <!-- <div>
          
        </div> -->
      <!-- </div> -->
        <!-- <div class="col-4" style="text-align: center;margin-top: 30px;">
         
          </div>  -->
          <!-- <div class="col-4" style="margin-top: 30px;">
         
          </div>   -->
      <!-- </div>
    </div> -->
    <div>
        <table id="userTable" class="display mt-3" cellspacing="0" style="width:100%;font-size:15px;text-align: center">
          <thead style="background-color:#add8e6;color: white;height: 45px;">
            <tr style="height: 45px;">
                <th style="text-align:left;">{{'ID' | translate}}</th>
                <th style="text-align:left;">{{'Name' | translate}}</th>
                <!-- <th style="text-align:left;">Dealer</th>
                <th style="text-align:left;">Is Dealer</th> -->
                <th style="text-align:left;">{{'Created on' | translate}}</th>
                <th style="text-align:left;">{{'Email' | translate}}</th>
                <th style="text-align:left;;">{{'Phone' | translate}}</th>
                <th style="text-align:left;">{{'Password' | translate}}</th>
                <th style="text-align:left;">{{'Address' | translate}}</th>
                <th style="text-align:left;">{{'Organisation Name' | translate}}</th>
                <th style="text-align:left;">{{'Point Allocated' | translate}}</th>
                <!-- <th style="text-align:left;">{{'Available Points' | translate}}</th> -->
                <th style="text-align:left;">{{'Point Shared' | translate}}</th>
                <th style="text-align:left;">{{'Status' | translate}}</th>
                <th style="text-align:left;">{{'Edit' | translate}}</th>
                <th style="text-align:left;">{{'Add Points' | translate}}</th>
                <th style="text-align:left;">{{'Suspend Account' | translate}}</th>
                <!-- <th style="text-align:left;">{{'Open Account' | translate}}</th> -->
            </tr>
        </thead>
        </table>
        <!-- <table id="deviceTable" datatable [dtOptions]="dtOptions" style="width:100%" class="mt-5 table table-striped table-bordered full-data-table" >
        </table> -->
    </div>
  </div>

