var hrModal = $('#modal-hr > .modal-dialog > .modal-content');

function resetFormAssign() {
	$('#select-role-hr').val(null).trigger("change");
	$('#select-role-hr').find('option').remove();
	$('#select-role-hr').val("");
	$('#select-hr').val(null).trigger("change");
	$('#select-hr').find('option').remove();
	$('#select-hr').val("");
	$("#hr_role").val("");
	$('#form-assign-hr').trigger("reset");
	$('#btn-assign-hr').html('Assign');
	$('#btn-assign-hr').prop("disabled", false);
};

$(document).ready(function () {
	var tableHr = $("#table-hr").DataTable({
		"processing": true,
		"serverSide": true,
		"ajax": {
			"url": `${base_url}user-to-activity/datatables`,
			"data": function (d) {
				d.idact = activityId;
			}
		},
		"columns": [
			{ data: 'user_name', name: 'user_name' },
			{ data: 'role_name', name: 'role_name' },
		]
	});


	$("#modal-hr").on("click", "#show-form-hr", function () {
		$(this).hide();
		$("#hide-form-hr").show();
		$("#form-assign-hr").show();
	});

	$("#modal-hr").on("click", "#hide-form-hr", function () {
		$(this).hide();
		resetFormAssign()
		$("#show-form-hr").show();
	});

	$('#modal-hr').on('show.bs.modal', function (event) {
		$('#modal-hr-title').html("Human Resource " + activityName);
        $('#modal-hr-sub-title').html(`<p style="font-size: 12px; color: #747474">Plan Date ${moment(activityEarlyStart).format('MM-DD-YYYY')} - ${moment(activityEarlyFinish).format('MM-DD-YYYY')}</p>`);
		tableHr.draw();
	});

	$('#modal-hr').on('hide.bs.modal', function (event) {
		$("#hide-form-hr").hide();
		$("#show-form-hr").show();
		resetFormAssign();
	});

});