budgeteer/web/src/dialogs/NewBudget.vue

29 lines
602 B
Vue

<script lang="ts" setup>
import Modal from '../components/Modal.vue';
import { ref } from "vue";
import { useBudgetsStore } from '../stores/budget';
import Input from '../components/Input.vue';
const budgetName = ref("");
function saveBudget() {
useBudgetsStore().NewBudget(budgetName.value);
};
</script>
<template>
<Modal
button-text="New Budget"
@submit="saveBudget"
>
<div class="mt-2 px-7 py-3">
<Input
v-model="budgetName"
class="border-2"
type="text"
placeholder="Budget name"
required
/>
</div>
</Modal>
</template>