1

Bom dia senhores, tenho o seguinte array de objetos:

[{
  key:"-Kw05MQXBFh8uUxDml-v",
  datainicio:"2017-10-09",
  dataprevisao:"2017-10-13",
  descricao:"teste",
  etapa:"A testar",
  numero:"56789",
  qteDias: 4
},
{
  key:"-Kw05iv443JpB9EstNxs",
  datainicio:"2017-10-04",
  dataprevisao:"2017-10-11",
  descricao:"teste",
  etapa:"Em desenvolvimento",
  numero:"56874",
  qteDias: 7
}]

e gostaria de adicionar mais uma posição nos dois objetos, e seria a porcentagem calculando a data previsão referente hoje, exemplo tenho 4 dias para entregar um projeto e ja se passou dois dias então a porcentagem seria 50%..

aqui como gostaria baseando com a data de hoje 09/10/2017:

[{
  key:"-Kw05MQXBFh8uUxDml-v",
  datainicio:"2017-10-09",
  dataprevisao:"2017-10-13",
  descricao:"teste",
  etapa:"A testar",
  numero:"56789",
  qteDias: 4,
  porcentagem: 0.00
},
{
  key:"-Kw05iv443JpB9EstNxs",
  datainicio:"2017-10-04",
  dataprevisao:"2017-10-11",
  descricao:"teste",
  etapa:"Em desenvolvimento",
  numero:"56874",
  qteDias: 7,
  porcentagem: 71.00
}]

então basicamente quero calcular a porcentagem de dias corridos baseando se nos campos datainicio e dataprevisao e adicionar um novo campo no objeto.

Obs: Estou usando vuejs e estou querendo colocar essa lista em computed, o calculo da porcentagem eu já fiz e funciona, mas meu problema é não saber o que usar para adicionar o campo porcentagem em todos objetos, tipo o que posso usar ou melhor forma de realizar esta operação, tentei com um for(kkkk) e não funcionou.

lista () {

  for(i = 0; i < this.cards.length; i++) {
    this.cards[i].porcentagem = 2
  }

  return this.cards;
}

(error during evaluation)

1 Resposta 1

1

Podes usar um método também para fazer isso.

No template terias:

<div v-for="obj in dados">{{percentagem(obj)}}</div>

e nos métodos:

methods: {
    percentagem(obj) {
      const inicio = new Date(obj.datainicio);
      const fim = new Date(obj.dataprevisao);
      const hoje = new Date();
      const perc = (fim - hoje) * 100 / (fim - inicio);
      return perc.toFixed(2) + '%';
    }
}

jsFiddle: https://jsfiddle.net/Sergio_fiddle/uwzxb5rb/

Claro que podes ter uma propriedade computed para isso. Nesse caso seria um mapeamento da array inicial juntando a lógica que coloquei em cima como método.

Para teres isso em modo computed e ordenado pela percentagem podias fazer assim:

new Vue({
  el: '#vue-app',

  data: {
    dados: []
  },

  computed: {
    dadosOrdenados() {
      const dadosComPercentagem = this.dados.map(obj => {
        const inicio = new Date(obj.datainicio);
        const fim = new Date(obj.dataprevisao);
        const hoje = new Date();
        const perc = (fim - hoje) * 100 / (fim - inicio);
        obj.percentagem = perc;
        return obj;
      });
      return dadosComPercentagem.sort((a, b) => a.percentagem - b.percentagem);
    }
  },
  mounted() {
    this.dados = [{
      key: "-Kw05MQXBFh8uUxDml-v",
      datainicio: "2017-10-09",
      dataprevisao: "2017-10-13",
      descricao: "teste",
      etapa: "A testar",
      numero: "56789",
      qteDias: 4,
      porcentagem: 0.00
    }, {
      key: "-Kw05iv443JpB9EstNxs",
      datainicio: "2017-10-04",
      dataprevisao: "2017-10-11",
      descricao: "teste",
      etapa: "Em desenvolvimento",
      numero: "56874",
      qteDias: 7,
      porcentagem: 71.00
    }];
  }
});
<script src="https://vuejs.org/js/vue.min.js"></script>
<div class="container" id="vue-app">
  <div v-for="obj in dadosOrdenados">
    <h3>{{obj.descricao}}</h3>
    <p><span>Percentagem: </span> {{obj.percentagem.toFixed(2) + '%'}}</p>
  </div>
</div>

7
  • Oi Sergio obrigado pela resposta, sua resposta realmente me ajuda na parte de calcular a porcentagem, mas esqueci de mencionar que estou querendo adicionar o valor na lista para efeitos de ordenação dos objetos com o lodash, ou teria outra forma? Commented 9/10/2017 às 12:56
  • @LennonS.Bueno então queres ter a lista ordenada e com essa percentagem calculada é isso?
    – Sergio
    Commented 9/10/2017 às 13:12
  • isso mesmo @Sergio Commented 9/10/2017 às 13:13
  • @LennonS.Bueno qual é o campo que ordena?
    – Sergio
    Commented 9/10/2017 às 13:13
  • ainda não montei o filtro, mas seria pela porcentagem que não tenho na lista pois cada dia a porcentagem precisa ser calculada novamente, datainicio, datafim e numero, mas hoje vem sem nenhuma ordenação @Sergio Commented 9/10/2017 às 13:15

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .