Laravel and Vuejs 3 Image updating not working - laravel

Question

I managed to create a post with image and now I want to be able to update it too. Everything was working fine with the update method when i upload new image and try to update i got old image new iamge isn't updating. Bellow my code:
<form #submit.prevent="UpdateService" enctype="multipart/form-data">
<div class="mb-4">
<label class="form-label" for="image">Upload Image</label>
<input type="file" name="image" #change="onChangeServiceUpdateImage" class="form-control"/>
<img :src="ServiceUpdateForm.url" class="img-fluid mt-2" width="100" />
<HasError :form="ServiceUpdateForm" field="image" />
</div>
</form>
VueComponenet.vue
export default {
data: () => ({
ServiceUpdateForm: new Form({
name: "",
status: "",
desc: "",
icon_class: "",
image: "",
url: "",
_method: "put",
}),
editor: ClassicEditor,
editorConfig: {},
language: 'en',
}),
methods: {
onChangeServiceUpdateImage(e){
// console.log(e.target.files[0]);
const file = e.target.files[0];
this.ServiceUpdateForm.url = URL.createObjectURL(file);
this.ServiceUpdateForm.image = file;
},
async UpdateService() {
let slug = this.$route.params.slug;
$api.post(`/service/${slug}`, this.ServiceUpdateForm).then(() => {
this.$router.push({ name: "backend-service-manage" });
Toast.fire({
icon: 'success',
title: 'Data Update Successful!'
})
}).catch(error => {
Toast.fire({
icon: 'error',
title: 'Data is missing!'
})
});
},
}
Controller
if($request->hasFile('image')){
// Delete Existing Image
if( File::exists('frontend/assets/img/service/' . $service->image) ) {
File::delete('frontend/assets/img/service/' . $service->image);
}
$logo = time().'.'.request()->file('image')->getClientOriginalExtension();
$request->selectedfile->move(public_path('frontend/assets/img/service'), $logo);
$service->image = $logo;
}
$service->save();
return response()->json('success', 200);