Skip to content

Commit 81a28fd

Browse files
pix-service-auto-mergepix-service-auto-merge
authored
[FEATURE] Utiliser PixTable dans les tableaux de session et de certification sur Pix Admin (PIX-16809).
 #11558
2 parents 719e6b4 + 8227bcb commit 81a28fd

File tree

18 files changed

+513
-296
lines changed

18 files changed

+513
-296
lines changed

‎admin/app/components/sessions/certifications/header.gjs‎

Lines changed: 26 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,18 @@
11
import PixButton from '@1024pix/pix-ui/components/pix-button';
2+
import PixTag from '@1024pix/pix-ui/components/pix-tag';
23
import PixTooltip from '@1024pix/pix-ui/components/pix-tooltip';
34
import { action } from '@ember/object';
45
import { service } from '@ember/service';
56
import Component from '@glimmer/component';
67
import { tracked } from '@glimmer/tracking';
8+
import { t } from 'ember-intl';
79
import { not } from 'ember-truth-helpers';
810

911
import ConfirmPopup from '../../confirm-popup';
1012

1113
export default class CertificationsHeader extends Component {
1214
@service accessControl;
15+
@service intl;
1316

1417
@tracked isModalDisplayed = false;
1518
@tracked confirmMessage = null;
@@ -26,8 +29,8 @@ export default class CertificationsHeader extends Component {
2629
@action
2730
displayConfirmationModal() {
2831
this.confirmMessage = this.args.session.isPublished
29-
? 'Souhaitez-vous dépublier la session ?'
30-
: 'Souhaitez-vous publier la session ?';
32+
? this.intl.t('pages.certifications.modal-confirmation.unpublish-session-information')
33+
: this.intl.t('pages.certifications.modal-confirmation.publish-session-information');
3134
this.isModalDisplayed = true;
3235
}
3336

@@ -47,30 +50,40 @@ export default class CertificationsHeader extends Component {
4750
}
4851

4952
<template>
50-
<header class="certification-list-page__header">
51-
<h2>Certifications</h2>
52-
{{#if this.accessControl.hasAccessToCertificationActionsScope}}
53-
<div class="btn-group" role="group">
53+
<header>
54+
<h2>{{t "pages.certifications.title"}}</h2>
5455

56+
<div class="certification-list-page__header">
57+
{{#if @session.isPublished}}
58+
<PixTag @color="success">
59+
{{t "pages.certifications.session-state.published"}}
60+
</PixTag>
61+
{{else}}
62+
<PixTag @color="neutral">
63+
{{t "pages.certifications.session-state.not-published"}}
64+
</PixTag>
65+
{{/if}}
66+
67+
{{#if this.accessControl.hasAccessToCertificationActionsScope}}
5568
{{#if @session.isPublished}}
56-
<PixButton @triggerAction={{this.displayConfirmationModal}}>Dépublier la session</PixButton>
69+
<PixButton @triggerAction={{this.displayConfirmationModal}}>{{t
70+
"pages.certifications.actions.unpublish-session"
71+
}}</PixButton>
5772
{{else}}
5873
<PixTooltip @position="left" @isWide={{true}} @hide={{this.canPublish}}>
5974
<:triggerElement>
6075
<PixButton @triggerAction={{this.displayConfirmationModal}} @isDisabled={{not this.canPublish}}>
61-
Publier la session
76+
{{t "pages.certifications.actions.publish-session.label"}}
6277
</PixButton>
6378
</:triggerElement>
6479
<:tooltip>
65-
Vous ne pouvez pas publier la session tant qu'elle n'est pas finalisée ou qu'il reste des certifications
66-
en erreur.
80+
{{t "pages.certifications.actions.publish-session.warning-information"}}
6781
</:tooltip>
6882
</PixTooltip>
6983
{{/if}}
70-
</div>
71-
{{/if}}
84+
{{/if}}
85+
</div>
7286
</header>
73-
7487
<ConfirmPopup
7588
@message={{this.confirmMessage}}
7689
@confirm={{this.toggleSessionPublication}}

‎admin/app/components/sessions/certifications/info-published.gjs‎

Lines changed: 0 additions & 15 deletions
This file was deleted.

‎admin/app/components/sessions/certifications/list.gjs‎

Lines changed: 98 additions & 56 deletions
Original file line numberDiff line numberDiff line change
@@ -1,72 +1,114 @@
11
import PixPagination from '@1024pix/pix-ui/components/pix-pagination';
2+
import PixTable from '@1024pix/pix-ui/components/pix-table';
3+
import PixTableColumn from '@1024pix/pix-ui/components/pix-table-column';
24
import { LinkTo } from '@ember/routing';
35
import Component from '@glimmer/component';
6+
import { t } from 'ember-intl';
47

5-
import CertificationInfoPublished from './info-published';
68
import CertificationStatus from './status';
7-
89
export default class CertificationsHeader extends Component {
910
get sortedCertificationJurySummaries() {
1011
return this.args.juryCertificationSummaries.sortBy('numberOfCertificationIssueReportsWithRequiredAction').reverse();
1112
}
1213

1314
<template>
14-
<div class="table-admin">
15-
<table>
16-
<thead>
17-
<tr>
18-
<th class="table__column table__column--id">ID</th>
19-
<th>Prénom</th>
20-
<th>Nom</th>
21-
<th>Statut</th>
22-
<th>Signalements impactants non résolus</th>
23-
{{#if @displayHasSeenEndTestScreenColumn}}
24-
<th>Ecran de fin de test vu</th>
25-
{{/if}}
26-
<th>Autre certification</th>
27-
<th>Score</th>
28-
<th>Début</th>
29-
<th>Fin</th>
30-
<th>Publiée</th>
31-
</tr>
32-
</thead>
33-
34-
{{#if @juryCertificationSummaries}}
35-
<tbody>
36-
{{#each this.sortedCertificationJurySummaries as |certification|}}
37-
<tr aria-label="Certifications de {{certification.firstName certification.LastName}}">
38-
<td class="table__column table__column--id">
39-
<LinkTo @route="authenticated.certifications.certification.informations" @model={{certification.id}}>
40-
{{certification.id}}
41-
</LinkTo>
42-
</td>
43-
<td>{{certification.firstName}}</td>
44-
<td>{{certification.lastName}}</td>
45-
<td>
46-
<CertificationStatus @record={{certification}} />
47-
</td>
48-
<td
49-
class="certification-list-page__cell--important"
50-
>{{certification.numberOfCertificationIssueReportsWithRequiredActionLabel}}</td>
51-
{{#if @displayHasSeenEndTestScreenColumn}}
52-
<td class="certification-list-page__cell--important">{{certification.hasSeenEndTestScreenLabel}}</td>
53-
{{/if}}
54-
<td>{{certification.complementaryCertificationTakenLabel}}</td>
55-
<td>{{certification.pixScore}}</td>
56-
<td>{{certification.creationDate}}</td>
57-
<td>{{certification.completionDate}}</td>
58-
<td>
59-
<CertificationInfoPublished @record={{certification}} />
60-
</td>
61-
</tr>
62-
{{/each}}
63-
</tbody>
64-
{{/if}}
65-
</table>
66-
</div>
67-
6815
{{#if @juryCertificationSummaries}}
16+
<PixTable
17+
@variant="primary"
18+
@data={{this.sortedCertificationJurySummaries}}
19+
@caption={{t "pages.certifications.table.caption"}}
20+
>
21+
<:columns as |certification context|>
22+
<PixTableColumn @context={{context}}>
23+
<:header>
24+
{{t "pages.certifications.table.headers.id"}}
25+
</:header>
26+
<:cell>
27+
<LinkTo @route="authenticated.certifications.certification.informations" @model={{certification.id}}>
28+
{{certification.id}}
29+
</LinkTo>
30+
</:cell>
31+
</PixTableColumn>
32+
<PixTableColumn @context={{context}}>
33+
<:header>
34+
{{t "pages.certifications.table.headers.first-name"}}
35+
</:header>
36+
<:cell>
37+
{{certification.firstName}}
38+
</:cell>
39+
</PixTableColumn>
40+
<PixTableColumn @context={{context}}>
41+
<:header>
42+
{{t "pages.certifications.table.headers.last-name"}}
43+
</:header>
44+
<:cell>
45+
{{certification.lastName}}
46+
</:cell>
47+
</PixTableColumn>
48+
<PixTableColumn @context={{context}}>
49+
<:header>
50+
{{t "pages.certifications.table.headers.status"}}
51+
</:header>
52+
<:cell>
53+
<CertificationStatus @record={{certification}} />
54+
</:cell>
55+
</PixTableColumn>
56+
<PixTableColumn @context={{context}}>
57+
<:header>
58+
{{t "pages.certifications.table.headers.unresolved-reports"}}
59+
</:header>
60+
<:cell>
61+
{{certification.numberOfCertificationIssueReportsWithRequiredActionLabel}}
62+
</:cell>
63+
</PixTableColumn>
64+
{{#if @displayHasSeenEndTestScreenColumn}}
65+
<PixTableColumn @context={{context}}>
66+
<:header>
67+
Ecran de fin de test vu
68+
</:header>
69+
<:cell>
70+
{{certification.hasSeenEndTestScreenLabel}}
71+
</:cell>
72+
</PixTableColumn>
73+
{{/if}}
74+
<PixTableColumn @context={{context}}>
75+
<:header>
76+
{{t "pages.certifications.table.headers.other-certification"}}
77+
</:header>
78+
<:cell>
79+
{{certification.complementaryCertificationTakenLabel}}
80+
</:cell>
81+
</PixTableColumn>
82+
<PixTableColumn @context={{context}}>
83+
<:header>
84+
{{t "pages.certifications.table.headers.pix-score"}}
85+
</:header>
86+
<:cell>
87+
{{certification.pixScore}}
88+
</:cell>
89+
</PixTableColumn>
90+
<PixTableColumn @context={{context}}>
91+
<:header>
92+
{{t "pages.certifications.table.headers.started-certification-date"}}
93+
</:header>
94+
<:cell>
95+
{{certification.creationDate}}
96+
</:cell>
97+
</PixTableColumn>
98+
<PixTableColumn @context={{context}}>
99+
<:header>
100+
{{t "pages.certifications.table.headers.finished-certification-date"}}
101+
</:header>
102+
<:cell>
103+
{{certification.completionDate}}
104+
</:cell>
105+
</PixTableColumn>
106+
</:columns>
107+
</PixTable>
108+
69109
<PixPagination @pagination={{@pagination}} />
110+
{{else}}
111+
<p class="certification-list-page__empty">{{t "common.tables.empty-result"}}</p>
70112
{{/if}}
71113
</template>
72114
}

0 commit comments

Comments
 (0)