table pagination html

<div class="col-md-12 content-background">
    <hr>
    <div class="row">
        <div class="col-md-2">
            <input type="text" ng-model="supplierName" class="form-control uppercase">
        </div>
        <div class="col-md-2">
            <button class="btn btn-primary" ng-click="getCalonSupplier(supplierName)">Search</button>
        </div>
        <div class="col-md-4">
            <div ng-if="alertSuccessApprove" class="alert alert-success">
                <%alertSuccessApproveContent%>
            </div>
        </div>
    </div>
    <br>
    <table class="table table-striped table-custom tabel-bordered table-condensed">
        <thead>
            <tr>
                <th>Action</th>
                <th>
                <a href="" ng-click="setSorting('merchant_name',!sortReverse)">
                        Nama Supplier
                        <span ng-show="sortType == 'merchant_name' && !sortReverse" class="fa fa-caret-down"></span>
                        <span ng-show="sortType == 'merchant_name' && sortReverse" class="fa fa-caret-up"></span>
                    </a>
                </th>
                <th>
                    <a href="" ng-click="setSorting('phone',!sortReverse)">
                        No Telp
                        <span ng-show="sortType == 'phone' && !sortReverse" class="fa fa-caret-down"></span>
                        <span ng-show="sortType == 'phone' && sortReverse" class="fa fa-caret-up"></span>
                    </a>
                </th>
                <th>
                    <a href="" ng-click="setSorting('cp_name, cp_phone',!sortReverse)">
                        Contact Person
                        <span ng-show="sortType == 'cp_name, cp_phone' && !sortReverse" class="fa fa-caret-down"></span>
                        <span ng-show="sortType == 'cp_name, cp_phone' && sortReverse" class="fa fa-caret-up"></span>
                    </a>
                </th>
                <th>Status</th>
            </tr>
        </thead>
        <tbody>
            <tr ng-repeat="item in supplierCandidates" total-items="totalItems">
                <td align="center"><a href="#/calon-supplier/<%item.merchant_candidate_id%>">Lihat</a></td>
                <td><%item.merchant_name%></td>
                <td><%item.phone%></td>
                <td><%item.cp_name%> / <%item.cp_phone%></td>
                <td align="center" ng-if="item.workflow_status == 'DRAFT'">Belum Approved</td>
                <td align="center" ng-if="item.workflow_status == 'APPROVED'">Sudah Approvd</td>
            </tr>
        </tbody>
    </table>
    <div class="row padding-row">
        <div class="col-md-6">
            <uib-pagination items-per-page="take" total-items="supplierCandidatesTotal" ng-model="skip" ng-change="getCalonSupplier()" rotate="false" boundary-links="true" max-size="maxSize"></uib-pagination>
        </div>
        <div class="col-md-2" style="padding-top: 20px;">
            <strong>Data Per Halaman : </strong>
        </div>
        <div class="col-md-2" style="padding-top: 15px;">
            <select class="form-control" ng-options="item.value as item.id for item in page" ng-model="take" ng-change="getCalonSupplier()">
            </select>
        </div>
        <div class="col-md-2" style="padding-top: 20px;">
            <strong>Jumlah data : <%supplierCandidatesTotal%></strong>
        </div>
    </div>
</div>