@extends('layouts.layout')
@section('body_class', 'nav-md')
@section('body_content')
    <div class="container body">
        <div class="main_container">
            @include('includes.sidebar')
            <div class="right_col" role="main">
                <div class="page-title">
                    <div class="row">
                        <div class="col-sm-8">
                            <div class="title_left">
                                <h3><i class="fa fa-cubes"></i> Webstore Payment Method List</h3>
                            </div>
                        </div>
                        <div class="col-sm-4 text-right">
                            <button class="btn btn-success" onclick="AddPaymentMethodModal()">Add Payment Method List</button>
                        </div>
                    </div>
                    <div class="clearfix"></div>
                </div>

                <div class="row">
                    <div class="col-xs-12">
                        <div class="x_panel">
                            <div class="x_title">
                                <h2>Filter</h2>
                                <div class="clearfix"></div>
                            </div>
                            <div class="x_content">
                                <table class="table table-bordered table-striped">
                                    <tr>
                                        <th>No</th>
                                        <th>Type</th>
                                        <th>Name</th>
                                        <th>Xendit Channel</th>
                                        <th>Logo</th>
                                        <th>Biaya Layanan</th>
                                        <th>Expired Time</th>
                                        <th>Sort</th>
                                        <th>Status</th>
                                        <th>Action</th>
                                    </tr>
                                    @php
                                        $no = 1;
                                    @endphp
                                    @forelse($payment_methods as $payment_method)
                                        <tr>
                                            <td>{{ $no++ }}</td>
                                            <td>{{ $payment_method->type }}</td>
                                            <td>{{ $payment_method->name }}</td>
                                            <td>{{ $payment_method->xendit_channel }}</td>
                                            <td>
                                                @if($payment_method->logo)
                                                    <img src="{{ env('ALIYUN_OSS_IMAGE_URL') . '/ecommerce/bank/' . $payment_method->logo }}" alt="Logo" style="width: 50px;">
                                                @else
                                                    No Logo
                                                @endif
                                            </td>
                                            <td class="text-right">
												@if($payment_method->biaya_layanan_config == 'nominal_persen')
													{{ $payment_method->biaya_layanan_persen }}% + Rp. {{ number_format($payment_method->biaya_layanan_nominal) }}
												@elseif($payment_method->biaya_layanan_config == 'nominal')
													Rp. {{ number_format($payment_method->biaya_layanan_nominal) }}
												@else
													{{ $payment_method->biaya_layanan_persen }}%
												@endif
											</td>
                                            <td>{{ $payment_method->expired_time . ' ' . $payment_method->expired_time_unit }}</td>
                                            <td>{{ (int)$payment_method->sort }}</td>
                                            <td>{!! $payment_method->status ? '<span class="text-success">Active</span>' : '<span class="text-danger">Inactive</span>' !!}</td>
                                            <td>
                                                <button class="btn btn-warning" onclick="editPaymentMethodModal('{{ $payment_method->id }}')"><i class="fa fa-pencil fa-1x"></i></button>
                                                <button class="btn btn-danger" onclick="deletePaymentMethod('{{ $payment_method->id }}')"><i class="fa fa-trash fa-1x"></i></button>
                                            </td>
                                        </tr>
                                    @empty
                                        <tr>
                                            <td colspan="10">No data</td>
                                        </tr>
                                    @endforelse
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            @include('includes.footer')
        </div>
    </div>
    <!-- Modal -->
    <div class="modal fade" id="formAddProduct" role="dialog" aria-labelledby="formAddProduct" aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered modal-lg" role="document">
            <div id="formAddProductContent" class="modal-content">
            </div>
        </div>
    </div>
    <div class="modal fade" id="formEditProduct" role="dialog" aria-labelledby="formEditProduct" aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered modal-lg" role="document">
            <div id="formEditProductContent" class="modal-content">
            </div>
        </div>
    </div>
@endsection


@section("scripts")
    <script>
        
        function AddPaymentMethodModal() {
            $('#cover-spin').fadeIn();
            $.ajax({
                url: "{{ url('webstore/payment_method/form-add') }}",
                method: "GET",
                headers: { 'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content') },
                success: function(response) {
                    $('#formAddProductContent').html(response);
                    $('.summernote').summernote( {
                        height: 250
                    });
                    $('#formAddProduct').modal('show');
                    $('#cover-spin').hide();
                },
                error: function(response) {
                    var response = response.responseJSON;
                    alert(response.error);
                    $('#cover-spin').hide();
                }
            });
        }

        function editPaymentMethodModal(productId) {
            $('#skuEditData').show();
            $('#skuForm').hide();
            $('#cover-spin').fadeIn();
            $.ajax({
                url: "{{ url('webstore/payment_method/form-edit') }}/" + productId,
                method: "GET",
                headers: { 'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content') },
                success: function(response) {
                    $('#formEditProductContent').html(response);
                    $('.summernote').summernote( {
                        height: 250
                    });
                    // getSKU();
                    
                    // $('.branch_manager_id').val(data.branch_manager_id).change();

                    $('#formEditProduct').modal('show');
                    $('#cover-spin').hide();
                },
                error: function(response) {
                    var response = response.responseJSON;
                    alert(response.error);
                    $('#cover-spin').hide();
                }
            });
        }

        function deletePaymentMethod(paymentMethodID) {
            $('#cover-spin').fadeIn();
            if (confirm("Apakah Anda yakin ingin menghapus Payment Method ini ?") == true) {
                window.location = "{{ url('webstore/payment_method/delete') }}/" + paymentMethodID;
            } 
			
            $('#cover-spin').fadeOut();
        }
    </script>
@endsection