Laravel 5, Vue 2 - send html form via controller and bind submit action to the component method

I am trying to bind action to component method, to the button which is sent via ajax response (json).

So far I have two Vue components - Service and Modal.

Service:

<template>
    <div>
        <h1>Services ()</h1>
        <div class="services-actions">
            <button type="button" class="btn btn-primary" @click="openModal">Add Service</button>
        </div>
        <div class="services" v-for="(service, index) in services" :key="service.id">
            <p></p>
        </div>
    </div>
</template>

<script>
export default {
    data(){
        return {
            services: []
        }
    },
    methods: {
        getAll(){
            axios.get('/admin/services/all', {})
            .then((response) => {
                this.services = response.data
            })
        },
        openModal(){
            axios.get('/admin/services/create', {})
            .then((response) => {
               Event.$emit('modal:show', response.data)
            })

        },
        save(){
            console.log('test');
        }

    },
    mounted(){
        this.getAll()
    }
}
</script>

Modal:

<template>

    <div class="modal fade" tabindex="-1" role="dialog" id="main-modal">
        <div class="modal-dialog" role="document">
            <div class="modal-content">


            </div><!-- /.modal-content -->
        </div><!-- /.modal-dialog -->
    </div><!-- /.modal -->

</template>

<script>
    export default {
        mounted(){

            let mainModal = $('#main-modal')

            Event.$on('modal:show', (html) => {
                mainModal.find('.modal-content').html(html)
                mainModal.modal('show')
            })

            Event.$on('modal:hide', () => {
                mainModal.modal('hide')
            })
        }
    }
</script>

View file:

<div class="modal-header">
    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
    <h4 class="modal-title">Modal title</h4>
</div>

<form id=service-store action='/admin/service/store'>

    <label for="name">Name</label>
    <input type="text" name=name id=name>

</form>

<div class="modal-body">
    <p>One fine body&hellip;</p>
</div>

<div class="modal-footer">
    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
    <button type="button" class="btn btn-primary">Save changes</button>
</div>

Is it possible bind save changes to the Service component save method when I click the submit button?

via Chebli Mohamed