Alterar o valor do item data com uma função

Tenho uma função que incrementa 4 variáveis q estão inicializadas com zero, gostaria de pegar o valor das variáveis após incrementar e jogar dentro do seu respectivo campo.

<script>
import {GoogleCharts} from 'google-charts';
GoogleCharts.load(donutChart);

function donutChart() {

        var data = google.visualization.arrayToDataTable([
          ['Effort', 'Amount given'],
          ['Total',     100],
          ['Fechados',   30],
        ]);
        var options = {
          pieHole: 0.9,
          height: 370,
          width: 370,
          pieSliceTextStyle: {
            color: 'black',
          },
          pieSliceText: "none",
          legend: 'none',
          backgroundColor:"transparent",
          slices: {
            0: { color: '#e8e8e8' },
            1: { color: '#9b17d6' }
          },
        };

        var chart = new google.visualization.PieChart(document.getElementById('donut'));
        chart.draw(data, options);
      }

document.addEventListener("DOMContentLoaded", function() {

  var progressBar = document.querySelectorAll(".progress-bar");
  var porcentagem = document.querySelectorAll(".info");


  var time = 1500;


  progressBar.forEach(function(i) {
    let label = i.children[1];
    let line = i.children[2];
    let count = 0;
    let dataCount = label.getAttribute("data-count");
    let lineCount = line.children[0];     
    let runTime = time/dataCount;

    let animationLineCount = setInterval(function(){
      if(count < dataCount){
        count++;
        label.innerHTML = count;
        lineCount.style.width = count + '%';
      }
    },runTime);
  });
  porcentagem.forEach(function(i) {
    let b = i.children[0];
    let dataCount = b.getAttribute("data-count");
    let count = 0;

    let animationLineCount = setInterval(function(){
      if(count < dataCount){
        count++;
        b.innerHTML = count + '%';
      }
    });
  });
});

export default {

  data() {
    return {
      titulo : 'chamados por status',
      barras: [
        {
          titulo: 'Pendente', 
          dataCount: 0,
          classe: 'pendente' ,

          },
        {
          titulo:'Aberto',
          dataCount: '30',
          classe: 'aberto' ,
          },
        {
          titulo:'Fechados',
          dataCount: '4',
          classe: 'fechado',

          },
        {
          titulo:'Resolvidos',
          dataCount: '10',
          classe: 'resolvido' 
          }         
      ],
      dados: []

    }
  },
    created() {

      this.$http.get('http://localhost:3001/zendesk/tickets/assignee/Sistemas')
        .then(res => res.json())
        .then(dados =>this.dados = dados);
    },
    methods: {      
      total:function(dados) {
        let aberto = 0 ; 
        let pendente = 0;
        let aguardando = 0;                       
        for(let i = 0; i < dados.length; i++) {
          const dado = dados[i]         
          if(dado.status === 'closed'){         
          }
          else if(dado.status === 'open'){
           aberto += 1            
            }
          else if(dado.status === 'pending'){
             pendente += 1      
            }
            else if(dado.status === 'hold'){
              aguardando += 1
            }                  
          }              
        }            
      }    
  } 
</script>

obs: estou consumindo uma api com e tratando o Json.