Skip to content
GitLab
Select Git revision
  • master default
Find file BlameHistoryPermalink
graphics-page.component.html 2.68 KiB
1 
<body>
2 
  <h1>Générer un graphique</h1>
3 
  <div class="graph-select">
4 
    <form action="">
5
6 
      <!-- Select graphic -->
7 
      <mat-form-field class="select-graph">
8 
        <mat-label>Graphique</mat-label>
9 
        <mat-select [(value)]="matSelectedValue" (selectionChange)="manageSelection()" required>
10 
          <mat-option *ngFor="let graphic of graphics" [value]="graphic" >{{ graphic }}</mat-option>
11 
        </mat-select>
12 
      </mat-form-field>
13
14 
      <!-- Select type of graphic -->
15 
      <mat-form-field class="graphic-type">
16 
        <mat-label>Type de graphique</mat-label>
17 
        <mat-select [(value)]="matSelectedGraphic" (selectionChange)="manageSelection()" required>
18 
          <mat-option *ngFor="let type of graphicTypes" [value]="type">{{ type }}</mat-option>
19 
        </mat-select>
20 
      </mat-form-field>
21
22 
      <!-- This is displayed if select-graph.value === graphics[0] or graphics[1] -->
23 
      <div>
24 
        <mat-form-field class="form-cp">
25 
          <mat-label>Titre du communiqué</mat-label>
26 
          <mat-select [(value)]="matSelectedName" (selectionChange)="manageSelection()" [formControl]="formControlName" required>
27 
            <mat-option *ngFor="let name of articleNames" [value]="name">{{ name }}</mat-option>
28 
          </mat-select>
29 
          <mat-error *ngIf="formControlName.hasError('required')">Vous devez selectionner un article</mat-error>
30 
        </mat-form-field>
31 
      </div>
32
33
34 
      <!-- Add buttons generate and cancel -->
35 
      <button mat-raised-button (click)="generateGraphic()" type="submit" class="button-generate" title="Générer le graphique">Générer graphique</button>
36 
      <button mat-button title="Annuler" class="button-cancel" (click)="reset()">X</button>
37 
    </form>
38 
    <div class="horizontal-sep"></div>
39 
  </div>
40
41
42
43 
  <!-- Display graphic if inputs are accurates and button generate is clicked on -->
44 
   <app-graphics *ngIf="validate" [graphicType]="matSelectedGraphic" [graphic]="matSelectedValue" [codeCP]="matSelectedName" [arrayGraphics]="graphics" [arrayGraphicTypes]="graphicTypes" (errorOcc)="error()"></app-graphics>
45
46 
   <!-- Displayed if an error has occurred while trying to generate the graphic -->
47 
   <p *ngIf="errorOcc" class="error-occurred">Une erreur est survenue. Réessayez plus tard</p>
48 
</body>
49
50 
<!-- To do
51 
    Ask what type of graphic for what data, generate it and display component Graphics + display articles related below the graphic
52 
-->
53
54
55 
<!-- Les graphiques possibles
56 
  - Pour un code CP, la tonalité des retombéées
57 
  - Pour un code CP, les departements des retombées
58 
  - Type de retombées, possibilité de croiser avec la tonalite
59 
  - journaux des retombées
60 
  - retombées par departement
61 
  - tonalité globale
62 
  - retombées par theme
63 
 -->
64