@extends('layouts.app-hr')

@section('content')
    <?php Fun::lang()?>
    @include('hr.exchange-rate.confirm-delete')
    <div class="top-header">
        <ol class="breadcrumb">
            <li><a href="#">{{__('administrator.dashboard')}}</a></li>
            <li><a href="#">{{__('administrator.exchange_rate')}}</a></li>
        </ol>
    </div>
    <div class="page">
        <div class="top-content">
            <div class="row">
                <div class="col-sm-6 col-xs-12">
                    <div class="title-add">
                        <div class="pull-left">
                            <h3>{{__('administrator.exchange_rate')}} </h3>
                        </div>
                    </div>
                </div>
                <div class="col-sm-6 col-xs-12">
                    <div class="title-add">
                        <div class="pull-right">
                            @if(Gate::check('Exchange Rate Create'))
                                <a href="{{route('hr-exchange-rate.create')}}"
                                   class="button_primary">{{__('administrator.add_new')}}</a>
                            @endif
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="box-body">
            <table id="datatable_products" width="100%" class="table table-striped">
                <thead>
                    <tr>
                        <th>#</th>
                        <th>{{__('administrator.name')}}</th>
                        <th>{{__('administrator.symbol')}}</th>
                        <th>{{__('administrator.code')}}</th>
                        <th>{{__('administrator.rate')}}</th>
                        <th>{{ __('administrator.action') }}</th>
                    </tr>
                </thead>
                <tbody>
                @foreach($currency as $key => $row)
                    <tr>
                        <td>{{$key+1}}</td>
                        <td>{{$row->name}}</td>
                        <td>{{$row->symbol}}</td>
                        <td>{{$row->code}}</td>
                        <td>{{$row->rate}}</td>
                        <td>
                            @if($key === 0)
                                <a href="javascript:void(0)" class="button_info btn_history" title="History"><i class="fa fa-history"></i> </a>
                            @endif
{{--                            <a href="{{route('currency.edit',$row->id)}}" class="button_warning"><span class="fa fa-pencil-square-o"></span></a>--}}
                        </td>
                    </tr>
                @endforeach
                </tbody>
            </table>
        </div>
    </div>
@endsection
@section('script')
    <script type="text/javascript">
        $(document).ready(function () {

        });
        $(document).on('click', '.btn_history', function () {
            $.get("{{ route('hr.history-currency') }}", function (data) {
                let row = '';
                $.each(data, function (k,v) {
                    row += `<tr>
                                <td>${k+1}</td>
                                <td>${v.name}</td>
                                <td>${v.symbol+' '+v.old_rate}</td>
                                <td>${v.date}</td>
                            </tr>
                        `;
                })
                $.confirm({
                    title: 'History Currency!',
                    content: `
                        <table id="datatable_products" width="100%" class="table table-striped">
                            <thead>
                                <tr>
                                    <th width="5%">#</th>
                                    <th>{{__('administrator.currency')}}</th>
                                    <th>{{__('administrator.rate')}}</th>
                                    <th>{{__('administrator.date')}}</th>
                                </tr>
                            </thead>
                            <tbody>
                            ${row}
                            </tbody>
                        </table>
                    `,
                    columnClass: 'large',
                    buttons: {
                        close: function () {

                        },
                    }
                });
            });

        });
    </script>
@endsection
