How to solve 500 (internal server error) on delete modal vue.js?

My view is like this :

@foreach($account_list as $account)
<table class="table table-bordered">
    ...
        <li>
            <a href="javascript:;" @click="modalShow('modal-delete-account',{{ $account['id'] }})">
                <span class="glyphicon glyphicon-trash"></span> Delete
            </a>
        </li>
    ...
</table>
@endforeach

My modal is like this :

<template>
    <div class="modal" tabindex="-1" role="dialog">
        ...
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
                <button type="button" class="btn btn-success" @click="deleteAccount">OK</button>
            </div> 
        ...
    </div>
</template>

<script>
    export default{
        name: 'DeleteAccountModal',
        props:['idAccount'],
        methods:{
            deleteAccount(event){
                event.target.disabled = true
                const payload= {id_account: this.idAccount}
                this.$store.dispatch('deleteAccount', payload);
                window.location.reload(true)
            }
        }
    }
</script>

My routes is like this :

Route::group(['middleware' => 'auth', 'prefix'=>'member', 'as'=>'member.'], function () {
    ...
    Route::group(['prefix' => 'profile', 'as'=>'profile.'], function () {
        ...
        Route::post('setting/account/delete', 'Member\UserBankController@deleteAccount');
        ...
    });
    ...
});

My account.js (resources\assets\js\api\account.js) is like this :

import Vue from 'vue'
import Resource from 'vue-resource'
Vue.use(Resource)
export default {
    ...
    delete (account, cb, ecb = null ) {
        Vue.http.post(window.Laravel.baseUrl+'/member/profile/setting/account/delete', account)
            .then(
            (resp) => cb(resp.data),
            (resp) => ecb(resp.data)
        );
    },
    ...
}

My controller is like this :

public function deleteAccount(Request $request)
{
    $id_account = $request->input('id_account');
    try{
        if($this->user_service->deleteAccount($id_account)) {
            return $this->respond(['status' => 'Success']);
        }else {
            return $this->respond(['status' => 'Failed Delete']);
        }
    }catch (\Exception $exception){
        return $this->respondInternalError();
    }
}

My service is like this :

public function deleteAccount($id)
{
    return $this->user_bank_repository->delete($id);
}

My repository is like this :

public function delete($id)
{
    $data = self::find($id)->delete();

    return $data;
} 

When I click the delete button, it will show a modal with vue.js. After that I click ok button to remove it. But there was no record has been deleted.

On the console looks like this :

There exist error : 500 (internal server error)

How to solve this problem?