@extends('layouts.backend')
@section('extraCss')
<style type="text/css">
span.multiselect-native-select {
    position: relative;
    display: block;
}
.btn-group, .btn-group-vertical {
    display: block;
}
.custom-select, .dropdown-item {
    width: 100% !important;
}
</style>
@endsection
@section('mainContentArea')
    <div class="card card-default">
        <div class="card-header">
            <h4>Asset Stock</h4>
             <a href="{{ route('oc-staff-assets-list') }}" class="btn btn-info float-right btn-sm" style="float:right; margin:5px;"> Back</a>
             <a href="{{route('oc-assets-store')}}" class="btn btn-xs btn-info float-right btn-sm" style="float:right; margin:5px;"><i class="fa fas fa-list"></i> Store Stock</a>
             <button class="btn btn-success float-right btn-sm" style="float:right; margin:5px;"  type="button"  data-toggle="modal" data-target="#assignAssest" id="add-assign" style=" margin:10px;">
             <i class="fa fas fa-plus"></i> Assign</button>
              </div>
        </div>
        <div class="card-body">
          
         
            <table class="table table-bordered table-striped">
                <thead>
                    <tr>
                        <th>S.no</th>                        
                        <!-- <th>Name</th> -->
                        <th>Category</th>
                        <th>Sub Category</th> 
                        <th>Qty</th>
                        
                       <!--  <th colspan="2">Actions</th> -->
                    </tr>
                </thead>
                <tbody>
                    @foreach ($assestlist as $key => $assest)
                        <tr>
                            <td>{{$key + $assestlist->firstItem() }}</td> 
                            <!-- <td>{{ empty($assest->items->name) ? 'N/A' : $assest->items->name }}</td> -->
                            <td>{{ empty($assest->category->name) ? 'N/A' : $assest->category->name}}</td>
                            <td>{{ empty($assest->subcategory->name) ? 'N/A' : $assest->subcategory->name }}</td> 
                            <td>{{ empty($assest->totalqty) ? '0' : $assest->totalqty }}</td>
                            
                           <!--  <td>{{ ($assest->current_postion === 1) ? 'Occupied' : 'Free' }}</td> -->
                          
                            <!-- <td>
                                <a data-id="{{ $assest->id }}" id="edit-post" class="btn btn-xs btn-info btn-sm"><i class="fa fas fa-pencil"></i> Modify</a>
                              -->   <!-- <button class="btn btn-success  btn-sm"  data-id="{{ $assest->id }}" type="button"  data-toggle="modal" data-target="#assignAssest" id="add-assign" style=" margin:10px;">
                               <i class="fa fas fa-plus"></i> Assign</button> 
                            </td> -->
                        </tr>
                    @endforeach
                </tbody>
            </table>
        </div>
        @php if($assestlist->count() > 0) { @endphp {!! $assestlist->appends(request()->input())->links() !!} @php } @endphp
    </div>

<!-- Modal -->

<div class="modal fade" id="assignAssest" role="dialog">
    <div class="modal-dialog">
        <div class="modal-content">
            <!-- Modal Header -->
            <div class="modal-header" >
              <h5> Assest Assign</h5>
              <button type="button" class="close" data-dismiss="modal">&times;</button> 
               
            </div>
            
            <!-- Modal Body -->
            <div class="modal-body">
                <p class="statusMsg"></p>
                <form role="form">
                    
                    <div class="form-group store_type"><label for="store_type"> Category</label> 
                        <select name="category" id="asset_category" class="form-control select2" data-placeholder="Select Category" required>
                        <option>select category</option>
                        @foreach ($categories as $category)
                            <option value="{{ $category->id }}" {{ old('asset_category') == $category->id ? "selected" : "" }}>{{ $category->name }}</option>
                        @endforeach
                    </select>
                    </div>

                    <div class="form-group">
                        <label>Select Sub category</label>                                    
                        <select name="sub_category" id="subsection" class="form-control select2" >                  
                        </select>
                    </div>

                    <div class="form-group store_type"><label for="store_type"> Store / Pos</label> 
                        <select name="warehouse_model" id="pos_model" class="input-md form-control" >   
                          <option value=''>select</option>                             
                          @foreach($ALL_POS as $warehouse)
                          <option value="{{ $warehouse->id }}" >{{ $warehouse->warehouse_code . ' ('.$warehouse->name.')' }}</option>
                          @endforeach
                        </select>
                    </div>

                    <div class="form-group">
                       <label for="staff">Staff</label>
                       <select  id="Ass_staff" class="form-control" >
                                <option value="">select</option>
                                @foreach($stafflist as $staff)
                                <option value="{{ $staff->id }}" {{ ( (!empty(request("staff")) && (request("staff") === $staff->id)) ? "selected" : "") }}>{{ $staff->name  }}</option>
                                @endforeach
                        </select>
                    </div>                   
                    
                    <div class="form-group">
                        <label for="inputName">Qty</label>                        
                        <input type="number" class="form-control" id="assign_qty" placeholder="Enter your Qty" required />
                    </div>                    
                    
                    <div class="form-group">
                        <label for="assign_desc">Description</label>                        
                        <textarea class="form-control" id="assign_desc" placeholder="Enter your description" required></textarea>
                    </div>

                    <div class="form-group">
                         <label for="Color">Date On</label>
                         <input type="text" class="form-control datepicker" style="width:100%"  id='assign_on' placeholder="Enter your assign date" required> 
                     </div>
                    
                </form>
            </div>
            
            <!-- Modal Footer -->
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                <button type="button" class="btn btn-primary AsssubmitBtn" id="btn-save" onclick="submitAssignForm()">SUBMIT</button>
            </div>
        </div>
    </div>
</div>
   
@endsection

@section('extraJs')
<script type="text/javascript">


$('body').on('click','#add-assign',function(){
     var assId = $(this).data('id');
     $('#assestId').val(assId);
});

$( ".datepicker" ).datepicker({
    format: 'yyyy-mm-dd',
    todayBtn: "linked",
    language: "it",
    autoclose: true,
    todayHighlight: true
});

function submitAssignForm(){
    
    var cateId = $('#asset_category').val();
    var subCateId = $('#subsection').val();
    var pos = $('#pos_model').val();
    var assign_qty = $('#assign_qty').val();
    var assign_desc = $('#assign_desc').val();
    var assId = $('#assestId').val();
    var staff = $('#Ass_staff').val();
    var assign_on = $('#assign_on').val();
    
    if(cateId.trim() == ''  ){
        alert('Please select category.');
        $('#asset_category').focus();
        return false;
    }else if(subCateId.trim() == ''  ){
        alert('Please select sub category.');
        $('#subsection').focus();
        return false;
    }else if(pos.trim() == '' && staff.trim() == '' ){
        alert('Please select pos or staff.');
        $('#pos_model').focus();
        return false;
    }else if(assign_qty.trim() == '' ){
        alert('Please enter qty.');
        $('#assign_qty').focus();
        return false;
    }else if(assign_desc.trim() == '' ){
        alert('Please enter description.');
        $('#assign_desc').focus();
        return false;       
    }else{
        var _token   = $('meta[name="csrf-token"]').attr('content'); 
        $.ajax({
            type: "get",
            url: "{{ route('oc-assets-assign-add') }}",
            data: {
            pos: pos,
            staff : staff,
            assign_qty: assign_qty,
            desc : assign_desc,
            assest_id:assId, 
            assign_on:assign_on,
            category_id: cateId,
            sub_category_id: subCateId,           
            _token: _token
            },
            dataType: "json",
            beforeSend: function () {
               // $('.AsssubmitBtn').attr("disabled","disabled");
               
            },           
            success: function(response) { 
                var reason = JSON.stringify(response);  
                var parsed = JSON.parse(reason);            
                console.log(parsed);
                if (parsed.status == false) {
                toastr.error(parsed.info);
               // $('.submitBtn').removeAttr("disabled");
                } else {
                toastr.success(parsed.info);
                
                window.location.reload('true');               
                
                }
            }
        });
    }
}

$('#asset_category').on('change', function (event) {
    section($('#asset_category').val());
});

function section(section)
{
    var section = $('#asset_category').val();
    var _token   = $('meta[name="csrf-token"]').attr('content');

    $.ajax({
    url:"{{ route('assest-subcategory') }}",
    method:"get",
    data:{section: section, _token:_token},
    success:function(res)
    { 
        if(res){ console.log(res);
        $("#subsection").empty();
        //  $("#subsection").append('<option value="">Select Section</option>');
        $.each(res,function(key,value){ console.log(value);
        $("#subsection").append('<option value="'+value.id+'">'+value.name+'</option>');
        });       

        }else{
        $("#subsection").empty();
        }
    }    

    })
}
</script>
@endsection