<!-- begin::Quick Sidebar -->
<a href="javascript:;" class="kt-quick-panel__close quick-panel-action-button" id="getting_started_close"
    (click)="unPin()">
    <i class="flaticon2-delete"></i>
</a>
<a href="javascript:;" class="quick-panel-action-button page-quick-sidebar-pinner">
    <i class="fa fa-map-pin" [attr.aria-label]="l('Pin')"></i>
</a>
<div class="kt-quick-panel__content">
    <div class="kt-portlet__body">
        <div class="col-md-12 text-left">
            <h2 style="font-weight: 300 !important; color: #111111 !important;">{{"ConfigureFilter" | localize}}</h2>
        </div>
        <br>
        <div class="p-2 row divStarted">
            <div class="col-md-2">
                <span class="kt-switch kt-switch--icon kt-switch--success kt-switch--outline">
                    <label>
                        <input type="checkbox" name="" (change)="switchHideEmpty($event)" [checked]="hideEmpty">
                        <span></span>
                    </label>
                </span>
            </div>
            <div class="col-md-10" style="padding-top: 7px;">
                <span style="font-size: 15px;">{{"HideEmpty" | localize}}</span>
            </div>
        </div>
        <div class="p-2 row divStarted">
            <div class="col-md-2">
                <span class="kt-switch kt-switch--icon kt-switch--success kt-switch--outline">
                    <label>
                        <input type="checkbox" (change)="switchHideCompleted($event)" [checked]="hideCompleted" name="">
                        <span></span>
                    </label>
                </span>
            </div>
            <div class="col-md-10" style="padding-top: 7px;">
                <span style="font-size: 15px;">{{"HideCompleted" | localize}}</span>
            </div>
        </div>
        <div class="p-2 row divStarted">
            <div class="col-md-2">
                <span class="kt-switch kt-switch--icon kt-switch--success kt-switch--outline">
                    <label>
                        <input type="checkbox" name="" (change)="switchHidePickedUp($event)" [checked]="hidePickedUp">
                        <span></span>
                    </label>
                </span>
            </div>
            <div class="col-md-10" style="padding-top: 7px;">
                <span style="font-size: 15px;">{{"HidePickedUp" | localize}}</span>
            </div>
        </div>
        <div class="p-2 row divStarted">
            <div class="col-md-12">
                <span style="font-size: 15px;">{{"RowsToShow" | localize}}</span>
            </div>
        </div>
        <div class="p-2 row divStarted">
            <div class="col-md-11">
                <input class="form-control" name="maxCountResult" id="maxCountResult" type="number" [(ngModel)]="rowsToShow">
            </div>
        </div>
        <div class="mt-4 col-md-12 text-left">
            <button type="submit" class="btn btn-primary blue btn-pill" (click)="getDataFilter()"><i class="fa fa-check"></i>
                <span>{{l("ApplyFilter")}}</span></button>
            <button type="button" class="btn btn-default btn-pill"><i
                    class="fa fa-redo"></i> {{l("ClearFilter")}}</button>
        </div>
    </div>


</div>


<!-- end::Quick Sidebar -->