@extends('layouts.merchant-backend-layout') @section('content')
<div class="content-wrapper merchant-right-side">
<!--<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>-->
        <!-- Content Header (Page header) -->
        <section class="content-header">
            <h1 class="pull-left">Segments settings</h1>
    	<div class="pull-right">
    		<a class="btn btn-primary" data-toggle="modal" data-target="#myModal">Add Region</a>

<!-- @include('includes.search') -->

		</div><br><br>
         

           @include('includes.messages')
        </section>

        <!-- Main content -->
        <section class="content">
	        <div class="row">
	        	<div class="col-xs-12">
		             <div class="box">
		               
		                <div class="box-body table-responsive no-padding">
			                @if(count($region) == 0)
								<p class='notice'>{{ trans('admin::users.pages.no_record_found') }}</p>
							@else 
								<table class="table table-bordered table-striped">
								<thead>
									<tr>
										<th align="center">S.No</th>
										<th align="center">City Name</th>
										<th align="center">Region Name</th>
										<th align="center">Action</th>
									</tr>
								</thead>
								<tbody>
								{{--*/ $j=0 /*--}}
								 @foreach ($region as $regions )
									<tr>
										<td  align="">{{$j=$j+1}}</td>
										<td  align="">{{$regions->city}}</td>
										<td  align="">{{$regions->region}}</td>
										<td  align=""><span class="btn delete-region" id='delete-region' style="color: #337ab7;" onclick='deleteRegion({{$regions->id}})'>Delete</span></td>
									</tr>
								@endforeach
								</tbody>
								</table>
			                @endif
		                </div><!-- /.box-body -->
		             </div><!-- /.box -->
		        </div>
	        </div>
        </section><!-- /.content -->
</div>
<div id="myModal" class="modal fade" role="dialog">
    <div class="modal-dialog modal-lg">
        <!-- Modal content-->
        <div class="modal-content">
	        <div class="modal-header">
	        	<button type="button" class="close" data-dismiss="modal">&times;</button>
	        	<h4 class="modal-title">Add Region</h4>
	        </div>
          	<div class="modal-body">
            	<!-- {{Form::open(array('url'=>'merchant/confirm_sendToken','method'=>'POST','role'=>"form",
							'files'=>true,'id'=>'adds-add-form'))}} -->
	                <div class="form-group">
	            		<select class="form-control" id="city-dropdown">
                                <label for="sel1">Select City:</label>
                                <option selected value="">Select City</option>
                                                        </select>
	                </div>
                    <div class="form-group">
                            <label for="usr">Region Name:</label>
                            <input type="text" class="form-control" id="region" placeholder="Type a region here (max 100 characters)">
                    </div>
	            	<div class='message'></div>
	            	<div class="modal-footer" style="text-align: center">
			            <input type="submit" class="btn btn-primary register" value="SEND" id="register" onclick="return validateForm()">
			        </div>
		        <!-- {{Form::close()}} -->
          	</div>
        </div>

    </div>
</div>
<div class="modal fade" id="message" role="dialog" aria-hidden="true">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title">Message</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body">
                    <div class="message-content"></div>
                </div>
            </div>
        </div>
    </div>
@section('scripts')
<!-- <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> -->
<!-- <script src="https://myewards.com/assets/js/bootstrap.min.js"></script> -->
<!-- <script type="text/javascript">
	$(document).ready(function() {
        alert("Settings page was loaded");
    });
</script> -->
<script type="text/javascript">
    function deleteRegion(id)
    {   
        //alert(id);
        var merchant_id = {{$merchant_id}};
        var r  = confirm("Do you want to delete region?");
        if(r == true)
        {
            //alert('yes');
                $.ajax(
                            {
                                type: 'POST',
                                url: '{{url('merchant/deleteRegion')}}',
                                data: {merchant_id:merchant_id,id:id},
                                success: function(response)
                                {
                                    //console.log(response);
                                    console.log(response)
                                    var json = $.parseJSON(response);
                                    $('#myModal').modal('hide');
                                    $('#message').modal('show');
                                    $(".message-content").html("<p style='color:green'>"+json.msg+ "</p>");
                                    setTimeout(function()
                                    {
                                                $('#message').modal('hide');
                                                window.location.reload();
                                    }, 3000);
                                }

                            }
                );
        }
        else
        {
            //alert('No');
        }
    }
 function validateForm() {
 	//alert('here');
    var merchant_id = {{$merchant_id}};
    var city = $('#city-dropdown').val();
    var region = $('#region').val();
    //alert(region);
    if(city != '')
    {
                //alert(city);
                $.ajax(
                            {
                                type: 'POST',
                                url: '{{url('merchant/addRegion')}}',
                                data: {merchant_id:merchant_id,city:city,region:region},
                                success: function(response)
                                {
                                    //console.log(response);
                                    console.log(response)
                                    var json = $.parseJSON(response);
                                    $('#myModal').modal('hide');
                                    $('#message').modal('show');
                                    $(".message-content").html("<p style='color:green'>"+json.msg+ "</p>");
                                    setTimeout(function()
                                    {
                                                $('#message').modal('hide');
                                                window.location.reload();
                                    }, 3000);
                                }

                            }
                );
    }
    else
    {
        alert('please select city');
    }
}
</script>
@stop
@stop