@extends('admin.layout')

@section('content')
    <div class="container-fluid" ng-controller="taskerServiceController">
        <div class="row">
            <div class="col-md-12 m-b-30">
                <form class="form-header">
                    <input class="au-input au-input--xl" type="text" ng-model="config.search" ng-keyup="refreshTasker($event)" placeholder="Tìm kiếm theo tên" />
                    <button class="au-btn--submit" ng-click="refreshTasker()" type="button">
                        <i class="zmdi zmdi-search"></i>
                    </button>
                </form>
                <div class="table-responsive table-responsive-data2">
                    <table class="table table-data2">
                        <thead>
                        <tr>
                            <th>#</th>
                            <th>Tên Tasker</th>
                            <th>Email</th>
                            <th>SDT</th>
                            <th>Tasker</th>
                            <th>Dịch vụ</th>
                            <th></th>
                        </tr>
                        </thead>
                        <tbody>
                            <tr class="tr-shadow" ng-repeat="user in users">
                                <td>#{<>user.id<>}</td>
                                <td>{<>user.name<>}</td>
                                <td>{<>user.email<>}</td>
                                <td>{<>user.phone_number || 'Chưa có'<>}</td>
                                <td>{<>user.tasker_role.tasker || 'Chưa có'<>}</td>
                                <td>
                                    Có {<>user.pending_service<>} dịch vụ chờ duyệt
                                </td>
                                <td>
                                    <div class="table-data-feature">
                                        <a class="item" href="edit-tasker?id={<>user.id<>}" data-toggle="tooltip" data-placement="top" title="Edit">
                                            <i class="zmdi zmdi-edit"></i>
                                        </a>
                                    </div>
                                </td>
                            </tr>
                        </tbody>
                    </table>

                    <div class="m-b-10 m-t-10" ng-if="meta !== null && meta.last_page > 1">
                        <ul class="pagination">
                            <li class="page-item {<>meta.current_page - 1 < 1 ? 'disabled' : ''<>}"><button class="page-link" ng-click="$watch(config.page = config.page - 1, refreshTasker())">Prev</button></li>
                            <li class="page-item"><span class="page-link disabled">{<>meta.current_page<>}</span></li>
                            <li class="page-item {<>meta.current_page + 1 > meta.last_page ? 'disabled' : ''<>}"><button class="page-link" ng-click="$watch(config.page = config.page + 1, refreshTasker())">Next</button></li>
                            <li class="pull-right"><span>&nbsp; Go to page&nbsp;</span><input class="text-center" type="number" style="width: 40px;height: 38px" min="1" ng-model="config.page" ng-keyup="refreshTasker($event)" /> / {<>meta.last_page<>}</li>
                        </ul>

                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection