@extends('admin.layouts.master-soyuz')
@section('title', __('Invoice Settings | '))
@section('body')

@component('admin.component.breadcumb', ['secondaryactive' => 'active'])
    @slot('heading'){{ __('Invoice Settings') }}@endslot
    @slot('menu1'){{ __('Invoice Settings') }}@endslot
@endcomponent

<div class="contentbar">
    @if ($errors->any())
        <div class="alert alert-danger" role="alert">
            @foreach($errors->all() as $error)<p class="mb-0">{{ $error }}</p>@endforeach
        </div>
    @endif
    @if(session('updated') || session('success'))
        <div class="alert alert-success" role="alert">{{ session('updated') ?? session('success') }}</div>
    @endif

    <form action="{{ url('admin/invoice/') }}" method="POST" enctype="multipart/form-data">
        @csrf
        <div class="row">
            {{-- LEFT: form fields --}}
            <div class="col-lg-8">

                <div class="card m-b-30">
                    <div class="card-header">
                        <h5 class="card-title mb-0"><i class="feather icon-file-text mr-2 text-primary"></i>{{ __('Numbering') }}</h5>
                    </div>
                    <div class="card-body">
                        <div class="row">
                            <div class="col-md-4 mb-3">
                                <label class="font-weight-600 mb-2">{{ __('Order Prefix') }}</label>
                                <input type="text" name="order_prefix" value="{{ $Invoice->order_prefix ?? '' }}" class="form-control sh-select-bare" placeholder="ORD-">
                                <small class="text-muted">{{ __('Prefix shown on order IDs') }}</small>
                            </div>
                            <div class="col-md-4 mb-3">
                                <label class="font-weight-600 mb-2">{{ __('Invoice Prefix') }} <span class="text-danger">*</span></label>
                                <input required type="text" name="prefix" value="{{ $Invoice->prefix ?? '' }}" class="form-control sh-select-bare" placeholder="INV-">
                            </div>
                            <div class="col-md-4 mb-3">
                                <label class="font-weight-600 mb-2">{{ __('Invoice Postfix') }} <span class="text-danger">*</span></label>
                                <input required type="text" name="postfix" value="{{ $Invoice->postfix ?? '' }}" class="form-control sh-select-bare" placeholder="-2026">
                            </div>
                            <div class="col-md-4 mb-3">
                                <label class="font-weight-600 mb-2">{{ __('Invoice Start Number') }}</label>
                                <input type="number" min="1" name="inv_start" value="{{ $Invoice->inv_start ?? 1 }}" class="form-control sh-select-bare" placeholder="1001">
                                <small class="text-muted">{{ __('Next invoice will start from this number') }}</small>
                            </div>
                            <div class="col-md-4 mb-3">
                                <label class="font-weight-600 mb-2">{{ __('COD Prefix') }}</label>
                                <input type="text" name="cod_prefix" value="{{ $Invoice->cod_prefix ?? '' }}" class="form-control sh-select-bare" placeholder="COD-">
                            </div>
                            <div class="col-md-4 mb-3">
                                <label class="font-weight-600 mb-2">{{ __('COD Postfix') }}</label>
                                <input type="text" name="cod_postfix" value="{{ $Invoice->cod_postfix ?? '' }}" class="form-control sh-select-bare" placeholder="-IN">
                            </div>
                        </div>
                    </div>
                </div>

                <div class="card m-b-30">
                    <div class="card-header">
                        <h5 class="card-title mb-0"><i class="feather icon-image mr-2 text-primary"></i>{{ __('Seal & Signature') }}</h5>
                    </div>
                    <div class="card-body">
                        <div class="row">
                            <div class="col-md-6 mb-3">
                                <label class="font-weight-600 mb-2">{{ __('Company Seal') }}</label>
                                <div class="d-flex align-items-center" style="gap: 14px;">
                                    <div style="width:96px; height:96px; border:1px solid var(--adm-border); border-radius:10px; background:var(--adm-content-bg); overflow:hidden; display:grid; place-items:center; flex-shrink:0;">
                                        @if(isset($Invoice->seal) && $Invoice->seal && file_exists(public_path('images/seal/' . $Invoice->seal)))
                                            <img src="{{ url('images/seal/' . $Invoice->seal) }}" alt="" style="max-width:100%; max-height:100%; object-fit:contain; padding:8px;">
                                        @else
                                            <span class="text-muted small">{{ __('No seal') }}</span>
                                        @endif
                                    </div>
                                    <div class="flex-grow-1">
                                        <div class="custom-file">
                                            <input type="file" name="seal" accept="image/*" class="custom-file-input" id="seal-input">
                                            <label class="custom-file-label" for="seal-input">{{ __('Upload company seal') }}</label>
                                        </div>
                                        <small class="text-muted d-block mt-2">{{ __('PNG with transparent background recommended.') }}</small>
                                    </div>
                                </div>
                            </div>

                            <div class="col-md-6 mb-3">
                                <label class="font-weight-600 mb-2">{{ __('Authorised Signature') }}</label>
                                <div class="d-flex align-items-center" style="gap: 14px;">
                                    <div style="width:96px; height:96px; border:1px solid var(--adm-border); border-radius:10px; background:var(--adm-content-bg); overflow:hidden; display:grid; place-items:center; flex-shrink:0;">
                                        @if(isset($Invoice->sign) && $Invoice->sign && file_exists(public_path('images/sign/' . $Invoice->sign)))
                                            <img src="{{ url('images/sign/' . $Invoice->sign) }}" alt="" style="max-width:100%; max-height:100%; object-fit:contain; padding:8px;">
                                        @else
                                            <span class="text-muted small">{{ __('No signature') }}</span>
                                        @endif
                                    </div>
                                    <div class="flex-grow-1">
                                        <div class="custom-file">
                                            <input type="file" name="sign" accept="image/*" class="custom-file-input" id="sign-input">
                                            <label class="custom-file-label" for="sign-input">{{ __('Upload signature') }}</label>
                                        </div>
                                        <small class="text-muted d-block mt-2">{{ __('PNG / JPG, transparent preferred.') }}</small>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="card m-b-30">
                    <div class="card-header">
                        <h5 class="card-title mb-0"><i class="feather icon-edit-3 mr-2 text-primary"></i>{{ __('Terms & Conditions') }}</h5>
                    </div>
                    <div class="card-body">
                        <textarea name="terms" id="invoice-terms" class="form-control sh-select-bare" rows="6" placeholder="{{ __('Terms printed at the bottom of every invoice') }}">{!! $Invoice->terms ?? '' !!}</textarea>
                        <small class="text-muted">{{ __('You can include a return policy, jurisdiction, or signature note. Plain text or basic HTML.') }}</small>
                    </div>
                </div>
            </div>

            {{-- RIGHT: sticky save + helper --}}
            <div class="col-lg-4">
                <div class="card m-b-30" style="position: sticky; top: 80px;">
                    <div class="card-header">
                        <h5 class="card-title mb-0"><i class="feather icon-save mr-2 text-primary"></i>{{ __('Save Settings') }}</h5>
                    </div>
                    <div class="card-body">
                        <p class="text-muted small mb-3">{{ __('Updates apply to invoices generated from now on.') }}</p>
                        <button type="submit" class="btn btn-primary-rgba btn-block" {{ env('DEMO_LOCK') == 0 ? '' : 'disabled' }}>
                            <i class="feather icon-check-circle mr-1"></i>{{ __('Save Invoice Settings') }}
                        </button>
                        <a href="{{ route('get.invoice.design') }}" class="btn btn-secondary-rgba btn-block mt-2">
                            <i class="feather icon-layout mr-1"></i>{{ __('Design / Layout') }}
                        </a>
                    </div>
                </div>

                <div class="card m-b-30">
                    <div class="card-header">
                        <h5 class="card-title mb-0"><i class="feather icon-info mr-2 text-primary"></i>{{ __('Preview') }}</h5>
                    </div>
                    <div class="card-body">
                        <div style="border:1px solid var(--adm-border); border-radius:10px; padding:14px; background:#fff;">
                            <div style="font-weight:700; font-size:14px;">{{ __('Sample Invoice ID') }}</div>
                            <div style="font-family:monospace; font-size:14px; margin-top:6px; color: var(--adm-blue);">
                                <span id="prv-prefix">{{ $Invoice->prefix ?? 'INV-' }}</span><span id="prv-num">{{ str_pad((string) ($Invoice->inv_start ?? 1001), 5, '0', STR_PAD_LEFT) }}</span><span id="prv-postfix">{{ $Invoice->postfix ?? '' }}</span>
                            </div>
                            <hr class="my-3">
                            <div style="font-weight:700; font-size:13px;">{{ __('COD Sample') }}</div>
                            <div style="font-family:monospace; font-size:13px; margin-top:4px; color: #16a34a;">
                                <span id="prv-codpre">{{ $Invoice->cod_prefix ?? 'COD-' }}</span><span id="prv-codnum">{{ str_pad((string) ($Invoice->inv_start ?? 1001), 5, '0', STR_PAD_LEFT) }}</span><span id="prv-codpost">{{ $Invoice->cod_postfix ?? '' }}</span>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </form>
</div>

@endsection

@section('custom-script')
<script>
(function(){
    var pre  = document.querySelector('input[name="prefix"]');
    var post = document.querySelector('input[name="postfix"]');
    var num  = document.querySelector('input[name="inv_start"]');
    var codp = document.querySelector('input[name="cod_prefix"]');
    var codps= document.querySelector('input[name="cod_postfix"]');
    var prvPre = document.getElementById('prv-prefix');
    var prvPost= document.getElementById('prv-postfix');
    var prvNum = document.getElementById('prv-num');
    var prvCodp = document.getElementById('prv-codpre');
    var prvCodps = document.getElementById('prv-codpost');
    var prvCodNum = document.getElementById('prv-codnum');
    function pad(n){ n = String(parseInt(n||'1',10)); return n.padStart(5,'0'); }
    function refresh(){
        if (prvPre) prvPre.textContent = pre.value || 'INV-';
        if (prvPost) prvPost.textContent = post.value || '';
        if (prvNum) prvNum.textContent = pad(num.value);
        if (prvCodp) prvCodp.textContent = codp.value || 'COD-';
        if (prvCodps) prvCodps.textContent = codps.value || '';
        if (prvCodNum) prvCodNum.textContent = pad(num.value);
    }
    [pre, post, num, codp, codps].forEach(function(el){ if (el) el.addEventListener('input', refresh); });

    // Filename label sync
    document.querySelectorAll('.custom-file-input').forEach(function(input){
        input.addEventListener('change', function(){
            var label = input.nextElementSibling;
            if (label && input.files && input.files[0]) label.textContent = input.files[0].name;
        });
    });
})();
</script>
@endsection