Changes on a table with relationship does not reflect till page refresh

I am working on a single page laravel-vue application.

I have a HighLevelProjectPhase table with columns "name", "id" and "department_id" Department table which has "name" and "id"

HighLevelProjectPhase table has a relationship with a Department table, using a foreign key department_id.

If i update the project name of a record, my code make it reflect on my view without refresh, but if i change the department, this change doesnt display until i reload the page.

Here is my code

    $project_phase = HighLevelProjectPhase::find($request->id);
    $project_phase->name = $request->name;
    $project_phase->department_id = $request->department['id'];
    $project_phase->save();
    $var = $project_phase->with('department:id,name')->first()->makeHidden(['created_at','updated_at'])->toArray();

    return ['project_phase'=>$var];
    }

The returned array is what is used to display the updated code.

Please help me figure out what i am doing wrong.

via Chebli Mohamed