@extends('layouts.master')

@section('title', 'Lihat Shopee Invoice')



@section('content')
<div class="row">
    <x-page-title title="{{__('Shopee Invoice')}}" pagetitle="Lihat {{__('Shopee Invoice')}}" />
    <hr>
    <div class="container content">
        <h2>Lihat {{__('Shopee Invoice')}}</h2>
        <div id="message-container">
            @if(session('success'))
                <div id="success-message" class="alert alert-success fade show">{{ session('success') }}</div>
            @endif
            @if($errors->any())
                <div id="error-message" class="alert alert-danger fade show">
                    <ul>
                        @foreach($errors->all() as $error)
                            <li>{{ $error }}</li>
                        @endforeach
                    </ul>
                </div>
            @endif
        </div>

        <form id="contract-form" action="" method="POST"
            >
            <input type='hidden' id="checkHPP" name='checkHPP' value=0 />
            <div class="mb-3 card">
                <div class="card-header">{{__('Shopee Invoice')}} {{__('Information')}} : <strong>{{$ShopeeInvoice->sales_order_number}}</strong></div>
                <div class="card-body">
                    <div class="row">
                        <div class="col-md-6">
                            <div class="form-group">
                                <label for="customer_code">{{__('Shopee Invoice Number')}}</label>
                                <input type="text" id="customer_code" class="form-control" name="customer_code" value="{{ old('customer_code', $ShopeeInvoice->shopee_invoice_number) }}" readonly>
                            </div>
                            <br>
                            <div class="form-group">
                                <label for="customer_name">{{__('Order SN')}}</label>
                                <input type="text" id="customer_name" class="form-control" name="customer_name" value="{{ old('customer_name', $ShopeeInvoice->order_sn) }}" readonly>
                            </div>
                            <br>

                        </div>

                        <div class="col-md-6">
                            <div class="form-group">
                                <label for="customer_name">{{__('Buyer Username')}}</label>
                                <input type="text" id="customer_name" class="form-control" name="customer_name" value="{{ old('customer_name', $ShopeeInvoice->buyer_username) }}" readonly>
                            </div>
                            <br>
                            <div class="form-group">
                                <label for="document_date">{{__('Document Date')}}</label>
                                <input type="text" name="document_date" id="document_date" class="form-control" value="{{ \Carbon\Carbon::parse(old('document_date', $ShopeeInvoice->create_time ?? date('Y-m-d')))->format('d M Y') }}" readonly>
                            </div>
                            <br>
                        </div>
                    </div>
                </div>
            </div>

            <!-- Card for Shopee Invoice Details -->
            <div class="mb-3 card">
                <div class="card-header">Shopee Invoice Details</div>
                <div class="card-body table-responsive">
                    <h5 class="text-end">Total sebelum pajak: <span id="total-value">0</span></h5>
                    <div style="overflow-x: auto;">
                    <table class="table" id="sales-order-details-table">
                        <thead>
                            <tr>
                                <th style="min-width: 430px">{{__('Item')}}</th>
                                <th style="min-width: 230px">Variasi</th>
                                <th style="min-width: 150px">Qty</th>
                                <th style="min-width: 200px">{{__('Price')}}</th>
                                <th style="min-width: 200px">{{__('Discount')}}</th>
                                <th style="min-width: 200px">{{__('Price')}} Setelah Diskon</th>
                                <th style="min-width: 200px">Nominal</th>
                            </tr>
                        </thead>
                        <tbody>
                            @foreach($ShopeeInvoice->details as $index => $detail)
                                <tr data-row-id="{{ $index }}">
                                    <td>
                                        <input type="hidden" id="item_code_{{$index}}" name="details[{{ $index }}][item_id]" class="form-control" value="{{ $detail->item_id }}" readonly />
                                        <input type="text" name="details[{{ $index }}][item_name]" class="form-control" value="{{ $detail->shopee_item_name }}" readonly />
                                    </td>
                                    <td>
                                        <input type="text" name="details[{{ $index }}][model_name]" id="model_name_{{$index}}" class="form-control" value="{{ $detail->model_name }}" min="1" required readonly>
                                    </td>
                                    <td>
                                        <input type="number" name="details[{{ $index }}][qty]" id="qty_{{$index}}" class="form-control" value="{{ $detail->qty }}" min="1" required readonly>
                                    </td>
                                    <td>
                                        <input type="text" name="details[{{ $index }}][price]" oninput="formatNumber(this)" id="price_{{$index}}" class="form-control price-input text-end" id="price_{{ $index }}" value="{{ number_format($detail->price,0,'.',',') }}" required >
                                    </td>
                                    <td>
                                        <input type="text" name="details[{{ $index }}][disc_nominal]" oninput="formatNumber(this)" id="disc_nominal_{{$index}}" class="form-control text-end" value="{{ number_format($detail->disc_nominal,0,'.',',') }}" required readonly>
                                    </td>
                                    <td>
                                        <input type="text" name="details[{{ $index }}][price]" oninput="formatNumber(this)" id="price_{{$index}}" class="form-control price-input text-end" id="price_{{ $index }}" value="{{ number_format($detail->price_after_disc,0,'.',',') }}" required >
                                    </td>
                                    <td>
                                        <input type="text" name="details[{{ $index }}][nominal]" oninput="formatNumber(this)" id="nominal_{{$index}}" class="form-control text-end nominal" value="{{ number_format($detail->nominal,0,'.',',') }}" required readonly>
                                    </td>
                                </tr>
                            @endforeach
                        </tbody>
                    </table>
                    </div>
                    <button type="button" id="add-row" class="btn btn-primary mt-3 d-none"

                    >Add Row</button>
                </div>
            </div>
            <a class="btn btn-secondary mb-3" href="{{ route('shopee.si') }}" >Back</a>
        </form>

    </div>
</div>

</div>

@section('scripts')
<script>

    function calculateTotals() {
        let total = 0;
        const disc_nominal = 0;
        document.querySelectorAll('.nominal').forEach(function (input) {

            input.value = input.value.replace(/,/g, ''); // Remove any thousand separators
            if(input.id=='disc_nominal'){
                total -= parseFloat(input.value) || 0;
            }else{
                total += parseFloat(input.value) || 0;
            }
            const cursorPosition = input.selectionStart;
            let value = input.value.replace(/,/g, '');
            // Format the number with thousand separators
            let formattedValue = value.replace(/\B(?=(\d{3})+(?!\d))/g, ',');

            // Set the new value
            input.value = formattedValue;

            // Adjust the cursor position
            const newCursorPosition = formattedValue.length - (value.length - cursorPosition);
            input.setSelectionRange(newCursorPosition, newCursorPosition);
        });
        let strTotal = (total)+"";
        let value2 = strTotal.replace(/,/g, '');
            // Format the number with thousand separators
        let formattedValue2 = value2.replace(/\B(?=(\d{3})+(?!\d))/g, ',');
        document.getElementById('total-value').innerText = formattedValue2;

        return { total }; // Return totals for validation
    }
    calculateTotals();

</script>
@endsection
@endsection