works on REDLINE-17

Author: sombriks

web-app-vue/src/components/movimentacao/nova-movimentacao.vue

@@ -1,25 +1,51 @@
 <template>
   <form @submit.stop.prevent="salvarMovimentacao()">
-    <select v-model="novaMovimentacao.tipo">
-      <option>Selecione uma conta</option>
+    <select required v-model="novaMovimentacao.tipo">
+      <option :value="null">Selecione um tipo</option>
       <option v-for="tipo in mState.store.tiposMovimentacao" :key="tipo.id" :value="tipo">
         {{ tipo.descricao }}
-      </option>
-    </select>
-    <input placeholder="valor" />
+      </option></select
+    ><br />
+    <select required v-model="novaMovimentacao.conta">
+      <option :value="null">Selecione uma conta</option>
+      <option v-for="conta in cState.store.contas" :key="conta.id" :value="conta">
+        {{ conta.descricao }}
+      </option></select
+    ><br />
+    <input required placeholder="descrição" v-model="novaMovimentacao.descricao" /><br />
+    <input required placeholder="valor" v-model="novaMovimentacao.valor" />
     <button type="submit">salvar</button>
   </form>
 </template>
 <script setup>
 import { useMovimentacaoStore } from '@/stores/movimentacaoStore'
-import { reactive } from 'vue'
+import { onMounted, reactive } from 'vue'
+import { useContaStore } from '@/stores/contaStore'
 
 const mState = useMovimentacaoStore()
+const cState = useContaStore()
 
 const novaMovimentacao = reactive({
-  tipo: { id: 2, descricao: 'SAIDA' }
+  tipo: null,
+  conta: null,
+  descricao: '',
+  valor: 0
 })
 
-const salvarMovimentacao = async () => {}
+const salvarMovimentacao = async () => {
+  await mState.salvarMovimentacao({
+    descricao: novaMovimentacao.descricao,
+    valor: novaMovimentacao.valor,
+    conta_id: novaMovimentacao.conta?.id,
+    tipo_conta_id: novaMovimentacao?.tipo.id
+  })
+  await cState.sincronizarContas()
+  await mState.sincronizarMovimentacoes()
+}
+
+onMounted(async () => {
+  await cState.sincronizarContas()
+  await mState.sincronizarMovimentacoes()
+})
 </script>
 <style scoped></style>

web-app-vue/src/stores/movimentacaoStore.js

@@ -29,5 +29,10 @@ export const useMovimentacaoStore = defineStore('movimentacao-store', () => {
     })
   }
 
-  return { store, sincronizarMovimentacoes }
+  const salvarMovimentacao = async (movimentacao) => {
+    const { id } = uState.userData
+    console.log(id, movimentacao)
+  }
+
+  return { store, sincronizarMovimentacoes, salvarMovimentacao }
 })