@extends('layouts.default', ['appTopMenu' => true])
@section('title', 'Add Malkhana Items')
@push('scripts')

    <link rel="stylesheet" href="{{ asset('css/jquery-ui.css')}}" />
    <script src="{{ asset('js/jquery-ui.js') }}"></script>
    <script src="{{ asset('js/bootstrap-datetimepicker.js')}}"></script>
    <link href="../assets/plugins/bootstrap-datepicker/dist/css/bootstrap-datepicker.css" rel="stylesheet" />
    <script src="../assets/plugins/bootstrap-datepicker/dist/js/bootstrap-datepicker.js"></script>
    <script src="/assets/plugins/sweetalert/dist/sweetalert.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>


@endpush
@push('head')

    <style>
        /* Chrome, Safari, Edge, Opera */
            input::-webkit-outer-spin-button,
            input::-webkit-inner-spin-button {
            -webkit-appearance: none;
            margin: 0;
            }

            /* Firefox */
            input[type=number] {
            -moz-appearance: textfield;
            }
        .req{
            color:red;
            transform:translateY(-2px);
        }
       
        h3{
            
            /* text-align:center; */
            width:100%;
            font-size:16px;
        }

        /* css below for ajax loader */
       #overlay{	
            position: absolute;
            overflow:hidden;
            top: 0;
            left: 0;
            z-index: 100;
            width: 100%;
            height:100%;
            display: none;
            background: rgba(0,0,0,0.6);
           
            
        }
        .cv-spinner {
            position:fixed;
            top:0;
            left:30%;
            height: 100%;
            width: 50%;
            display: flex;
            justify-content: center;
            align-items: center;  
        }
        .spinner {
            width: 50px;
            height: 50px;
            z-index: 100;
            border: 4px #ddd solid;
            border-top: 4px #2e93e6 solid;
            border-radius: 50%;
            animation: sp-anime 0.8s infinite linear;
        }
        @keyframes sp-anime {
            100% { 
                transform: rotate(360deg); 
            }
        }
        .is-hide{
            display:none;
        }
       
        .ilist{
            padding:0;
        }
        .ilist td,th{
            border:1px solid #ced4da;
        }
        .ilist th{
            color:#0e4b8e;
        }
        .ilist tr:nth-child(odd) {  
        background-color: #eff7fc;  
        }
        .sno{
            width:80px;
        }
        .loi{
            width:150px;
        }
        @media (min-width: 768px) {
            label {
                font-size: 12px; 
            }
        }
        .btn{
            font-size:14px;
        }
        #scroll{
            overflow-y: scroll;
            max-height: 510px;
        }
      
        
       
        
    </style>

@endpush
@section('content')

    <section class="container">
        <div class="row">
            <div class="col-xl-12">
                <div class="panel" data-sortable-id="form-stuff-3">
                    <!-- loader -->
                    <div id="overlay">
                        <div class="cv-spinner">
                            <span class="spinner"></span>
                        </div>
                    </div>
                    <div class="panel-heading card-bg-color">
                        <h3 class="mt-1">मालखाना में वस्‍तु जोड़ें (Add Malkhana Items)</h3>
                        
                    </div>
                    <div class="container px-sm-5 px-2 my-3">
                        <div class="row mb-xl-3">
                            
                            <div class="col-lg-4 mt-2 mt-xl-0">
                                <div class="d-md-flex align-items-center justify-content-center">
                                    <label for="item_name_english">Item&nbsp;name&nbsp;(English)<span class="req">&nbsp;*</span>&nbsp;:&nbsp;</label>
                                    <input type="text" name="item_name_english" id="item_name_english" value="" class="form-control " placeholder="Item Name in English" required>

                                </div>
                            </div>
                            <div class="col-lg-4 mt-2 mt-xl-0">
                                <div class="d-md-flex align-items-center justify-content-center">
                                    <label for="item_name_hindi">वस्‍तु&nbsp;का&nbsp;नाम&nbsp;(हिन्‍दी&nbsp;में)<span class="req">&nbsp;*</span>&nbsp;:&nbsp;</label>
                                    <input type="text" name="item_name_hindi" id="item_name_hindi" class="form-control" placeholder="वस्‍तु का नाम हिन्‍दी में" required>

                                </div>
                            </div>
                            <div class="col-12 col-xl-4 mt-2 mt-xl-0">
                                <div class="d-md-flex align-items-center">
                                    <label for="life_of_item">वस्‍तु&nbsp;क‍ि&nbsp;उम्र&nbsp;(Life&nbsp;of&nbsp;Item)&nbsp;:&nbsp;</label>
                                    <div class="d-flex">
                                        <select name="life_year" id="life_year" class="form-control mx-1">
                                            <option value="0">वर्ष</option>
                                                                                            <option value="0"> 0 वर्ष </option>
                                                                                                <option value="1"> 1 वर्ष </option>
                                                                                                <option value="2"> 2 वर्ष </option>
                                                                                                <option value="3"> 3 वर्ष </option>
                                                                                                <option value="4"> 4 वर्ष </option>
                                                                                                <option value="5"> 5 वर्ष </option>
                                                                                                <option value="6"> 6 वर्ष </option>
                                                                                                <option value="7"> 7 वर्ष </option>
                                                                                                <option value="8"> 8 वर्ष </option>
                                                                                                <option value="9"> 9 वर्ष </option>
                                                                                                <option value="10"> 10 वर्ष </option>
                                                                                                <option value="11"> 11 वर्ष </option>
                                                                                                <option value="12"> 12 वर्ष </option>
                                                                                                <option value="13"> 13 वर्ष </option>
                                                                                                <option value="14"> 14 वर्ष </option>
                                                                                                <option value="15"> 15 वर्ष </option>
                                                                                                <option value="16"> 16 वर्ष </option>
                                                                                                <option value="17"> 17 वर्ष </option>
                                                                                                <option value="18"> 18 वर्ष </option>
                                                                                                <option value="19"> 19 वर्ष </option>
                                                                                                <option value="20"> 20 वर्ष </option>
                                                                                                <option value="21"> 21 वर्ष </option>
                                                                                                <option value="22"> 22 वर्ष </option>
                                                                                                <option value="23"> 23 वर्ष </option>
                                                                                                <option value="24"> 24 वर्ष </option>
                                                                                                <option value="25"> 25 वर्ष </option>
                                                                                        </select>
                                        <select name="life_month" id="life_month" class="form-control mx-1">
                                            <option value="0">माह</option>
                                                                                            <option value="0"> 0 माह </option>
                                                                                                <option value="1"> 1 माह </option>
                                                                                                <option value="2"> 2 माह </option>
                                                                                                <option value="3"> 3 माह </option>
                                                                                                <option value="4"> 4 माह </option>
                                                                                                <option value="5"> 5 माह </option>
                                                                                                <option value="6"> 6 माह </option>
                                                                                                <option value="7"> 7 माह </option>
                                                                                                <option value="8"> 8 माह </option>
                                                                                                <option value="9"> 9 माह </option>
                                                                                                <option value="10"> 10 माह </option>
                                                                                                <option value="11"> 11 माह </option>
                                                                                                <option value="12"> 12 माह </option>
                                                                                        </select>
                                        <select name="life_day" id="life_day" class="form-control mx-1">
                                            <option value="0">दिन</option>
                                                                                            <option value="0"> 0 दिन </option>
                                                                                                <option value="1"> 1 दिन </option>
                                                                                                <option value="2"> 2 दिन </option>
                                                                                                <option value="3"> 3 दिन </option>
                                                                                                <option value="4"> 4 दिन </option>
                                                                                                <option value="5"> 5 दिन </option>
                                                                                                <option value="6"> 6 दिन </option>
                                                                                                <option value="7"> 7 दिन </option>
                                                                                                <option value="8"> 8 दिन </option>
                                                                                                <option value="9"> 9 दिन </option>
                                                                                                <option value="10"> 10 दिन </option>
                                                                                                <option value="11"> 11 दिन </option>
                                                                                                <option value="12"> 12 दिन </option>
                                                                                                <option value="13"> 13 दिन </option>
                                                                                                <option value="14"> 14 दिन </option>
                                                                                                <option value="15"> 15 दिन </option>
                                                                                                <option value="16"> 16 दिन </option>
                                                                                                <option value="17"> 17 दिन </option>
                                                                                                <option value="18"> 18 दिन </option>
                                                                                                <option value="19"> 19 दिन </option>
                                                                                                <option value="20"> 20 दिन </option>
                                                                                                <option value="21"> 21 दिन </option>
                                                                                                <option value="22"> 22 दिन </option>
                                                                                                <option value="23"> 23 दिन </option>
                                                                                                <option value="24"> 24 दिन </option>
                                                                                                <option value="25"> 25 दिन </option>
                                                                                                <option value="26"> 26 दिन </option>
                                                                                                <option value="27"> 27 दिन </option>
                                                                                                <option value="28"> 28 दिन </option>
                                                                                                <option value="29"> 29 दिन </option>
                                                                                                <option value="30"> 30 दिन </option>
                                                                                                <option value="31"> 31 दिन </option>
                                                                                        </select>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-lg-4 mt-2 mt-xl-0">
                                <div class="d-md-flex align-items-center justify-content-center">
                                    <label for="fromDate">दिनांक&nbsp;से&nbsp;(From&nbsp;Date)&nbsp;&nbsp;:&nbsp;</label>
                                    <input type="date" name="fromDate" id="fromDate" class="form-control fromDate">

                                </div>
                            </div>
                            <div class="col-lg-4 mt-2 mt-xl-0">
                                <div class="d-md-flex align-items-center justify-content-center">
                                    <label for="toDate" >दिनांक&nbsp;तक&nbsp;(To&nbsp;Date)&nbsp;&ensp;:&nbsp;</label>
                                    <input type="date" name="toDate" id="toDate" class="form-control toDate"  >

                                </div>
                            </div>
                            <div class="col-xl-4">
                                <div class="d-xl-flex align-items-center justify-content-center mt-2 mt-xl-0">
                                    <button type="button" name="submit" id="saveBtn" class="btn btn-primary btn-lg px-5">Save</button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <!-- edit modal start -->

        <div class="modal fade" id="editModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
            <div class="modal-dialog" >
                <div class="modal-content">
                    <div class="modal-header">
                        <h5 class="modal-title" id="exampleModalLabel">Update Items</h5>
                        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                    </div>
                    <div class="modal-body">
                        <form>
                            @csrf
                                <input type="hidden" id="itm_id" value="" readonly>                        
                                <label for="in_eng" class="d-flex align-items-center justify-content-center">Item&nbsp;name&nbsp;in&nbsp;english<span class="req"> *</span>&nbsp;:&nbsp;
                                    <input type="text" name="in_eng" id="in_eng" value="" class="form-control " placeholder="Item Name in English" required>
                                </label> 
                                <br>
                                <label for="in_hindi" class="d-flex align-items-center justify-content-center">वस्‍तु&nbsp;का&nbsp;नाम&nbsp;हिन्‍दी&nbsp;में<span class="req"> *</span>&nbsp;:&nbsp;
                                    <input type="text" name="in_hindi" id="in_hindi" value="" class="form-control" placeholder="वस्‍तु का नाम हिन्‍दी में" required>
                                </label>
                                <br>
                                <label for="from_Date" class="d-flex align-items-center justify-content-center">From&nbsp;Date&nbsp;(दिनांक&nbsp;से)&nbsp;:&nbsp;
                                    <input type="date" name="from_Date" id="from_Date" class="form-control fromDate">
                                </label>
                                <br>
                                <label for="to_Date" class="d-flex align-items-center justify-content-center">To&nbsp;Date&nbsp;(दिनांक&nbsp;तक)&nbsp;:&nbsp;
                                    <input type="date" name="to_Date" id="to_Date" class="form-control toDate">
                                </label>
                                <br>
                                <label for="" class="d-flex align-items-center justify-content-center">वस्‍तु&nbsp;क‍ि&nbsp;उम्र&nbsp;:&nbsp;
                                    <select name="life_year_m" id="life_year_m" class="form-control mx-1">
                                                                                    <option value="0"> 0 वर्ष </option>
                                                                                        <option value="1"> 1 वर्ष </option>
                                                                                        <option value="2"> 2 वर्ष </option>
                                                                                        <option value="3"> 3 वर्ष </option>
                                                                                        <option value="4"> 4 वर्ष </option>
                                                                                        <option value="5"> 5 वर्ष </option>
                                                                                        <option value="6"> 6 वर्ष </option>
                                                                                        <option value="7"> 7 वर्ष </option>
                                                                                        <option value="8"> 8 वर्ष </option>
                                                                                        <option value="9"> 9 वर्ष </option>
                                                                                        <option value="10"> 10 वर्ष </option>
                                                                                        <option value="11"> 11 वर्ष </option>
                                                                                        <option value="12"> 12 वर्ष </option>
                                                                                        <option value="13"> 13 वर्ष </option>
                                                                                        <option value="14"> 14 वर्ष </option>
                                                                                        <option value="15"> 15 वर्ष </option>
                                                                                        <option value="16"> 16 वर्ष </option>
                                                                                        <option value="17"> 17 वर्ष </option>
                                                                                        <option value="18"> 18 वर्ष </option>
                                                                                        <option value="19"> 19 वर्ष </option>
                                                                                        <option value="20"> 20 वर्ष </option>
                                                                                        <option value="21"> 21 वर्ष </option>
                                                                                        <option value="22"> 22 वर्ष </option>
                                                                                        <option value="23"> 23 वर्ष </option>
                                                                                        <option value="24"> 24 वर्ष </option>
                                                                                        <option value="25"> 25 वर्ष </option>
                                                                                </select>
                                    <select name="life_month_m" id="life_month_m" class="form-control mx-1">
                                                                                    <option value="0"> 0 माह </option>
                                                                                        <option value="1"> 1 माह </option>
                                                                                        <option value="2"> 2 माह </option>
                                                                                        <option value="3"> 3 माह </option>
                                                                                        <option value="4"> 4 माह </option>
                                                                                        <option value="5"> 5 माह </option>
                                                                                        <option value="6"> 6 माह </option>
                                                                                        <option value="7"> 7 माह </option>
                                                                                        <option value="8"> 8 माह </option>
                                                                                        <option value="9"> 9 माह </option>
                                                                                        <option value="10"> 10 माह </option>
                                                                                        <option value="11"> 11 माह </option>
                                                                                        <option value="12"> 12 माह </option>
                                                                                </select>
                                    <select name="life_day_m" id="life_day_m" class="form-control mx-1">
                                                                                    <option value="0"> 0 दिन </option>
                                                                                        <option value="1"> 1 दिन </option>
                                                                                        <option value="2"> 2 दिन </option>
                                                                                        <option value="3"> 3 दिन </option>
                                                                                        <option value="4"> 4 दिन </option>
                                                                                        <option value="5"> 5 दिन </option>
                                                                                        <option value="6"> 6 दिन </option>
                                                                                        <option value="7"> 7 दिन </option>
                                                                                        <option value="8"> 8 दिन </option>
                                                                                        <option value="9"> 9 दिन </option>
                                                                                        <option value="10"> 10 दिन </option>
                                                                                        <option value="11"> 11 दिन </option>
                                                                                        <option value="12"> 12 दिन </option>
                                                                                        <option value="13"> 13 दिन </option>
                                                                                        <option value="14"> 14 दिन </option>
                                                                                        <option value="15"> 15 दिन </option>
                                                                                        <option value="16"> 16 दिन </option>
                                                                                        <option value="17"> 17 दिन </option>
                                                                                        <option value="18"> 18 दिन </option>
                                                                                        <option value="19"> 19 दिन </option>
                                                                                        <option value="20"> 20 दिन </option>
                                                                                        <option value="21"> 21 दिन </option>
                                                                                        <option value="22"> 22 दिन </option>
                                                                                        <option value="23"> 23 दिन </option>
                                                                                        <option value="24"> 24 दिन </option>
                                                                                        <option value="25"> 25 दिन </option>
                                                                                        <option value="26"> 26 दिन </option>
                                                                                        <option value="27"> 27 दिन </option>
                                                                                        <option value="28"> 28 दिन </option>
                                                                                        <option value="29"> 29 दिन </option>
                                                                                        <option value="30"> 30 दिन </option>
                                                                                        <option value="31"> 31 दिन </option>
                                                                                </select>
                                </label>
            
                        </form>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-secondary" id="closeModal" data-bs-dismiss="modal">Close</button>
                        <button type="button" id="update_btn" class="btn btn-primary">Update</button>
                    </div>
                </div>
            </div>
        </div>

       <!-- edit modal end -->

    </section>
    <section class="container">
        <div class="row">
            <div class="col-xl-12">
                <div class="panel" data-sortable-id="form-stuff-3">
                    <div class="panel-heading card-bg-color">
                        <h3 class="mt-1" >वस्‍तु सूची (Items List)</h3>
                        <div class="panel-heading-btn">
                            <a href="javascript:;" class="btn btn-xs btn-icon btn-default" data-toggle="panel-expand"><i class="fa fa-expand"></i></a>
                            <a href="javascript:;" class="btn btn-xs btn-icon btn-success" data-toggle="panel-reload"><i class="fa fa-redo"></i></a>
                            <a href="javascript:;" class="btn btn-xs btn-icon btn-warning" data-toggle="panel-collapse"><i class="fa fa-minus"></i></a>
                        </div>
                    </div>
                    <div class="panel-body" id="scroll">
                        <div class="row">
                            <table class="ilist">
                            @if(session('success'))
                                <div class="alert alert-success" id="flash-message">
                                    {{ session('success') }}
                                </div>
                            @endif
                            <div id="message"></div>
                                <tr>
                                    <th class="py-sm-2 px-sm-2 sno">क्रमांक</th>
                                    <th class="py-sm-2 px-sm-2 ">Items Name</th>
                                    <th class="py-sm-2 px-sm-2 ">वस्‍तु का नाम</th>
                                    <th class="py-sm-2 px-sm-2 sno">From Date</th>
                                    <th class="py-sm-2 px-sm-2 sno">To Date</th>
                                    <th class="py-sm-2 px-sm-2 loi">Life of Item</th>
                                    <th class="py-sm-2 px-sm-2 sno text-center">Action</th>
                                </tr>
                                @foreach($show as $data)
                                

                                    <tr class="alldata">
                                        <td class="py-sm-2 px-sm-2 px-1 sno"><b>{{($data->id)}}</b></td>
                                        <td class="py-sm-2 px-sm-2 px-1 ">{{($data->item_name_eng)}}</td>
                                        <td class="py-sm-2 px-sm-2 px-1 ">{{($data->item_name_hindi)}}</td>
                                        <td class="py-sm-2 px-sm-2 px-1 sno">{{($data->from_date)}}</td>
                                        <td class="py-sm-2 px-sm-2 px-1 sno">{{($data->to_date)}}</td>
                                        <td class="py-sm-2 px-sm-2 px-1 loi">{{($data->year)}} वर्ष {{($data->month)}} माह {{($data->day)}} दिन </td>
                                        <!-- <td class="sno">{{($data->month)}}</td>
                                        <td class="sno">{{($data->day)}}</td> -->
                                        <td class="py-sm-2 px-sm-2 sno">
                                            <span class="d-flex align-items-center justify-content-center">
                                                <i class="fas fa-lg fa-fw me-5px fa-user-edit text-info editbtn" data-id="{{($data->id) }}" title="Edit Items"></i>
                                                <!-- <a href="/edit/{{($data->id) }}" class="fas fa-lg fa-fw me-5px fa-user-edit text-info editRow" title="Edit Items" data-id="{{($data->id) }}"></a> -->
                                                <!-- <i class="fas fa-lg fa-fw me-5px fa-trash text-danger deleteRow" title="Delete Items" data-id="{{($data->id) }}"></i>  -->
                                                <a href="/delete/{{($data->id) }}" class="fas fa-lg fa-fw me-5px fa-trash text-danger deleteRow" title="Delete Items" data-id="{{($data->id) }}"></a>

                                            </span>
                                        </td>
                                    </tr>
                               
                               @endforeach
                               <tbody id="Content" class="searchdata"></tbody>
                            </table>
                            
                        </div>
                    </div>
                </div> 
                        
            </div>
        </div>
    </section>




@endsection
@push('scripts')
<script>

$(document).ready(function () {

// ..........................Translater ........................


    $('#item_name_english').on('input',function(){chnglang();});
    function chnglang(){
    
    var item_name_english = $('#item_name_english').val();
    var sourceLang = 'en';
    var targetLang = 'hi';
    // console.log(item_name_english);
    
    var url = "https://translate.googleapis.com/translate_a/single?client=gtx&sl="+ sourceLang + "&tl=" + targetLang + "&dt=t&q=" + encodeURI(item_name_english);
    //console.log(url);
    
    $.getJSON(url, function(data) {
        $('#item_name_hindi').val(data[0][0][0]);
        });

    }
//for update
    $('#in_eng').on('input',function(){clang();});
    function clang(){
    
    var in_eng = $('#in_eng').val();
    var sourceLang = 'en';
    var targetLang = 'hi';
    console.log(in_eng);
    
    var url = "https://translate.googleapis.com/translate_a/single?client=gtx&sl="+ sourceLang + "&tl=" + targetLang + "&dt=t&q=" + encodeURI(in_eng);
    //console.log(url);
    
    $.getJSON(url, function(data) {
        $('#in_hindi').val(data[0][0][0]);
        });

    }


// ..............................................................




// .........................Date check validateion.......................
    

const from_date = $('.fromDate');
const to_date = $('.toDate');

    // Attach a change event handler to both inputs
    from_date.change(validateDates);
    to_date.change(validateDates);

    function validateDates() {
        const olderDate = new Date(from_date.val());
        const newerDate = new Date(to_date.val());

        if (!isNaN(olderDate.getTime()) && !isNaN(newerDate.getTime())) {
            if (newerDate < olderDate) {
                alert('To Date must be greater than or equal to the From Date.');
                to_date.val(''); // Clear the input if invalid
            }
        }
    }
   


// ........................................................................


    
    // use on when submit dynamic form
    $("#saveBtn").click(function(){

        var inHindi=$("#item_name_hindi").val();
        var inEnglish=$("#item_name_english").val();
        var year=$("#life_year").val();
        var month=$("#life_month").val();
        var day=$("#life_day").val();
        var fromDate=$("#fromDate").val();
        var toDate=$("#toDate").val();
        var token=$("meta[name=csrf-token]").attr("content");


        

            if (inHindi ==='' || inEnglish ==='')
                {
                    // sweet alert start......................>
                    Swal.fire({
                        // icon: 'error',
                        icon: 'info',
                        title: 'Please fill all fields!',
                        timer: 2000
                    })
                    
                }
            else{

                // $(document).ajaxSend(function() {
                //     $("#overlay").fadeIn();　
                // });

                $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': token
                }
                });

                $.ajax({
                    url:"{{'master_malkhana'}}",
                    data:{'_token': token,'item_name_eng':inEnglish,'item_name_hindi':inHindi,'year':year,'month':month,'day':day,'from_date':fromDate,'to_date':toDate},
                    type:"POST",
                    dataType:"json",
                    success:function(){
                        Swal.fire({
                            icon: 'success',
                            title: 'Item added successfully!',
                            showConfirmButton: false,
                            timer: 1000
                        });
                        location.reload();

                        // setInterval('location.reload()', 7000);
                    },
                    error: function(errorResponse) {
                        Swal.fire({
                            icon: 'info',
                            title: 'Something went wrong!\nItem already present !',
                            showConfirmButton: false,
                            timer: 1000
                        })
                        
                    }
                });
                
            }
    });
    //ajex for search start
    $('#item_name_english, #item_name_hindi').on('keyup',function()
    {
        $value=$(this).val();
        if($value){
            $('.alldata').hide();
            $('.searchdata').show();
        }
        else{
            $('.alldata').show();
            $('.searchdata').hide();
        }
        
        $.ajax({

            type:'get',
            url:'{{URL::to('search')}}',
            data:{'item_name_english':$value},

            success:function (data) {
                console.log(data);
                $('#Content').html(data);
            }
        });
    });



    //ajex for search end


    // ajax for delete start

    $(".deleteRow").click(function(){
                var id = $(this).data("id");
                var token = $("meta[name='csrf-token']").attr("content");
                
                $(document).ajaxSend(function() {
                    $("#overlay").fadeIn();　
                });

                $.ajax(
                {
                    url: "/delete/"+id,
                    type: 'GET',
                    dataType:"json",
                    data: {
                        "id": id,
                        "_token": token,
                    },
                    success: function (response){
                        if (response.success) {
                            // If it's a success, update the message element with a success message
                            $('#message').html('<div class="alert alert-success">' + response.message + '</div>');
                        } else {
                            // If it's an error, update the message element with an error message
                            $('#message').html('<div class="alert alert-danger">' + response.message + '</div>');
                        }
                    },
                    error: function(xhr, status, error) {
                        // Handle AJAX errors here if needed
                    console.error(error);
                    }
                }).done(function() { // also this functin for remove loader
                setTimeout(function(){
                    $("#overlay").fadeOut();
                });
                });
            
    });
    
    setTimeout(function() {
            $('#flash-message').fadeOut('slow');
    }, 2000); 

    // ajex for delete end


    // ajex for edit
    $(document).on('click','.editbtn',function(){

        var id = $(this).data("id");
        // alert(id);
        $('#editModal').modal('show');
        
        $.ajax({
            type:"GET",
            url:"/edit/"+id,
            dataType:"json",
            success: function(response){
                var itemData = response.update[0];
                // console.log(itemData.item_name_eng);
                $('#in_eng').val(itemData.item_name_eng);
                $('#in_hindi').val(itemData.item_name_hindi);
                $('#life_year_m').val(itemData.year);
                $('#life_month_m').val(itemData.month);
                $('#life_day_m').val(itemData.day);
                $('#from_Date').val(itemData.from_date);
                $('#to_Date').val(itemData.to_date);
                $('#itm_id').val(itemData.id);
            }
        })
    });


    //ajex for update


    $("#update_btn").click(function(){

    var id=$("#itm_id").val();
    var Hindi=$("#in_hindi").val();
    var English=$("#in_eng").val();
    var year=$("#life_year_m").val();
    var month=$("#life_month_m").val();
    var day=$("#life_day_m").val();
    var fromDate=$("#from_Date").val();
    var toDate=$("#to_Date").val();
    var token=$("meta[name=csrf-token]").attr("content");

        if (Hindi ==='' || English ==='')
            {
                // sweet alert start......................>
                Swal.fire({
                    // icon: 'error',
                    icon: 'info',
                    title: 'Please fill all fields!',
                    timer: 2000
                })
                
            }
        else{

            

            $.ajaxSetup({
            headers: {
                'X-CSRF-TOKEN': token
            }
            });

            $.ajax({
                url:"{{'update-items'}}",
                data:{'_token': token,'id':id, 'item_name_eng':English,'item_name_hindi':Hindi,'year':year,'month':month,'day':day,'from_date':fromDate,'to_date':toDate},
                type:"POST",
                dataType:"json",
                success:function(){
                    $('#closeModal').click();
                    Swal.fire({
                        icon: 'success',
                        title: 'Item updated successfully!',
                        showConfirmButton: false,
                        timer: 1000
                    });
                    location.reload();
                },
                error: function(errorResponse) {
                    Swal.fire({
                        icon: 'error',
                        title: 'Something went wrong!\nItem not updated !',
                        showConfirmButton: false,
                        timer: 1000
                    }).done(function() {     //this function for remove loader
                        setTimeout(function(){
                            $("#overlay").fadeOut();
                        });
                    });
                }
            });
            
        }
    });


});

</script>


@endpush