@extends('admin.layouts.master-soyuz')
@section('title', __('Create Order'))
@section('body')

@component('admin.component.breadcumb', ['secondaryactive' => 'active'])
    @slot('heading'){{ __('Inhouse Orders') }}@endslot
    @slot('menu1'){{ __('Create Order') }}@endslot
    @slot('button')
        <div class="col-md-6">
            <div class="widgetbar">
                <a href="{{ route('offline-orders.index') }}" class="btn btn-primary-rgba">
                    <i class="feather icon-arrow-left mr-1"></i> {{ __('Back to Orders') }}
                </a>
            </div>
        </div>
    @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

    <form action="{{ route('offline-orders.store') }}" method="POST">
        @csrf

        <div class="row">
            {{-- LEFT — main form --}}
            <div class="col-lg-8">

                {{-- Customer details --}}
                <div class="card m-b-30">
                    <div class="card-header">
                        <h5 class="card-title mb-0"><i class="feather icon-user mr-2 text-primary"></i>{{ __('Customer Details') }}</h5>
                    </div>
                    <div class="card-body">
                        <div class="row">
                            <div class="col-md-4 mb-3">
                                <label class="font-weight-600 mb-2">{{ __('Invoice Date') }}</label>
                                <div class="input-group">
                                    <input id="default-date" placeholder="{{ __('Pick a date') }}" value="{{ old('invoice_date') }}" name="invoice_date" type="text" class="form-control sh-select-bare">
                                    <div class="input-group-append">
                                        <span class="input-group-text"><i class="feather icon-calendar"></i></span>
                                    </div>
                                </div>
                            </div>

                            <div class="col-md-4 mb-3">
                                <label class="font-weight-600 mb-2">{{ __('Customer Name') }} <span class="text-danger">*</span></label>
                                <div class="input-group">
                                    <div class="input-group-prepend">
                                        <span class="input-group-text"><i class="feather icon-user"></i></span>
                                    </div>
                                    <input id="customer_search" value="{{ old('customer_name') }}" required class="form-control sh-select-bare" type="text" name="customer_name" placeholder="{{ __('eg: John Doe') }}">
                                    <input type="hidden" name="customer_id" id="customer_id">
                                </div>
                            </div>

                            <div class="col-md-4 mb-3">
                                <label class="font-weight-600 mb-2">{{ __('Email') }} <span class="text-danger">*</span></label>
                                <div class="input-group">
                                    <div class="input-group-prepend">
                                        <span class="input-group-text"><i class="feather icon-at-sign"></i></span>
                                    </div>
                                    <input value="{{ old('customer_email') }}" required class="form-control customer_email sh-select-bare" type="email" name="customer_email" placeholder="{{ __('eg: john@example.com') }}">
                                </div>
                            </div>

                            <div class="col-md-4 mb-3">
                                <label class="font-weight-600 mb-2">{{ __('Contact No.') }} <span class="text-danger">*</span></label>
                                <div class="input-group">
                                    <div class="input-group-prepend">
                                        <span class="input-group-text"><i class="feather icon-phone"></i></span>
                                    </div>
                                    <input maxlength="15" value="{{ old('customer_phone') }}" required pattern="[0-9]+" class="form-control customer_phone sh-select-bare" type="text" name="customer_phone" placeholder="{{ __('eg: 9876543210') }}">
                                </div>
                            </div>

                            <div class="col-md-4 mb-3">
                                <label class="font-weight-600 mb-2">{{ __('Country') }}</label>
                                <select onchange="getstate();" required name="country_id" class="form-control country_id sh-select-bare" id="country_id">
                                    <option value="">{{ __('Select country') }}</option>
                                    @foreach($country as $c)
                                        @php $iso3 = $c->country; $cn = DB::table('allcountry')->where('iso3', $iso3)->first(); @endphp
                                        @if($cn)
                                            <option value="{{ $cn->id }}">{{ $cn->nicename }}</option>
                                        @endif
                                    @endforeach
                                </select>
                            </div>

                            <div class="col-md-4 mb-3">
                                <label class="font-weight-600 mb-2">{{ __('State') }}</label>
                                <select onchange="getcity();" required name="state_id" class="form-control state_id sh-select-bare" id="upload_id">
                                    <option value="">{{ __('Select state') }}</option>
                                </select>
                            </div>

                            <div class="col-md-4 mb-3">
                                <label class="font-weight-600 mb-2">{{ __('City') }}</label>
                                <select required name="city_id" id="city_id" class="form-control city_id sh-select-bare">
                                    <option value="">{{ __('Select city') }}</option>
                                </select>
                            </div>

                            <div class="col-md-4 mb-3">
                                <label class="font-weight-600 mb-2">{{ __('Pincode') }} <span class="text-danger">*</span></label>
                                <div class="input-group">
                                    <div class="input-group-prepend">
                                        <span class="input-group-text"><i class="feather icon-map-pin"></i></span>
                                    </div>
                                    <input required placeholder="eg: 110011" type="text" class="form-control customer_pincode sh-select-bare" name="customer_pincode" value="{{ old('customer_pincode') }}">
                                </div>
                            </div>

                            <div class="col-md-6 mb-3">
                                <label class="font-weight-600 mb-2">{{ __('Shipping Address') }} <span class="text-danger">*</span></label>
                                <textarea placeholder="{{ __('B-123, Sample Street, City, Country') }}" required class="form-control customer_shipping_address sh-select-bare" name="customer_shipping_address" rows="3">{{ old('customer_shipping_address') }}</textarea>
                                <label class="text-muted mt-1 mb-0" style="font-size: 12px;"><input checked {{ old('mark_as_default') ? 'checked' : '' }} type="checkbox" name="mark_as_default"> {{ __('Mark as default address') }}</label>
                            </div>

                            <div class="col-md-6 mb-3">
                                <label class="font-weight-600 mb-2">{{ __('Billing Address') }} <span class="text-danger">*</span></label>
                                <textarea placeholder="{{ __('B-123, Sample Street, City, Country') }}" required class="form-control customer_billing_address sh-select-bare" name="customer_billing_address" rows="3">{{ old('customer_billing_address') }}</textarea>
                                <label class="text-muted mt-1 mb-0" style="font-size: 12px;"><input checked {{ old('same_as_shipping') ? 'checked' : '' }} type="checkbox" id="same_as_shipping" name="same_as_shipping"> {{ __('Same as shipping address') }}</label>
                            </div>
                        </div>
                    </div>
                </div>

                {{-- Payment & Shipping --}}
                <div class="card m-b-30">
                    <div class="card-header">
                        <h5 class="card-title mb-0"><i class="feather icon-credit-card mr-2 text-primary"></i>{{ __('Payment & Shipping') }}</h5>
                    </div>
                    <div class="card-body">
                        <div class="row">
                            <div class="col-md-4 mb-3">
                                <label class="font-weight-600 mb-2">{{ __('Payment Method') }} <span class="text-danger">*</span></label>
                                <input value="{{ old('payment_method') ?? 'Online' }}" required name="payment_method" type="text" class="form-control sh-select-bare" placeholder="{{ __('eg: Cash on delivery') }}">
                            </div>

                            <div class="col-md-4 mb-3">
                                <label class="font-weight-600 mb-2">{{ __('Order ID') }}</label>
                                <input value="{{ old('order_id') }}" name="order_id" type="text" class="form-control sh-select-bare" placeholder="eg: NND7456789">
                                <small class="text-muted">{{ __('Leave blank for auto-generation') }}</small>
                            </div>

                            <div class="col-md-4 mb-3">
                                <label class="font-weight-600 mb-2">{{ __('Order Status') }} <span class="text-danger">*</span></label>
                                <select name="order_status" class="form-control sh-select-bare">
                                    @foreach([
                                        'pending' => __('Pending'),
                                        'processed' => __('Processed'),
                                        'packed' => __('Packed'),
                                        'shipped' => __('Shipped'),
                                        'in_transit' => __('In Transit'),
                                        'out_for_delivery' => __('Out for Delivery'),
                                        'delivered' => __('Delivered'),
                                    ] as $val => $label)
                                        <option value="{{ $val }}" {{ $val === 'delivered' ? 'selected' : '' }}>{{ $label }}</option>
                                    @endforeach
                                </select>
                            </div>

                            <div class="col-md-4 mb-3">
                                <label class="font-weight-600 mb-2">{{ __('Shipping Method') }} <span class="text-danger">*</span></label>
                                <input value="{{ old('shipping_method') ?? 'Shiprocket' }}" required name="shipping_method" type="text" class="form-control sh-select-bare" placeholder="FedEx">
                            </div>

                            <div class="col-md-4 mb-3">
                                <label class="font-weight-600 mb-2">{{ __('Shipping Rate') }} <span class="text-danger">*</span></label>
                                <div class="input-group">
                                    <input value="{{ old('shipping_rate') ?? 0 }}" required name="shipping_rate" type="number" min="0" step="0.01" class="form-control shipping_rate sh-select-bare" placeholder="eg: 40">
                                    <div class="input-group-append">
                                        <span class="input-group-text"><i class="{{ $defCurrency->currency_symbol }}"></i></span>
                                    </div>
                                </div>
                            </div>

                            <div class="col-md-4 mb-3">
                                <label class="font-weight-600 mb-2">{{ __('Transaction ID') }}</label>
                                <input value="{{ old('txn_id') }}" required name="txn_id" type="text" class="form-control sh-select-bare" placeholder="eg: NND7405">
                                <label class="text-muted mt-1 mb-0" style="font-size: 12px;"><input checked type="checkbox" name="txn_same_as_orderid"> {{ __('Same as Order ID') }}</label>
                            </div>
                        </div>
                    </div>
                </div>

                {{-- Order items --}}
                <div class="card m-b-30 orderDetails" tabindex="1">
                    <div class="card-header d-flex justify-content-between align-items-center flex-wrap" style="gap: 8px;">
                        <h5 class="card-title mb-0"><i class="feather icon-shopping-cart mr-2 text-primary"></i>{{ __('Order Items') }}</h5>
                        <div class="d-flex" style="gap: 6px; font-size: 11px;">
                            <span class="badge badge-success-rgba" style="background: rgba(22,163,74,0.10); color: #16a34a; padding: 5px 9px;">{{ __('Ctrl + D') }} {{ __('to add row') }}</span>
                            <span class="badge badge-danger-rgba"  style="background: rgba(239,68,68,0.10);  color: #ef4444; padding: 5px 9px;">{{ __('Ctrl + E') }} {{ __('to remove row') }}</span>
                        </div>
                    </div>

                    <div class="card-body">
                        <div style="display: none;" class="errorzone fadein alert alert-danger alert-dismissable">
                            <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                            <span class="errorMessage"></span>
                        </div>

                        <div class="table-responsive">
                            <table class="myTable table table-bordered" style="margin-bottom: 0;">
                                <thead>
                                    <tr style="background: var(--adm-content-bg);">
                                        <th style="min-width: 220px;">{{ __('Product') }}</th>
                                        <th style="min-width: 150px;">{{ __('Price') }}</th>
                                        <th style="min-width: 110px;">{{ __('Origin') }}</th>
                                        <th style="min-width: 90px;">{{ __('Qty') }}</th>
                                        <th style="min-width: 150px;">{{ __('Total') }}</th>
                                        <th style="width: 90px;"></th>
                                    </tr>
                                </thead>
                                <tbody>
                                @if(!old('product_name'))
                                    <tr id="tableBody" class="tbody">
                                        <td><input required type="text" class="form-control product_name sh-select-bare" name="product_name[]" placeholder="eg: Ring (Gold)"></td>
                                        <td>
                                            <div class="input-group">
                                                <input required value="" type="text" class="form-control product_price sh-select-bare" name="product_price[]" placeholder="5000">
                                                <div class="input-group-append"><span class="input-group-text"><i class="{{ $defCurrency->currency_symbol }}"></i></span></div>
                                            </div>
                                        </td>
                                        <td><input value="India" placeholder="eg: India" required type="text" class="form-control product_origin sh-select-bare" name="origin[]"></td>
                                        <td><input value="1" required placeholder="1" type="number" class="form-control product_qty sh-select-bare" name="product_qty[]" min="1"></td>
                                        <td>
                                            <div class="input-group">
                                                <input required readonly type="text" class="form-control product_total sh-select-bare" name="product_total[]" placeholder="5000">
                                                <div class="input-group-append"><span class="input-group-text"><i class="{{ $defCurrency->currency_symbol }}"></i></span></div>
                                            </div>
                                        </td>
                                        <td>
                                            <div class="d-flex" style="gap: 4px;">
                                                <button title="{{ __('Add new row') }}" type="button" class="addNew btn btn-primary-rgba btn-sm"><i class="feather icon-plus"></i></button>
                                                <button title="{{ __('Remove row') }}" type="button" class="removeBtn btn btn-danger-rgba btn-sm"><i class="feather icon-x"></i></button>
                                            </div>
                                        </td>
                                    </tr>
                                @else
                                    @foreach(old('product_name') as $key => $item)
                                        <tr id="tableBody" class="tbody">
                                            <td><input required type="text" class="form-control product_name sh-select-bare" value="{{ $item }}" name="product_name[]" placeholder="eg: Ring (Gold)"></td>
                                            <td>
                                                <div class="input-group">
                                                    <input required value="{{ old('product_price')[$key] }}" type="text" class="form-control product_price sh-select-bare" name="product_price[]" placeholder="5000">
                                                    <div class="input-group-append"><span class="input-group-text"><i class="{{ $defCurrency->currency_symbol }}"></i></span></div>
                                                </div>
                                            </td>
                                            <td><input placeholder="eg: India" required type="text" class="form-control product_origin sh-select-bare" value="{{ old('origin')[$key] }}" name="origin[]"></td>
                                            <td><input required placeholder="1" type="number" class="form-control product_qty sh-select-bare" value="{{ old('product_qty')[$key] }}" name="product_qty[]" min="1"></td>
                                            <td>
                                                <div class="input-group">
                                                    <input required readonly type="text" class="form-control product_total sh-select-bare" value="{{ old('product_total')[$key] }}" name="product_total[]" placeholder="5000">
                                                    <div class="input-group-append"><span class="input-group-text"><i class="{{ $defCurrency->currency_symbol }}"></i></span></div>
                                                </div>
                                            </td>
                                            <td>
                                                <div class="d-flex" style="gap: 4px;">
                                                    <button title="{{ __('Add new row') }}" type="button" class="addNew btn btn-primary-rgba btn-sm"><i class="feather icon-plus"></i></button>
                                                    <button title="{{ __('Remove row') }}" type="button" class="removeBtn btn btn-danger-rgba btn-sm"><i class="feather icon-x"></i></button>
                                                </div>
                                            </td>
                                        </tr>
                                    @endforeach
                                @endif
                                </tbody>
                            </table>
                        </div>

                        <div class="mt-3">
                            <label class="text-muted mb-2" style="font-size: 12px;">
                                <input checked type="checkbox" name="tax_include" class="tax_include">
                                {{ __('All prices are inclusive of tax') }}
                            </label>
                            <label class="font-weight-600 mb-2 d-block">{{ __('Additional Note') }}</label>
                            <textarea class="form-control sh-select-bare" placeholder="{{ __('Any additional order note') }}" name="additional_note" rows="3">{{ old('additional_note') }}</textarea>
                        </div>
                    </div>
                </div>
            </div>

            {{-- RIGHT — sticky totals + submit --}}
            <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-file-text mr-2 text-primary"></i>{{ __('Order Summary') }}</h5>
                    </div>
                    <div class="card-body">
                        <div class="d-flex align-items-center justify-content-between py-2" style="border-bottom: 1px solid var(--adm-border);">
                            <span class="text-muted" style="font-size: 13px;">{{ __('Subtotal') }}</span>
                            <div class="input-group" style="max-width: 160px;">
                                <input readonly type="text" class="form-control final_subtotal sh-select-bare text-right" value="{{ old('subtotal') ?? '0.00' }}" name="subtotal">
                                <div class="input-group-append"><span class="input-group-text"><i class="{{ $defCurrency->currency_symbol }}"></i></span></div>
                            </div>
                        </div>

                        <div class="d-flex align-items-center justify-content-between py-2" style="border-bottom: 1px solid var(--adm-border);">
                            <span class="text-muted" style="font-size: 13px;">{{ __('Shipping') }}</span>
                            <div class="input-group" style="max-width: 160px;">
                                <input readonly type="text" class="form-control total_shipping sh-select-bare text-right" value="{{ old('total_shipping') ?? '0.00' }}" name="total_shipping">
                                <div class="input-group-append"><span class="input-group-text"><i class="{{ $defCurrency->currency_symbol }}"></i></span></div>
                            </div>
                        </div>

                        <div class="d-flex align-items-center justify-content-between py-2" style="border-bottom: 1px solid var(--adm-border);">
                            <span class="text-muted" style="font-size: 13px;">{{ __('Tax') }}</span>
                            <div class="input-group" style="max-width: 160px;">
                                <input type="number" class="form-control total_tax_percent sh-select-bare text-right" value="{{ old('tax_rate') ?? 0 }}" name="tax_rate">
                                <input type="hidden" class="form-control total_tax_amount" value="0" name="total_tax">
                                <div class="input-group-append"><span class="input-group-text">%</span></div>
                            </div>
                        </div>

                        <div class="text-right" style="font-size: 11px; color: #94a3b8; margin-top: 2px;">
                            <span class="tax_in_rupees">{{ old('total_tax_amount') ?? 0 }}</span> <i class="{{ $defCurrency->currency_symbol }}"></i>
                        </div>

                        <div class="d-flex align-items-center justify-content-between py-2" style="border-bottom: 1px solid var(--adm-border);">
                            <span class="text-muted" style="font-size: 13px;">{{ __('Adjustment') }}</span>
                            <div class="input-group" style="max-width: 160px;">
                                <input min="0" step="0.01" type="number" class="form-control adjustable_amount sh-select-bare text-right" value="{{ old('adjustable_amount') ?? '0.00' }}" name="adjustable_amount">
                                <div class="input-group-append"><span class="input-group-text"><i class="{{ $defCurrency->currency_symbol }}"></i></span></div>
                            </div>
                        </div>

                        <div class="d-flex align-items-center justify-content-between mt-3 p-3" style="background: rgba(59,109,240,0.08); border-radius: 10px;">
                            <span style="font-weight: 700; font-size: 14px; color: var(--adm-text-dark);">{{ __('Grand Total') }}</span>
                            <div class="input-group" style="max-width: 170px;">
                                <input readonly type="text" class="form-control grand_total sh-select-bare text-right" value="{{ old('grand_total') ?? '0.00' }}" name="grand_total" style="font-weight: 700; font-size: 15px;">
                                <div class="input-group-append"><span class="input-group-text"><i class="{{ $defCurrency->currency_symbol }}"></i></span></div>
                            </div>
                        </div>

                        <button type="submit" class="btn btn-primary-rgba btn-block mt-4">
                            <i class="feather icon-check-circle mr-1"></i> {{ __('Create Order') }}
                        </button>

                        <p class="text-muted small mt-3 mb-0 text-center">
                            <i class="feather icon-info mr-1"></i> {{ __('Verify all details before submitting.') }}
                        </p>
                    </div>
                </div>
            </div>
        </div>
    </form>
</div>

@endsection

@section('custom-script')
<script>
    var url = @json(route('offline.customer.search'));
    var baseurl = @json(url('/'));
    var productsearch = @json(route('offline.product.search'));
</script>
<script>
    $(document).ready(function(){
        $(".product_name").each(function(){ enableAutoComplete($(this)); });
    });
</script>
<script src="{{ url('js/offlineorder.js') }}"></script>
@endsection