@extends('layouts.header')
@section('content')

<br>
<div class="statbox widget box box-shadow">

	<h4>Workflow Email Config</h4>

	<a href="javascript:void();" class="text-primary" onclick="GetEmailForm()">
		<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-plus-circle"><circle cx="12" cy="12" r="10"></circle><line x1="12" y1="8" x2="12" y2="16"></line><line x1="8" y1="12" x2="16" y2="12"></line></svg> Add Email Config
	</a>


	<div id="EmailConfigDiv"></div>

</div>

<br>
<div class="statbox widget box box-shadow" >
	
	<div class="form-group">
		<div class="col-md-3">
			<label>Module</label>
			<select class="form-control customDropdown" id="ModuleId" name="ModuleId" onchange="LoadEmailForms(this.value)">					
				<option value="">--Select Module--</option>
				@foreach($ModulesArray as $ModuleId=>$ModuleName)
				<option value="{{$ModuleId}}">{{$ModuleName}}</option>
				@endforeach
			</select>
		</div>
	</div>	


	<br>

	<div id="EmailConfigListDiv"></div>

</div>

@endsection

<script>

	const ModuleChange=(ModuleId,FormId='')=>{

		$.ajax({
			type:"post",
			url:"{{url('WorkFlowEmailConfig-GetTemplates')}}",
			data:{ModuleId},
			beforeSend:()=>{
				$(`#TemplateId${FormId}`).empty();
				$(`#ToAddressType${FormId}`).empty();
				$(`#FromAddressType${FormId}`).empty();
			},
			success:reponse=>{
				res=JSON.parse(reponse);
				console.log(res);
				optionsList=`<option value="">--Select Template--</option>`;
				res.map((template)=>{
					optionsList+=`<option value="${template.EmailTemplatesId}">${template.Name}</option>`
				})	
				$(`#TemplateId${FormId}`).html(optionsList);

				if(!ModuleId)
				{
					$(`#ToAddressType${FormId}`).html(`<option value="">--Select To AddressType--</option>
						<option value="2">Manual</option><option value="3">User List</option>`);
					$(`#ToAddressDiv${FormId}`).html('');

					$(`#FromAddressType${FormId}`).html(`<option value="2">Manual</option>
						<option value="3">Email Configuration</option>`);
					$(`#FromAddressDiv${FormId}`).html('');
				}
				else
				{
					$(`#ToAddressType${FormId}`).html(`<option value="">--Select To AddressType--</option>
						<option value="1">Module Column</option>
						<option value="2">Manual</option> <option value="3">User List</option>`);

					$(`#FromAddressType${FormId}`).html(`<option value="">--Select To AddressType--</option>
						<option value="1">Module Column</option><option value="2">Manual</option>
						<option value="3">Email Configuration</option>`);
				}

			}
		})
	}


	GetToAddressColumn=(ColumnType,divname='')=>
	{
		ModuleId=$(`#ModuleId${divname} :selected`).val();

		if(!ColumnType)
		{
			$(`#ToAddressDiv${divname}`).html('');
			return;
		}

		// console.clear();
		// console.log(ModuleId);

		// return;


		$.ajax({
			type:"post",
			url:"{{url('WorkFlow-GetToAddressColumn')}}",
			data:{ColumnType,ModuleId,divname},
			beforeSend:()=>{
				$(`#ToAddressDiv${divname}`).html(`<center> <div class="spinner-border text-primary align-self-center loader-lg">Loading...</div> </center>`);
			},
			success:response=>{
					// $('#ActionFormBtn').prop('disabled',false);
				$(`#ToAddressDiv${divname}`).html(response);
			}
		});

	}

	GetFromAddressColumn=(ColumnType,divname='')=>
	{
		ModuleId=$(`#ModuleId${divname}`).val();

		if(!ColumnType)
		{
			$(`#FromAddressDiv${divname}`).html('');
			return;
		}

		$.ajax({
			type:"post",
			url:"{{url('WorkFlow-GetFromAddressColumn')}}",
			data:{ColumnType,ModuleId,divname},
			beforeSend:()=>{
				$(`#FromAddressDiv${divname}`).html(`<center> <div class="spinner-border text-primary align-self-center loader-lg">Loading...</div> </center>`);
			},
			success:response=>{
					// $('#ActionFormBtn').prop('disabled',false);
				$(`#FromAddressDiv${divname}`).html(response);
			}
		});

	}

	SaveEmailConfig=()=>
	{
		form=document.getElementById('NotificationForm');
		form.classList.add('was-validated');
		if (form.checkValidity() === false) 
		{
			event.preventDefault();
			event.stopPropagation();
			return;
		}
		else
		{
			formData=new FormData(form);

			$.ajax({
				url: "{{url('WorkFlow-SaveMailForm')}}",
				type: 'POST',
				data: formData,
				mimeType: "multipart/form-data",
				contentType: false,
				cache: false,
				processData: false,
				beforeSend:()=>{
					$('#WorkFlowActionFormDiv').html(`<center>
						<div class="spinner-border text-primary align-self-center loader-lg">Loading...</div> </center>`);

					$('#EmailConfigBtn').prop('disabled',true);

				},
				success:response=>
				{
					console.clear();
					console.log(response);
					res=JSON.parse(response);

					$('#EmailConfigDiv').html('');

					if(res.status=="success")
					{
						Snackbar.show({
							text: res.msg,
							pos: 'top-right',
						});
					}
					else
					{
						Snackbar.show({
							text: res.msg,
							pos: 'top-right',
							actionTextColor: '#fff',
							backgroundColor: '#e7515a'
						});
					}
				}
			});
		}
	}


	GetEmailForm=()=>
	{
		$.ajax({
			type:"post",
			url:"{{url('WorkFlowEmailConfig-AddEmailForm')}}",
			beforeSend:()=>{
				$(`#EmailConfigDiv`).html(`<center> <div class="spinner-border text-primary align-self-center loader-lg">Loading...</div> </center>`);
			},
			success:response=>{
					// $('#ActionFormBtn').prop('disabled',false);
				$(`#EmailConfigDiv`).html(response);
			}
		});



	}

	LoadEmailForms=ModuleId=>{

		$.ajax({
			type:"post",
			url:"{{url('WorkFlowEmailConfig-GetCofiguredList')}}",
			data:{ModuleId},
			beforeSend:()=>{
				$('#EmailConfigListDiv').html(`<center> <div class="spinner-border text-primary align-self-center loader-lg">Loading...</div> </center>`)	
			},
			success:response=>
			{
				$('#EmailConfigListDiv').html(response);	
			}
		})
	}

	UpdateForm=WorkFlowNotificationId=>
	{
		
		form=document.getElementById(`NotificationForm${WorkFlowNotificationId}`);
		form.classList.add('was-validated');
		if (form.checkValidity() === false) 
		{
			event.preventDefault();
			event.stopPropagation();
			$(`#NotificationFormTr${WorkFlowNotificationId} .invalid-feedback`).css('display','block');
			return;
		}
		else
		{
			$(`#NotificationFormTr${WorkFlowNotificationId} .invalid-feedback`).css('display','none');
			formData=new FormData(form);

			formData.append('WorkFlowNotificationId',WorkFlowNotificationId);

			$.ajax({
				type:"post",
				url:"{{url('WorkFlowEmailConfig-Update')}}",
				data:formData,
				processData:false,
				contentType:false,
				cache:false,
				beforeSend:()=>{},
				success:response=>
				{
					console.clear();
					console.log(response);
					res=JSON.parse(response);
					if(res.status=="success")
					{
						Snackbar.show({
							text: res.msg,
							pos: 'top-right',
						});
					}
					else
					{
						Snackbar.show({
							text: res.msg,
							pos: 'top-right',
							actionTextColor: '#fff',
							backgroundColor: '#e7515a'
						});
					}
				}
			})

		}
	}


	DeleteForm=(WorkFlowNotificationId,ModuleId)=>{
		console.clear();
		Swal.fire({
			title: 'Are you sure?',
			text: "You won't be able to revert this!",
			icon: 'warning',
			showCancelButton: true,
			confirmButtonColor: '#3085d6',
			cancelButtonColor: '#d33',
			confirmButtonText: 'Yes, delete it!'
		}).then((result) => {

			if (result.isConfirmed) {

				formData=new FormData();
				formData.append('WorkFlowNotificationId',WorkFlowNotificationId);
				formData.append('DeletedStatus',1);
				$.ajax({
					type:"post",
					url:"{{url('WorkFlowEmailConfig-Update')}}",
					data:formData,
					processData:false,
					contentType:false,
					cache:false,
					beforeSend:()=>{},
					success:response=>
					{
						console.clear();
						console.log(response);
						res=JSON.parse(response);
						if(res.status=="success")
						{
							Snackbar.show({
								text: res.msg,
								pos: 'top-right',
							});
						}
						else
						{
							Snackbar.show({
								text: res.msg,
								pos: 'top-right',
								actionTextColor: '#fff',
								backgroundColor: '#e7515a'
							});
						}

						LoadEmailForms(ModuleId);
					}
				})
			}

		});
	}

</script>