snegov/notif-visa-ext
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Use table for consulates info

Browse Source
This commit is contained in:
Maks Snegov 2024-04-24 16:33:16 -07:00
parent 99e61bb1fc
commit 91672725fa
2 changed files with 25 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
popup/popup.html
View File

@ -74,9 +74,7 @@
<!-- consulates --> <!-- consulates -->
<div class="row"> <div class="row">
<div class="col"> <div class="col">Consulates:</div>
Consulates:
</div>
</div> </div>
<div id="consulatesConfig"> <div id="consulatesConfig">
</div> </div>

40
popup/popup.js
View File

@ -83,35 +83,43 @@
await chrome.storage.local.get(['__consulates']).then((result) => { await chrome.storage.local.get(['__consulates']).then((result) => {
let consulates = result['__consulates']; let consulates = result['__consulates'];
let html = ''; let html = `
<table class="table table-striped">
<thead>
<tr>
<th scope="col"></th>
<th scope="col">City</th>
<th scope="col" style="white-space: nowrap;">Current Date</th>
<th scope="col" style="white-space: nowrap;">Best Date</th>
<th scope="col">Autobook</th>
</tr>
</thead>
<tbody>
`
for (let c in consulates) { for (let c in consulates) {
console.log(c, consulates[c])
let cSelected = consulates[c].isSelected === true ? "checked" : ""; let cSelected = consulates[c].isSelected === true ? "checked" : "";
let cAutobook = consulates[c].autobook === true ? "checked" : ""; let cAutobook = consulates[c].autobook === true ? "checked" : "";
let cName = c.replace(/ /g, '&nbsp;')
let cId = consulates[c].id; let cId = consulates[c].id;
html += ` html += `
<div class="row"> <tr>
<div class="col"> <td>
<div class="form-check form-checkbox" style="text-align: left;"> <div class="form-check form-checkbox" style="text-align: left;">
<input class="form-check-input" type="checkbox" role="switch" id="isSelected-${cId}" ${cSelected}> <input class="form-check-input" type="checkbox" role="switch" id="isSelected-${cId}" ${cSelected}>
</div> </div>
</div> </td>
<div class="col">${cName}</div> <td style="white-space: nowrap;">${c}</td>
<div class="col"><span id="bestDate-${cId}">${consulates[c].bestDate || "-"}</span></div> <td style="white-space: nowrap;"><span id="currentDate-${cId}">${consulates[c].currentDate || "-"}</span></td>
<div class="col"><span id="currentDate-${cId}">${consulates[c].currentDate || "-"}</span></div> <td style="white-space: nowrap;"><span id="bestDate-${cId}">${consulates[c].bestDate || "-"}</span></td>
<div class="col"> <td>
<div class="form-check form-switch" style="text-align: left;"> <div class="form-check form-switch" style="text-align: left;">
<input class="form-check-input" type="checkbox" role="switch" id="autobook-${cId}" ${cAutobook}> <input class="form-check-input" type="checkbox" role="switch" id="autobook-${cId}" ${cAutobook}>
<label class="form-check-label" for="autobook-${cId}">Autobook</label> <!--<label class="form-check-label" for="autobook-${cId}">Autobook</label>-->
</div> </div>
</div> </td>
</div> </tr>
`; `;
} }
if (html === '') { html += `</tbody></table>`;
html = "No consulates found.";
}
document.getElementById('consulatesConfig').innerHTML = html; document.getElementById('consulatesConfig').innerHTML = html;
for (let c in consulates) { for (let c in consulates) {