@extends('master.app')
@section('title', 'Edit Supplier Advance')

@section('body')
<main class="app-content">
    <section>
        <div class="card shadow-sm border-0" style="border-radius:18px; overflow:hidden;">

            {{-- TOP BAR --}}
            <div class="p-3 p-md-4 border-bottom"
                 style="background:linear-gradient(135deg, rgba(255,193,7,.14), rgba(13,110,253,.06));">
                <div class="d-flex flex-wrap align-items-center justify-content-between gap-2">
                    <div>
                        <h5 class="mb-0 fw-bold">
                            <i class="fa fa-pen-to-square me-1"></i> Edit Supplier Advance
                        </h5>
                        <small class="text-muted">
                            Update advance record & target cash journal
                        </small>
                    </div>

                    <div class="d-flex gap-2">
                        <a href="{{ route('msupplier_advance.index') }}"
                           class="btn btn-sm btn-light border" style="border-radius:10px;">
                            <i class="fa fa-arrow-left me-1"></i> Back
                        </a>
                    </div>
                </div>
            </div>

            <div class="card-body p-3 p-md-4">
                @include('general.valert')

                <form action="{{ route('msupplier_advance.update', $data->id) }}" method="POST" id="advanceEditForm">
                    @csrf
                    @method('PUT')

                    <div class="row g-3">

                        {{-- LEFT --}}
                        <div class="col-lg-8">
                            <div class="card border-0 shadow-sm" style="border-radius:16px;">
                                <div class="card-body p-3 p-md-4">

                                    <div class="d-flex align-items-center justify-content-between mb-2">
                                        <h6 class="mb-0 fw-bold">
                                            <i class="fa fa-info-circle me-1"></i> Advance Information
                                        </h6>
                                        <span class="badge bg-secondary">Edit</span>
                                    </div>

                                    <div class="row g-3">

                                        <div class="col-md-4">
                                            <div class="form-outline">
                                                <input type="number" name="invoice_number"
                                                       value="{{ old('invoice_number', $data->invoice_number) }}"
                                                       id="invoice_number" class="form-control" />
                                                <label class="form-label" for="invoice_number">Advance Number</label>
                                            </div>
                                        </div>

                                        <div class="col-md-8">
                                            <label class="form-label mb-1">Supplier</label>
                                            <select id="supplier_id" name="supplier_id"
                                                    class="select2 form-control" style="width:100%;">
                                                <option value="">Choose Supplier</option>
                                                @foreach ($suppliers as $row)
                                                    <option value="{{ $row->id }}"
                                                        {{ (string)old('supplier_id', $data->supplier_id)===(string)$row->id ? 'selected' : '' }}>
                                                        {{ $row->name }}
                                                    </option>
                                                @endforeach
                                            </select>
                                        </div>

                                        <div class="col-md-4">
                                            <div class="form-outline">
                                                <input type="number" step="0.01" name="amount"
                                                       value="{{ old('amount', $data->amount) }}"
                                                       id="amount" class="form-control" />
                                                <label class="form-label" for="amount">Amount</label>
                                            </div>
                                        </div>

                                        <div class="col-md-4">
                                            <label class="form-label mb-1">Currency</label>
                                            <select id="currency_id" name="currency_id"
                                                    class="select2 form-control" style="width:100%;">
                                                <option value="">Choose Currency</option>
                                                @foreach ($currencies as $row)
                                                    <option value="{{ $row->id }}"
                                                        {{ (string)old('currency_id', $data->currency_id)===(string)$row->id ? 'selected' : '' }}>
                                                        {{ $row->title_en }}
                                                    </option>
                                                @endforeach
                                            </select>
                                        </div>

                                        <div class="col-md-4" id="ex_rate_text_box" style="display:none;">
                                            <div class="form-outline">
                                                <input type="text" name="ex_rate"
                                                       value="{{ old('ex_rate', $data->ex_rate) }}"
                                                       id="ex_rate" class="form-control" />
                                                <label class="form-label" for="ex_rate">Exchange Rate</label>
                                            </div>
                                        </div>

                                        <div class="col-md-8">
                                            <div class="form-outline">
                                                <input type="text" name="title"
                                                       value="{{ old('title', $data->title) }}"
                                                       id="title" class="form-control" />
                                                <label class="form-label" for="title">Title</label>
                                            </div>
                                        </div>

                                        <div class="col-md-4">
                                            <label class="form-label mb-1">Target Cash</label>
                                            <select name="cash_id" id="cash_id" class="form-select">
                                                <option value="">Define Target Option</option>
                                                <option value="1" {{ (string)old('cash_id', $data->c_target)==='1' ? 'selected' : '' }}>
                                                    Target Cash Yes
                                                </option>
                                                <option value="2" {{ (string)old('cash_id', $data->c_target ?? 2)==='2' ? 'selected' : '' }}>
                                                    Target Cash No
                                                </option>
                                            </select>
                                        </div>

                                        <div class="col-md-6">
                                            @if ($bdate == 1)
                                                <label class="form-label mb-1">Date</label>
                                                <input type="text" required dir="rtl" name="date"
                                                       value="{{ old('date', $data->date) }}"
                                                       class="form-control sample-date-picker" id="date" />
                                            @else
                                                <div class="form-outline">
                                                    <input type="date" required name="date"
                                                           value="{{ old('date', $data->date) }}"
                                                           class="form-control" id="date" />
                                                    <label class="form-label" for="date">Date</label>
                                                </div>
                                            @endif
                                        </div>

                                        <div class="col-md-12">
                                            <div class="form-outline">
                                                <textarea name="details" id="details" cols="30" rows="4"
                                                          class="form-control">{{ old('details', $data->details) }}</textarea>
                                                <label class="form-label" for="details">Details</label>
                                            </div>
                                        </div>

                                    </div>

                                    <div class="d-flex flex-wrap justify-content-end gap-2 mt-4">
                                        <a href="{{ route('msupplier_advance.index') }}"
                                           class="btn btn-light border" style="border-radius:12px;">
                                            <i class="fa fa-list me-1"></i> Back to List
                                        </a>

                                        <button type="submit" class="btn btn-warning" style="border-radius:12px;">
                                            <i class="fa fa-save me-1"></i> Update Advance
                                        </button>
                                    </div>

                                </div>
                            </div>
                        </div>

                        {{-- RIGHT SUMMARY --}}
                        <div class="col-lg-4">
                            <div class="card border-0 shadow-sm" style="border-radius:16px;">
                                <div class="card-body p-3 p-md-4">
                                    <h6 class="fw-bold mb-2">
                                        <i class="fa fa-chart-pie me-1"></i> Quick Summary
                                    </h6>

                                    @php
                                        $cur = $data->currency->title_en ?? $data->currency->title_ps ?? $data->currency->title_dr ?? '';
                                        $supplierName = $data->supplier->name ?? 'N/A';
                                    @endphp

                                    <ul class="list-group list-group-flush small">
                                        <li class="list-group-item px-0 border-0 d-flex justify-content-between">
                                            <span class="text-muted"><i class="fa fa-hashtag me-1"></i> Number</span>
                                            <span class="fw-bold">{{ $data->invoice_number }}</span>
                                        </li>
                                        <li class="list-group-item px-0 d-flex justify-content-between">
                                            <span class="text-muted"><i class="fa fa-user-tie me-1"></i> Supplier</span>
                                            <span class="fw-bold">{{ $supplierName }}</span>
                                        </li>
                                        <li class="list-group-item px-0 d-flex justify-content-between">
                                            <span class="text-muted"><i class="fa fa-money-bill me-1"></i> Amount</span>
                                            <span class="fw-bold">{{ number_format((float)$data->amount, 2) }} {{ $cur }}</span>
                                        </li>
                                        <li class="list-group-item px-0 d-flex justify-content-between">
                                            <span class="text-muted"><i class="fa fa-calendar-day me-1"></i> Date</span>
                                            <span class="fw-bold">{{ $data->date }}</span>
                                        </li>
                                        <li class="list-group-item px-0 d-flex justify-content-between">
                                            <span class="text-muted"><i class="fa fa-wallet me-1"></i> Target Cash</span>
                                            <span class="fw-bold">
                                                {{ (int)($data->c_target ?? 2) === 1 ? 'Yes' : 'No' }}
                                            </span>
                                        </li>
                                        <li class="list-group-item px-0 d-flex justify-content-between">
                                            <span class="text-muted"><i class="fa fa-exchange-alt me-1"></i> Ex Rate</span>
                                            <span class="fw-bold">{{ $data->ex_rate ?? 1 }}</span>
                                        </li>
                                    </ul>

                                    <div class="alert alert-light border small mt-3" style="border-radius:14px;">
                                        <i class="fa fa-circle-info text-primary me-1"></i>
                                        Changing currency (ID!=1) will show exchange rate.
                                    </div>
                                </div>
                            </div>
                        </div>

                    </div> {{-- row --}}
                </form>
            </div>
        </div>
    </section>
</main>
@endsection

@section('pageJs')
<script>
    $(".app-menu").removeClass("active");
    $("#nav_purchase1").addClass("active");
    $("#purchasei").addClass("is-expanded");
    $("#purchase_advances").addClass("active");

    function toggleExRateBox(){
        const cid = $("#currency_id").val();
        if (cid && cid != 1) $("#ex_rate_text_box").show();
        else $("#ex_rate_text_box").hide();
    }

    // on currency change: show/hide + fetch rate
    $("#currency_id").on('change', function() {
        toggleExRateBox();

        $.ajax({
            url: '{{ route('get.ex_rate') }}',
            type: 'GET',
            data: { currency_id: $("#currency_id").val() },
            success: function(value) {
                $("#ex_rate").val(value);
            }
        });
    });

    // init
    $(function(){
        toggleExRateBox();
    });
</script>
@endsection