@extends('Admin.layout')

@section('content')

<h5> <button type="button" class="btn btn-icon bg-white waves-effect me-2" onclick="window.history.back()" ;
        style="box-shadow: 0px 9px 12px -2px #66328E1F;">
        <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"
            fill="none" stroke="#000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
            class="icon icon-tabler icons-tabler-outline icon-tabler-chevron-left">
            <path stroke="none" d="M0 0h24v24H0z" fill="none" />
            <path d="M15 6l-6 6l6 6" />
        </svg>
    </button>Edit Rack</h5>
<div class="card p-5">
    <div class="container">
        <h5>Edit Rack</h5>
        <form id="updateForm" method="POST" action="{{ route('update_rack_details') }}">
            @csrf
            <input type="hidden" name="id" value="{{ $rack->id }}">

            <div class="row">
                <div class="col-lg-6 mb-2">
                    <label class="form-label" for="wood_name">Wood Name</label>
                    <input type="text" class="form-control" id="wood_name"
                        name="wood_name"
                        value="{{ old('wood_name', $rack->wood_name) }}">
                    @error('wood_name')
                    <div class="invalid-feedback d-block">{{ $message }}</div>
                    @enderror
                </div>

                <div class="col-lg-6 mb-2">
                    <label class="form-label" for="rack_number">Rack Number</label>
                    <input type="text" class="form-control" id="rack_number"
                        name="rack_number"
                        value="{{ old('rack_number', $rack->rack_number) }}">
                    @error('rack_number')
                    <div class="invalid-feedback d-block">{{ $message }}</div>
                    @enderror
                </div>
            </div>

            <div class="row">
                <div class="col-lg-4 mb-2">
                    <label class="form-label" for="length">Length</label>
                    <input type="number" class="form-control" id="length"
                        name="length"
                        value="{{ old('length', $rack->length) }}">
                    @error('length')
                    <div class="invalid-feedback d-block">{{ $message }}</div>
                    @enderror
                </div>

                <div class="col-lg-4 mb-2">
                    <label class="form-label" for="width">Width</label>
                    <input type="number" class="form-control" id="width"
                        name="width"
                        value="{{ old('width', $rack->width) }}">
                    @error('width')
                    <div class="invalid-feedback d-block">{{ $message }}</div>
                    @enderror
                </div>

                <div class="col-lg-4 mb-2">
                    <label class="form-label" for="thickness">Thickness</label>
                    <input type="number" class="form-control" id="thickness"
                        name="thickness"
                        value="{{ old('thickness', $rack->thickness) }}">
                    @error('thickness')
                    <div class="invalid-feedback d-block">{{ $message }}</div>
                    @enderror
                </div>
            </div>

            <div class="row">
                <div class="row">
                    <div class="col-lg-4 mb-2">
                        <label class="form-label" for="cft">CFT</label>
                        <input type="number" class="form-control" id="cft"
                            name="cft"
                            value="{{ old('cft', $rack->cft) }}" readonly>
                        @error('cft')
                        <div class="invalid-feedback d-block">{{ $message }}</div>
                        @enderror
                    </div>

                    <div class="col-lg-4 mb-2">
                        <label class="form-label" for="quantity">Quantity</label>
                        <input type="number" class="form-control" id="quantity"
                            name="quantity"
                            value="{{ old('quantity', $rack->quantity) }}" readonly>
                        @error('quantity')
                        <div class="invalid-feedback d-block">{{ $message }}</div>
                        @enderror
                    </div>

                    <div class="col-lg-4 mb-2">
                        <label class="form-label" for="rate">Rate</label>
                        <input type="text" class="form-control" id="rate"
                            name="rate"
                            value="{{ old('rate', $rack->rate) }}" readonly>
                        @error('rate')
                        <div class="invalid-feedback d-block">{{ $message }}</div>
                        @enderror
                    </div>
                </div>

                <div class="form-actions mt-4">
                    <button type="submit" class="btn btn-primary me-3">Update</button>
                    <button type="reset" class="btn btn-secondary">Discard</button>
                </div>
        </form>

    </div>
</div>

<!-- submit -->
<div class="modal fade" id="update_submit" tabindex="-1" data-bs-backdrop="static" data-bs-keyboard="false">

    <div class="modal-dialog modal-sm modal-dialog-centered">
        <div class="modal-content rounded-4 text-center p-4 py-5">
            <h5 class="fw-bold mb-2">Are you sure!!</h5>
            <p class="text-muted">Are you confirm to submit ?</p>
            <div class="d-flex justify-content-center align-items-center gap-3 mt-4">
                <button type="button" class="btn btn-outline-primary p-3 fw-semibold me-3" data-bs-dismiss="modal">
                    Cancel
                </button>
                <button type="submit" id="submit_btn" class="btn btn-primary p-3 fw-semibold ">
                    Yes, Sure
                </button>
            </div>
        </div>
    </div>
</div>

<script>
    document.getElementById('submit_btn').addEventListener('click', function(e) {
        e.preventDefault(); // ✅ prevent double submit
        let btn = this;
        btn.disabled = true;
        btn.innerText = 'Processing...';
        document.getElementById('updateForm').submit();
    });
</script>
@endsection