@extends('layouts.app')
@section('title', 'Abstractor Product Mapping')
@section('content')
<div class="container-fluid mt-1">
    @include('settings.common_tabs')
        <div class="col-lg-12">
            <div class="card ">
                <div class="card-body">
                    <div class="p-0">
                        <table id="abstMapplist" class="table table-bordered mb-0" style="border-collapse: collapse; border-spacing: 0; width: 100%;">
                            <thead>
                                <tr>
                                    <th>Sl No</th>
                                    <th>Abstractor</th>
                                    <th>Product Name</th>
                                    <th>State</th>
                                    <th>County</th>
                                    <th>Eta</th>
                                    <th>Abstract cost</th>
                                    <th>Copy Cost</th>
                                    <th>Is Approved ?</th>
                                    <th>Status</th>
                                    <th>Action</th>
                                </tr>
                            </thead>
                            <tbody></tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<!-- The Add Abstractor Modal -->
<div class="modal fade" id="addAbstractorModal">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
	        <form method="post" name="addAbstractorForm" id="addAbstractorForm" role="form" enctype="multipart/form-data" autocomplete="off" data-parsley-validate>
	            @csrf
                <!-- Modal Header -->
                <div class="modal-header">
                    <h5 class="modal-title" id="exampleModalLabel">Add Abstractor Product Mapping</h5>
					<button type="button" class="close" data-dismiss="modal" aria-label="Close">
						<span aria-hidden="true">&times;</span>
					</button> 
                </div>
                <!-- Modal body -->
                <div class="modal-body">
                    <div class="row">
                        <div class="col-lg-4">
                            <label for="abstractor_select" class="col-form-label"> Abstractor <span class="text-danger"> * <span></label>
                            <select required class="form-control" name="abstractor_master_id" id="abstractor_master_id">
                                <option value="">Select Abstractor</option>
                                @foreach($abstractor_masters as $ab_master)
                                    <option value="{{ $ab_master->id }}">{{ $ab_master->abstractor_name }}</option>
                                @endforeach
                            </select>
                        </div>
                        <div class="col-lg-4">
                            <label for="product_select" class="col-form-label">Product Name<span class="text-danger"> * <span></label>
                            <select required class="form-control" name="product_id" id="product_id">
                                <option value="">Select Product</option>
                                @foreach($products as $product)
                                    <option value="{{ $product->id }}">{{ $product->product_name }}</option>
                                @endforeach
                            </select>
                        </div>
                        <div class="col-lg-4">
                            <label for="state_select" class="col-form-label"> State <span class="text-danger"> * <span></label>
                            <select required class="form-control" name="state" id="state" onchange="get_county(this.value)">
                                <option value="">Select State</option>
                                @foreach($states as $state)
                                    <option value="{{ $state->id }}">{{ $state->short_code }}</option>
                                @endforeach
                            </select>
                        </div>
                    </div>
                    <div class="row mt-1">
                        <div class="col-lg-4">
                            <label for="county_select" class="col-form-label"> County <span class="text-danger"> * <span></label>
                            <select required class="form-control" name="county" id="county">
                                <option value="">Select County</option>
                                <!-- @foreach($counties as $county)
                                    <option value="{{ $county->id }}">{{ $county->county_name }}</option>
                                @endforeach -->
                            </select>
                        </div>
                        <div class="col-lg-4">
                            <label for="eta-input" class="col-form-label"> Eta </label>
                            <input autocomplete="off"  name="eta" id="eta" type="text" class="form-control" placeholder="Enter Eta" data-parsley-type="number" data-parsley-trigger="change" />
                        </div>
                        <div class="col-lg-4">
                            <label for="abstract-cost-input" class="col-form-label"> Abstract Cost </label>
                                <input name="abstract_cost" id="abstract_cost" type="text" value="" class="form-control" placeholder="Enter Abstract Cost" data-parsley-type="number" data-parsley-trigger="change"/>
                        </div>
                    </div>
                    <div class="row mt-1">
                        <div class="col-lg-4">
                            <label for="copy-cost-input" class="col-form-label"> Copy Cost </label>
                                <input name="copy_cost" id="copy_cost" type="text" value="" class="form-control" placeholder="Enter Copy Cost" data-parsley-type="number" data-parsley-trigger="change" />
                        </div>
                        <div class="col-lg-4">
                            <label for="active-input" class="col-form-label">Is Approved ?</label><br>
                            <input type="checkbox" id="is_approved" name="is_approved" value="1" checked>
                        </div>
                        <div class="col-lg-4">
                            <label for="active-input" class="col-form-label">Is Active ?</label><br>
                            <input type="checkbox" id="is_active" name="is_active" value="1" checked>
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-danger" data-dismiss="modal">Close</button>
                    <input type="submit" value="Submit" name="submit" id="submit" class="btn btn-primary" onclick="saveAbstractor();">
                </div>
	        </form>
        </div>
    </div>
</div>
<!-- End Modal -->

<!-- The Edit Abstractor Modal -->
<div class="modal fade" id="editAbstractorModal">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
	        <form method="post" name="editAbstractorForm" id="editAbstractorForm" role="form" enctype="multipart/form-data" onsubmit="return abstractorUpdate()" autocomplete="off" data-parsley-validate>
	            @csrf
                <input type="hidden" name="abstractor_id" id="abstractor_id">
                <!-- Modal Header -->
                <div class="modal-header">
                    <h5 class="modal-title" id="exampleModalLabel">Edit Abstractor Product Mapping</h5>
					<button type="button" class="close" data-dismiss="modal" aria-label="Close">
						<span aria-hidden="true">&times;</span>
					</button>
                </div>
                <!-- Modal body -->
                <div class="modal-body">
                    <div class="row">
                        <div class="col-lg-4">
                            <label for="abstractor_select" class="col-form-label"> Abstractor <span class="text-danger"> * <span></label>
                            <select required class="form-control" name="abstractor_master_id" id="edit_abstractor_master_id">
                                <option value="">Select Abstractor</option>
                                @foreach($abstractor_masters as $ab_master)
                                    <option value="{{ $ab_master->id }}">{{ $ab_master->abstractor_name }}</option>
                                @endforeach
                            </select>
                        </div>
                        <div class="col-lg-4">
                            <label for="product_select" class="col-form-label">Product Name<span class="text-danger"> * <span></label>
                            <select required class="form-control" name="product_id" id="edit_product_id">
                                <option value="">Select Product</option>
                                @foreach($products as $product)
                                    <option value="{{ $product->id }}">{{ $product->product_name }}</option>
                                @endforeach
                            </select>
                        </div>
                        <div class="col-lg-4">
                            <label for="state_select" class="col-form-label"> State <span class="text-danger"> * <span></label>
                            <select required class="form-control" name="state" id="edit_state" onchange="get_county(this.value)">
                                <option value="">Select State</option>
                                @foreach($states as $state)
                                    <option value="{{ $state->id }}">{{ $state->short_code }}</option>
                                @endforeach
                            </select>
                        </div>
                    </div>
                    <div class="row mt-1">
                        <div class="col-lg-4">
                            <label for="county_select" class="col-form-label"> County <span class="text-danger"> * <span></label>
                            <select required class="form-control" name="county" id="edit_county">
                                <option value="">Select County</option>
                                @foreach($counties as $county)
                                    <option value="{{ $county->id }}">{{ $county->county_name }}</option>
                                @endforeach
                            </select>
                        </div>
                        <div class="col-lg-4">
                            <label for="eta-input" class="col-form-label"> Eta </label>
                            <input autocomplete="off"  name="eta" id="edit_eta" type="text" class="form-control" placeholder="Enter Eta" data-parsley-type="number" data-parsley-trigger="change" />
                        </div>
                        <div class="col-lg-4">
                            <label for="abstract-cost-input" class="col-form-label"> Abstract Cost </label>
                                <input name="abstract_cost" id="edit_abstract_cost" type="text" value="" class="form-control" placeholder="Enter Abstract Cost" data-parsley-type="number" data-parsley-trigger="change" />
                        </div>
                    </div>
                    <div class="row mt-1">
                        <div class="col-lg-4">
                            <label for="copy-cost-input" class="col-form-label"> Copy Cost </label>
                                <input name="copy_cost" id="edit_copy_cost" type="text" value="" class="form-control" placeholder="Enter Copy Cost" data-parsley-type="number" data-parsley-trigger="change" />
                        </div>
                        <div class="col-lg-4">
                            <label for="active-input" class="col-form-label">Is Approved ?</label><br>
                            <input type="checkbox" id="edit_is_approved" name="is_approved" value="1" checked>
                        </div>
                        <div class="col-lg-4">
                            <label for="active-input" class="col-form-label">Is Active ?</label><br>
                            <input type="checkbox" id="edit_is_active" name="is_active" value="1" checked>
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-danger" data-dismiss="modal">Close</button>
                    <input type="submit" value="Update" name="submit" id="edit_submit" class="btn btn-primary" onclick="updateAbstractor();">
                </div>
	        </form>
        </div>
    </div>
</div>
<!-- End Modal -->

<script>
$(function() {
    @if(Session::has('success'))
    new PNotify({
    title: 'Success',
    delay: 500,
    text:  "{{Session::get('success')}}",
    type: 'success'
    });
            
    @endif
    @if ($errors->any())
    var err = "";
    @foreach ($errors->all() as $error)
    
        new PNotify({
        title: 'Error',
        text: "{{$error}}",
        delay: 800,
        type: 'error'
        });
        @endforeach
    @endif
});
 $(function () {
     
    var table = $('#abstMapplist').DataTable({
       processing: true,
        serverSide: true,
        responsive: true,
        autoWidth:false,
        ajax: "{{ route('getabstractMapplist') }}",
        columns: [
                {data: 'DT_RowIndex',name: 'DT_RowIndex',orderable: false, searchable: false },
                {data: 'abstractor_name',name: 'getAbstractormasterdetail.abstractor_name'  ,sortable : false,},
                {data : 'product_name',name: 'getProduct_namedetail.product_name' ,sortable : false,},
                {data : 'state_name',name: 'getStatedetail.state_name' ,sortable : false,},
                {data : 'county_name',name: 'getCountydetail.county_name' ,sortable : false,},
                {data : 'eta'},
                {data : 'abstract_cost'},
                {data : 'copy_cost'},
                {data : 'is_approved'},
                {data: 'status'},
                {data: 'action'},
                ],
        dom: 'l<"toolbar">Bfrtip',
        buttons: [
            'excel'
        ],
        lengthMenu: [[10, 25, 50, -1], [10, 25, 50, "All"]],
        initComplete: function(){
            $("div.toolbar").html('<button id="addAbstractor" type="button" class="ml-2 btn btn-primary" onclick="add_records();"><img class="menuicon" src="{{asset("app-assets/assets/images/add.svg")}}">&nbsp;Add Abstractor Product Mapping</button><br />');
        },
         // "columnDefs": [{"render": createManageBtn, "data": null, "targets": [7]}],
    });
     
  });
 function add_records()
{
    window.location.href = '/add_abstractor_mapping/' ;
}
$(document).ready(function() {
	$(".odtabs").not("#tab11").addClass('btn-outline-secondary');
	$("#tab11").addClass('btn-secondary');

    $('.modal').on('hidden.bs.modal', function() {
        $(this).find('form')[0].reset();
        $(this).find('form').parsley().reset();
    });

    window.ParsleyValidator
        .addValidator('fileextension', function (value, requirement) {
            var tagslistarr = requirement.split(',');
            var fileExtension = value.split('.').pop();
            var arr=[];
            $.each(tagslistarr,function(i,val){
            arr.push(val);
            });
            if(jQuery.inArray(fileExtension, arr)!='-1') {
                return true;
            } else {
                return false;
            }
        }, 32)
        .addMessage('en', 'fileextension', 'The extension doesn\'t match the required');
		$("form").parsley();

    var table = $('#datatable').DataTable({
		responsive: true,
		dom: 'l<"toolbar">Bfrtip',
        buttons: [
            'excel'
        ],
		initComplete: function(){
		    $("div.toolbar").html('<button id="addAbstractor" type="button" class="ml-2 btn btn-primary" data-toggle="modal" data-target="#addAbstractorModal"><img class="menuicon" src="{{asset("app-assets/assets/images/add.svg")}}">&nbsp;Add Abstractor Product Mapping</button><br />');
		}, 
	   'columnDefs': [ {
			'targets': [9],
			'orderable': false,
		}]
    });
});

function abstractorStatus(value)
{
    window.location.href = '/abstractorproductmappingStatus/' + value;
}

function saveAbstractor() {
    if ($("#addAbstractorForm").parsley()) {
        if ($("#addAbstractorForm").parsley().validate()) {
            event.preventDefault();
            if ($("#addAbstractorForm").parsley().isValid()) {
                $.ajax({
                    type: "POST",
                    cache:false,
                    async: false,
                    url: "{{ route('abstractor_product_mapping_add') }}",
                    data: new FormData($("#addAbstractorForm")[0]),
                    processData: false,
                    contentType: false,
                    success: function(response) {
                        if(response.msg=="Abstractor Already Exists!"){
                        new PNotify({
                            title: 'Error',
                            text:  response.msg,
                            type: 'error',
                            delay: 1000
                        });
                        return false;
                        } else {
                            new PNotify({
                                title: 'Success',
                                text:  response.msg,
                                type: 'success'
                            });
                            setTimeout(function(){  location.reload(); }, 800);
                        }
                    },
                    error:function(response) {
                        var err = "";
                        $.each(response.responseJSON.errors,function(field_name,error){
                            err = err +'<br>' + error;
                        });
                        new PNotify({
                            title: 'Error',
                            text:err,
                            type: 'error',
                            delay: 2000
                        });
                    }
                });
            }
        }
    }
}

function editAbstractor(id) {
    var url = '/abstractorproductmapping/edit/'+id;
    $.ajax({
        url:url,
        dataType:"json",
        success:function(data) {
            $('#editAbstractorModal').modal('show'); 
            $("#abstractor_id").val(data.result.id);
            $("#edit_abstractor_master_id").val(data.result.abstractor_master_id).change();
            $("#edit_product_id").val(data.result.product_name_id);
            $("#edit_state").val(data.result.state);
            $("#edit_county").val(data.result.county);
            $("#edit_eta").val(data.result.eta);
            $("#edit_abstract_cost").val(data.result.abstract_cost);
            $("#edit_copy_cost").val(data.result.copy_cost);
            if(data.result.is_approved == 1){
                $("#edit_is_approved").attr("checked", "checked");
            }else {
                $("#edit_is_approved").removeAttr("checked", "");
            }
            if(data.result.is_active == 1){
                $("#edit_is_active").attr("checked", "checked");
            }else {
                $("#edit_is_active").removeAttr("checked", "");
            }
        }
    });
    return false;
}

function updateAbstractor(){
	var id = $('#abstractor_id').val();
	var url = '{{ route("abstractor_product_mapping_update", ":id") }}';
	url = url.replace(':id', id);
    if ($("#editAbstractorForm").parsley()) {
		if ($("#editAbstractorForm").parsley().validate()) {
			event.preventDefault();
			if ($("#editAbstractorForm").parsley().isValid()) {
				$.ajax({
					type: "POST",
					cache:false,
					async: false,
					url: url,
					data: new FormData($("#editAbstractorForm")[0]),
					processData: false,
					contentType: false,
					success: function(response) {
						new PNotify({
								title: 'Success',
								text:  response.msg,
								type: 'success'
							});
						setTimeout(function(){  location.reload(); }, 800);
					},
					error:function(response) {
						var err = "";
						$.each(response.responseJSON.errors,function(field_name,error){
							err = err +'<br>' + error;
						});
						new PNotify({
							title: 'Error',
							text:err,
							type: 'error',
							delay: 2000
						});
					}
				});
			}
		}
	}
}

function get_county(stateid)
{
    var stateid = stateid;
    var url = '{{ route("getcounty") }}';
    $.ajax({
        type: "post",
        url: url,
        data: { stateid:stateid , _token: '{{csrf_token()}}'},
        success: function(html)
        {
            if (html)
            {
                $("#county").html("");
                $("#county").html(html);
                $("#edit_county").html("");
                $("#edit_county").html(html);
            }
        }
    });
}
</script>
@endsection