@extends('layouts.app')

@section("title", "My Transactions")

@section("page_style")

    <link rel="stylesheet" type="text/css" href="{{ url('dist/assets/plugins/custom/datatables/datatables.bundle.css') }}">
    <style type="text/css">
        .ki-arrow-back::before{
            content:"<";
        }
        .ki-arrow-next::before{
            content:">";
        }
    </style>
@endsection

@section('content')
<div class="row justify-content-center">
    <div class="col-md-12 pad-top-120" style="padding-top: 60px;">
        <div class="page page-md comman-page-height-main user-listing">
            <div class="content d-flex flex-column flex-column-fluid" id="kt_content">
            @include("admin.layouts.form-status")
                <div class="d-flex flex-column-fluid">
                    <div class="container">
                        <div class="card card-custom">
                            <div class="card-header">
                                <div class="card-title">
                                    <h3 class="card-label">{{ __('message_lang.LBL_MY_TXNS') }}</h3>
                                </div>
                            </div>
                            <div class="card-body">
                                <table id="example" class="table table-bordered grid-table nowrap">
                                    <thead>
                                        <tr>
                                            <th>#</th>
                                            <th>{{ __('message_lang.LBL_SENDING_COMPANY') }}</th>
                                            <th>{{ __('message_lang.LBL_RECEIVING_COMPANY') }}</th>
                                            <th>{{ __('message_lang.LBL_RECEIVING_AMOUNT') }}</th>
                                            <th>{{ __('message_lang.LBL_REF_NO') }}</th>
                                            <th>{{ __('message_lang.LBL_PICKUP_CODE') }}</th>
                                            <th>{{ __('message_lang.LBL_STATUS') }}</th>
                                            <th>{{ __('message_lang.LBL_ACTIONS') }}</th>
                                        </tr>
                                    </thead>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection

@section("page_vendors")
            <script>var KTAppSettings = { "breakpoints": { "sm": 576, "md": 768, "lg": 992, "xl": 1200, "xxl": 1200 }, "colors": { "theme": { "base": { "white": "#ffffff", "primary": "#3699FF", "secondary": "#E5EAEE", "success": "#1BC5BD", "info": "#8950FC", "warning": "#FFA800", "danger": "#F64E60", "light": "#F3F6F9", "dark": "#212121" }, "light": { "white": "#ffffff", "primary": "#E1F0FF", "secondary": "#ECF0F3", "success": "#C9F7F5", "info": "#EEE5FF", "warning": "#FFF4DE", "danger": "#FFE2E5", "light": "#F3F6F9", "dark": "#D6D6E0" }, "inverse": { "white": "#ffffff", "primary": "#ffffff", "secondary": "#212121", "success": "#ffffff", "info": "#ffffff", "warning": "#ffffff", "danger": "#ffffff", "light": "#464E5F", "dark": "#ffffff" } }, "gray": { "gray-100": "#F3F6F9", "gray-200": "#ECF0F3", "gray-300": "#E5EAEE", "gray-400": "#D6D6E0", "gray-500": "#B5B5C3", "gray-600": "#80808F", "gray-700": "#464E5F", "gray-800": "#1B283F", "gray-900": "#212121" } }, "font-family": "Poppins" };</script>
            <script src="{{ url('dist/assets/plugins/global/plugins.bundle.js') }}"></script>
            <script src="{{ url('dist/assets/plugins/custom/prismjs/prismjs.bundle.js') }}"></script>
            <script src="{{ url('dist/assets/js/scripts.bundle.js') }}"></script>
            <script src="{{ url('dist/assets/plugins/custom/datatables/datatables.bundle.js') }}"></script>
@endsection

@section("page_script")
<script type="text/javascript">
    var list_table_one;
    $(document).ready(function() {

        if($('#example').length > 0)
        {
            list_table_one = $('#example').DataTable(
            {
                processing: true,
                serverSide: true,
                "responsive": true,
                "aaSorting": [],
                "ajax":
                {
                    "url": "{!! route('list-my-txns') !!}",
                    "type": "POST",
                    "dataType": "json",
                    headers: {
                        'X-CSRF-TOKEN': "{{csrf_token()}}"
                    }
                },
                columns: [
                    {
                        data: 'DT_RowIndex',
                        name: 'DT_RowIndex'
                    },
                    {
                        data: 'sending_company_id',
                        name: 'sending_company_id'
                    },
                    {
                        data: 'receiving_company_id',
                        name: 'receiving_company_id'
                    },
                    {
                        data: 'receive_amount',
                        name: 'receive_amount'
                    },
                    {
                        data: 'ref_number',
                        name: 'ref_number'
                    },
                    {
                        data: 'pickup_code',
                        name: 'pickup_code'
                    },
                    {
                        data: 'status',
                        name: 'status'
                    },
                    {
                        data: 'action',
                        name: 'action'
                    }

                ]
            });
        }
    });
</script>
@endsection