If it helps, my son helped me and looking at your code he added a few lines and now its working in our server.
<!doctype html>
<html lang="en">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Bootstrap CSS -->
<title>Connect Stats</title>
</head>
<body>
<div id="app" class="container">
<!-- Over All Server Stats -->
<div class="row ">
<div class="col-4 card">
<h2 class="card-title">Total de Salas </h2>
<p class="card-text" id="tMeetings">{{ Meetings }}</p>
</div>
<div class="col-4 card">
<h2 class="card-title">Total de Cámaras </h2>
<p class="card-text" id="tMeetings">{{ Webcams }}</p>
</div>
<div class="col-4 card">
<h2 class="card-title">Total de Participantes</h2>
<p class="card-text" id="tParticipants">{{ Participants }}</p>
</div>
</div>
<!-- Meetings -->
<div class="row border border-secondary mt-md-5" v-for="Meeting in MeetingData" >
<!-- Meeting Stats -->
<div class="col border-bottom border-secondary">
<div class="row">
<div class="col card">
<span class="card-text">Nombre de la sala : {{Meeting["meetingName"]}}</span>
<span class="card-text">ID de la sala : {{Meeting["meetingID"]}}</span>
<span class="card-text">Origen : {{Meeting["bbbOrigin"]}}</span>
<span class="card-text">Curso : {{Meeting["bbbContext"]}}</span>
<span class="card-text">Hora de inicio : {{Meeting["createDate"]}}</span>
</div>
<div class="col card">
<p>Participantes : {{Meeting["attendeescount"]}}</p>
</div>
<div class="col card">
<p>Cámaras activas : {{Meeting["cams"]}}</p>
</div>
</div>
</div>
<!-- Meeting Attendees -->
<div class="col-12" >
<table class="table table-striped">
<thead>
<tr>
<td>ID Usuario</td>
<td>Nombre</td>
<td>Rol</td>
<td>Presentador</td>
<td>Solo escuchar</td>
<td>Micrófono</td>
<td>Web Cam</td>
<td>Tipo de cliente</td>
</tr>
</thead>
<tbody>
<tr v-for='person in Meeting["attendee"]'>
<td>{{person[0]}}</td>
<td>{{person[1]}}</td>
<td>{{person[2]}}</td>
<td>{{person[3]}}</td>
<td>{{person[4]}}</td>
<td>{{person[5]}}</td>
<td>{{person[6]}}</td>
<td>{{person[7]}}</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<script>
var xl ;
var MA;
var table ;
var app = new Vue({
el: '#app',
data: {
DataXML: "xmldata" ,
Meetings: 0,
Participants: 0,
Webcams: 0,
MeetingData: Array()
},
methods: {
getdata(data="newdata") {
//alert("Getting data");
app.DataXML = data;
axios.get('APIBBBCALL').then(response => {
app.DataXML = new DOMParser().parseFromString(response.data,"text/xml");
xl = meetings = app.DataXML.getElementsByTagName("meeting");
tattendee = app.DataXML.getElementsByTagName("attendee")
webCams = MA = app.DataXML.getElementsByTagName("hasVideo");
app.Webcams = 0;
for (i=0;i < webCams.length;i++ ){
if (webCams[i].innerHTML == "true"){
app.Webcams++;
}
}
app.Meetings = meetings.length;
app.Participants = tattendee.length;
//app.DataXML = response.data;
table = Array();
name = "";
for (i=0;i<meetings.length;i++){
var Mattendee = meetings.item(i).getElementsByTagName("attendee");
var Mattendeedata = Array();
var cams = 0;
for (x=0; x < Mattendee.length;x++){
Mattendeedata.push([
Mattendee[x].children[0].innerHTML,
Mattendee[x].children[1].innerHTML,
Mattendee[x].children[2].innerHTML,
Mattendee[x].children[3].innerHTML,
Mattendee[x].children[4].innerHTML,
Mattendee[x].children[5].innerHTML,
Mattendee[x].children[6].innerHTML,
Mattendee[x].children[7].innerHTML
]);
if (Mattendee[x].children[6].innerHTML == "true"){
cams++;
}
}
try{
var context = meetings.item(i).getElementsByTagName("bbb-context").item(0).textContent
var origin = meetings.item(i).getElementsByTagName("bbb-origin").item(0).textContent
}
catch(err){
var context = "--"
var origin = "GreenLight"
}
var row = {
meetingName : meetings.item(i).getElementsByTagName("meetingName").item(0).textContent,
meetingID : meetings.item(i).getElementsByTagName("meetingID").item(0).textContent,
bbbOrigin : origin,
bbbContext : context,
createDate : meetings.item(i).getElementsByTagName("createDate").item(0).textContent,
attendeescount : Mattendee.length,
attendee: Mattendeedata,
cams: cams
};
table.push(row);
}
app.MeetingData = table;
});
}
}
});
document.addEventListener('DOMContentLoaded', function() {
//alert("ready");
app.getdata("function data");
window.setInterval(function(){app.getdata("function data");}, 20000);
});
</script>
<!-- Optional JavaScript -->
<!-- jQuery first, then Popper.js, then Bootstrap JS -->
</body>
</html>