const requestFunc = async(url, method = "GET", data = null, token = null) => { apihost = 'http://127.0.0.1/api' method = method.toLocaleUpperCase() let fullurl = `${apihost}${url}`; let options = { method: method, headers: { "Content-Type": "application/json", "Authorization": `Bearer ${token}`, }, }; switch(method) { case "PUT": delete options.headers["Content-Type"]; options.body = data; break; case "POST": case "PATCH": case "DELETE": options.body = JSON.stringify(data); break; } const res = await fetch(fullurl, options); return await res.json(); }; var app = new Vue({ el: '#app', delimiters: ['${', '}'], data: { classrooms:[], buildings: [], selectedRow: { "Code": "", "Name": "", "IDDuration": 0, "ID": "" }, }, methods: { showClassrooms() { console.log(this.classrooms) }, selectRow(row, index){ let rows = document.querySelectorAll('.clickHover') console.log(index) this.selectedRow = row; // for(let i = 0; i < row.length; i++) { // rows[i].style.backgroundColor = 'red' // } console.log(rows) console.log(rows[index].style.backgroundColor) // empty string if(rows[index].style.backgroundColor != 'red'){ rows[index].style.backgroundColor = 'red' } else{ rows[index].style.backgroundColor = 'white' this.clearSelectedRow() } console.log(row) }, clearSelectedRow(){ this.selectedRow = { "Code": "", "Name": "", "IDDuration": 0 } }, async getClassrooms(){ this.classrooms = await requestFunc("/classroom", "GET") }, async getBuildings() { const buildings = await requestFunc("/building/", "GET") .then(response => { console.log(response) this.buildings = response }) }, }, mounted() { this.getClassrooms() this.getBuildings() } }); addClassroom = () =>{ let number = document.querySelector('.numberCab').value let placeQuantity = document.querySelector('.placeQuantity').value let building = document.querySelectorAll('.building-radio'); let radioValue for(let i=0; i