AJAX post form with file upload – Jquery ajax

I have this problem that i cant seem to solve, for sure is a noob thing but here it goes, i’m trying to past values and upload file using the same form, but the file is not passing to the php function.

my html with ajax:

<form name="create_batch" method="post" role="form">
   <input type="hidden" name="token" value="<?= MiddlewaresCsrf::get() ?>" required="required" />
   <input type="hidden" name="request_type" value="create" />
   <input type="hidden" name="project_id" value="<?= $data->project->project_id ?>" />
   <input type="hidden" name="type" value="batch" />

   <div class="notification-container"></div>

   <div class="form-group">
      <label><i class="fa fa-fw fa-signature fa-sm mr-1"></i> <?= $this->language->create_link_modal->input->location_url ?></label>
   <input type="text" class="form-control" name="location_url" required="required" placeholder="<?= $this->language->create_link_modal->input->location_url_placeholder ?>" />
   </div>
   <div class="form-group">
     <input type="file" name="file">
   </div>
   <div class="form-group">
      <label><i class="fa fa-fw fa-link"></i> <?= $this->language->create_link_modal->input->url ?> 
      </label>
      <input type="text" class="form-control" name="url" placeholder="<?= $this->language->create_link_modal->input->url_placeholder ?>" />
   </div>
   <div class="text-center mt-4">
      <button type="submit" name="submit" class="btn btn-primary"><?= $this->language->create_link_modal->input->submit ?></button>
   </div>
</form>
<script>
    $('form[name="create_batch"]').on('submit', event => {

        $.ajax({
            type: 'POST',
            url: 'link-ajax',
            data: $(event.currentTarget).serialize(),
            success: (data) => {
                if(data.status == 'error') {

                    let notification_container = $(event.currentTarget).find('.notification-container');

                    notification_container.html('');

                    display_notifications(data.message, 'error', notification_container);

                }

                else if(data.status == 'success') {

                    /* Fade out refresh */
                    fade_out_redirect({ url: data.details.url, full: true });

                }
            },
            dataType: 'json'
        });

        event.preventDefault();
    })
</script>

this will post the data to the php file and the respective funtion, but only the fields are passing through. The file, that is a csv, is not passing. for sure i have something wrong on my ajax script that is only allow to pass the values of the form via post but not the file.

my php is something like this:

<?php

if(!empty($_FILES)){

$fh = fopen($_FILES['file']['tmp_name'], 'r+');
$i=0;
$lines = array();

while( ($row = fgetcsv($fh, 8192)) !== FALSE ) {
    $lines[] = $row;

$location_url = $lines[$i][0];
$url = $lines[$i][1];
$umt_source = $lines[$i][2];
$utm_medium = $lines[$i][3];
$utm_campaign = $lines[$i][4];
$utm_term = $lines[$i][5];
$utm_content = $lines[$i][6];

$i=$i+1;

}
fclose($fh);
}

$_POST['project_id'] = (int) $_POST['project_id'];
$_POST['location_url'] = trim(Database::clean_string($_POST['location_url']));
$_POST['url'] = !empty($_POST['url']) ? get_slug(Database::clean_string($_POST['url'])) : false;
...........

Any help? Many thanks.