izyim/resources/assets/vue/components/account/forms/InviteAccountFormComponent.vue

<template>
    <div class="row align-items-center justify-content-center h-100">
        <div class="col">
            <loading-component  v-show="isLoading"></loading-component>
            <div class="row m-t-20" v-show="!isEdit">
                <div class="col">
                    <div class="b-l b-success p-l-15 m-b-15" style="border-left-width: 3px;">
                        <h6 class="bold all-caps no-margin text-success">Invite User</h6>
                        <div class="muted all-caps fs-12">Send an invitation to a new user</div>
                    </div>
                </div>
            </div>
            <form method="post" @submit.prevent="sendInvite">
                <div class="row">
                    <div class="col no-padding">
                        <div class="form-group form-group-default required">
                            <label class="muted">Email Address</label>
                            <input class="form-control" v-model="invite.email">
                        </div>
                        <div class="row">
                            <div class="col text-right no-padding">
                                <button class="btn b-rad-none btn-success" @click="sendInvite" data-dismiss="modal">Send Invite</button>
                            </div>
                        </div>
                    </div>
                </div>
            </form>
        </div>
    </div>
</template>
<script>
    export default {
        data() {
            return {
                invite: {
                    email: '',
                    role_id: 1
                },
				isLoading: false,
                isEdit: false
            }
        },
        methods: {
            sendInvite() {

				//turn on loading animation
                this.isLoading = true;

                var url = route('api.account.invite.create'),
                    method = 'post';

                fetch(url, {
                    method: method,
                    body: JSON.stringify(this.invite),
                    headers: {
                        'content-type': 'application/json'
                    }
                }).catch(error => console.log(error));

                    this.clearForm();
                    Event.$emit('updateInviteList');
                    this.isLoading = false;

            },
            clearForm(){
                this.invite.email = ''
            }
        }
    }
</script>