@extends('layouts.master')

@section('page_title', 'Add Purchase Order')
@section('title', 'Add Purchase Order')
@section('main_item', 'Purchase')
@section('sub_item', 'Add Purchase Order')

@section('content')
<div class="col-12">
    <div class="card">
        <div class="card-body">
            <h4 class="header-title mt-0">Add Purchases</h4>
            <div class="row">
                <div class="col-md-3" @if ($setting->business_location != '1') style="display: none" @endif>
                    <div class="form-group">
                        <label class="required" style="font-weight: bold" for="activate_code">business
                            Location</label>
                        <select class="form-control select2" id="location_id" name="location_id">
                            @if (Auth::user()->role_id == '1')
                                @foreach ($users_access_location as $business_location)
                                    @if ($business_location->is_active == '1')
                                        <option value="{{ $business_location->id }}">
                                            {{ $business_location->name }}
                                        </option>
                                    @else
                                    @endif
                                @endforeach
                            @else
                                @foreach ($users_access_location as $business_location)
                                    @if ($business_location->is_active == '1')
                                        <option value="{{ $business_location->business_location_id }}">
                                            {{ $business_location->name }}
                                        </option>
                                    @else
                                    @endif
                                @endforeach
                            @endif
                        </select>
                    </div>
                </div>
                <div class="col-md-3">
                    <div class="form-group">
                        <label style="font-weight: bold" style="font-weight: bold" for="supplier">Supplier</label>
                        <div class="input-group">
                            <select class="custom-select" id="supplier" name="suppliers_id" required>
                                <option value="">Select Supplier</option>
                                    @foreach ($suppliers as $supplier)
                                        <option value="{{ $supplier->id }}">{{ $supplier->business_name }} | {{ $supplier->name }}</option>
                                    @endforeach
                            </select>
                        </div>
                        <a id="add-supplier" href="javascript:void(0)" class="btn btn-outline-light"
                            style="background:#ed4b00; color: white;" type="button" data-toggle="modal"
                            data-target=".bd-example-modal-lg">Add Supplier</a>
                    </div>
                </div>
                <div class="col-md-3">
                    <div class="form-group">
                        <label style="font-weight: bold" style="font-weight: bold" for="ref_number">Purchase Order
                            No</label>
                        <input type="text" class="form-control" id="ref_number" name="" required="">
                    </div>
                </div>
                <div class="col-md-3">
                    <div class="form-group">
                        <label style="font-weight: bold" style="font-weight: bold" for="date-format">Purchase
                            Date</label>
                        <input type="text" class="form-control mdate" placeholder="" id="mdate" name=""
                            required>
                    </div>
                </div>

                <div class="col-md-3">
                    <div class="form-group">
                        <label class="required" style="font-weight: bold" for="activate_code">Status
                            </label>
                        <select class="form-control select2" id="purchase_order_status" name="purchase_order_status" required>

                           <option value="draft">Draft</option>
                           <option value="final">Final</option>
    
                        </select>
                    </div>
                </div>

                {{-- <div class="col-md-3">
                    <div class="form-group">
                        <label style="font-weight: bold" style="font-weight: bold" for="sms_notify">Mobile number for sms Notifification
                            No</label>
                        <input type="text" class="form-control" id="sms_notify" name="" value="0770168097">
                    </div>
                </div> --}}
            </div>
        </div>
        <!--end card-body-->
    </div>
    <!--end card-->
</div>


</div>
<div class="col-12">
    <div class="card">
        <div class="card-body">
            <div class="row justify-content-center">
                <div class="col-md-6 ">
                    <div class="form-group">
                        <div class="input-group">
                            <select class="custom-select select2" id="grn-product-list">
                                <option selected="">Choose Product</option>
                                @foreach ($add_products as $product)
                                    <option id="{{ $product->id }}" value="{{ $product->id }}">
                                        {{ $product->sku }}|{{ $product->product_name }} |@if (!empty($product->attribute_value))
                                            ({{ $product->attribute_value }})
                                        @else
                                            (single)
                                        @endif
                                    </option>
                                @endforeach
                            </select>
                        </div>
                        <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#addProductModal">
                            Add Product
                        </button>
                    </div>
                </div>
            </div>
            <form action="{{ route('purchase.store') }}" method="POST" id="grn-create">
                @csrf
                <div class="table-responsive dash-social" style="height: 300px;" style="overflow: scroll;">
                    <table id="datatable_purch" class="table table-striped">
                        <thead class="thead-dark">
                            <tr>
                                <th>Product Name</th>
                                <th>Purchase Quantity</th>
                                <th>Purchase Price</th>
                                <th>Selling Price</th>
                                <th>Line Total</th>
                                <th>Action</th>
                            </tr>
                            <!--end tr-->
                        </thead>
                        <tbody id="t-body">
                        </tbody>
                    </table>
                </div>
        </div>
        <div hidden>
            <input type="text" class="form-control" placeholder="Reference Number" id="ref_number_copy"
                name="ref_no" readonly>
            <input type="text" class="form-control" placeholder="" id="mdate_copy" name="grn_date" required readonly>
            <input type="text" class="form-control" placeholder="" id="supplier_copy" name="contact_id" required
                readonly>

            <select class="form-control select2" id="copy_business_location_id" name="location_id">
                @foreach ($business_locations as $business_location)
                    @if ($business_location->is_active == '1')
                        <option value="{{ $business_location->id }}">{{ $business_location->name }}
                        </option>
                    @else
                    @endif
                @endforeach
            </select>

            <input type="text" class="form-control" placeholder="" id="sms_notify_copy"
            name="sms_notify" readonly>
        </div>
    </div>
</div>
<div class="col-12">
    <div class="card">
        <div class="card-body">
            <h4 class="header-title mt-0">Total Cost</h4>
            <div class="row">
                <div class="col-md">
                    <div class="form-group">
                        <label style="font-weight: bold" style="font-weight: bold" for="sub_total">Sub Total</label>
                        <input type="text" class="form-control" placeholder="" id="sub_total" name="grn_total"
                            required="" readonly>
                    </div>
                </div>
                <div class="col-md">
                    <div class="form-group">
                        <label style="font-weight: bold" for="discount_type">Discount Type</label>
                        <select class="form-control " id="discount_type" name="discount_type" required>
                            <option value="fixed" selected>Fixed</option>
                            <option value="precentage">Precentage</option>
                        </select>
                    </div>
                </div>
                <div class="col-md">
                    <div class="form-group">
                        <label style="font-weight: bold" style="font-weight: bold" for="discount">Discount</label>
                        <input type="number" class="form-control" placeholder="" id="discount"
                            name="grn_discount" required="">
                    </div>
                </div>
                <div class="col-md">
                    <div class="form-group">
                        <label style="font-weight: bold" style="font-weight: bold" for="net_total">Net Total</label>
                        <input type="text" class="form-control" style="font-weight: bold" placeholder=""
                            id="net_total" name="grn_nettotal" required readonly>
                    </div>
                </div>
            </div>
            
             <div hidden class="col-md-3">
                <div class="form-group">
                    <label class="required" style="font-weight: bold" for="activate_code">Status
                        </label>
                    <select class="form-control select2" id="purchase_order_status_copy" name="purchase_order_status" required readonly>
                        <option value="draft">Draft</option>
                        <option value="final">Final</option>

                    </select>
                </div>
            </div> 

        </div>
    </div>
</div>
<div class="col-12">
    <div class="card">
        <div class="card-body">
            <h4 class="header-title mt-0">Add Payment</h4>
            <div class="row">
                <div class="col-md-3">
                    <div class="form-group">
                        <label style="font-weight: bold">Payment Ref No</label>
                        <input type="text" class="form-control" id="payment_ref_no" name="payment_ref_no">
                    </div>
                </div>
                <div class="col-md-3">
                    <div class="form-group">
                        <label style="font-weight: bold">Paid Amount</label>
                        <input type="text" class="form-control" id="paid_amount" name="paid_amount">
                    </div>
                </div>
                <div class="col-md-3">
                    <div class="form-group">
                        <label style="font-weight: bold">Payment Method</label>
                        <select class="form-control select2" name="payment_method" id="payment_method">
                            <option value="cash">Cash</option>
                            <option value="card">Card</option>
                            <option value="cheque">Cheque</option>
                            <option value="other">Other</option>
                        </select>
                    </div>
                </div>
                <div class="col-md-3">
                    <div class="form-group">
                        <label style="font-weight: bold">Payment Account</label>
                        <select id="account_id" class="select2 form-control mb-3 custom-select" name="account_id"
                            style="width: 100%; height:36px;">
                            <option value="">Select</option>
                            @foreach ($accounts as $account)
                                <option value="{{ $account->id }}" selected>{{ $account->account_name }}</option>
                            @endforeach
                        </select>
                    </div>
                </div>
                <div class="col-md-12">
                    <div class="form-group">
                        <label style="font-weight: bold">Payment Note</label>
                        <textarea type="text" class="form-control" id="payment_note" name="payment_note"></textarea>
                    </div>
                </div>
            </div>
            <input type="hidden" name="sale_date" id="sale_date" value="">
            <div class="row">
                <div class="col-sm-12 text-right">
                    <button id="save-btn" type="submit" class="btn btn-primary px-5 py-2">Save</button>
                </div>
                </form>
            </div>
        </div>
    </div>
</div>



 {{-- Model Sart here --}}
 <div class="modal fade bd-example-modal-lg" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel"
 aria-hidden="true">
 <div class="modal-dialog modal-lg">
     <div class="modal-content">
         <div class="col-md-12">
             <div class="card">
                <form id="supplier_form">                
                 <div class="card-body">
                     <h4 class="mt-0 header-title">Add Supplier</h4>
                     <p class="text-muted mb-3"></p>
                     <input type="text" class="form-control" placeholder="type" id="type" name="type"
                         value="customer" readonly hidden>
                     <div class="row">
                         <div class="col-md-4">
                             <div class="form-group">
                                 <label style="font-weight: bold" for="name">Name</label>
                                 <input type="text" class="form-control" placeholder="Name" id="name"
                                     name="name" required="">
                             </div>
                         </div>
                         <div class="col-md-4">
                             <div class="form-group">
                                 <label style="font-weight: bold" for="businesss_name">Business Name</label>
                                 <input type="text" class="form-control" placeholder="Business Name"
                                     id="business_name" name="business_name">
                             </div>
                         </div>
                         <div class="col-md-4">
                             <div class="form-group">
                                 <label style="font-weight: bold" for="primary_mobile">Primary Mobile</label>
                                 <input type="tel" class="form-control @error('mobile') is-invalid @enderror"
                                     placeholder="Primary Mobile" id="mobile" name="mobile"
                                     data-parsley-type="digits" pattern="0[0-9]{9}" minlength="10" maxlength="10" required title="Phone number must be exactly 10 digits and start with 0">
                                 @error('mobile')
                                     <div class="alert alert-danger alert-dismissible fade show" role="alert">
                                         {{ $message }}
                                         <button type="button" class="close" data-dismiss="alert"
                                             aria-label="Close">
                                             <span aria-hidden="true">&times;</span>
                                         </button>
                                     </div>
                                 @enderror
                             </div>
                         </div>
                         <div class="col-md-4">
                             <div class="form-group">
                                 <label style="font-weight: bold" for="secondary_mobile">Secondary Mobile</label>
                                 <input type="tel" class="form-control @error('mobile') is-invalid @enderror"
                                     placeholder="Secondary Mobile" id="secondary_mobile" name="mobile_2"
                                     data-parsley-type="digits" pattern="0[0-9]{9}" minlength="10" maxlength="10" title="Phone number must be exactly 10 digits and start with 0">
                                 @error('mobile_2')
                                     <div class="alert alert-danger alert-dismissible fade show" role="alert">
                                         {{ $message }}
                                         <button type="button" class="close" data-dismiss="alert"
                                             aria-label="Close">
                                             <span aria-hidden="true">&times;</span>
                                         </button>
                                     </div>
                                 @enderror
                             </div>
                         </div>
                         <div class="col-md-4">
                             <div class="form-group">
                                 <label style="font-weight: bold" for="landline">Landline</label>
                                 <input type="text" class="form-control @error('mobile') is-invalid @enderror"
                                     placeholder="Landline" id="landline" name="landline"
                                     data-parsley-type="digits">
                                 @error('landline')
                                     <div class="alert alert-danger alert-dismissible fade show" role="alert">
                                         {{ $message }}
                                         <button type="button" class="close" data-dismiss="alert"
                                             aria-label="Close">
                                             <span aria-hidden="true">&times;</span>
                                         </button>
                                     </div>
                                 @enderror
                             </div>
                         </div>
                         <div class="col-md-4">
                             <div class="form-group">
                                 <label style="font-weight: bold" for="landmark">Landmark</label>
                                 <input type="text" class="form-control" placeholder="Landmark" id="landmark"
                                     name="landmark" required="">
                             </div>
                         </div>
                         <div class="col-md-4">
                             <div class="form-group">
                                 <label style="font-weight: bold" for="city">City</label>
                                 <select class="form-control" id="city" name="city" required>
                                    <option value="">Select</option>
                                    @foreach ($cities as $city)
                                        <option value="{{ $city->id }}">{{ $city->name_en }}</option>
                                    @endforeach
                                 </select>
                             </div>
                         </div>
                         <div class="col-md-4">
                             <div class="form-group">
                                 <label style="font-weight: bold" for="province">District</label>
                                 <select class="form-control" id="province" name="district_id" required>
                                     <option value="">Select</option>
                                     @foreach ($districts as $district)
                                         <option value="{{ $district->id }}">{{ $district->name_en }}</option>
                                     @endforeach
                                 </select>
                                <span class="text-danger" id="district-error" style="display:none;"></span>
                         </div>
                     </div>
                     <div class="row">
                         <div class="col-sm-12 text-right">
                             <button class="btn btn-primary px-5 py-2" id="supplier_save">Save</button>
                         </div>
                     </div>
                 </div>
                </form>
                 <!--end card-body-->
             </div>
         </div>
     </div>
 </div>
</div>

{{-- add product modal --}}
<!-- Modal -->
<div class="modal fade" id="addProductModal" tabindex="-1" role="dialog" aria-labelledby="addProductModalLabel"
    aria-hidden="true">
    <div class="modal-dialog modal-lg" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="addProductModalLabel">Add Product</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <!-- Move your existing form here -->
                <form id="product-create-form" class="form-parsley" method="POST" action="{{ route('products.store') }}"
                    enctype="multipart/form-data">
                    @csrf
                    <input type="hidden" name="type" value="open" readonly>
                    <div class="row">
                        <div class="col-md-4">
                            <div class="form-group">
                                <label style="font-weight: bold" for="product_name">Product Name</label>
                                <input type="text" class="form-control required_text" placeholder="Product Name"
                                    id="product_name" name="product_name" required="">
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="form-group">
                                <label style="font-weight: bold" for="category">Category</label>
                                <select class="form-control required_combo" id="category" name="category_id" required>
                                    <option value="">Select</option>
                                    @foreach ($categories as $category)
                                        <option value="{{ $category->id }}">{{ $category->category_name }}</option>
                                    @endforeach
                                </select>
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="form-group">
                                <label style="font-weight: bold" for="sub_category_id">Sub Category</label>
                                <select class="form-control select2" id="sub_category_id" name="sub_category_id[]"
                                    multiple="multiple">
                                </select>
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="form-group">
                                <label style="font-weight: bold" for="unit">Unit</label>
                                <select class="form-control required_combo" id="unit" name="unit_id" required>
                                    <option value="">Select</option>
                                    @foreach ($units as $unit)
                                        <option value="{{ $unit->id }}">
                                            {{ $unit->actual_name . ' (' . $unit->short_name . ')' }}</option>
                                    @endforeach
                                </select>
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="form-group">
                                <label style="font-weight: bold" for="sku">SKU</label>
                                <input type="text" class="form-control" placeholder="SKU" id="sku" name="sku">
                            </div>
                        </div>
                        <div class="col-md-2 mt-2">
                            <div class="custom-control custom-checkbox">
                                <input type="checkbox" class="custom-control-input" id="allow_woocommerce_sync"
                                    data-parsley-multiple="groups" data-parsley-mincheck="1" name="allow_woocommerce_sync">
                                <label class="custom-control-label" for="allow_woocommerce_sync">Allow Woocomerce
                                    Sync</label>
                            </div>
                        </div>
                        <div class="col-md-2 mt-2">
                            <div class="custom-control custom-checkbox">
                                <input type="checkbox" class="custom-control-input" id="product_visible_sync"
                                    data-parsley-multiple="groups" data-parsley-mincheck="1" name="product_visible_sync">
                                <label class="custom-control-label" for="product_visible_sync">Woocomerce Product InVisible
                                    Sync
                                </label>
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="form-group">
                                <label style="font-weight: bold" for="reorder_level">Re-order Level</label>
                                <input type="number" step="1" class="form-control required_text"
                                    placeholder="Re-order Level" id="reorder_level" name="reorder_level" required=""
                                    data-parsley-type="integer">
                            </div>
                        </div>
                        <div class="col-md-4" hidden>
                            <div class="form-group">
                                <label style="font-weight: bold" for="variation">Is Combo</label>
                                <select class="form-control" id="is_combo" name="is_combo">
                                    <option value="no">No</option>
                                    <option value="yes">Yes</option>
                                </select>
                            </div>
                        </div>
                        <div class="col-md-4" id="product_type">
                            <div class="form-group">
                                <label style="font-weight: bold" for="variation">Product Type</label>
                                <select class="form-control" id="variation" name="variation">
                                    <option value="">Select</option>
                                    <option value="single">Single</option>
                                    <option value="variable">Variable</option>
                                </select>
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="form-group">
                                <label class="required" style="font-weight: bold" for="activate_code">business
                                    Location</label>
                                <select class="form-control select2" id="location_id" name="location_id[]"
                                    multiple="multiple" required>
                                    @if (Auth::user()->role_id == '1')
                                        @foreach ($users_access_location as $business_location)
                                            @if ($business_location->is_active == '1')
                                                <option value="{{ $business_location->id }}">
                                                    {{ $business_location->name }}
                                                </option>
                                            @else
                                            @endif
                                        @endforeach
                                    @else
                                        @foreach ($users_access_location as $business_location)
                                            @if ($business_location->is_active == '1')
                                                <option value="{{ $business_location->business_location_id }}">
                                                    {{ $business_location->name }}
                                                </option>
                                            @else
                                            @endif
                                        @endforeach
                                    @endif

                                </select>
                            </div>
                        </div>
                        <div class="col-md-4" id="attri" hidden>
                            <div class="form-group">
                                <label style="font-weight: bold">Variation Type</label>
                                <select class="form-control" id="attribute" name="attribute_id">
                                    <option value="">Select</option>
                                    @foreach ($attributes as $att)
                                        <option value="{{ $att->id }}">{{ $att->attribute_name }}</option>
                                    @endforeach
                                </select>
                            </div>
                        </div>
                        <div class="col-md-12" id="attr" hidden>
                            <div class="table-responsive">
                                <table id="attribute-table" class="table table-bordered mb-0 table-centered">
                                    <thead class="thead-dark">
                                        <tr>
                                            <th>Variation</th>
                                            <th>Variation Value</th>
                                            <th>Quantity</th>
                                            <th>Unit Price</th>
                                            <th>Selling Price</th>
                                            <th>Second Price</th>
                                            <th>Action</th>
                                        </tr>
                                    </thead>
                                    <tbody id="attribute-value-tbody"></tbody>
                                </table>
                                <!--end /table-->
                            </div>
                            <!--end /tableresponsive-->
                        </div>
                        <div class="col-md-4 mt-3">
                            <div class="form-group">
                                <label style="font-weight: bold">Product Image</label>
                                <input class="form-control dropify" type="file" name="image" id="image"
                                    accept="image/*">
                            </div>
                        </div>
                        <div class="col-md-12">
                            <div class="form-group" style="position: relative;">
                                <label style="font-weight: bold" for="message">Description</label>
                                <textarea class="form-control" rows="5" id="message" name="descrption"></textarea>
                            </div>
                        </div>
                        <div class="col-md-4" id="single-unit-cost">
                            <div class="form-group">
                                <label style="font-weight: bold" for="unit_cost">Unit Cost</label>
                                <input type="number" class="form-control required_text" placeholder="Unit Cost"
                                    id="unit_cost" name="unit_cost" required="" data-parsley-type="integer"
                                    step="0.01">
                            </div>
                        </div>
                        <div class="col-md-4" id="single-selling-price">
                            <div class="form-group">
                                <label style="font-weight: bold" for="unit_price">Selling Price</label>
                                <input type="number" step="0.01" class="form-control required_text"
                                    placeholder="Selling Price" id="unit_price" name="unit_price" required="">
                            </div>
                        </div>
                        <div class="col-md-4" id="single-second-price">
                            <div class="form-group">
                                <label style="font-weight: bold" for="second_price">Second Price</label>
                                <input type="number" step="0.01" class="form-control" placeholder="Second Price"
                                    id="second_price" name="second_price">
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="form-group">
                                <label style="font-weight: bold">Warranty Period Type</label>
                                <select class="form-control" id="warranty_select" name="warranty_select">
                                    <option value="">Select</option>
                                    <option value="month">Month</option>
                                    <option value="year">Year</option>
                                    <option value="day">Day</option>
                                </select>
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="form-group">
                                <label style="font-weight: bold">Warranty Period</label>
                                <input type="number" step="0.01" class="form-control" placeholder="Warranty Period"
                                    id="warranty_period" name="warranty_period">
                            </div>
                        </div>
                    </div>
                    <div id="combo_section">
                        <div class="row justify-content-center">
                            <div class="col-md-6 ">
                                <div class="form-group">
                                    <div class="input-group">
                                        <select class="form-control select2 " multiple="multiple" name="products[]"
                                            id="product-list" data-placeholder="Select">
                                            <option label="Select product"></option>
                                            @foreach ($products as $product)
                                                <option value="{{ $product->id }}">{{ $product->product_name }}</option>
                                            @endforeach
                                        </select>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="table-responsive dash-social">
                            <table id="datatable" class="table table-striped">
                                <thead class="thead-dark">
                                    <tr>
                                        <th>Product </th>
                                        <th>Qty</th>
                                    </tr>
                                    <!--end tr-->
                                </thead>
                                <tbody id="t-body">
                                </tbody>
                            </table>
                        </div>
                    </div>
                   
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                <button id="prod-save-btn" type="button" class="btn btn-primary px-5 py-2">Save</button>
            </div>
        </div>
    </div>
</div>

@endsection

@section('scripts')
<script>
       $(document).ready(function() {
            $('#supplier').select2();
            // $('#purchase_order_status').select2();
            $("#account_id").select2();
            $('#mdate').val(moment(new Date()).format("YYYY-MM-DD"));
            $('#mdate_copy').val(moment(new Date()).format("YYYY-MM-DD"));
        })
        $(document).on('change', '#grn-product-list', function() {
            var selected = $('#grn-product-list').find(':selected').val();
            var rowCount = $('#datatable_purch tbody tr').length;
            axios.get('{{ url('/grns/product/add/') }}/' + selected + '/' + rowCount)
                .then(function(response) {
                    $(response.data).appendTo($("#datatable_purch tbody"));
                    calculate()
                })
                .catch(function(error) {
                    console.log(error);
                })
        })
        $(document).on('change', '#ref_number, #supplier, #mdate, #location_id,#purchase_order_status,#sms_notify', function() {
            $("#ref_number_copy").val($("#ref_number").val());
            $("#mdate_copy").val($("#mdate").val());
            $("#supplier_copy").val($("#supplier").find(':selected').val());
            $("#copy_business_location_id").val($("#location_id").find(':selected').val());
            $("#purchase_order_status_copy").val($("#purchase_order_status").find(':selected').val());
            $("#sms_notify_copy").val($("#sms_notify").val());
        })
        

        $(document).on('change', '.qty, .s_price, .p_price', function() {
            let qty = $(this).closest("tr").find(".qty").val();
            let p_price = $(this).closest("tr").find(".p_price").val();
            let line_total = parseFloat(qty) * parseFloat(p_price);
            line_total = line_total.toFixed(2);
            $(this).closest("tr").find(".line_total").html(line_total);
            $(this).closest("tr").find(".line_total_price").val(line_total);
            calculate();
        })

        function calculate() {
            let total = 0.00;
            $('#datatable_purch tbody tr').each(function() {
                total += parseFloat($(this).find(".line_total_price").val());
            });
            $('#sub_total').val(total.toFixed(2))
            // alert('Sub Total: $' + total.toFixed(2));
            $('#net_total').val(total.toFixed(2))
            // $('#paid_amount').val(total.toFixed(2))
            $('#discount').val('0.00')
        }
        $(document).on('click', '.remove_row', function() {
            $(this).closest("tr").remove();
            calculate();
        })

     // quick add supplier
    $(document).on('click', '#supplier_save', function(event) {
            event.preventDefault();
            let form = $("#supplier_form")[0];

            if (!form.checkValidity()) {
                form.reportValidity();
                return;
            }
            let name = $('#name').val();
            let business_name = $('#business_name').val();
            let mobile = $('#mobile').val();
            let secondary_mobile = $('#secondary_mobile').val();
            let landline = $('#landline').val();
            let landmark = $('#landmark').val();
            let city = $('#city').val();
            let district_id = $('#province').val();

            $.ajax({
                method: 'POST',
                url: "{{ route('grn.supplier') }} ",
                data: {
                    "_token": "{{ csrf_token() }}",
                    'name': name,
                    'business_name': business_name,
                    'mobile': mobile,
                    'secondary_mobile': secondary_mobile,
                    'landline': landline,
                    'landmark': landmark,
                    'city': city,
                    'district_id': district_id,
                },
                success: function(response) {
                    if (response.success) {
                        $.toast({
                            heading: 'Success',
                            text: response.message,
                            position: 'top-right',
                            bgColor: '#1ecab8',
                            icon: 'success',
                            showHideTransition: 'fade',
                            loaderBg: '#ecf0f1'
                        });

                        $('#supplier').empty().html(response.html);
                        $("#supplier_copy").val($("#supplier").find(':selected').val());

                        $('#supplier_form')[0].reset();
                        $('.modal').modal('hide');
                    }
                },
            })
        })

        $(document).on('change', '#discount', function() {
            let discount_type = $("#discount_type").val();
            let sub_total = $('#sub_total').val();
            let discount = $("#discount").val();
            if (discount_type == 'fixed') {
                let sub = sub_total - discount;
                $("#net_total").val(sub);
                // $("#paid_amount").val(sub);
            } else {
                let precentage = sub_total * discount / 100;
                let sub = sub_total - precentage;
                $("#net_total").val(sub);
                // $("#paid_amount").val(sub);
            }
        });
        $(document).on('change', '#discount_type', function() {
            let sub_total = $('#sub_total').val();
            $("#discount").val('');
            $("#net_total").val(sub_total);
        });
        $("input[name='paid_amount']").change(function() {
            let paid_amount = $('#paid_amount').val();
            let net_total = $('#net_total').val();
            if (Math.round(paid_amount) > net_total) {
                Swal.fire(
                    'Warning',
                    'Paid Amount is greater than Net Total',
                    'warning'
                )
                $('#paid_amount').val('');
            }
        });
        $(document).on('click', '#save-btn', function(e) {
            e.preventDefault();
            let supplier_id = $('#supplier_copy').val();
            let item_count = $('#t-body tr').length;
            let purchase_order_status = $('#purchase_order_status_copy').val();

            if (item_count == 0) {
                $.toast({
                    heading: 'Error',
                    text: "No products in the table.!",
                    position: 'top-right',
                    bgColor: '#f1646c',
                    icon: 'error',
                    showHideTransition: 'fade',
                    loaderBg: '#ecf0f1'
                })
                return;
            }
            if (supplier_id == '') {
                $.toast({
                    heading: 'Error',
                    text: "Supplier is required.!",
                    position: 'top-right',
                    bgColor: '#f1646c',
                    icon: 'error',
                    showHideTransition: 'fade',
                    loaderBg: '#ecf0f1'
                });
                return;
            } 
            
            if (purchase_order_status == '') {
                $.toast({
                    heading: 'Error',
                    text: "Status is required.!",
                    position: 'top-right',
                    bgColor: '#f1646c',
                    icon: 'error',
                    showHideTransition: 'fade',
                    loaderBg: '#ecf0f1'
                })
            } 
            
            else {
                $('#grn-create').submit();
            }
        })
        $(document).on('change', '#business_location_id', function() {
            $('#business_location_id').val($(this).val());
            getProductsRelated($(this).val());
        });

        function getProductsRelated(business_location_id) {
            $.ajax({
                method: 'GET',
                url: "{{ route('grn.location') }}",
                data: {
                    business_location_id: business_location_id,
                },
                success: function(options) {
                    $('#grn-product-list').empty().html(options)
                }
            });
        }
        $(document).ready(function() {
            let clicks = 0;
            $('#save-btn').click(function() {
                clicks++;
                if (clicks === 2) {
                    $(this).prop('disabled', true);
                }
            });
        });
</script>

<script>
    $(document).ready(function() {
        $('#combo_section').hide();
    })

    $('#sku').change(function() {
        let input = $('#sku').val();
        let url = "{{ route('products.validate-sku') }}";
        $.ajax({
            method: 'POST',
            url: url,
            data: {
                "_token": "{{ csrf_token() }}",
                sku: input
            },
            success: function(response) {

                if (response.is_have == 'yes') {
                    $('#sku').val('');
                    Swal.fire(
                        'Error',
                        'This SKU already used',
                        'warning'
                    )
                }
            }
        })
    });

    $(document).on('change', '#is_combo', function() {
        let variation = $(this).val();
        if (variation == 'yes') {
            $('#combo_section').show();
            $('#product_type').hide();
            $('#attr').prop('hidden', false);
            $('#attri').prop('hidden', false);
        } else {
            $('#combo_section').hide();
            $('#product_type').show();
            $('#attr').prop('hidden', true);
            $('#attri').prop('hidden', true);
        }
    });
    $(document).on('change', '#variation', function() {
        let variation = $(this).val();
        $('#variation').val(variation);
        if (variation == 'single') {
            $('#attr').prop('hidden', true);
            $('#attri').prop('hidden', true);
            $('#single-unit-cost').prop('hidden', false);
            $('#single-selling-price').prop('hidden', false);
            $('#single-second-price').prop('hidden', false);
            $('#unit_cost').prop('required', true);
            $('#unit_price').prop('required', true);
        } else {
            $('#attr').prop('hidden', false);
            $('#attri').prop('hidden', false);
            $('#single-unit-cost').prop('hidden', true);
            $('#single-selling-price').prop('hidden', true);
            $('#single-second-price').prop('hidden', true);
            $('#unit_cost').prop('required', false);
            $('#unit_price').prop('required', false);
        }
    });
    $(document).on('change', '#attribute', function() {
        let id = $(this).val();
        if (id == '') {
            $('#attribute-value-tbody').empty();
            return false;
        }
        let url = "{{ route('products.get_attribute_values', ':id') }}";
        url = url.replace(':id', id);
        $.ajax({
            method: 'GET',
            url: url,
            success: function(result) {
                $('#attribute-value-tbody').empty().html(result);
            },
        });
    });
    $(document).on('click', '#remove-value', function() {
        this.closest('tr').remove();
    })
    $(document).on('click', "#attribute-value-tbody input[type='number']", function() {
        $(this).select();
    });


    $(document).on('click', '#prod-save-btn', function(e) {
        e.preventDefault();
        let product_type = $('#variation').val();
        if (product_type != '' && product_type == 'variable') {
            let row_count = $('#attribute-table tbody tr').length;
            if (row_count == 0) {
                $.toast({
                    heading: 'Error',
                    text: "No Variations in table.!",
                    position: 'top-right',
                    bgColor: '#f1646c',
                    icon: 'error',
                    showHideTransition: 'fade',
                    loaderBg: '#ecf0f1'
                });
                return false;
            }

        }
        let item_flag = false;
        $('#attribute-table tbody tr').each(function() {
            let qty = $(this).find('td #qty').val();
            let unit_cost = $(this).find('td #unit_cost').val();
            let unit_price = $(this).find('td #unit_price').val();
            if (parseFloat(unit_cost) == 0 || parseFloat(unit_price) == 0) {
                item_flag = true;
            }
        });
        if (item_flag && product_type == 'variable') {
            $.toast({
                heading: 'Error',
                text: "Please add values to variations, cannot be empty or 0 values.!",
                position: 'top-right',
                bgColor: '#f1646c',
                icon: 'error',
                showHideTransition: 'fade',
                loaderBg: '#ecf0f1'
            });
            return false;
        }
        //disable save button when form is not error
        var textValid = true;
        var comboValid = true;

        $('.required_text').each(function() {
            if ($(this).val() === '') {
                textValid = false;
                return; // skip remaining checks
            }
        });

        $('.required_combo').each(function() {
            if ($(this).val() === '') {
                comboValid = false;
                return; // skip remaining checks
            }
        });

        if (textValid == true && comboValid == true) {
            // $(this).prop("disabled", true);
        }
        $('#product-create-form').submit();
    });


    $('#product-list').on('change', function() {
        let id = $('#product-list').val();
        // let ref_no = $('#ref_no').val();
        $.ajax({
            method: 'POST',
            url: "{{ url('/product/combo/add') }}",
            data: {
                "_token": "{{ csrf_token() }}",
                'id': id,
                // 'ref_no':ref_no,

            },
            success: function(response) {
                $('#datatable tbody').empty().html(response);
            }
        })
    });

    $(document).on('change', '#category', function() {
        let id = $(this).val();
        if (id !== '') {
            let url = "{{ route('categories.get_sub_categories', ':id') }}";
            url = url.replace(':id', id);
            $.ajax({
                method: 'GET',
                url: url,
                success: function(response) {
                    $('#sub_category_id').empty().html(response);
                },
                error: function(response) {
                    $('#sub_category_id').empty();
                }
            });
        } else {
            $('#sub_category_id').empty();
        }
    });

    $(document).ready(function() {
        var urlParams = new URLSearchParams(window.location.search);
        var productId = urlParams.get('product_id');
        var qty = urlParams.get('qty');
        var supplier = urlParams.get('supplier');
        var location = urlParams.get('location');
        var sale_date = urlParams.get('sale_date');

        $("#sale_date").val(sale_date);

        if (productId) {
            $('#grn-product-list').val(productId).trigger('change');
        }

        if (supplier) {
            $('#supplier').val(supplier).trigger('change');
        }

        if (location) {
            $('#location_id').val(location).trigger('change');
        }

            const QtyInterval = setInterval(function () {
                const qtyField = $('#datatable_purch .qty');
                if (qtyField.length > 0 && qty) {
                    qtyField.val(qty);
                    qtyField.trigger('change');
                    clearInterval(QtyInterval);
                }
            }, 100); 

        getProductsRelated($('#location_id').val());
        getAccountsRelated($('#location_id').val());
    });

        $(document).on('change', '#location_id', function() {
            getProductsRelated($(this).val());
            getAccountsRelated($(this).val());
            $('#datatable_purch tbody').empty();
        });

        function getProductsRelated(business_location_id) {
            $.ajax({
                method: 'GET',
                url: "{{ route('grn.location') }}",
                data: {
                    business_location_id: business_location_id,
                },
                success: function(options) {
                    $('#grn-product-list').empty().html(options)
                }
            });
        }

        function getAccountsRelated(business_location_id) {
            $.ajax({
                method: 'GET',
                url: "{{ route('payment-accounts.location') }}",
                data: {
                    business_location_id: business_location_id,
                },
                success: function(options) {
                    $('#account_id').empty().html(options)
                },
                error: function(xhr, status, error) {
                    console.error('AJAX error:', status, error);
                }
            });
        }

        //onchange city district should be fetched
    $(document).on('change', '#city', function() {
        let city_id = $(this).val();
        console.log(city_id);
        let url = "{{ route('get-district') }}";
        $.ajax({
            method: 'POST',
            url: url,
            data: {
                _token: "{{ csrf_token() }}",
                city_id: city_id,
            },
            success: function(response) {
                $('#province').val(response).change();
            },
        });
    });

</script>
@endsection