|
|
@@ -0,0 +1,103 @@
|
|
|
+<template>
|
|
|
+ <q-dialog ref="dialogRef" @hide="onDialogHide">
|
|
|
+ <q-card class="q-dialog-plugin overflow-hidden" style="width: 520px; max-width: 90vw">
|
|
|
+ <DefaultDialogHeader :title="title" @close="onDialogCancel" />
|
|
|
+ <q-form ref="formRef" @submit="onOKClick">
|
|
|
+ <q-card-section class="row q-col-gutter-sm q-pt-none">
|
|
|
+ <DefaultSelect
|
|
|
+ v-model="form.transaction_type"
|
|
|
+ v-model:error="validationErrors.transaction_type"
|
|
|
+ :options="typeOptions"
|
|
|
+ emit-value
|
|
|
+ map-options
|
|
|
+ :rules="[inputRules.required]"
|
|
|
+ label="Tipo"
|
|
|
+ placeholder="Entrada ou Saída"
|
|
|
+ class="col-12"
|
|
|
+ />
|
|
|
+
|
|
|
+ <DefaultInput
|
|
|
+ v-model="form.description"
|
|
|
+ v-model:error="validationErrors.description"
|
|
|
+ :rules="[inputRules.required]"
|
|
|
+ label="Descrição"
|
|
|
+ placeholder="Descreva a movimentação"
|
|
|
+ class="col-12"
|
|
|
+ />
|
|
|
+
|
|
|
+ <DefaultCurrencyInput
|
|
|
+ v-model="form.amount"
|
|
|
+ v-model:error="validationErrors.amount"
|
|
|
+ label="Valor"
|
|
|
+ class="col-12"
|
|
|
+ />
|
|
|
+ </q-card-section>
|
|
|
+
|
|
|
+ <q-card-actions align="right">
|
|
|
+ <q-btn outline color="negative" label="Cancelar" @click="onDialogCancel" />
|
|
|
+ <q-btn color="primary" label="Salvar" type="submit" :loading="loading" />
|
|
|
+ </q-card-actions>
|
|
|
+ </q-form>
|
|
|
+ </q-card>
|
|
|
+ </q-dialog>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script setup>
|
|
|
+import { ref } from "vue";
|
|
|
+import { useDialogPluginComponent } from "quasar";
|
|
|
+import { useInputRules } from "src/composables/useInputRules";
|
|
|
+import { useSubmitHandler } from "src/composables/useSubmitHandler";
|
|
|
+import { createTreasuryLaunch } from "src/api/treasury_launch";
|
|
|
+
|
|
|
+import DefaultDialogHeader from "src/components/defaults/DefaultDialogHeader.vue";
|
|
|
+import DefaultInput from "src/components/defaults/DefaultInput.vue";
|
|
|
+import DefaultSelect from "src/components/defaults/DefaultSelect.vue";
|
|
|
+import DefaultCurrencyInput from "src/components/defaults/DefaultCurrencyInput.vue";
|
|
|
+
|
|
|
+defineEmits([...useDialogPluginComponent.emits]);
|
|
|
+
|
|
|
+const { account } = defineProps({
|
|
|
+ account: {
|
|
|
+ type: Object,
|
|
|
+ required: true,
|
|
|
+ },
|
|
|
+});
|
|
|
+
|
|
|
+const { inputRules } = useInputRules();
|
|
|
+
|
|
|
+const { dialogRef, onDialogHide, onDialogOK, onDialogCancel } = useDialogPluginComponent();
|
|
|
+
|
|
|
+const formRef = ref(null);
|
|
|
+const title = `Nova movimentação — ${account.name}`;
|
|
|
+
|
|
|
+const typeOptions = [
|
|
|
+ { label: "Entrada", value: "entrada" },
|
|
|
+ { label: "Saída", value: "saida" },
|
|
|
+];
|
|
|
+
|
|
|
+const form = ref({
|
|
|
+ transaction_type: null,
|
|
|
+ description: "",
|
|
|
+ amount: 0,
|
|
|
+});
|
|
|
+
|
|
|
+const {
|
|
|
+ loading,
|
|
|
+ validationErrors,
|
|
|
+ execute: submitForm,
|
|
|
+} = useSubmitHandler({
|
|
|
+ onSuccess: (response) => onDialogOK(response),
|
|
|
+ formRef,
|
|
|
+});
|
|
|
+
|
|
|
+const onOKClick = async () => {
|
|
|
+ await submitForm(() =>
|
|
|
+ createTreasuryLaunch({
|
|
|
+ account_id: account.id,
|
|
|
+ transaction_type: form.value.transaction_type,
|
|
|
+ description: form.value.description,
|
|
|
+ amount: form.value.amount,
|
|
|
+ }),
|
|
|
+ );
|
|
|
+};
|
|
|
+</script>
|