[TECH] PixAdmin - Composants Certifications sous gjs (PIX-13892)

 #9872

admin/app/components/certifications/certification/comments.gjs

@@ -0,0 +1,91 @@
+import PixButton from '@1024pix/pix-ui/components/pix-button';
+import PixTextarea from '@1024pix/pix-ui/components/pix-textarea';
+import { on } from '@ember/modifier';
+import { action } from '@ember/object';
+import Component from '@glimmer/component';
+import { tracked } from '@glimmer/tracking';
+import pick from 'ember-composable-helpers/helpers/pick';
+import set from 'ember-set-helper/helpers/set';
+
+import CertificationInfoField from '../info-field';
+
+export default class Comments extends Component {
+  @tracked isEditingJuryComment = false;
+  @tracked commentByJury;
+
+  @action
+  editJuryComment() {
+    this.isEditingJuryComment = true;
+  }
+
+  @action
+  async saveJuryComment() {
+    const hasBeenSaved = await this.args.onJuryCommentSave(this.commentByJury);
+    if (hasBeenSaved) {
+      this.cancelJuryCommentEdition();
+    }
+  }
+
+  @action
+  cancelJuryCommentEdition() {
+    this.isEditingJuryComment = false;
+  }
+
+  <template>
+    <div class="certification-informations__row">
+      <div class="certification-informations__card">
+        <h2 class="certification-informations__card__title">Commentaires jury</h2>
+        <CertificationInfoField
+          @value={{@certification.commentForCandidate}}
+          @edition={{false}}
+          @label="Pour le candidat :"
+          @fieldId="certification-commentForCandidate"
+        />
+        <CertificationInfoField
+          @value={{@certification.commentForOrganization}}
+          @edition={{false}}
+          @label="Pour l'organisation :"
+          @fieldId="certification-commentForOrganization"
+        />
+        <div class="certification-info-field">
+          {{#if this.isEditingJuryComment}}
+            <label for="certification-commentByJury" class="certification-info-field__label">
+              Notes internes Jury Pix :
+            </label>
+            <PixTextarea
+              id="certification-commentByJury"
+              @value={{@certification.commentByJury}}
+              class="form-control"
+              {{on "input" (pick "target.value" (set this "commentByJury"))}}
+            />
+          {{else}}
+            <p>Notes internes Jury Pix :</p>
+            <p>
+              {{if @certification.commentByJury @certification.commentByJury " - "}}
+            </p>
+          {{/if}}
+        </div>
+        <CertificationInfoField @value={{@certification.juryId}} @edition={{false}} @label="Identifiant jury :" />
+
+        {{#if this.isEditingJuryComment}}
+          <ul class="certification-information-comments">
+            <li>
+              <PixButton @size="small" @variant="secondary" @triggerAction={{this.cancelJuryCommentEdition}}>
+                Annuler
+              </PixButton>
+            </li>
+            <li>
+              <PixButton @size="small" @triggerAction={{this.saveJuryComment}}>
+                Enregistrer
+              </PixButton>
+            </li>
+          </ul>
+        {{else}}
+          <PixButton @size="small" @triggerAction={{this.editJuryComment}}>
+            Modifier le commentaire jury
+          </PixButton>
+        {{/if}}
+      </div>
+    </div>
+  </template>
+}

admin/app/components/certifications/certification/details-v2.gjs

@@ -0,0 +1,31 @@
+import Card from '../../card';
+import CertificationDetailsCompetence from '../details-competence';
+
+<template>
+  <div class="certification-details-v2">
+    <div>
+      <div>
+        <Card>
+          <div class="certification-details-v2__info">
+            <div>Statut :</div>
+            <div>{{@details.status}}</div>
+
+            <div>Créé le :</div>
+            <div>{{@details.creationDate}}</div>
+
+            <div>Terminée le :</div>
+            <div>{{@details.completionDate}}</div>
+
+            <div>Score :</div>
+            <div class="certificate">{{@details.totalScore}}</div>
+            <div>Taux de reproductibilité :</div>
+            <div class="certificate">{{@details.percentageCorrectAnswers}}</div>
+          </div>
+        </Card>
+      </div>
+      {{#each @details.competences as |competence|}}
+        <CertificationDetailsCompetence @competence={{competence}} @rate={{@details.percentageCorrectAnswers}} />
+      {{/each}}
+    </div>
+  </div>
+</template>