kbenestad/reimburse
1
0
Fork 0
mirror of https://github.com/kbenestad/reimburse.git synced 2026-06-18 08:04:31 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Add 'New claim' period button; format period as 'd Mmmm'

Browse source 
- 'New claim' button below the claimant fields fills period from/to
  using defaultPeriod() (previous month, or current if today is the
  last day of the month)
- Period meta in the doctitle now shows '1 June – 30 June' format
  instead of ISO dates

https://claude.ai/code/session_01JyuActqTJG5tuRQNLmT7fZ
This commit is contained in:
Claude 2026-06-08 05:06:15 +00:00
parent 6787fd15a2
commit 08a0d2b0ea
No known key found for this signature in database
1 changed files with 17 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

21
app/index.html
View file

@ -782,12 +782,16 @@ function render() {
const wordmark = el('div', {className:'app-wordmark'});
wordmark.innerHTML = `reimburse<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48"><rect width="48" height="48" rx="12" fill="#2f6fed"/><rect x="7.5" y="14" width="33" height="20" rx="3.2" fill="none" stroke="#fff" stroke-width="2.8"/><circle cx="24" cy="24" r="4.6" fill="none" stroke="#fff" stroke-width="2.6"/><path d="M12.7 21.4V26.6M35.3 21.4V26.6" stroke="#fff" stroke-width="2.6" stroke-linecap="round"/></svg>`;
const periodMeta = el('div', {className:'meta'});
function fmtPeriodDate(iso) {
const [y, m, d] = iso.split('-').map(Number);
return `${d} ${new Date(y, m-1, 1).toLocaleString('en-GB', {month:'long'})}`;
}
function updatePeriodMeta() {
const from = state.periodFrom, to = state.periodTo;
if (from && to) periodMeta.textContent = `${from} – ${to}`;
else if (from) periodMeta.textContent = `From ${from}`;
else if (to) periodMeta.textContent = `Until ${to}`;
else periodMeta.textContent = 'No period selected';
if (from && to) periodMeta.textContent = `${fmtPeriodDate(from)} – ${fmtPeriodDate(to)}`;
else if (from) periodMeta.textContent = `From ${fmtPeriodDate(from)}`;
else if (to) periodMeta.textContent = `Until ${fmtPeriodDate(to)}`;
else periodMeta.textContent = '';
}
updatePeriodMeta();
docTitle.append(wordmark, periodMeta);
@ -831,6 +835,15 @@ function render() {
claimGrid.appendChild(kbField('Period to', toInput));
claimGrid.appendChild(kbField('Base currency', baseCurDD));
claimCard.appendChild(claimGrid);
const fillPeriodBtn = el('button', {type:'button', className:'kb-btn kb-btn--ghost', style:{marginTop:'12px'}}, 'New claim');
fillPeriodBtn.addEventListener('click', () => {
const p = defaultPeriod();
state.periodFrom = p.from; state.periodTo = p.to;
fromInput.value = p.from; toInput.value = p.to;
updatePeriodMeta();
});
claimCard.appendChild(fillPeriodBtn);
wrap.appendChild(claimCard);
// ── Expenses card ─────────────────────────────────────────────────────────