@extends('admin.layout')

@section('content')
    <section ng-controller="taskerIncomesController">
        <div class="container-fluid">
            <div class="row">
                <div class="col-md-12 m-b-30">
                    <!-- DATA TABLE -->
                    <div class="table-data__tool">
                        <div class="table-data__tool-left mb-2 mr-1">
                            <form class="form-header">
                                <input class="au-input au-input--xl" type="text" ng-model="config.search" ng-keyup="refresh($event)" placeholder="Tìm kiếm lịch sử.." />
                                <button class="au-btn--submit" ng-click="refresh()" type="button">
                                    <i class="zmdi zmdi-search"></i>
                                </button>
                            </form>
                        </div>
                        <div class="table-data__tool-right">
                            <input class="au-input au-input--xl date-picker mb-2" id="from-date" type="text" placeholder="Thống kê từ ngày..." />
                            <input class="au-input au-input--xl date-picker mb-2" type="text" id="to-date" placeholder="Đến ngày..." />

                            {{--<div class="rs-select2--light rs-select2--md mb-2">--}}
                                {{--<select class="js-select2" ng-model="config.type" ng-change="$watch(config.page = 1, refresh())">--}}
                                    {{--<option value="">Kiểu thanh toán</option>--}}
                                    {{--@foreach($status_title as $val => $s_title)--}}
                                        {{--<option value="{{$val}}">{{$s_title}}</option>--}}
                                    {{--@endforeach--}}
                                {{--</select>--}}
                                {{--<div class="dropDownSelect2"></div>--}}
                            {{--</div>--}}
                        </div>
                    </div>
                    <div class="table-responsive table-responsive-data2">
                        <table class="table table-data2">
                            <thead>
                            <tr>
                                <th>#</th>
                                <th>Tasker</th>
                                <th>Số tiền (VND)</th>
                                <th>Lý do</th>
                                <th>Tạo bởi</th>
                                <th>Ngày tạo</th>
                            </tr>
                            </thead>
                            <tbody>
                            <tr class="tr-shadow" ng-repeat="data in datas">
                                <td>#{<>data.id<>}</td>
                                <td>{<>data.tasker.name<>}</td>
                                <td>{<>data.income.toLocaleString('us')<>}</td>
                                <td>{<>data.description<>}</td>
                                <td>{<>data.creator.name<>}</td>
                                <td>{<>data.created_at<>}</td>
                            </tr>
                            </tbody>
                        </table>
                        <div class="m-b-10 m-t-10" ng-if="meta.last_page > 1">
                            <ul class="pagination">
                                <li class="page-item {<>meta.current_page == 1 ? 'disabled' : ''<>}">
                                    <button class="page-link"
                                            ng-click="$watch(config.page = config.page - 1, refresh())">Prev</button>
                                </li>
                                <li class="page-item"><span class="page-link disabled">{<>meta.current_page<>}</span></li>
                                <li class="page-item {<>meta.current_page == meta.last_page<>}">
                                    <button class="page-link"
                                            ng-click="$watch(config.page = config.page + 1, refresh())">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-change="refresh()" /> / {<>meta.last_page<>}
                                </li>
                            </ul>

                        </div>
                    </div>
                    <!-- END DATA TABLE -->
                </div>
            </div>
        </div>
    </section>

@endsection

@section('custom_script')
    <link href="vendor/datepicker/bootstrap-material-datetimepicker.min.css" rel="stylesheet" media="all">
    {{--<script src="vendor/chartjs/Chart.bundle.min.js"></script>--}}
    <script src="vendor/datepicker/moment-with-locales.js"></script>
    <script src="vendor/datepicker/bootstrap-material-datetimepicker.min.js"></script>
@endsection