Solucionado (ver solução)
Solucionado
(ver solução)
2
respostas

Por algum motivo não funciona levar as tarefas pra store

Espero que dê pra entender. Algumas linhas de códigos foram omitidas. index.ts

      export const store = createStore<Estado>({
    state: {
        projetos: [],
        tarefas: [],
        notificacoes: []
    },
    mutations: {

        //-----------------------------------------------------------------------

        [ADICIONA_TAREFA](state, tarefa:ITarefa){

            state.tarefas.push(tarefa)
        },

Formulario.vue

    export default defineComponent({
    name: 'FormularioVue',
    //array de texto com os eventos que ele emite
    emits: ['aoSalvarTarefa'],
    components: {
        Temporizador
    },
    //método que retorna um estado
    data () {
        return {
            descricao: '',
            idProjeto: '',
        }
    },

    methods: {
        finalizarATarefa(tempoDecorrido: number): void{
            this.$emit('aoSalvarTarefa', {
                id: new Date().toISOString(),
                duracaoEmSegundos: tempoDecorrido,
                descricao: this.descricao,
                projeto: this.projetos.find(projetoItem => projetoItem.id == this.idProjeto)
            }as ITarefa)

            this.descricao = '';
        }
    },
    setup(){
        const store = useStore();
        return {
            projetos: computed(() => store.state.projetos),
            store
        }
    }

});

Tarefa.vue

     <div class="column is-three-quarter conteudo">

        <FormularioVue @aoSalvarTarefa="salvarTarefa"/>

        <div class="lista">

          <Tarefa v-for="tarefa in tarefas" :key="tarefa.id" :tarefa="tarefa" />

          <Box v-if="true">
            Você não está produtivo hoje :(
          </Box>

        </div>

      </div>
    export default defineComponent({
  name: 'Tarefas',
  components: {
    FormularioVue,
    Tarefa,
    Box
  },
  //estado do componente que retorna um objeto
  data () {
    return{
      //tarefas: [] as ITarefa[],   
      modoEscuroAtivo: false
    }
  },

  methods:{
    salvarTarefa (tarefa: ITarefa){
      this.store.commit(ADICIONA_TAREFA, tarefa)
      console.log(tarefa.projeto);

    },
    trocarTema(modoEscuroAtivo: boolean){
      this.modoEscuroAtivo = modoEscuroAtivo;
    },

  },

  setup (){
    const store = useStore();
    return{
      tarefas: computed(() => store.state.tarefas),
      store
    }
  }
});

Tarefa.vue

     <Box>
        <div class="columns">
            <div class="column is-7">
                {{tarefa.descricao || 'Tarefa sem descrição'}}
            </div>
            <div class="column">
                <Cronometro :tempoEmSegundos="tarefa.duracaoEmSegundos" />
            </div>
            <!-- <button class="button ml-2 is-danger" @click="excluir(tarefa)">
                <span class="icon is-small">
                    <i class="fas fa-trash"></i>
                </span>
            </button> -->
        </div>
    </Box>
export default defineComponent({
    name: "Tarefa",
    components: {
        Cronometro,
        Box
    },
    methods:{
        excluir(tarefa:ITarefa){
            this.store.commit(EXCLUI_TAREFA, tarefa)

        }
    },
    props: {
        tarefa: {
            type: Object as PropType<ITarefa>,
            required: true
        }
    },
    setup(){
        const store = useStore();
        return{
            store
        }
    }
})
2 respostas

Tudo bem Nathalia! Conseguiu resolver? O que seria o problema "não consegue levar as tarefas para a store"? As tarefas não estão sendo listadas? Você possui o cógido no github e tem como mencionar?

solução!

Eu consegui resolver, só que eu já nem lembro mais o que tava pegando...

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software