@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>Update Stock</h5>
<div class="card p-5">

    <div class="container">
        <h5>Update Stock</h5>
        <form id="UpdateForm" method="POST" action="{{route('update_stock_form')}}">
            @csrf
            <input type="hidden" name="id" value="{{ $stock->id }}">


            <div class="row">
                <div class="col-lg-6 mb-2">
                    <label class="form-label" for="Select_rack">Select Rack size</label>
                    <input type="text" name="rack_size"
                        id="select_rack"
                        class="form-control"
                        value="{{ old('rack_size', $stock->rack_size) }}" readonly disabled>
                    @error('rack_size') <div class="text-danger">{{ $message }}</div> @enderror



                    </input>
                </div>
                <div class="col-lg-6 mb-2">
                    <label class="form-label" for="Select_wood">Select Wood</label>
                    <input type="text" name="wood_name"
                        id="wood_name"
                        class="form-control"
                        value="{{ old('wood_name', $stock->wood_name) }}" readonly disabled>
                    @error('wood_name') <div class="text-danger">{{ $message }}</div> @enderror

                    </input>
                </div>

                <div class="col-lg-4 mb-2">
                    <label class="form-label" for="Quantity">Quantity</label>
                    <input type="number"
                        class="form-control"
                        name="quantity"
                        id="quantity"
                        value="{{ old('quantity', $stock->quantity) }}"
                        placeholder="Enter Quantity">
                    @error('quantity') <div class="text-danger">{{ $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"
                        name="rate" id="rate"
                        value="{{ old('rate', $stock->rate) }}"
                        placeholder="Enter Rate">
                    @error('rate') <div class="text-danger">{{ $message }}</div> @enderror

                </div>

                <div class="col-lg-4 mb-2">
                    <label class="form-label" for="Rack Number">Rack Number</label>
                    <input type="text"
                        class="form-control"
                        name="rack_number"
                        id="rack_number"
                        value="{{ old('rack_number', $stock->rack_number) }}"
                        readonly disabled>
                    @error('rack_number') <div class="text-danger">{{ $message }}</div> @enderror

                </div>

                <div class="col-lg-4 mb-2">
                    <label class="form-label" for="CFT">CFT</label>
                    <input type="text"
                        class="form-control"
                        name="cft"
                        id="cft"
                        value="{{ old('cft', $stock->cft) }}"
                        readonly>
                    @error('cft') <div class="text-danger">{{ $message }}</div> @enderror

                </div>

                <div class="col-lg-4 mb-2">
                    <label class="form-label" for="Perukam">Perukam</label>
                    <input type="text"
                        class="form-control"
                        name="perukam"
                        id="perukam"
                        value="{{ old('perukam', $stock->perukam) }}"
                        readonly>
                    @error('perukam') <div class="text-danger">{{ $message }}</div> @enderror

                </div>

                <div class="col-lg-4 mb-2">
                    <label class="form-label" for="square_feet">Square Feet</label>
                    <input type="text"
                        class="form-control"
                        name="square_feet"
                        id="square_feet"
                        value="{{ old('square_feet', $stock->square_feet) }}" readonly>
                    @error('square_feet') <div class="text-danger">{{ $message }}</div> @enderror

                </div>
            </div>



            <div class="form-actions d-flex justify-content-center mt-4">
                <button type="button" class="btn btn-primary me-3" data-bs-toggle="modal"
                    data-bs-target="#stock_update">Update</button>
                <button type="reset" class="btn btn-label-secondary">Discard</button>
            </div>
        </form>
    </div>
</div>

<!-- submit -->
<div class="modal fade" id="stock_update" 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 src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>


<script>
    // Disable button on submit
    document.getElementById('submit_btn')?.addEventListener('click', function(e) {
        e.preventDefault();
        let btn           = this;
            btn.disabled  = true;
            btn.innerText = 'Processing...';
        document.getElementById('UpdateForm').submit();
    });
</script>
<script>
    $(document).ready(function() {

        function recalculate() {
            let inputQty = parseFloat($('#quantity').val());
            if (isNaN(inputQty) || inputQty <= 0) {
                $('#perukam').val('');
                $('#square_feet').val('');
                $('#cft').val('');
                return;
            }

            let oldQty    = parseFloat({{ $stock->quantity }});
            let length    = parseFloat({{ $stock->length }});
            let width     = parseFloat({{ $stock->width }});
            let thickness = parseFloat({{ $stock->thickness }});


            let totalQty =  inputQty;

            let perukam    = (length * width * thickness * totalQty) / 4;
            let squareFeet = perukam / 3;
            let cft        = perukam / 36;

            $('#perukam').val(perukam.toFixed(2));
            $('#square_feet').val(squareFeet.toFixed(2));
            $('#cft').val(cft.toFixed(2));
        }

        $('#quantity').on('input', recalculate);

        recalculate();
    });
</script>

@endsection