@extends("newDashboard.index")

@section("css")
    <link rel="stylesheet" href="{{asset('metronic/css/data-table.css')}}">
@endsection


@section("main-content")
    <style>
        /* Spinner styles */
        .spinner {

            width: 5em;
            height: 5em;
            border: 0.5em solid rgba(0, 0, 0, 0.1);
            border-left-color: #8daf21;
            border-radius: 50%;
            animation: spin 1s linear infinite;
            z-index: 99999;
            /*   margin-left:260px; */  
        }

        .spinner-layer {
            position: fixed;
            width: calc(100vw - 260px);
            height: calc(100vh - 70px);
            background: #f2edf3;
            z-index: 999;
            display: flex;
            justify-content: center;
            align-items: center;
            flex-direction: column;
            gap: 10px;
        }

        /* Spinner animation */
        @keyframes spin {
            to {
                transform: rotate(360deg);
            }
        }

        .page-title {
            font-size: 24px;
            font-weight: bolder;
        }

        .separator {
            height: 50px;
            width: 100%;
            background: #f2edf3;
        }
    </style>
    <div class="content-wrapper">
        <div class="page-header" style="margin-bottom: 30px;">
            <h3 class="page-title">
            <span class="page-title-icon bg-gradient-primary text-white me-2">
                <i class="mdi mdi-cards-variant menu-icon"></i>
            </span> {{ __('messages.Add Item Data') }}
            </h3>
        </div>

        <form action="{{route('Direct.Sales.store')}}" method="POST" id="direct-purchase-and-sale">
            @csrf
            <div class="container" id="AddCategoryModal">
                <div class="card">
                    <div class="card-body">
                        <div class="row">
                            <div class="col-md-12 mx-auto">
                                <ul class="nav nav-pills nav-pills-custom justify-content-center"
                                    id="pills-tab" role="tablist">
                                    <li class="nav-item">
                                        <a class="nav-link active" id="pills-home-tab"
                                           data-bs-toggle="pill"
                                           href="#pills-health" role="tab" aria-controls="pills-home"
                                           aria-selected="true">{{__('messages.Add Item Data')}}</a>
                                    </li>
                                </ul>

                                <input type="hidden" id="purchases-prise-last"
                                       value="{{ route('purchases.prise.last') }}"/>

                                <input type="hidden" id="get-category-item"
                                       value="{{ route('Direct.Sales.getItemByCatecory') }}"/>
                                        
                                <div class="tab-content tab-content-custom-pill"
                                     id="pills-tabContent-2">
                                    <div class="tab-pane fade show active" id="pills-health"
                                         role="tabpanel"
                                         aria-labelledby="pills-home-tab">

                                        <div class="page-header" style="margin-bottom: 30px;">
                                            <h3 class="page-title">
                                                        <span class="page-title-icon bg-gradient-primary text-white me-2">
                                                            <i class="mdi mdi-cards-variant menu-icon"></i>
                                                        </span> {{ __('messages.Add Item Data') }}
                                            </h3>
                                        </div>
                                        <hr>
                                        <div class="item-container">
                                            <div class="row">
                                                <div class="form-group mb-3 col-md-4">
                                                    <label class="required"
                                                           for="">  {{__('messages.From')}} {{__('messages.Item')}}</label>
                                                    <select id="itemFrom"
                                                            class="js-example-disabled-results  form-control">
                                                        <option value="0">{{ __('validation.Select', ['attribute' => __('messages.Item')]) }}</option>
                                                        @foreach($itemFrom as $item)
                                                            <option value="{{$item->item_id}}"
                                                                    data-item-category-id="{{$item->category_id}}">{{$item->from_item_name}}</option>
                                                        @endforeach
                                                    </select>

                                                    <div class="itemId-error d-none text-danger">{{ __('validation.required', ['attribute' => __('messages.Item')]) }}</div>
                                                </div>
                                                <div class="form-group mb-3 col-md-4">
                                                    <label class="required"
                                                           for=""> {{__('messages.To')}}  {{__('messages.Item')}}</label>
                                                    <select id="item"
                                                            class="js-example-disabled-results form-control">
                                                    </select>
                                                    <div class="expiryDate-error d-none text-danger">{{ __('validation.required', ['attribute' => __('messages.Item')]) }}</div>
                                                </div>

                                                <div class="form-group col-md-2 quantity-div">
                                                    <label id="quantity-lable" class="required"
                                                           for="">{{__('messages.quantity')}}</label>
                                                    <input id="quantity" type="text" required
                                                           class="form-control">
                                                    <div class="quantity-error d-none text-danger">{{ __('validation.required', ['attribute' => __('messages.quantity')]) }}</div>
                                                </div>
                                                 <div class="form-group col-md-2 quantity-div"> 
                                                    <label id="quantity-lable" class="required"
                                                           for="">{{__('messages.quantity not exist')}}</label>
                                                    <input id="quantity-not-exist" type="text" required
                                                           class="form-control">
                                                    <div class="quantity-not-exist-error d-none text-danger">{{ __('validation.required', ['attribute' => __('messages.quantity not exist')]) }}</div>
                                                </div>
                                                <div class="form-group  col-md-2">
                                                    <label class="required">{{__('messages.price')}}</label>
                                                    <input id="price" class="form-control" type="text">
                                                    <div class="price-error d-none text-danger">{{ __('validation.required', ['attribute' => __('messages.price')]) }}</div>
                                                </div>
                                                <div class="form-group my-3 col-md-3">
                                                    <label class="required">{{__('messages.production date')}}</label>
                                                    <input id="production_date" class="form-control"
                                                           type="date">
                                                    <div class="production_date-error d-none text-danger">{{ __('validation.required', ['attribute' => __('messages.production date')]) }}</div>
                                                </div>
                                                <div class="form-group my-3 col-md-3">
                                                    <label class="required">{{__('messages.expire date')}}</label>
                                                    <input id="expire_date" class="form-control"
                                                           type="date">
                                                    <div class="expire_date-error d-none text-danger">{{ __('validation.required', ['attribute' => __('messages.expire date')]) }}</div>
                                                </div>
                                                <div class="mb-3 mx-1 row justify-content-between">
                                                    <button id="confirmItem" type="button"
                                                            class="btn btn-primary col-md-2">{{__('messages.Confirm item')}}</button>
                                                </div>
                                                <table id="itemTable" class="table my-3" name="totalqnt">
                                                    <thead style="background-color: #8daf21; color:#fff;">
                                                    <tr>
                                                        <th style="">#</th>
                                                        <th style="">{{__('messages.Item')}}</th>
                                                        <th style="">{{__('messages.item weight')}}</th>
                                                        <th style="">{{__('messages.quantity not exist')}}</th>
                                                        <th style="">{{__('messages.price')}}</th>
                                                        <th style="">{{__('messages.production date')}}</th>
                                                        <th style=""
                                                            class="expire-date-header">{{__('messages.expire date')}}</th>
                                                        <th style=""></th>
                                                    </tr>
                                                    </thead>
                                                    <tbody id="confirmedItems" 
                                                           class="confirmedItemspurchase">
                                                    <tr class="row col d-none">
                                                        <td colspan="8"
                                                            class="text-center text-danger">{{ __('validation.size.array', ['attribute' => __('messages.Item'), 'size' => 1]) }}</td>
                                                    </tr>
                                                    </tbody>
                                                </table>
                                                <div class="form-group mb-3 col-md-4 d-none">
                                                    <label class="required"
                                                           for=""> {{__('messages.shipping')}}</label>
                                                    <select name="shipping_type" id="shipping_type"
                                                            class="js-example-disabled-results form-control">
<!--                                                         <option value="0">{{ __('validation.Select', ['attribute' => __('messages.shipping')]) }}</option> -->
                                                        <option value="land">{{__('messages.land')}}</option>
<!--                                                         <option value="air">{{__('messages.air')}}</option> -->
<!--                                                         <option value="sea">{{__('messages.sea')}}</option> -->
                                                    </select>
                                                    <div class="shipping_type-error d-none text-danger">{{ __('validation.required', ['attribute' => __('messages.shipping')]) }}</div>
                                                </div>
                                                <div class="form-group mb-3 col-md-4 d-none">
                                                    <label for=""> {{__('messages.Shipping price')}}</label>
                                                    <input name="shipping_price" id="priceShipping"
                                                           step="0.001"
                                                           class="form-control" type="number" value="0">
                                                </div>

                                                <div class="form-group mb-3 col-md-4">
                                                    <label for=""> {{__('messages.Serial number')}}</label>
                                                    <input name="serial_number" id="serialNumber"
                                                           step="0.001"
                                                           class="form-control" type="text" value=""
                                                           readonly>
                                                    <div class="serial_number-error d-none text-danger">{{ __('validation.required', ['attribute' => __('messages.Serial number')]) }}</div>
                                                </div>
                                                <hr>
                                                <h4 class="d-none">{{__('messages.Other expenses')}}</h4>
                                                <div class="form-group my-3 col-md-4 d-none">
                                                    <label for=""> {{__('messages.Customs expenses')}}</label>
                                                    <input name="customs" step="0.001" id="customs"
                                                           class="form-control" type="number"
                                                           value="0">

                                                </div>
                                                <div class="form-group my-3 col-md-4 d-none">
                                                    <label for=""> {{__('messages.Clearance expenses')}}</label>
                                                    <input
                                                            name="clearance"
                                                            step="0.001"
                                                            id="clearance"
                                                            class="form-control"
                                                            type="number"
                                                            value="0"
                                                    >

                                                </div>
                                                <div class="form-group my-3 col-md-4 d-none">
                                                    <label for=""> {{__('messages.Tax expenses')}}</label>
                                                    <input
                                                            name="tax"
                                                            step="0.001"
                                                            id="tax"
                                                            class="form-control"
                                                            type="number"
                                                            value="0">
                                                </div>
                                                <div class="form-group my-3 col-md-4 d-none">
                                                    <label for=""> {{__('messages.Unloading workers expenses')}}</label>
                                                    <input
                                                            name="workersExpenses"
                                                            step="0.001"
                                                            id="workersExpenses" class="form-control"
                                                            type="number" value="0">

                                                </div>
                                                <hr>
                                                <div class="form-group mb-3 col-md-4 d-none">
                                                    <label for=""> {{__('messages.Subtotal')}}</label>
                                                    <input
                                                            id="subtotal" class="form-control"
                                                            type="number"
                                                            step="0.001"
                                                            disabled min="0">
                                                </div>
                                                <div class="form-group mb-3 col-md-4 d-none">
                                                    <label for=""> {{__('messages.Discount Type')}}</label>
                                                    <select name="discount_type"
                                                            id="discountType"
                                                            class="form-control"
                                                    >
                                                        <option value="0"
                                                                selected>{{__('messages.Select an Option')}}</option>
                                                        <option value="fixed">{{__('messages.Fixed')}}</option>
                                                        <option value="percentage">{{__('messages.Percentage')}}</option>
                                                    </select>
                                                </div>
                                                <div class="form-group mb-3 col-md-4 d-none">
                                                    <label for=""> {{__('messages.Discount Amount')}}</label>
                                                    <input
                                                            step="0.001"
                                                            name="discount_amount"
                                                            id="discountAmount" class="form-control"
                                                            type="number" disabled min="0">
                                                </div>
                                                <div class="form-group my-3 col-md-4">
                                                    <label for=""> {{__('messages.Total price')}}</label>
                                                    <input id="totalPrice"
                                                           type="number"
                                                           disabled
                                                           step="0.001"
                                                           class="form-control"
                                                    >
                                                    <input type="hidden" id="add-ajax-route"
                                                           value="{{ route('Direct.Sales.store') }}"/>
                                                </div>
                                            </div>
                                        </div>
                                        <hr>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <ul id="save_msgList"></ul>
                <div class="card d-none">
                    <div class="card-body">
                        <div class="row">
                            <div class="col-md-12 mx-auto">
                                <div class="tab-content tab-content-custom-pill pt-0 "
                                     id="pills-tabContent">
                                    <div class="tab-pane fade show active" id="pills-health"
                                         role="tabpanel" aria-labelledby="pills-home-tab">
                                        <div class="page-header" style="margin-bottom: 30px;">
                                            <h3 class="page-title">
                                                            <span class="page-title-icon bg-gradient-primary text-white me-2">
                                                                <i class="mdi mdi-cards-variant menu-icon"></i>
                                                            </span> {{ __('messages.Sales invoice') }}
                                            </h3>
                                        </div>
                                        <table id="itemTable" class="table my-3">
                                            <thead style="background-color: #8daf21; color:#fff;">
                                            <tr>
                                                <th style="">#</th>
                                                <th style="">{{__('messages.Item')}}</th>
                                                <th style="">{{__('messages.quantity')}}</th>
                                                <th style="">{{__('messages.item weight')}}</th>
                                                <th style="">{{__('messages.price')}}</th>
                                                <th style="text-align: center">{{__('messages.Action')}}</th>
                                            </tr>
                                            </thead>
                                            <tbody id="confirmedItems" class="confirmedItemsSales">
                                            </tbody>
                                        </table>
                                        <hr>
                                        <div class="row">
                                            <div class="form-group mb-3 col-md-4">
                                                <label class="required"
                                                       for=""> {{__('messages.Customer')}}</label>
                                                <select id="customer"
                                                        name="customer"
                                                        class="js-example-disabled-results  form-control">
                                                    <option value="0">{{ __('validation.Select', ['attribute' => __('messages.Customer')]) }}</option>
                                                    @foreach($customers as $customer)
                                                        <option value="{{$customer->id}}">{{$customer->name}}</option>
                                                    @endforeach
                                                </select>
                                                <div class="customerId-error d-none text-danger">{{ __('validation.required', ['attribute' => __('messages.Customer')]) }}</div>
                                            </div>

                                            <div class="form-group mb-3 col-md-4">
                                                <label class="required"
                                                       for=""> {{__('messages.payment method')}}</label>
                                                <select name="payment_method" id="paymentMethod"
                                                        class="js-example-disabled-results  form-control">
                                                    <option value="cridet">{{__('messages.cridet On the account')}}</option>
                                                    <option value="cash">{{__('messages.cash')}}</option>
                                                    <option value="check">{{__('messages.check')}}</option>
                                                    <option value="bank-transfer">{{__('messages.bank transfer')}}</option>

                                                </select>
                                                <div class="paymentMethod-error d-none text-danger">{{ __('validation.required', ['attribute' => __('messages.payment method')]) }}</div>
                                            </div>

                                            <div class="form-group mb-3 col-md-4 d-none">
                                                <label class="required"
                                                       for=""> {{__('messages.bank transfer method')}}</label>
                                                <select id="bank_transfer_method"
                                                        name="bank_transfer_method"
                                                        class="js-example-disabled-results  form-control">
                                                    <option value="">{{ __('validation.Select', ['attribute' => __('messages.transactions')]) }}</option>
                                                    @foreach ($Transaction as $row)
                                                        <option value="{{ $row->id }}">
                                                            {{ str_replace('-', '', $row->serial_number) }}
                                                            -
                                                            {{ $row->name }}
                                                        </option>
                                                    @endforeach
                                                </select>
                                            </div>

                                        </div>
                                        <div class="row">
                                            <div class="form-group mb-3 col-md-4">
                                                <label for=""> {{__('messages.Serial number')}}</label>
                                                <input name="sale_serial_number" id="serialNumberSales"
                                                       class="form-control"
                                                       type="text" value="" readonly>
                                                <div class="serial_number-error d-none text-danger">{{ __('validation.required', ['attribute' => __('messages.Serial number')]) }}</div>
                                            </div>

                                            <div class="form-group mb-3 col-md-4">
                                                <label for=""> {{__('messages.Subtotal')}}</label>
                                                <input id="subtotalsales" class="form-control"
                                                       type="number"
                                                       name="subtotal_sale"
                                                       disabled min="0">
                                            </div>
                                            <div class="form-group mb-3 col-md-4">
                                                <label for=""> {{__('messages.Discount Type')}}</label>
                                                <select
                                                        name="sale_discount_type"
                                                        id="discountTypesale" class=" form-control">
                                                    <option value="0"
                                                            selected>{{__('messages.Select an Option')}}</option>
                                                    <option value="fixed">{{__('messages.Fixed')}}</option>
                                                    <option value="percentage">{{__('messages.Percentage')}}</option>
                                                </select>
                                            </div>
                                            <div class="form-group mb-3 col-md-4">
                                                <label for=""> {{__('messages.Discount Amount')}}</label>
                                                <input name="sale_discount_amount" id="discountAmountsale"
                                                       class="form-control"
                                                       step="0.001"
                                                       type="number" disabled min="0">
                                            </div>
                                            <div class="form-group mb-3 col-md-4">
                                                <label for=""> {{__('messages.Total price')}}</label>
                                                <input id="totalPricesales"
                                                       disabled
                                                       class="form-control"
                                                       type="number">
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="mt-3 text-center">
                    <button type="submit"
                            class="btn btn-primary">{{__('messages.Save')}}</button>
                </div>
            </div>
        </form>

    </div>
            <div class="spinner-layer d-none">
            <div class="spinner"></div>
            <p class="fs-3">{{__('messages.Processing')}}</p>
        </div>
@endsection
@section("scripts")
    <script>
        var translations = {
            'weight': "{{__('messages.meat weight')}}",
            "item": "{{__('messages.Item')}}",
            

        };
        var route_of_direct_purchases_sales = "{{route('Direct.Sales.index')}}"
    </script>
    <script src="{{asset('metronic/js/pages/create-direct-sales.js?v=') . uniqid()}}"></script>
    <script src="{{asset('metronic/js/components/uploadFiles.js')}}"></script>

@endsection