@extends('layouts.master')
@section('title', 'User')
@push('css')

@endpush

@section('content')
    <form method="POST" action="{{ route('user.customerPayment.add') }}" enctype="multipart/form-data">
        @csrf
        <div class="row" style="border-bottom: 1px solid silver;">
            <div class="col-xl-12">
                <div class="form-horizontal">
                    <div class="col-sm-12">
                        <div class="form-group">
                            <label class="col-sm-1 control-label" for="username"> Invoice no:</label>
                            <div class="col-sm-2">
                                <input type="number" id="username" name="due" placeholder="Present Address" class="form-control">
                            </div>

                            <label class="col-sm-1 control-label" for="username"> Sales By: </label>
                            <div class="col-sm-2">
                                <input type="Date" id="username" name="date" placeholder="Permanent Address" class="form-control">
                            </div>

                            <label class="col-sm-1 control-label" for="username"> Sales From </label>
                            <div class="col-sm-2">
                                <input type="text" id="username" name="amount" placeholder="{{auth()->user()->branch_id}}" class="form-control" readonly>
                            </div>

                            <div class="col-sm-2">
                                <input type="date" id="username" name="amount" placeholder="Amount" class="form-control">
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

    <div class="row">

        <div class="col-md-9">
            <div class="form-horizontal">
                <fieldset style="border: 1px solid silver;">
                    <legend>Sales Information:</legend>
                <div class="col-sm-5">
                    <div class="form-group">
                        <label class="col-sm-4 control-label" for="Brunch"> Sales Type </label>
                        <label class="col-sm-1 control-label">:</label>
                        <div class="col-sm-7">
                            <input id="demo-inline-form-radio-2" class="magic-radio" type="radio" name="inline-form-radio">
                            <label for="demo-inline-form-radio-2">Retail   </label>

                            <input id="demo-inline-form-radio-3" class="magic-radio" type="radio" name="inline-form-radio">
                            <label for="demo-inline-form-radio-3">Wholesale</label>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-4 control-label" for="Brunch"> Customer </label>
                        <label class="col-sm-1 control-label">:</label>
                        <div class="col-sm-7">
                            <select data-placeholder="Choose a Country..."  name="customer_id" class="chosen-select" id="demo-chosen-select" tabindex="2">
                                @foreach($customers as $customer)
                                    <option value="{{$customer->id}}">{{$customer->customer_name}}</option>
                                @endforeach
                            </select>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-4 control-label" for="txtFirstName"> Name </label>
                        <label class="col-sm-1 control-label">:</label>
                        <div class="col-sm-6">
                            <input type="text" name="transaction_id" id="txtFirstName" placeholder="" value=""
                                   class="form-control">
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-4 control-label" for="txtFirstName"> Mobile No </label>
                        <label class="col-sm-1 control-label">:</label>
                        <div class="col-sm-6">
                            <input type="text" name="transaction_id" id="txtFirstName" placeholder="" value=""
                                   class="form-control">
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-4 control-label" for="Brunch"> Address </label>
                        <label class="col-sm-1 control-label">:</label>
                        <div class="col-sm-7">
                            <textarea name="description" class="form-control"></textarea>
                        </div>
                    </div>




                </div>

                <div class="col-sm-5">
                    <div class="form-group">
                        <div class="col-sm-7">
                            <input id="demo-inline-form-radio-2" class="magic-radio" type="radio" name="inline-form-radio">
                            <label for="demo-inline-form-radio-2">Product</label>

                            <input id="demo-inline-form-radio-3" class="magic-radio" type="radio" name="inline-form-radio">
                            <label for="demo-inline-form-radio-3">Serial</label>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-4 control-label" for="Brunch"> Product </label>
                        <label class="col-sm-1 control-label">:</label>
                        <div class="col-sm-7">
                            <select data-placeholder="Choose a Country..."  name="customer_id" class="chosen-select" id="demo-chosen-select" tabindex="2">
                                @foreach($customers as $customer)
                                    <option value="{{$customer->id}}">{{$customer->customer_name}}</option>
                                @endforeach
                            </select>
                        </div>
                    </div>

                    <div class="form-group">
                        <label class="col-sm-4 control-label" for="username"> Sale Rate </label>
                        <label class="col-sm-1 control-label">:</label>
                        <div class="col-sm-6">
                            <input type="number" id="username" name="due" placeholder="Present Address" class="form-control">
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-4 control-label" for="username"> Quantity</label>
                        <label class="col-sm-1 control-label">:</label>
                        <div class="col-sm-6">
                            <input type="number" id="username" name="due" placeholder="Present Address" class="form-control">
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-4 control-label" for="username"> Amount</label>
                        <label class="col-sm-1 control-label">:</label>
                        <div class="col-sm-6">
                            <input type="number" id="username" name="due" placeholder="Present Address" class="form-control">
                        </div>
                    </div>

                    <div class="form-group">
                        <label class="col-sm-4 control-label" for=""> </label>
                        <label class="col-sm-1 control-label"></label>
                        <div class="col-sm-6">
                            <button type="button" onclick="submit()" name="btnSubmit" title="Save"
                                    class="btn btn-sm btn-success pull-left">
                                Save
                                <i class="ace-icon fa fa-arrow-right icon-on-right bigger-110"></i>
                            </button>
                        </div>
                    </div>
                </div>

                <div class="col-sm-2">
                    <input type="text" id="productStock" readonly="readonly" style="border: none; font-size: 20px; width: 100%; text-align: center; color: green; background-color: red">
                    <br/>
                    <input type="text" id="stockUnit" readonly="readonly" style="border: none; font-size: 12px; width: 100%; text-align: center;background-color: blue">
                    <br/>
                    <input type="password" readonly="readonly" title="Purchase rate (click &amp; hold)" style="font-size: 12px; width: 100%; text-align: center; background-color: green">
                </div>
                </fieldset>

            </div>
        </div>

        <div class="col-md-3">
            <div class="form-horizontal">
                <fieldset style="border: 1px solid silver;">
                    <legend>Amount Details:</legend>
                    <div class="form-group">
                        <label class="col-sm-4 control-label" for="txtFirstName"> Sub Total </label>
                        <div class="col-sm-6">
                            <input type="text" name="transaction_id" id="txtFirstName" placeholder="" value=""
                                   class="form-control">
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-4 control-label" for="txtFirstName"> Vat </label>
                        <div class="col-sm-6">
                            <input type="text" name="transaction_id" id="txtFirstName" placeholder="" value=""
                                   class="form-control">
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-4 control-label" for="txtFirstName"> Discount Persent </label>
                        <div class="col-sm-6">
                            <input type="text" name="transaction_id" id="txtFirstName" placeholder="" value=""
                                   class="form-control">
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-4 control-label" for="txtFirstName"> Transport Cost</label>
                        <div class="col-sm-6">
                            <input type="text" name="transaction_id" id="txtFirstName" placeholder="" value=""
                                   class="form-control">
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-4 control-label" for="txtFirstName"> Payment Type</label>
                        <div class="col-sm-6">
                            <input type="text" name="transaction_id" id="txtFirstName" placeholder="" value=""
                                   class="form-control">
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-4 control-label" for="txtFirstName">Total</label>
                        <div class="col-sm-6">
                            <input type="text" name="transaction_id" id="txtFirstName" placeholder="" value=""
                                   class="form-control">
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-4 control-label" for="txtFirstName">Paid</label>
                        <div class="col-sm-6">
                            <input type="text" name="transaction_id" id="txtFirstName" placeholder="" value=""
                                   class="form-control">
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-4 control-label" for="txtFirstName">Due</label>
                        <div class="col-sm-6">
                            <input type="text" name="transaction_id" id="txtFirstName" placeholder="" value=""
                                   class="form-control">
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-4 control-label" for=""> </label>
                        <label class="col-sm-1 control-label"></label>

                        <button type="button" onclick="submit()" name="btnSubmit" title="Save"
                                class="btn btn-sm btn-success pull-left">
                            Sale
                            <i class="ace-icon fa fa-arrow-right icon-on-right bigger-110"></i>
                        </button>
                        &nbsp;
                        <button type="button" onclick="submit()" name="btnSubmit" title="Save"
                                class="btn btn-sm btn-success pull-left">
                            New Sale
                            <i class="ace-icon fa fa-arrow-right icon-on-right bigger-110"></i>
                        </button>

                    </div>
                </fieldset>
            </div>
        </div>
    </div>
    </form>

@endsection

@push('js')
<script>
    $(document).ready(function() {
        var table = $('#example').DataTable( {
            lengthChange: false,
            buttons: [ 'copy', 'excel', 'pdf', 'colvis' ]
        } );

        table.buttons().container()
            .appendTo( '#example_wrapper .col-md-6:eq(0)' );
    } );
</script>
    <script>
        $("#payment_type_click").change(function () {
            var end = this.value;
            if(end=='bank'){
                $("#payment_type_bank_form").css('display','block');
            }else{
                $("#payment_type_bank_form").css('display','none');
            }

        });
    </script>
@endpush