Merge branch 'main' into media-ceremonies

# Conflicts: # package-lock.json # src/app/people/people.component.html
worldskills · Jun 20, 2024 · dec038d · dec038d
2 parents 61e9bf1 + 435b5fa
commit dec038d
Show file tree

Hide file tree

Showing 15 changed files with 146 additions and 84 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/src/app/delegate-types-form/delegate-types-form.component.html b/src/app/delegate-types-form/delegate-types-form.component.html
@@ -26,11 +26,22 @@
   <div class="row mb-2">
     <div class="col-sm-3">
       <label class="small font-weight-bold my-0 py-0">{{'color' | translate}}</label>
-      <input
-        type="color"
-        class="form-control"
-        name="color"
-        [ngModel]="delType.color">
+      <div class="form-row">
+        <div class="col-4">
+          <input
+            type="color"
+            class="form-control px-2"
+            name="colorPicker"
+            [(ngModel)]="color">
+        </div>
+        <div class="col-8">
+          <input
+            type="text"
+            class="form-control"
+            name="color"
+            [(ngModel)]="color">
+        </div>
+      </div>
     </div>
   </div>
 

diff --git a/src/app/delegate-types-form/delegate-types-form.component.ts b/src/app/delegate-types-form/delegate-types-form.component.ts
@@ -18,13 +18,17 @@ export class DelegateTypesFormComponent extends WsComponent implements OnInit {
   @Input() delType: DelegateType;
   @Input() selectedEvent: Event;
   @ViewChild('form') form: NgForm;
+  color = '#4A0D66';
   zones: Zone[];
 
   constructor(private zoneService: ZoneService) {
     super();
   }
 
   ngOnInit(): void {
+    if (this.delType.color) {
+      this.color = this.delType.color;
+    }
     this.subscribe(
       this.zoneService.getList(this.selectedEvent.id).subscribe(res => {
         this.zones = res.zones;

diff --git a/src/app/people-filter/people-filter.component.html b/src/app/people-filter/people-filter.component.html
@@ -55,11 +55,12 @@ <h5 class="card-header m-0">{{'filter' | translate}}</h5>
         <div class="col-sm-12">
           <label class="small text-muted font-weight-bold my-0 py-0">{{'skill' | translate}}</label>
           <ng-select
-            [wsSelect]="['id', 'name.text']"
+            [wsSelect]="['id', 'label']"
             name="skill"
             [ngModel]="fetchParams.skill"
             [items]="skills"
-          ></ng-select>
+          >
+          </ng-select>
         </div>
       </div>
 

diff --git a/src/app/people-filter/people-filter.component.ts b/src/app/people-filter/people-filter.component.ts
@@ -62,7 +62,11 @@ export class PeopleFilterComponent extends WsComponent implements OnInit {
             this.delegateTypes = res.delegate_types;
           }),
           this.skillService.getSkills(this.selectedEvent.id).subscribe(res => {
-            this.skills = res.skills.sort((a, b) => a.name.text.localeCompare(b.name.text));
+            this.skills = res.skills;
+            // combined label
+            this.skills.forEach(skill => {
+              skill.label = `${skill.skill_number} ${skill.name.text}`;
+            });
           }),
           this.zoneService.getList(this.selectedEvent.id).subscribe(res => {
             this.zones = res.zones;

diff --git a/src/app/people/people.component.html b/src/app/people/people.component.html
@@ -1,22 +1,22 @@
 <div class="row">
   <div class="col-md-9 people-result">
     <ng-container *ngIf="!loading; else loadingAnimation">
-      <div class="table-responsive-md">
+      <div class="table-responsive">
         <table class="table table-striped">
           <thead>
           <tr>
-            <th class="border-top-0">
+            <th class="border-top-0 text-truncate">
               <input type="checkbox" [(ngModel)]="allChecked" (change)="checkAll()">
             </th>
-            <th class="border-top-0">
+            <th class="border-top-0 text-truncate">
               <a (click)="$event.preventDefault(); sort('firstname')">{{'first_name' | translate}}</a>
             </th>
-            <th class="border-top-0">
+            <th class="border-top-0 text-truncate">
               <a (click)="$event.preventDefault(); sort('lastname')">{{'last_name' | translate}}</a>
             </th>
-            <th class="border-top-0">{{'delegate_type' | translate}}</th>
-            <th class="border-top-0">{{'zones' | translate}}</th>
-            <th class="border-top-0" *ngIf="doesResultHasMember()">{{'member' | translate}}</th>
+            <th class="border-top-0 text-truncate">{{'delegate_type' | translate}}</th>
+            <th class="border-top-0 text-truncate">{{'zones' | translate}}</th>
+            <th class="border-top-0 text-truncate" *ngIf="doesResultHasMember()">{{'member' | translate}}</th>
             <th class="border-top-0" *ngIf="functionalitiesDisplaySetting.select_a_person">{{'action' | translate}}</th>
           </tr>
           </thead>
@@ -25,29 +25,29 @@
             <td>
               <input type="checkbox" [(ngModel)]="personAcr.checked">
             </td>
-            <td>
+            <td class="text-truncate">
               <a [routerLink]="functionalitiesDisplaySetting.person_profile_visit ? personAcr.id +'' : null">
                 <ng-container *ngIf="personAcr.first_name">{{personAcr.first_name}}</ng-container>
                 <ng-container *ngIf="!personAcr.first_name">{{'empty_hint' | translate}}</ng-container>
               </a>
             </td>
-            <td>
+            <td class="text-truncate">
               <a [routerLink]="functionalitiesDisplaySetting.person_profile_visit ? personAcr.id +'' : null">
                 <ng-container *ngIf="personAcr.last_name">{{personAcr.last_name}}</ng-container>
                 <ng-container *ngIf="!personAcr.last_name">{{'empty_hint' | translate}}</ng-container>
               </a>
             </td>
-            <td>
+            <td class="text-truncate">
               {{personAcr.delegate_type.name}}
             </td>
-            <td>
+            <td class="text-truncate" style="max-width: 10rem;">
               <ng-container *ngFor="let zone of personAcr.zones">
                 <div class="badge mr-1 small" [style.background-color]="zone.color"
                      [ngbTooltip]="zone.name"
                      [style.color]="zone.text_color">{{zone.code}}</div>
               </ng-container>
             </td>
-            <td><span *ngIf="personAcr.member && doesResultHasMember()">{{personAcr.member.name.text}}</span></td>
+            <td class="text-truncate"><span *ngIf="personAcr.member && doesResultHasMember()">{{personAcr.member.name.text}}</span></td>
             <td *ngIf="functionalitiesDisplaySetting.select_a_person">
               <button class="btn btn-sm btn-primary small" (click)="selectPerson(personAcr)">{{'choose_person' | translate}}</button>
             </td>
@@ -59,51 +59,54 @@
         </table>
       </div>
 
-      <div class="row">
-        <div class="col-lg-9">
-          <div class="dropdown">
-            <button class="btn btn-sm btn-primary dropdown-toggle" type="button" data-toggle="dropdown">
-              Actions
-            </button>
-            <div class="dropdown-menu">
-              <a class="dropdown-item" (click)="editSelected()" href="#" translate [class.disabled]="!hasSelected()">edit_selected</a>
-              <a class="dropdown-item" (click)="printSelected()" href="#" translate [class.disabled]="!hasSelected()">print_selected</a>
-            </div>
+    </ng-container>
+
+    <ng-template #loadingAnimation>
+      <div style="margin-bottom: 56px;">
+        <ngx-skeleton-loader
+          count="5"
+          [theme]="{ 'border-radius': '0', width: '100%', height: '44px', 'margin-top': '40px', 'margin-bottom': '0' }"></ngx-skeleton-loader>
+      </div>
+    </ng-template>
+
+    <div class="row">
+      <div class="col-lg-9">
+        <div class="dropdown">
+          <button class="btn btn-sm btn-primary dropdown-toggle" type="button" data-toggle="dropdown">
+            Actions
+          </button>
+          <div class="dropdown-menu">
+            <a class="dropdown-item" (click)="editSelected()" href="#" translate [class.disabled]="!hasSelected()">edit_selected</a>
+            <a class="dropdown-item" (click)="printSelected()" href="#" translate [class.disabled]="!hasSelected()">print_selected</a>
           </div>
         </div>
-        <div class="col-lg-3">
-          <div class="dropdown pull-right">
-            <button class="btn btn-sm btn-outline-primary dropdown-toggle" type="button" data-toggle="dropdown">
-              Per page
-            </button>
-            <div class="dropdown-menu">
-              <a class="dropdown-item" (click)="changeLimit(10)" href="#">10</a>
-              <a class="dropdown-item" (click)="changeLimit(100)" href="#">100</a>
-              <a class="dropdown-item" (click)="changeLimit(1000)" href="#">1000</a>
-            </div>
+      </div>
+      <div class="col-lg-3">
+        <div class="dropdown pull-right">
+          <button class="btn btn-sm btn-outline-primary dropdown-toggle" type="button" data-toggle="dropdown">
+            Per page
+          </button>
+          <div class="dropdown-menu">
+            <a class="dropdown-item" (click)="changeLimit(10)" href="#">10</a>
+            <a class="dropdown-item" (click)="changeLimit(100)" href="#">100</a>
+            <a class="dropdown-item" (click)="changeLimit(1000)" href="#">1000</a>
           </div>
         </div>
       </div>
+    </div>
 
-      <ngb-pagination
-        class="component-pager"
-        [collectionSize]="result.total_count"
-        [page]="(fetchParams.offset / fetchParams.limit) + 1"
-        [pageSize]="fetchParams.limit"
-        [maxSize]="10"
-        [boundaryLinks]="true"
-        (pageChange)="fetch($event)">
-      </ngb-pagination>
+    <ngb-pagination
+    class="component-pager"
+    [collectionSize]="result.total_count"
+    [page]="(fetchParams.offset / fetchParams.limit) + 1"
+    [pageSize]="fetchParams.limit"
+    [maxSize]="10"
+    [boundaryLinks]="true"
+    (pageChange)="fetch($event)">
+  </ngb-pagination>
 
-      <p><span class="text-muted">{{'total_results' | translate}}: {{result.total_count}} {{'people' | translate}}</span></p>
+  <p><span class="text-muted">{{'total_results' | translate}}: {{result.total_count}} {{'people' | translate}}</span></p>
 
-    </ng-container>
-
-    <ng-template #loadingAnimation>
-      <ngx-skeleton-loader
-        count="10"
-        [theme]="{ 'border-radius': '0', width: '100%', height: '30px', 'margin-bottom': '15px' }"></ngx-skeleton-loader>
-    </ng-template>
   </div>
   <div class="col-md-3">
     <app-people-filter (filter)="filter($event)"

diff --git a/src/app/person/person.component.html b/src/app/person/person.component.html
@@ -191,16 +191,19 @@ <h5 class="card-title">{{ 'person_data' | translate | titlecase }}</h5>
 
             <div class="form-group">
               <label class="small text-muted font-weight-bold my-0 py-0">{{ 'position' | translate }}</label>
-              <div>{{ personAcr.person_position.position.name.text }}</div>
-              <div>{{ personAcr.person_position.open_field }}</div>
-              <div>{{ personAcr.person_position.organization?.name.text }}</div>
+              <div>{{ personAcr.person_position?.position.name.text }}</div>
+              <div>{{ personAcr.person_position?.open_field }}</div>
+              <div>{{ personAcr.person_position?.organizational_unit }}</div>
+              <div>{{ personAcr.person_position?.organization?.name.text }}</div>
+              <div>{{ personAcr.person_position?.skill?.skill_number }} {{ personAcr.person_position?.skill?.name.text }}</div>
+              <div>{{ personAcr.person_position?.member?.name.text }}</div>
             </div>
 
             <div class="form-group">
               <label class="small text-muted font-weight-bold my-0 py-0">{{ 'delegate_type' | translate }}</label>
-              <div>{{ personAcr.position_delegate_type.delegate_type.name }}</div>
+              <div>{{ personAcr.position_delegate_type?.delegate_type.name }}</div>
               <div>
-                <ng-container *ngFor="let zone of personAcr.position_delegate_type.delegate_type.zones">
+                <ng-container *ngFor="let zone of personAcr.position_delegate_type?.delegate_type.zones">
                   <span class="badge mr-1 small" [style.background-color]="zone.color"
                         [ngbTooltip]="zone.name"
                         [style.color]="zone.text_color">{{ zone.code }}</span>

diff --git a/src/app/positions/positions.component.html b/src/app/positions/positions.component.html
@@ -38,12 +38,18 @@
           </td>
           <td>
             <div class="btn-group" role="group">
-              <button type="button" class="btn btn-outline-secondary btn-sm" (click)="moveUp(idx, pos)">
+              <button type="button" class="btn btn-outline-secondary btn-sm" (click)="moveToTop(idx, pos)" title="{{'move_to_top' | translate}}">
+                <i class="fa fa-long-arrow-up"></i>
+              </button>
+              <button type="button" class="btn btn-outline-secondary btn-sm" (click)="moveUp(idx, pos)" title="{{'move_up' | translate}}">
                 <i class="fa fa-arrow-up"></i>
               </button>
-              <button type="button" class="btn btn-outline-secondary btn-sm" (click)="moveDown(idx, pos)">
+              <button type="button" class="btn btn-outline-secondary btn-sm" (click)="moveDown(idx, pos)" title="{{'move_down' | translate}}">
                 <i class="fa fa-arrow-down"></i>
               </button>
+              <button type="button" class="btn btn-outline-secondary btn-sm" (click)="moveToBottom(idx, pos)" title="{{'move_to_bottom' | translate}}">
+                <i class="fa fa-long-arrow-down"></i>
+              </button>
             </div>
           </td>
         </tr>

diff --git a/src/app/positions/positions.component.ts b/src/app/positions/positions.component.ts
@@ -49,6 +49,20 @@ export class PositionsComponent extends WsComponent implements OnInit {
     )
   }
 
+  moveToTop(idx: number, pos: PositionDelegateType) {
+    this.positions[idx] = this.positions[0];
+    this.positions[0] = pos;
+
+    this.updatePositionsSort();
+  }
+
+  moveToBottom(idx: number, pos: PositionDelegateType) {
+    this.positions[idx] = this.positions[this.positions.length - 1];
+    this.positions[this.positions.length - 1] = pos;
+
+    this.updatePositionsSort();
+  }
+
   moveUp(idx: number, pos: PositionDelegateType) {
     this.positions[idx] = this.positions[idx - 1];
     this.positions[idx - 1] = pos;

diff --git a/src/app/zones-form/zones-form.component.html b/src/app/zones-form/zones-form.component.html
@@ -28,11 +28,22 @@
       <label class="small font-weight-bold my-0 py-0">{{'color' | translate}}
         <span class="text-danger" ngbTooltip="{{'required' | translate}}">*</span>
       </label>
-      <input
-        type="color"
-        class="form-control"
-        name="color"
-        [ngModel]="zone.color">
+      <div class="form-row">
+        <div class="col-4">
+          <input
+            type="color"
+            class="form-control px-2"
+            name="colorPicker"
+            [(ngModel)]="color">
+        </div>
+        <div class="col-8">
+          <input
+            type="text"
+            class="form-control"
+            name="color"
+            [(ngModel)]="color">
+        </div>
+      </div>
     </div>
   </div>
 

diff --git a/src/app/zones-form/zones-form.component.ts b/src/app/zones-form/zones-form.component.ts
@@ -16,12 +16,16 @@ export class ZonesFormComponent extends WsComponent implements OnInit {
   @Input() zone: Zone;
   @Input() selectedEvent: Event;
   @ViewChild('form') form: NgForm;
+  color = '#0084ad';
 
   constructor() {
     super();
   }
 
   ngOnInit(): void {
+    if (this.zone.color) {
+      this.color = this.zone.color;
+    }
   }
 
   save(): void {

diff --git a/src/app/zones/zones.component.html b/src/app/zones/zones.component.html
@@ -45,6 +45,9 @@
               </button>
             </td>
           </tr>
+          <tr *ngIf="zones.length === 0">
+            <td colspan="4">{{'no_zones_found' | translate}}</td>
+          </tr>
           </tbody>
         </table>
       </div>

diff --git a/src/assets/i18n/en.json b/src/assets/i18n/en.json
@@ -1,4 +1,9 @@
 {
+  "no_zones_found": "No zones found",
+  "move_to_top": "Move to top",
+  "move_to_bottom": "Move to bottom",
+  "move_up": "Move up",
+  "move_down": "Move down",
   "edit_selected": "Edit selected",
   "loading": "Loading",
   "print_selected": "Print selected",