000

@extends('admin.layouts.app')
@section('title','MPP')
@section('style')
<meta name="csrf-token" content="{{ csrf_token() }}">
{{-- {{Html::style("assets/css/bootstrap-datepicker3.min.css")}} --}}
<style>
            .dual-list .list-group {
            margin-top: 8px;
        }

.list-left li, .list-right li {
            cursor: pointer;
        }

.list-arrows {
            padding-top: 120px;
        }

.list-arrows button {
                margin-bottom: 20px;
            }
</style>
@endsection
@section('content')

<div class="content-header">
			<div class="d-flex align-items-center">
				<div class="me-auto">
					<h4 class="page-title">Master</h4>
					<div class="d-inline-block align-items-center">
						<nav>
							<ol class="breadcrumb">
								<li class="breadcrumb-item"><a href="#"><i class="fa fa-home"></i></a></li>
								<li class="breadcrumb-item active" aria-current="page">MPP</li>
							</ol>
						</nav>
					</div>
				</div>
			</div>
		</div>

<section class="content">
			<div class="row">
				<div class="col-12">
					<div class="box">
						<div class="box-header with-border">
							<div class="clearfix">
                                 <div class="row">
                                    <div class="col-sm-12">
                                    <h3 class="header smaller lighter blue">Transfer Mpp to Other Mcc(Bmc)</h3>
                                    <div class="container">
                                    <br />
                                    
                                	<div class="row">
                                        <div class="dual-list list-left col-md-5">
                                            <div class="well text-right">
                                                <div class="row">
                                                    <div class="col-md-10">
                                                        
                                                        
                                                        
                                                        
                                                        <div class="form-group">
                    									<label for="relation_with_application" class="form-label">From Mcc (Bmc) :</label>
                    									<select class="form-control select2" id="mcc_name" name="mcc_name" onchange="getMppByMcc()">
                    										<option value="">Select</option>
                                                            @foreach($mcc as $m)
                                                            <option value="{{$m->code}}">{{$m->name}}</option>
                                                            @endforeach
                    									</select>
                    								</div>
                                                    </div>
                                                    <div class="col-md-2">
                                                        <div class="btn-group" style="margin-top: 25px;">
                                                            <a class="btn btn-default selector" title="select all"><i class="glyphicon glyphicon-unchecked"></i></a>
                                                        </div>
                                                    </div>
                                                </div>
                                                <ul class="list-group" id="mpp_name" style="height: 350px; overflow-y: scroll;">
                                                    
                                                    
                                                    
                                                    
                                                </ul>
                                            </div>
                                        </div>
                                
                                        <div class="list-arrows col-md-1 text-center">
                                            <button class="btn btn-default btn-sm move-left">
                                                <span class="glyphicon glyphicon-chevron-left"></span>
                                            </button>
                                
                                            <button class="btn btn-default btn-sm move-right">
                                                <span class="glyphicon glyphicon-chevron-right"></span>
                                            </button>
                                        </div>
                                        
                                        <div class="dual-list list-right col-md-5">
                                            <form action="{{URL('/admin/transfer-mpp')}}" role="form" id="transferMppToOtherMccForm">
                                            <div class="well">
                                                <div class="row">
                                                    <div class="col-md-2">
                                                        <div class="btn-group" style="margin-top: 25px;">
                                                            <a class="btn btn-default selector" title="select all"><i class="glyphicon glyphicon-unchecked"></i></a>
                                                        </div>
                                                    </div>
                                                    <div class="col-md-10">
                                                        <div class="form-group">
                    									<label for="relation_with_application" class="form-label">To Mcc (Bmc):</label>
                    									<select class="form-control select2" id="mcc_name_to" name="mcc_name_to">
                    										<option value="">Select</option>
                                                            @foreach($mcc as $m)
                                                            <option value="{{$m->code}}">{{$m->name}}</option>
                                                            @endforeach
                    									</select>
                    									<span class="label label-danger" id="add_mcc_name_to_error" style="display: none;"></span>
                    								</div>
                                                    </div>
                                                </div>
                                                <ul class="list-group" style="height: 350px; overflow-y: scroll;">
                                                    
                                                    
                                                    
                                                    
                                                    
                                                </ul>
                                                <span class="label label-danger" id="add_mpp_codes_error" style="display: none;"></span>
                                            </div><br>
                                            
                                            <button type="button" class="btn btn-primary" onclick="transferMpp()">Transfer</button>
                                         </form>
                                        </div>
                                       
                                	</div>
                                
                                </div>
                                </div>
                                </div>
							</div>
						</div>
					</div>
					
				</div>
			</div>
		</section>
		
	</div>
</div>

@endsection
@section('script')
{{-- <script src="{{asset("src/js/pages/patients.js")}}"></script> --}}
<script src="../src/js/pages/validation.js"></script>
<script src="../src/js/pages/form-validation.js"></script>
<script>

function showError(id, error) {
		if (typeof(error) === "undefined") {
			$('#' + id).hide();
		} else {
			$('#' + id).show();
			$('#' + id).text(error);
		}
	}
	
	 $(function () {

$('body').on('click', '.list-group .list-group-item', function () {
                $(this).toggleClass('active');
            });
            $('.list-arrows button').click(function () {
                var $button = $(this), actives = '';
                if ($button.hasClass('move-left')) {
                    actives = $('.list-right ul li.active');
                    actives.clone().appendTo('.list-left ul');
                    actives.remove();
                } else if ($button.hasClass('move-right')) {
                    var mcc_name = $("#mcc_name_to").val();
                    if(mcc_name==''){
                        alert('Please Select To Mcc');
                    }else{
                    actives = $('.list-left ul li.active');
                    actives.clone().appendTo('.list-right ul');
                    actives.remove();
                    }
                }
            });
            $('.dual-list .selector').click(function () {
                var $checkBox = $(this);
                if (!$checkBox.hasClass('selected')) {
                    $checkBox.addClass('selected').closest('.well').find('ul li:not(.active)').addClass('active');
                    $checkBox.children('i').removeClass('glyphicon-unchecked').addClass('glyphicon-check');
                } else {
                    $checkBox.removeClass('selected').closest('.well').find('ul li.active').removeClass('active');
                    $checkBox.children('i').removeClass('glyphicon-check').addClass('glyphicon-unchecked');
                }
            });
            $('[name="SearchDualList"]').keyup(function (e) {
                var code = e.keyCode || e.which;
                if (code == '9') return;
                if (code == '27') $(this).val(null);
                var $rows = $(this).closest('.dual-list').find('.list-group li');
                var val = $.trim($(this).val()).replace(/ +/g, ' ').toLowerCase();
                $rows.show().filter(function () {
                    var text = $(this).text().replace(/\s+/g, ' ').toLowerCase();
                    return !~text.indexOf(val);
                }).hide();
            });

});
        
        function getMppByMcc() {
		var mcc_name = $("#mcc_name").val();
		if (mcc_name != "") {
            $.ajaxSetup({
				headers: {
					'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content')
				}
			});
			$.ajax({
				url: '/admin/get-mpp-by-mcc',
				type: 'POST',
				data: {mcc_name: mcc_name},
				success:function(data){
				// 	console.log(data);
					var option = "";
					if (data.flag) {
						$.each(data.mpp, function(index, mpp) {
				// 			option += "<option value='"+mpp.code+"'>"+mpp.name+"</option>";
				// 			option += "<li class='list-group-item'>"+mpp.name+"</li>";
							option += "<li class='list-group-item'><input type='text' name='mpp_codes[]' value='"+mpp.code+"' style='width:70px;'> "+ mpp.name+"</li>";
				// 			option += "<li class='list-group-item'><input type='checkbox' name='mpp_codes[]' value='"+mpp.code+"'> "+ mpp.name+"</li>";
						});
					} else {
				// 		option += "<option>"+data.message+"</option>";
						option += "<li class='list-group-item'>"+data.message+"</li>";
					}
					$('#mpp_name').val(null).trigger('change');
					$("#mpp_name").empty().html(option);
					abc();
				}
			});
		} else {
			swal({
				title : "mcc Missing!",
				text  : "Please select mcc first.",
				icon  : "error"
			}).then(function(){
				$("#mpp_name").empty();
			});
		}
	}
// 	function transferMpp(){
// 					$.ajaxSetup({

// 						headers: {

// 							'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content')

// 						}

// 					});

// 					$.ajax({

// 						url: $('#'+form_id).attr('action'),

// 						method: 'POST',

// 						data: $('#'+form_id).serialize(),

// 						success: function(data){

// 							if(!data.flag){

// 								swal({

// 									title: "Error!",

// 									text: data.message,

// 									type: "error"

// 								});

// 							}else{

// 								swal({

// 									title: "Success!",

// 									text: data.message,

// 									type: "success"

// 								}).then( function() {

// 									window.location.reload();
//                                   $("#nav_step"+id).removeClass("active");  // this deactivates the home tab
//                                   $("#nav_step"+a).addClass("active");
// 								});

// 							}

// 						}

// 					});

// 				}	
				
	function transferMpp() {
        $.ajaxSetup({
    		headers: {
    			'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content')
    		}
    	});
    	$.ajax({
    		url: '/admin/transfer-mpp',
    		type: 'POST',
    		data: $('#transferMppToOtherMccForm').serialize(),
    		success:function (data) {
                console.log(data);
    			if (data.flag == true) {
    				swal({
    					title:"Successfully",
    					text:data.message,
    					icon:"success"
    				}).then(function(){
    					window.location.reload();
    				});
    			} else if(data.flag == 2){
						$.each(data.error, function(key, value){
							$('#add_'+key+'_error').text(value).show();
						});
    			} else {
						swal("Something Went Wrong",data.error,"error");
					}
    		}
    	});
    }
</script>
@endsection