@extends('layouts.agent')
@section('content')
<div class="container">
    <div class="row justify-content-center">
        <div class="col-md-12">
            <form method="POST" action="{{ route("agent.sales-orders-v2.store") }}" enctype="multipart/form-data">
                <div class="card">
                    <div class="card-header">
                        {{ trans('global.create') }} Purchase Order
                    </div>

                    <div class="card-body">
                        @method('POST')
                        @csrf
                        <div class="row">
                            <div class="col-12 col-md-6">
                                <div class="form-group">
                                    <label class="required">Bill To</label>
                                    <input type="text" class="form-control-plaintext" readonly name="bill_to_name" name="bill_to_name" value="{{ auth('agent')->user()->customer->name }}" />
                                    <input type="text" class="form-control-plaintext" readonly name="bill_to_contact_number" name="bill_to_contact_number" value="{{ auth('agent')->user()->customer->contact_number }}" />
                                    <input type="text" class="form-control-plaintext" readonly name="bill_to_address" name="bill_to_address" value="{{ auth('agent')->user()->customer->address }}" />
                                    {{-- <select class="form-control" name="bill_to" id="bill_to" required>
                                        <option value disabled {{ old('bill_to', null) === null ? 'selected' : '' }}>{{ trans('global.pleaseSelect') }}</option>
                                    </select> --}}
                                    @if($errors->has('bill_to'))
                                        <div class="invalid-feedback">
                                            {{ $errors->first('bill_to') }}
                                        </div>
                                    @endif
                                </div>
                                <div class="form-group">
                                    <label class="required">Ship To</label>
                                    <select class="form-control select2" name="ship_to" id="ship_to" required>
                                        <option value disabled {{ old('ship_to', null) === null ? 'selected' : '' }}>{{ trans('global.pleaseSelect') }}</option>
                                        <option value="0" {{ old('ship_to', 0) === (string) 0 ? 'selected' : '' }}>Default</option>
                                        <option value="999" {{ old('ship_to', 999) === (string) 999 ? 'selected' : '' }}>Others</option>
                                    </select>
                                    @if($errors->has('ship_to'))
                                        <div class="invalid-feedback">
                                            {{ $errors->first('ship_to') }}
                                        </div>
                                    @endif
                                </div>
                                <div class="form-group default-ship" style="display: none;">
                                    <input type="text" class="form-control-plaintext" readonly name="default_ship_to_name" value="{{ auth('agent')->user()->name }}" />
                                    <input type="text" class="form-control-plaintext" readonly name="default_ship_to_contact_number" value="{{ auth('agent')->user()->contact_number }}" />
                                    <input type="text" class="form-control-plaintext" readonly name="default_ship_to_address" value="{{ auth('agent')->user()->address }}" />
                                </div>
                                <div class="form-group ship-to-name" style="display: none;">
                                    <label>Name</label>
                                    <input class="form-control {{ $errors->has('ship_to_name') ? 'is-invalid' : '' }}" name="ship_to_name" id="ship_to_name" value="{{ old('ship_to_name', '') }}"/>
                                    @if($errors->has('ship_to_name'))
                                        <div class="invalid-feedback">
                                            {{ $errors->first('ship_to_name') }}
                                        </div>
                                    @endif
                                </div>
                                <div class="form-group ship-to-contact-number" style="display: none;">
                                    <label>Contact Number</label>
                                    <input class="form-control {{ $errors->has('ship_to_contact_number') ? 'is-invalid' : '' }}" name="ship_to_contact_number" id="ship_to_contact_number" value="{{ old('ship_to_contact_number', '') }}" />
                                    @if($errors->has('ship_to_contact_number'))
                                        <div class="invalid-feedback">
                                            {{ $errors->first('ship_to_contact_number') }}
                                        </div>
                                    @endif
                                </div>
                                <div class="form-group ship-to-address" style="display: none;">
                                    <label>Address</label>
                                    <textarea class="form-control" name="ship_to_address" id="ship_to_address">{{ old('ship_to_address', '') }}</textarea>
                                    @if($errors->has('ship_to_address'))
                                        <div class="invalid-feedback">
                                            {{ $errors->first('ship_to_address') }}
                                        </div>
                                    @endif
                                </div>
                            </div>
                            <div class="col-12 col-md-6">
                                {{-- <div class="form-group">
                                    <label for="so_no">SO No</label>
                                    <input type="text" class="form-control-plaintext" readonly name="so_no" id="so_no" value="{{ old('so_no', $so_no) }}" />
                                </div> --}}

                                <div class="form-group">
                                    <label class="required">Date</label>
                                    <input type="text" class="form-control date" name="date" id="date" value="{{ old('date', '') }}" required /> 
                                    @if($errors->has('date'))
                                        <div class="invalid-feedback">
                                            {{ $errors->first('date') }}
                                        </div>
                                    @endif
                                </div>

                                <div class="form-group">
                                    <label class="required">Payment Terms</label>
                                    <select class="form-control select2" name="payment_terms" id="payment_terms" required>
                                        <option value disabled {{ old('payment_terms', null) === null ? 'selected' : '' }}>{{ trans('global.pleaseSelect') }}</option>
                                        @foreach ($paymentTerms as $id => $paymentTerm)
                                            <option value="{{ $id }}" {{ old('payment_terms', auth('agent')->user()->customer->payment_term_id) == $id ? 'selected' : '' }}>{{ $paymentTerm }}</option>
                                        @endforeach
                                    </select>
                                    @if($errors->has('payment_terms'))
                                        <div class="invalid-feedback">
                                            {{ $errors->first('payment_terms') }}
                                        </div>
                                    @endif
                                </div>
                                <div class="form-group">
                                    <label>Remark</label>
                                    <textarea class="form-control" name="sales_order_remark" id="sales_order_remark" rows="3">{{ old('sales_order_remark', '') }}</textarea>
                                    @if($errors->has('sales_order_remark'))
                                        <div class="invalid-feedback">
                                            {{ $errors->first('sales_order_remark') }}
                                        </div>
                                    @endif
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="card">
                    <div class="card-header">
                        Purchase Order Items
                    </div>
                    <div class="card-body">
                        <div class="row">
                            <div class="col-md-12">
                                @foreach ($carts as $key => $cart)
                                    <div class="d-flex">
                                        <div style="width: 15%;">
                                            <img class="d-block w-100" src="{{ url('products') . '/' . $cart->product_image }}" alt="{{ $cart->product_name }}">
                                        </div>
                                        
                                        <div style="width: 85%;">
                                            <table class="table table-borderless h-100">
                                                <tbody>
                                                    <tr>
                                                        <input type="hidden" name="cart_id[]" value="{{ $cart->id }}">
                                                        <td colspan="2">{{ $cart->product_name }}</td>
                                                    </tr>
                                                    <tr>
                                                        <td>Qty: {{ $cart->product_quantity }}</td>
                                                    </tr>
                                                    <tr>
                                                        <td class="w-50">
                                                            <p class="mb-0"><del>RM{{ number_format($cart->product->sell_price,2) }}</del>&nbsp;<span>RM{{ number_format($cart->product_price,2) }}</span></p>
                                                            <small>RM{{ number_format($cart->product_price,2) }}/Each</small>
                                                        </td>
                                                        <td class="w-50" align="center">
                                                            {{-- <button class="btn add-item-btn" wire:click="addProduct({{ $product }})">Add</button>
                                                            <div class="d-flex justify-content-center" id="add-to-cart-qty-{{ $key }}" data-row="{{ $key }}" style="display: none !important;">
                                                                <button class="btn btn-sm minus-item-qty-btn mr-1">-</button>
                                                                <input type="number" min="1" max="99" maxlength="2" class="form-control-plaintext qty-input text-center w-25" name="item-qty" value="0" />
                                                                <button class="btn btn-sm add-item-qty-btn ml-1">+</button>
                                                            </div> --}}
                                                        </td>
                                                    </tr>
                                                </tbody>
                                            </table>
                                        </div>
                                    </div>
                                @endforeach
                            </div>
                        </div>
                        
                        <div class="col-12 col-md-4 offset-md-8 mt-2">
                            <table class="table table-borderless mb-0">
                                <tbody>
                                    <tr>
                                        <td colspan="2" class="w-75" align="right">Total</td>
                                        <td align="right" class="w-25">RM{{ number_format($cartTotalAmount, 2) }}</td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>

                        <div class="form-group">
                            <a class="btn btn-secondary" href="{{ route('agent.products.index') }}">
                                Continue Order
                            </a>
                            <button class="btn btn-primary" type="submit">
                                Checkout
                            </button>
                            {{-- <a class="btn btn-primary" href="#">
                                Print Preview
                            </a> --}}
                        </div>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>
@endsection

@section('scripts')
<script>
$(document).ready(function () {
    var rowNumber = 1;
    var optionHTML = $("#salesOrder-0-product").html();
    tableBody = $("table tbody");

    $(document).on('input', 'input[type=number]', function(){
        if (!/^(?:\d*\.\d{1,2}|\d+)$/.test($(this).val())) {
            if(!Number.isNaN($(this).val()))
            {
                this.value = 0;
                return;
            }

            this.value = parseFloat(this.value).toFixed(2);
            alert("Invalid number");
        }
    });

    @error('ship_to_name')
        $('.ship-to-name').show();
        $('.ship-to-contact-number').show();
        $('.ship-to-address').show();
    @enderror

    @error('ship_to_contact_number')
        $('.ship-to-name').show();
        $('.ship-to-contact-number').show();
        $('.ship-to-address').show();
    @enderror

    @error('ship_to_address')
        $('.ship-to-name').show();
        $('.ship-to-contact-number').show();
        $('.ship-to-address').show();
    @enderror

    $("#ship_to").on('change',function(){
        let value = $(this).val();

        if(value == 999)
        {
            $('.default-ship').hide();
            $('.ship-to-name').show();
            $('.ship-to-contact-number').show();
            $('.ship-to-address').show();
        }
        else
        {
            $('.default-ship').show();

            $("#ship_to_name").val('');
            $("#ship_to_contact_number").val('');
            $("#ship_to_address").val('');
            $('.ship-to-name').hide();
            $('.ship-to-contact-number').hide();
            $('.ship-to-address').hide();
        }
    });

    $('#date').on('dp.change', function(e){ 
        var formatedValue = e.date.format(e.date._f);
        var array = formatedValue.split("-");
        let so_no = $("input[name=so_no]").val().split("-");
        let updated_so_no = 'SO' + array[1] + array[2] + '-' + so_no[1];
        $("input[name=so_no]").val(updated_so_no);
    });
});
</script>

@endsection