Mirrors/phanpy
1
0
Fork 0
mirror of https://github.com/cheeaun/phanpy.git synced 2025-01-22 08:36:21 +01:00
Code Issues Projects Releases Packages Wiki Activity

More formatting for annual report

Browse source
This commit is contained in:
Lim Chee Aun 2024-12-06 14:01:06 +08:00
parent 4e1572f89c
commit 2304b05c08
3 changed files with 47 additions and 10 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
src/locales/en.po generated
View file

@ -2268,7 +2268,7 @@ msgid "Failed to load history"
msgstr ""
#: src/components/status.jsx:3006
#: src/pages/annual-report.jsx:44
#: src/pages/annual-report.jsx:46
msgid "Loading…"
msgstr ""
@ -2410,7 +2410,7 @@ msgid "Login required."
msgstr "Login required."
#: src/compose.jsx:90
#: src/pages/annual-report.jsx:136
#: src/pages/annual-report.jsx:165
#: src/pages/http-route.jsx:91
#: src/pages/login.jsx:270
msgid "Go home"

14
src/pages/annual-report.css
View file

@ -31,8 +31,13 @@
table {
width: 100%;
td, th {
td,
th {
vertical-align: top;
&.number {
text-align: end;
}
}
th {
@ -44,6 +49,10 @@
tr > * {
border-top: 1px dashed var(--outline-color);
~ * {
padding-inline-start: 1ch;
}
}
}
@ -68,10 +77,9 @@
.status {
pointer-events: none;
font-size: calc(var(--text-size) * .8);
font-size: calc(var(--text-size) * 0.8);
}
}
}
}
}

37
src/pages/annual-report.jsx
View file

@ -35,6 +35,8 @@ export default function AnnualReport() {
const { accounts, annualReports, statuses } = results || {};
const report = annualReports?.find((report) => report.year == year)?.data;
const datePlaceholder = new Date();
return (
<div id="annual-report-page" class="deck-container" tabIndex="-1">
<div class="report">
@ -54,8 +56,16 @@ export default function AnnualReport() {
<table>
<thead>
<tr>
{Object.keys(value[0]).map((key) => (
<th>{key}</th>
{Object.entries(value[0]).map(([key, value]) => (
<th
class={
key !== 'month' && typeof value === 'number'
? 'number'
: ''
}
>
{key}
</th>
))}
</tr>
</thead>
@ -63,7 +73,13 @@ export default function AnnualReport() {
{value.map((item) => (
<tr>
{Object.entries(item).map(([k, value]) => (
<td>
<td
class={
k !== 'month' && typeof value === 'number'
? 'number'
: ''
}
>
{value &&
/(accountId)/i.test(k) &&
/^(mostRebloggedAccounts|commonlyInteractedWithAccounts)$/i.test(
@ -75,6 +91,13 @@ export default function AnnualReport() {
)}
showAvatar
/>
) : k === 'month' ? (
datePlaceholder.setMonth(value - 1) &&
datePlaceholder.toLocaleString(undefined, {
month: 'long',
})
) : typeof value === 'number' ? (
value.toLocaleString()
) : (
value
)}
@ -112,7 +135,13 @@ export default function AnnualReport() {
{Object.entries(value).map(([k, value]) => (
<tr>
<th>{k}</th>
<td>{value}</td>
<td
class={
typeof value === 'number' ? 'number' : ''
}
>
{value}
</td>
</tr>
))}
</tbody>