@extends('layouts.app')

@section('content')



<div style="padding:15px" class="card">
@if(auth()->user()->sales_person_category == "Counter")
    <!-- Field wrapper start -->
    <div class="field-wrapper">
        <div class="input-group">
            <input class="form-control" placeholder="Click Here, Scan Bar Code Or search by Item Code" type="text" autofocus autocomplete="off" id="barcode" onchange="getBarcode()">
            <span class="input-group-text">
                <button class="btn btn-primary btn-sm" type="button" onClick="autofocusBarcode()">
                    <span class="spinner-grow spinner-grow-sm" role="status" aria-hidden="true"></span>
                    Enable Scan
                </button>
            </span>
        </div>
        <div class="field-placeholder">Scan Barcode</div>
    </div>
    <!-- Field wrapper end -->
@endif
<form id="newinvoice">
    @csrf
<input type="text" name="customer_id" value="2664" hidden>
<!-- Row start -->
<div class="row gutters">
    
    <div class="col-xl-12 col-lg-12 col-md-12 col-sm-4 col-12">
        <div class="form-section-header">New Invoice<span style="float:right" class="badge bg-info">
            <a href="#" data-bs-toggle="modal" data-bs-target="{{auth()->user()->role == "Call Center" ? '#switchModal' : ''}}" style="color:#ffffff">{{auth()->user()->branch}}</a>
        </span>
    </div>
    </div>
    <div class="col-xl-4 col-lg-4 col-md-4 col-sm-4 col-12">
        
    	<!-- Field wrapper start -->
        <div class="field-wrapper">
            <select name="invoice_product_name" class="select-single js-states" title="Select Product Category" id="ddlViewBy" data-live-search="true">
            <option selected disabled> - Select Item -</option>
            @foreach($products as $product)
                    <option value="{{$product->FinalProductionID}}" 
                    >
                        [{{empty($app->currency) ? "GHS" : $app->currency}}{!!@strtoupper($product->UnitPrice)!!}]  {!!@strtoupper($product->Name)!!} {{$product->barcode}}
                    </option>
            @endforeach
            </select>
            <div class="field-placeholder">Product Name<span class="text-danger">*</span></div>
        </div>
        <!-- Field wrapper end -->
    </div>
    <div class="col-xl-4 col-lg-4 col-md-4 col-sm-4 col-12">
        
        <!-- Field wrapper start -->
        <div class="field-wrapper">
            <div class="input-group">
                <input class="form-control" type="text" value="1" id="quantity" name="invoice_quantity" onKeyUp="calculateTotal()">
                <span class="input-group-text">
                <i class="icon-sentiment_satisfied" aria-hidden="true"></i>
                </span>
            </div>
            <div class="field-placeholder">Quantity<span class="text-danger">*</span></div>
        </div>
        <!-- Field wrapper end -->

    </div>

    <div class="col-xl-4 col-lg-4 col-md-4 col-sm-4 col-12">
        
        <!-- Field wrapper start -->
        <div class="field-wrapper">
            <div class="input-group">
            <select name="status" id="getStatus" class="select-single js-states" title="Select Product Category">
                    <option value="General">General</option>
                    <option value="On The House" id="On The House">On The House</option>
                </select>
            </div>
            <div class="field-placeholder">Order Type</div>
        </div>
        <!-- Field wrapper end -->

    </div>


    
    <div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
        <input type="text" value="" readonly name="category" id="category" hidden>
    </div>
    <div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
        <button class="btn btn-outline-primary" ><i class="icon-shopping-cart1" aria-hidden="true"></i> Add to Cart</button> 
    </div>

    
</div>
<!-- Row end -->
</form>
</div>


<div id="tabler">
@if(empty($checkseesion))
    <!-- Card start -->
    <div class="card">
        <div class="card-body">
            <div class="alert alert-primary alert-dismissible fade show" role="alert">
                    No Item added to cart. Kindly select Item and add to cart {{auth()->user()->sales_person_category == "Counter" ? "or use Barcode" : ""}}
                    <span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>
                    <a href="{{route('printLastTransaction')}}" style="color:#ffffff;">Print Last Transaction</a><span class="visually-hidden">Loading...</span>
                <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
            </div>
            
        </div>
    </div>
    <!-- Card end -->
    @else 
                         
<table class="table m-0" style="background-color:#ffffff">
    <thead>
        <tr>
            <th colspan="7" class="pt-3 pb-3">Invoice Details</th>
        </tr>
        <tr>
        <th width="45%">Product</th>
            <th width="20%">Category</th>
            <th width="50%">Quantity</th>
            <th width="20%">Price</th>
            <th width="20%">Amount (Net)</th>
            <th>Actions</th>
        </tr>
    </thead>
    <tbody>
    @foreach($cartItems as $key => $cart)
    <tr class="trhidden{{$cart['id']}}">
            <td><select class="form-control"><option>{!!@strtoupper($cart['invoice_product_name'])!!}</option></select></td>
           <td><input type="text" value="{{@strtoupper($cart['item_category'])}}" class="form-control" readonly></td>
            <td>
            <div class="input-group">
                    <div class="d-flex mb-4" style="max-width: 300px">
                            <button class="btn btn-light btn-sm" id="{{$cart['id']}}" onclick="decrease(id)">
                            <i class="icon-minus"></i>
                            </button>
        
                            <div class="form-outline">
                            <input min="1" readonly type="number" id="qty{{$cart['id']}}" id="qty{{$cart['id']}}" value="{{$cart['invoice_quantity']}}" name="quantity"  class="form-control" />
                            </div>
        
                            <button class="btn btn-light btn-sm" id="{{$cart['id']}}" onclick="increase(id)">
                            <i class="icon-plus1"></i>
                            </button>
                    </div>
                    <!-- Quantity -->
                </div>
            </td>
            <td>
                <!-- Field wrapper start -->
                <div class="field-wrapper m-0">
                    <input type="text" readonly class="form-control" value="@convert($cart['invoice_unit_price'])" id="ItemPrice{{$cart['id']}}">
                </div>
                <!-- Field wrapper end -->
            </td>
            <td>
                <!-- Field wrapper start -->
                <div class="field-wrapper m-0">
                    <input type="text" id="demo{{$cart['id']}}" readonly class="form-control" value="{{empty($app->currency) ? "GHS" : $app->currency}}@convert($cart['invoice_unit_price'] * $cart['invoice_quantity'])">
                </div>
                <!-- Field wrapper end -->
            </td>
            
            <td>
                <div class="table-actions">
                    <button class="btn btn-outline-light" id="{{$cart['id']}}" onclick="DeleteItem(this.id)">
                    <i class="icon-x-circle"></i>
                    </button>
                </div>
            </td>
        </tr>
        @endforeach
        <tr>
            <td colspan="6">
                <div class="row gutters justify-content-end">
                    <div class="col-auto">
                        <label class="col-form-label">Discount % / {{empty($app->currency) ? "GHS" : $app->currency}} of Total Amount</label>
                    </div>
                    <div class="col-auto" style="max-width: 90px;">
                        <!-- Discount Button trigger modal -->
                        <button type="button" class="btn btn-primary mb-2" data-bs-toggle="modal" data-bs-target="#exampleModalSmall">
                            % Add Discount
                        </button>
                    </div>
                </div>
            </td>
        </tr>
        <tr>
            <td colspan="4">&nbsp;
            
            </td>
            <td colspan="2">
                <p class="m-0">Subtotal</p>
                <p class="m-0">Discount</p>
                <p class="m-0">VAT</p>
                <h5 class="mt-2">Total Amount</h5>
            </td>
            <td>
            <div id="subtotals">
            <p class="m-0">@convert(empty($checkseesion) ? 0 : $totalCart)</p>
                <p class="m-0" id="discounting">
                    @if(empty(session()->get('discount')))
                            {{empty($app->currency) ? "GHS" : $app->currency}}0.00
                    @else
                    @if(session()->get('discount')['type'] == "Cash")
                        {{ empty($app->currency) ? "GHS" : $app->currency}} {{session()->get('discount')['discount']}}
                    @elseif(session()->get('discount')['type'] == "Percentage")
                        {{ session()->get('discount')['discount'] . "%"}}
                    @endif
                    @endif
                </p>
                <p class="m-0">{{empty($app->currency) ? "GHS" : $app->currency}}0.00</p>
                @if(empty(session()->get('discount')))
                <h5 class="mt-2" id="tcost">{{empty($app->currency) ? "GHS" : $app->currency}}@convert(empty($checkseesion) ? 0 : $totalCart)</h5>
                @else
                @if(session()->get('discount')['type'] == "Percentage")
                <h5 class="mt-2" id="tcost">{{empty($app->currency) ? "GHS" : $app->currency}} @convert( $totalCart * ((100 - session()->get('discount')['discount']))/100)</h5>
                @else
                <h5 class="mt-2" id="tcost">{{empty($app->currency) ? "GHS" : $app->currency}} @convert( $totalCart - session()->get('discount')['discount'] )</h5>
                @endif
                @endif
                </div>
            </td>
            
        </tr>
    </tbody>
</table>
@endif



<!-- Row start -->
<div class="row gutters">

<div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
    <div class="form-actions-footer">
        <div class="text-end">
        <button type="button" class="btn btn btn-outline-success stripes-btn ms-1" data-bs-toggle="modal" data-bs-target="#loyalty">
               <i class="icon-percentage"></i>Discount Otp
            </button>
        <button type="button" class="btn btn btn-success stripes-btn ms-1" data-bs-toggle="modal" data-bs-target="#loyalty">
               <i class="icon-gift"></i>Redeem Loyalty [{{empty($app->currency) ? "GHS" : $app->currency}}@convert(empty(session()->get('loyality_point')) ? 0 : session()->get('loyality_point'))]
            </button>
            <!-- Discount Button trigger modal -->
            <button type="button" class="btn btn-outline-success ms-1" data-bs-toggle="modal" data-bs-target="#exampleModalSmallceleb">
               <i class="icon-gift"></i> Gift Cards
            </button>
        
        <a href="#" class="btn btn-outline-secondary stripes-btn" data-bs-toggle="modal" data-bs-target="#staticBackdropTingging"><i class="icon-attach_money"></i>Online Payment</a>

        <a href="#" onclick="confirmCreateNew()" class="btn btn-outline-dark ms-1"><i class="icon-x-circle"></i> Void Invoice</a>  
        @if(session()->get('sales_type') == "CREDIT NOTE")
             <a href="#" class="btn btn-outline-dark ms-1" data-bs-toggle="modal" data-bs-target="#generateRe"> <i class="icon-attach_money"></i> Credit Note</a>
        @else
        @if(auth()->user()->role != "Call Center")
            <a href="#" data-bs-toggle="modal" data-bs-target="#generateRe"  class="btn btn-info ms-1">Generate Receipt</a>
        @else
            <a href="#" onclick="newInvoiceConfirm(this.id)" id="#" class="btn btn-info">Generate Receipt</a>
        @endif
        @endif
        </div>
    </div>
</div>
</div>
</div>

</div>
<!-- Row end -->

<!-- Modal start -->
<div class="modal fade" id="exampleModalSmall" tabindex="-1" aria-labelledby="exampleModalSmallTitle" aria-hidden="true">
    <div class="modal-dialog modal-center">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="exampleModalSmallTitle">APPLY COUPON</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body" id="dis">
            <form id="discountAmount">
                @csrf
                <div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
												
                    <!-- Field wrapper start -->
                    <div class="field-wrapper">
                    <select name="type" class="select-single js-states">
                        <option value="Percentage">PERCENTAGE</option>
                        <option value="Cash">CASH</option>
                    </select>
                        <div class="field-placeholder">Type <span class="text-danger">*</span></div>
                    </div>
                    <!-- Field wrapper end -->

                </div>
                <div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
												
                    <!-- Field wrapper start -->
                    <div class="field-wrapper">
                        <input class="form-control" type="number" step="0.01" name="discount" required>
                        <div class="field-placeholder">Amount or % <span class="text-danger">*</span></div>
                    </div>
                    <!-- Field wrapper end -->

                </div>
                
                <button type="submit" class="btn btn-outline-primary">Apply</button>
            </form>
           
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal" id="cancelCoupon">Cancel</button>
            </div>
        </div>
    </div>
</div>
<!-- Modal end -->



<!-- Modal start -->
<div class="modal fade" id="loyalty" tabindex="-1" aria-labelledby="exampleModalSmallTitle" aria-hidden="true">
    <div class="modal-dialog modal-center">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="exampleModalSmallTitle">REDEEM LOYALITY POINTS</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
            <form id="discountLoyalty">
                @csrf
                <input type="text" name="type" value="Cash" required hidden>
                <input type="text" name="loyal" value="1" hidden>
                <div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
												
                    <!-- Field wrapper start -->
                    <div class="field-wrapper">
                        <input class="form-control" type="number" step="0.0001" max="@convert(empty(session()->get('loyality_point')) ? 0 : session()->get('loyality_point'))" min="0" step="0.001" name="discount" value="@convert(empty(session()->get('loyality_point')) ? 0 : session()->get('loyality_point'))" required>
                        <div class="field-placeholder">Amount <span class="text-danger">*</span></div>
                    </div>
                    <!-- Field wrapper end -->

                </div>
                
                <button type="submit" class="btn btn-outline-primary">Redeem</button>
            </form>
           
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" id="cancelCouponLoyalty" data-bs-dismiss="modal" id="cancelCoupon">Cancel</button>
            </div>
        </div>
    </div>
</div>
<!-- Modal end -->

<!-- Modal start -->
<div class="modal fade" id="exampleModalSmallceleb" tabindex="-1" aria-labelledby="exampleModalSmallTitle" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="exampleModalSmallTitle">COUPON CODE OR GIFT CARD</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body" id="disinf" >
           
            <form id="discountAmountCoupon">
                @csrf
                <input type="text" name="type" value="Percentage" hidden>
                <div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
                <input  type="text" name="submit_celeb" hidden value="Apply Code">

												
                    <!-- Field wrapper start -->
                    <div class="field-wrapper">
                        <input class="form-control" placeholder="Coupon Code Or Scan Gift Card" type="text" autocomplete="off" name="discount_code">
                        <div class="field-placeholder">Coupon code<span class="text-danger">*</span></div>
                    </div>
                    <!-- Field wrapper end -->

                </div>
                <input  type="submit" name="submit_celeb" id="" value="Apply Code" class="btn btn-outline-primary">
            </form>
            
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" id="cancelgift" data-bs-dismiss="modal">Cancel</button>
            </div>
        </div>
    </div>
</div>
<!-- Modal end -->






<!-- Table Modal start -->
<div class="modal fade" id="generateRe" tabindex="-1" aria-labelledby="exampleModalLongTitle" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
        <div class="modal-header">
        @if(session()->get('sales_type') == "CREDIT NOTE")
            <h5 class="modal-title" id="exampleModalLongTitle">Credit Sales</h5>
        @else
            <h5 class="modal-title" id="exampleModalLongTitle">Receive Payment</h5>
        @endif
            <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
        </div>
        <div class="modal-body">
            <form action="{{route('generateInvoicePay')}}" id="paymentDel" method="post">
            @csrf            

                <!-- Row start -->
                <div class="row gutters">

                <div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
                        
                    <!-- Field wrapper start -->
                    <div class="field-wrapper">
                    @if(Route::currentRouteName() == "indexAgency")
                        <select class="select-single js-states" name="payment_mode" title="Select Product Category" data-live-search="true">
                           <option value="{{$agencying}}">{{$agencying}}</option>
                        </select>
                    @else
                        <select class="select-single js-states" name="payment_mode" title="Select Product Category" data-live-search="true">
                        <option value="CASH">CASH</option>
                            <option value="MOBILE MONEY">MOBILE MONEY</option>
                            <option value="CREDIT CARD ">CREDIT CARD</option>
                            <option value="JUMIA">JUMIA</option>
                            <option value="BOLT">BOLT</option>
                            <option value="GLOVO">GLOVO</option>
                        </select>
                    @endif
                        <div class="field-placeholder">Payment mode<span class="text-danger">*</span></div>
                    </div>
                    <!-- Field wrapper end -->
                    </div>

                    <!-- <div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12"> -->
                        <!-- Field wrapper start -->
                        <!-- <div class="field-wrapper">
                    
                            <select class="select-single js-states" name="order_type" title="Select Product Category" data-live-search="true">
                                <option value="DINE IN">DINE IN</option>
                                <option value="PICK UP">PICK UP</option>
                                <option value="DELIVERY">DELIVERY</option>
                            </select>
                        
                            <div class="field-placeholder">Order Type<span class="text-danger">*</span></div>
                        </div> -->
                        <!-- Field wrapper end -->
                    <!-- </div> -->

                    <div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12" style="display:none">