Skip to content

Commit 80260c3

Browse files
andret2344andret2344
committed
EX: Fixed reports modal
1 parent cdd8c92 commit 80260c3

4 files changed

Lines changed: 155 additions & 10 deletions

File tree

‎assets/reports.ts‎

Lines changed: 38 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -40,6 +40,40 @@ function initTabHashSync(): void {
4040

4141
let pendingDetailHref: string | null = null;
4242

43+
function setReportField(id: string, value: string): void {
44+
const el = document.getElementById(id);
45+
if (!el) {
46+
return;
47+
}
48+
if (value) {
49+
el.textContent = value;
50+
el.classList.remove('report-content-empty');
51+
} else {
52+
el.textContent = '—';
53+
el.classList.add('report-content-empty');
54+
}
55+
}
56+
57+
function formatReportType(raw: string): string {
58+
if (!raw) {
59+
return '';
60+
}
61+
const spaced = raw.toLowerCase().replace(/_/g, ' ');
62+
return spaced.charAt(0).toUpperCase() + spaced.slice(1);
63+
}
64+
65+
function populateSuggestionContent(row: HTMLElement): void {
66+
setReportField('suggestionReportName', row.dataset.reportName ?? '');
67+
setReportField('suggestionReportDate', row.dataset.reportDate ?? '');
68+
setReportField('suggestionReportCountry', row.dataset.reportCountry ?? '');
69+
setReportField('suggestionReportDescription', row.dataset.reportDescription ?? '');
70+
}
71+
72+
function populateErrorContent(row: HTMLElement): void {
73+
setReportField('errorReportType', formatReportType(row.dataset.reportType ?? ''));
74+
setReportField('errorReportDescription', row.dataset.reportDescription ?? '');
75+
}
76+
4377
function setReferredHoliday(row: HTMLElement | null): void {
4478
const card = document.getElementById('referredHolidayCard');
4579
const nameEl = document.getElementById('referredHolidayName');
@@ -226,6 +260,9 @@ function initSuggestionModal(): void {
226260
errorBoxId: 'suggestionError',
227261
saveBtnId: 'suggestionSave',
228262
deleteBtnId: 'suggestionDelete',
263+
onShow: trigger => {
264+
populateSuggestionContent(trigger);
265+
},
229266
});
230267
}
231268

@@ -258,6 +295,7 @@ function initErrorModal(): void {
258295
deleteBtnId: 'errorDelete',
259296
onShow: trigger => {
260297
setReferredHoliday(trigger);
298+
populateErrorContent(trigger);
261299
},
262300
onHide: () => {
263301
pendingDetailHref = null;

‎assets/styles/app.scss‎

Lines changed: 75 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1295,6 +1295,81 @@ body {
12951295
}
12961296
}
12971297

1298+
// Submitted report content card (lives inside a modal — global, not nested under .section-manage-main)
1299+
.report-content-card {
1300+
position: relative;
1301+
background: linear-gradient(135deg, #1a1a30 0%, #0c0c1e 100%);
1302+
border: 1px solid #2a2a4a;
1303+
border-radius: 12px;
1304+
padding: 14px 16px 12px;
1305+
box-shadow: 0 2px 12px rgba(0, 0, 0, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.02);
1306+
1307+
&::before {
1308+
content: '';
1309+
position: absolute;
1310+
top: 0;
1311+
left: 0;
1312+
bottom: 0;
1313+
width: 3px;
1314+
background: linear-gradient(180deg, #a06060, #aa3030);
1315+
border-radius: 12px 0 0 12px;
1316+
}
1317+
1318+
.report-content-label {
1319+
display: flex;
1320+
align-items: center;
1321+
gap: 6px;
1322+
text-transform: uppercase;
1323+
letter-spacing: 0.08em;
1324+
font-size: 10.5px;
1325+
font-weight: 600;
1326+
color: #d08a8a;
1327+
margin-bottom: 10px;
1328+
1329+
i {
1330+
font-size: 13px;
1331+
color: #cc6a6a;
1332+
}
1333+
}
1334+
1335+
.report-content-grid {
1336+
display: grid;
1337+
grid-template-columns: max-content 1fr;
1338+
column-gap: 14px;
1339+
row-gap: 6px;
1340+
margin: 0;
1341+
1342+
dt {
1343+
font-size: 11px;
1344+
font-weight: 600;
1345+
text-transform: uppercase;
1346+
letter-spacing: 0.05em;
1347+
color: #7a7a9a;
1348+
padding-top: 2px;
1349+
}
1350+
1351+
dd {
1352+
margin: 0;
1353+
color: #e6e6f6;
1354+
font-size: 13.5px;
1355+
line-height: 1.4;
1356+
word-wrap: break-word;
1357+
overflow-wrap: anywhere;
1358+
}
1359+
1360+
.report-content-empty {
1361+
color: #555575;
1362+
font-style: italic;
1363+
}
1364+
}
1365+
1366+
.report-content-description {
1367+
white-space: pre-wrap;
1368+
max-height: 12em;
1369+
overflow-y: auto;
1370+
}
1371+
}
1372+
12981373
// Report state badge (used both in tables and modal — must be global)
12991374
.report-state {
13001375
font-size: 11px;

‎templates/admin/components/reports_table.html.twig‎

Lines changed: 14 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -37,14 +37,12 @@
3737
{% for r in rows %}
3838
{# Resolve linked metadata id + PL referent + edit payload uniformly. #}
3939
{% set linkedId = isError ? (r.metadata ? r.metadata.id : null) : (r.holiday ? r.holiday.id : null) %}
40-
{% set plData = isFloating ? (floatingHolidaysPl[linkedId] ?? null) : (fixedHolidaysPl[linkedId] ?? null) %}
41-
{% if isError %}
42-
{% set referredName = plData ? plData.name : null %}
43-
{% set referredDescription = plData ? plData.description : null %}
44-
{% else %}
45-
{% set referredName = r.name %}
46-
{% set referredDescription = r.description %}
47-
{% endif %}
40+
{% set plData = isError ? (isFloating ? (floatingHolidaysPl[linkedId] ?? null) : (fixedHolidaysPl[linkedId] ?? null)) : null %}
41+
{% set referredName = isError ? (plData ? plData.name : null) : null %}
42+
{% set referredDescription = isError ? (plData ? plData.description : null) : null %}
43+
{% set reportDate = isError ? '' : (isFloating ? r.date : '%02d.%02d'|format(r.day, r.month)) %}
44+
{% set reportCountry = isError ? '' : (r.country ? r.country.isoCode : '') %}
45+
{% set reportType = isError ? r.reportType.value : '' %}
4846
{% set detailHref = linkedId
4947
? path('admin_holiday_detail', {kind: isFloating ? 'floating' : 'fixed', id: linkedId})
5048
: '' %}
@@ -57,6 +55,11 @@
5755
data-state='{{ r.reportState.value }}'
5856
data-comment='{{ (r.comment ?? '')|e('html_attr') }}'
5957
data-holiday-id='{{ linkedId ?? '' }}'
58+
data-report-name='{{ (isError ? '' : r.name)|e('html_attr') }}'
59+
data-report-description='{{ (r.description ?? '')|e('html_attr') }}'
60+
data-report-date='{{ reportDate }}'
61+
data-report-country='{{ reportCountry }}'
62+
data-report-type='{{ reportType }}'
6063
data-referred-name='{{ (referredName ?? '')|e('html_attr') }}'
6164
data-referred-description='{{ (referredDescription ?? '')|e('html_attr') }}'
6265
data-detail-href='{{ detailHref }}'
@@ -102,13 +105,14 @@
102105
</span>
103106
</td>
104107
<td>{{ r.datetime|date('Y-m-d H:i') }}</td>
105-
<td class='user-cell'>
108+
<td class='user-cell' title='{{ r.userId }}'>
106109
{% set u = users[r.userId] ?? null %}
107110
{% if u and (u.name or u.email) %}
108111
<div class='user-name'>{{ u.name ?? '-' }}</div>
109112
<div class='user-email'>{{ u.email ?? '-' }}</div>
113+
{% else %}
114+
<div class='user-uid'>{{ r.userId }}</div>
110115
{% endif %}
111-
<div class='user-uid'>{{ r.userId }}</div>
112116
</td>
113117
</tr>
114118
{% endfor %}

‎templates/admin/reports.html.twig‎

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -88,6 +88,22 @@
8888
<button type='button' class='btn-close' data-bs-dismiss='modal' aria-label='Close'></button>
8989
</div>
9090
<div class='modal-body'>
91+
<div class='report-content-card mb-3'>
92+
<div class='report-content-label'>
93+
<i class='bi bi-person-lines-fill'></i>
94+
Submitted by user
95+
</div>
96+
<dl class='report-content-grid'>
97+
<dt>Name</dt>
98+
<dd id='suggestionReportName'></dd>
99+
<dt>Date</dt>
100+
<dd id='suggestionReportDate'></dd>
101+
<dt>Country</dt>
102+
<dd id='suggestionReportCountry'></dd>
103+
<dt>Description</dt>
104+
<dd id='suggestionReportDescription' class='report-content-description'></dd>
105+
</dl>
106+
</div>
91107
<form id='suggestionForm'>
92108
<input type='hidden' id='suggestionKind'>
93109
<input type='hidden' id='suggestionId'>
@@ -154,6 +170,18 @@
154170
<span>No referred holiday.</span>
155171
</div>
156172
</div>
173+
<div class='report-content-card mb-3'>
174+
<div class='report-content-label'>
175+
<i class='bi bi-person-lines-fill'></i>
176+
Submitted by user
177+
</div>
178+
<dl class='report-content-grid'>
179+
<dt>Type</dt>
180+
<dd id='errorReportType'></dd>
181+
<dt>Description</dt>
182+
<dd id='errorReportDescription' class='report-content-description'></dd>
183+
</dl>
184+
</div>
157185
<form id='errorForm'>
158186
<input type='hidden' id='errorKind'>
159187
<input type='hidden' id='errorId'>

0 commit comments

Comments
 (0)