@php
$loopcount = 1;
@endphp
<input type="hidden" id="UserID" name="UserID" value="{{$userid}}" />
<table class="table style-2 table-hover no-footer">
	<thead>
		<tr>
			<td>RoleName</td>
			<td>Association</td>
			<td>Primary</td>
		</tr>
	</thead>
@foreach($UserRoleList as $RoleList)
	<input type="hidden" name="RoleID{{$loopcount}}" id="RoleID{{$loopcount}}" value="{{$RoleList['RoleID']}}" />
	<tr>
		<td>
		{{$RoleList['RoleName']}}
		</td>
		<td>
			<label class="new-control new-checkbox checkbox-outline-primary  m-auto">
				<input type="checkbox" class="new-control-input child-chk select-customers-info" id="association{{$loopcount}}" onchange="AssociationChange({{$loopcount}})"
				@if($RoleList['Associated'] == 1) 
					@php 
					echo "checked='checked'";
					@endphp
				@endif
				>
				<span class="new-control-indicator"></span><span style="visibility:hidden">c</span>
			</label>
		</td>
		<td>
			<div class="custom-control custom-radio">
				<input type="radio" name="PrimaryRole" id="PrimaryRole{{$loopcount}}" onclick="PrimaryRoleChange({{$loopcount}})"
				@if($RoleList['PrimaryRole'] == 1) 
					@php 
					echo "checked='checked'";
					@endphp
				@endif
				/>
			</div>
		</td>
	</tr>
	@php
	$loopcount++;
	@endphp
@endforeach
</table>
<script type="text/javascript">
function PrimaryRoleChange(loopcount){
	var r = confirm("Are you sure you want to change user's Primay Role ?");
	if (r == true) {
	  var RoleFieldName = "RoleID"+loopcount;
		var RoleIDValue = document.getElementById(RoleFieldName).value;
		var userid = document.getElementById('UserID').value;
		$.ajaxSetup({
			headers: {
				'X-CSRF-TOKEN': jQuery('meta[name="csrf-token"]').attr('content')
			}
		});
		var formData = {
			UserId: userid,
			RoleId: RoleIDValue,
		};
		var type = "POST";
		var ajaxurl = 'UpdateUserPrimaryRole';
		$.ajax({
			type: type,
			url: ajaxurl,
			data: formData,
			success: function (result) {
			},
			complete: function () {
				Snackbar.show({
							text: 'Primary Role Updated Successfully',
							pos: 'top-right',
						});
			},
			error: function (data) {
				//console.log(data);
				alert(data);
			}
		});
	} else {
		Snackbar.show({
			text: 'Warning',
			actionTextColor: '#fff',
			backgroundColor: '#e2a03f',
			text: 'Primary Role Not Changed',
			pos: 'top-right',
		});
	}	
}
function AssociationChange(loopcount){
	var AssociationFieldName = "association"+loopcount;
	if(document.getElementById(AssociationFieldName).checked == true){
		var Associated = 1;
	}else{
		var Associated = 0;
	}
	
	var RoleFieldName = "RoleID"+loopcount;
	var RoleIDValue = document.getElementById(RoleFieldName).value;
	var userid = document.getElementById('UserID').value;
	$.ajaxSetup({
		headers: {
			'X-CSRF-TOKEN': jQuery('meta[name="csrf-token"]').attr('content')
		}
	});
	var formData = {
		UserId: userid,
		RoleId: RoleIDValue,
		AssociationFieldValue: Associated,
	};
	var type = "POST";
	var ajaxurl = 'updateUserRoleAssociation';
	$.ajax({
		type: type,
		url: ajaxurl,
		data: formData,
		success: function (result) {
			Snackbar.show({
						text: 'Assoication Added Successfully',
						pos: 'top-right',
					});
		},
		complete: function () {
			
		},
		error: function (data) {
			alert(data);
		}
	});
}
</script>