feat: add guest name tracking and implement client-side attendance table UI
This commit is contained in:
parent
d8c5448bc5
commit
d120f11a7d
@ -1,7 +1,8 @@
|
|||||||
{
|
{
|
||||||
"attendance": {
|
"attendance": {
|
||||||
|
"08/05/25|4": true,
|
||||||
"08/05/25|8": true,
|
"08/05/25|8": true,
|
||||||
"08/05/25|4": true
|
"5=5|8": true
|
||||||
},
|
},
|
||||||
"dates": [
|
"dates": [
|
||||||
"08/05/25",
|
"08/05/25",
|
||||||
@ -17,5 +18,8 @@
|
|||||||
"Frank",
|
"Frank",
|
||||||
"Grace",
|
"Grace",
|
||||||
"Hannah"
|
"Hannah"
|
||||||
]
|
],
|
||||||
|
"guestNames": {
|
||||||
|
"08/05/25": "Robert"
|
||||||
|
}
|
||||||
}
|
}
|
||||||
@ -30,20 +30,17 @@ function renderTable() {
|
|||||||
});
|
});
|
||||||
// Guest column
|
// Guest column
|
||||||
const guestTh = document.createElement('th');
|
const guestTh = document.createElement('th');
|
||||||
const guestInput = document.createElement('input');
|
guestTh.innerText = data.guest || 'Guest';
|
||||||
guestInput.type = 'text';
|
|
||||||
guestInput.value = data.guest;
|
|
||||||
guestInput.onchange = e => {
|
|
||||||
data.guest = e.target.value;
|
|
||||||
saveData();
|
|
||||||
renderTable();
|
|
||||||
};
|
|
||||||
guestTh.appendChild(guestInput);
|
|
||||||
headRow.appendChild(guestTh);
|
headRow.appendChild(guestTh);
|
||||||
|
// Guest Name column (per date)
|
||||||
|
const guestNameTh = document.createElement('th');
|
||||||
|
guestNameTh.innerText = 'Guest Name';
|
||||||
|
headRow.appendChild(guestNameTh);
|
||||||
thead.appendChild(headRow);
|
thead.appendChild(headRow);
|
||||||
table.appendChild(thead);
|
table.appendChild(thead);
|
||||||
// Body rows
|
// Body rows
|
||||||
const tbody = document.createElement('tbody');
|
const tbody = document.createElement('tbody');
|
||||||
|
if (!data.guestNames) data.guestNames = {};
|
||||||
data.dates.forEach((date, rowIdx) => {
|
data.dates.forEach((date, rowIdx) => {
|
||||||
const tr = document.createElement('tr');
|
const tr = document.createElement('tr');
|
||||||
// Date cell
|
// Date cell
|
||||||
@ -72,6 +69,18 @@ function renderTable() {
|
|||||||
};
|
};
|
||||||
tr.appendChild(td);
|
tr.appendChild(td);
|
||||||
});
|
});
|
||||||
|
// Guest Name column (input per date)
|
||||||
|
const guestNameTd = document.createElement('td');
|
||||||
|
const guestNameInput = document.createElement('input');
|
||||||
|
guestNameInput.type = 'text';
|
||||||
|
guestNameInput.value = data.guestNames[date] || '';
|
||||||
|
guestNameInput.placeholder = 'Enter guest name';
|
||||||
|
guestNameInput.onchange = e => {
|
||||||
|
data.guestNames[date] = e.target.value;
|
||||||
|
saveData();
|
||||||
|
};
|
||||||
|
guestNameTd.appendChild(guestNameInput);
|
||||||
|
tr.appendChild(guestNameTd);
|
||||||
tbody.appendChild(tr);
|
tbody.appendChild(tr);
|
||||||
});
|
});
|
||||||
table.appendChild(tbody);
|
table.appendChild(tbody);
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user