Laravel WhereHas() / orWhereHas not working - laravel

Question

I want to fetch data from two tables Employee and Company via search by typing Company name not by company Id the tables are linked with one to many Relationship.they rest search functionality is working perfectly.any help would be highly appreciated.
Code in EmployeeController is :
public function searchemp(){
if($search = \Request::get('q')){
$employees = Employee::with('company')->with('nationality')->where(function($query) use ($search){
$query->Where('BadgeCode','LIKE',"%$search%")
->orWhereHas('company', function ($query) use ($search) {
where('Company', 'like', '%'.$search.'%'); })
->orWhere('tazker','LIKE',"%$search%")
->orWhere('lastname','LIKE',"%$search%")
->orWhere('firstname','LIKE',"%$search%")
->orWhere('serialnumber','LIKE',"%$search%")
->orWhere('BadgeType','LIKE',"%$search%");
})->orderBy('BadgeCode','desc')->paginate(20);
} else{
$employees = Employee::with('company')->with('nationality')->latest()->paginate(5);
}
return $employees;
}
HTML Code in Employee.vue is :
<div style="margin-left:450px; margin-top:0px;margin-bottom:-10px;">
<h3 class="card-title">
<div class="card-tools">
<div class="input-group input-group-sm" style="width: 250px;">
<input
name="table_search"
class="form-control float-right"
placeholder="Search"
#keyup="searchit"
v-model="search"
type="search"
aria-label="Search"
/>
<div class="input-group-append">
<button type="submit" class="btn btn-default" #click="searchit">
<i class="fas fa-search"></i>
</button>
</div>
</div>
</div>
</h3>
</div>
Script Code in Employee.vue is :
export default {
data() {
return {
employees :{},
search: "",
},
methods: {
searchit: _.debounce(() => {
Fire.$emit("searching");
}, 300),
},
created() {
Fire.$on("searching", () => {
let query = this.search;
axios
.get("api/findemployee?q=" + query)
.then(data => {
this.employees = data.data;
})
.catch(() => {});
});
}
}
API Rout is :
Route::get('findemployee','API\EmployeeController#search');