MINI Sh3ll

@extends('layouts.main')
@section('title', 'Plants')
@section('content')
<div class="m-content">
    <div class="row" >
        <div class="m-portlet m-portlet--mobile filter_row">
            <div class="m-portlet__head">
                <div class="m-portlet__head-caption">
                    <div class="m-portlet__head-title">
                        <h3 class="m-portlet__head-text">
                            Plant Filter
                        </h3>
                    </div>
                </div>
            </div>
            <form class="m-form m-form--fit m-form--label-align-right" autocomplete="off" id="statusForm" method="POST" role="form" data-parsley-validate="parsley">
                {{ csrf_field() }}
                <div class="m-portlet__body">
                    <div class="row">
                        <div class="col-md-6">
                            <div class="form-group m-form__group">
                                <label class="show_status"> Plant Name</label>
                                <select class="form-control m-input" id="plantId">
                                    <option value="" >All</option> 
                                    @if(!empty($plants_name))
                                        @foreach($plants_name as $name)
                                            <option value="{{$name->id}}" >{{$name->plant_name}}</option>
                                        @endforeach
                                     @else
                                        <option value="" >Company not found.</option> 
                                    @endif
                                </select>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="form-group m-form__group">
                                <label class="show_status"> Select Status </label>
                                <select class="form-control m-input" id="status">
                                    <option value="" >All</option>
                                    <option value="1" >Active</option>
                                    <option value="0" >In Active</option>
                                </select>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="m-portlet__foot m-portlet__foot--fit">
                    <div class="m-form__actions">
                        <button type="button" id="statusBtn" name="submit" class="btn btn-sm btn-accent m-btn m-btn--custom m-btn--icon m-btn--air  search_plant">
                                Search  <i class="la la-search"></i>
                            </button>
                    </div>
                </div>
            </form>
        </div>
    </div>
    <div class="row" >
        <div class="m-portlet m-portlet--mobile filter_row">
            <div class="m-portlet__head">
                <div class="m-portlet__head-caption">
                    <div class="m-portlet__head-title">
                        <h3 class="m-portlet__head-text">
                            Plant
                        </h3>
                    </div>
                </div>
                @if(Auth::user()->role_id != config('constants.role.user.id'))
                <div class="m-portlet__head-tools">
                    <a href="{{ route('plant.create') }}" class="btn btn-sm btn-accent m-btn m-btn--custom m-btn--icon m-btn--air">
                        <span>

                            <i class="la la-industry"></i>
                            <span>
                                Add Plant
                            </span>
                        </span>
                    </a>
                </div>
                @endif
            </div>
            <div class="m-portlet__body">
                <!--begin: Datatable -->
                <div class="m_datatable" id="local_data">
                    <table id="plant_data" class="display" cellspacing="0" width="100%">
                        <thead>
                            <tr>
                                <th>Plant Name</th>
                                <th>Company</th>
                                <th>City</th>
                                <th>Status</th>
                                <th>Action</th>
                            </tr>
                        </thead>
                    </table>
                </div>
                <!--end: Datatable -->
            </div>
        </div>
    </div>
</div>

@endsection
@section('script')
<!--begin::Page Resources -->

<script>
var base_url = window.location.origin;
        var url = '{{ route('getPlant') }}';
        loadDataTable(url);

function loadDataTable(url) {
    $('#plant_data').DataTable({
        "order": [],
        "bAutoWidth": false,
        "processing": false,
        "serverSide": false,
        "bDestroy": true,
        "scrollX": true,
        "aLengthMenu": [[10, 20, 50, -1], [10, 20, 50, "All"]],
        "pageLength": 10,
        "columnDefs": [{
                "targets": 'no-sort',
                "orderable": false,
            }],
        "ajax": url,
        language: {
            search: "_INPUT_",
            searchPlaceholder: "Search...",
            "lengthMenu": "Show _MENU_"
        }
    })
}

$(document).on('click', '.delete_user', function (event) {
    var id = $(this).attr("data-id");
    var deleteUrl = '{{ route("delete_plant") }}';
    $('#deleteModal').modal('show');
    $(".delete").click(function (e) {
        e.preventDefault();
        $.ajax({
            type: "POST",
            url: deleteUrl,
            dataType: "json",
            data: {
                "id": id,
                "_token": "{{ csrf_token() }}",
            },
            success: function (response) {
                if (response.status == 1) {
                    $('#deleteModal').modal('hide');
                    location.reload(true);
                    toastr.success(response.success);
                }
            }
        });
    });
});

$(document).on("click", "#statusBtn", function () {
    $('#statusForm').submit();
    var status = $('#status').val();
    var id = $('#plantId').val();
    var url = '{{ route('getPlant') }}';
    url = url+"?id="+id+"&status="+status; 
    loadDataTable(url);
});


</script>

@endsection