Vue Создать запись в БД

UI Компоненты
resources\js\components\UI

Модальное окно
используем для отображения формы создания записи
resources\js\components\UI\MyDialog.vue

<template>
<div class="dialog" v-if="show" @click.stop="hideDialog">
 <div @click.stop class="dialog_content">
 <slot></slot>
 </div>
</div>
</template>

<script>
export default{
 name: 'my-dialog',
 props: {
  show: {
   type:Boolean,
   default: false,
  }
 },
 methods: {
  hideDialog() {
   this.$emit('update:show',false);
  }
 } 
}
</script>

<style scoped>
.dialog {
 top: 0;
 bottom: 0;
 right: 0;
 left: 0;
 background: rgba(0,0,0, 0.5); 
 position: fixed;
 display:flex; 
}
.dialog_content {
 margin: auto; 
 background: white;
 border-radius: 12px; 
 min-height: 50px; 
 min-width: 300px; 
 padding: 20px;
}
</style>

Кнопка
используем для отображения модального окна
resources\js\components\UI\MyButton.vue

<template>
<button class="btn">
<slot></slot>
</button>
</template>
<script>
export default {}
</script>

<style scoped>
.btn{ 
 padding: 10px 15px;
 background:none;
 color:teal;
 border: 1px solid teal;
}
</style>