Merge pull request #3460 from ita-social-projects/bugfix/#7783-add-em…

…ployee-form [Bugfix] #7783, #7786 add/edit employee form
ita-social-projects · Nov 18, 2024 · be310e9 · be310e9
2 parents 31027f3 + 4f19cbd
commit be310e9
Show file tree

Hide file tree

Showing 5 changed files with 49 additions and 31 deletions.
diff --git a/...s-admin-employee/ubs-admin-employee-edit-form/ubs-admin-employee-edit-form.component.html b/...s-admin-employee/ubs-admin-employee-edit-form/ubs-admin-employee-edit-form.component.html
@@ -99,36 +99,40 @@ <h6>{{ 'ubs-employee.required-fields' | translate }}</h6>
                     <th class="col-region">{{ 'ubs-employee.tariffs-columns.region' | translate }}</th>
                     <th class="col-city">{{ 'ubs-employee.tariffs-columns.city' | translate }}</th>
                     <th class="col-courier">{{ 'ubs-employee.tariffs-columns.courier' | translate }}</th>
-                    <th class="col-actions">{{ 'ubs-employee.tariffs-columns.chat' | translate }}</th>
                     <th class="col-actions">{{ 'ubs-employee.tariffs-columns.tariff' | translate }}</th>
+                    <th class="col-actions">{{ 'ubs-employee.tariffs-columns.chat' | translate }}</th>
                   </tr>
                 </thead>
                 <tbody>
                   <tr *ngFor="let tariff of filteredTariffs">
                     <td>
-                      {{ tariff.region.en }}
+                      {{ langService.getLangValue(tariff.region.ua, tariff.region.en) }}
                     </td>
                     <td>
-                      <span *ngFor="let location of tariff.locations">{{ location.en }}</span>
+                      <span *ngFor="let location of tariff.locations">
+                        {{ langService.getLangValue(location.ua, location.en) }}
+                      </span>
                     </td>
                     <td>
-                      {{ tariff.courier.en }}
+                      {{ langService.getLangValue(tariff.courier.ua, tariff.courier.en) }}
                     </td>
                     <td>
                       <mat-checkbox
-                        [(ngModel)]="tariff.hasChat"
+                        [(ngModel)]="tariff.selected"
                         [ngModelOptions]="{ standalone: true }"
-                        [disabled]="!tariff.selected"
                         (change)="isTariffListChange(tariff)"
                       ></mat-checkbox>
                     </td>
                     <td>
-                      <mat-checkbox
-                        class="tariff-checkbox"
-                        [(ngModel)]="tariff.selected"
-                        [ngModelOptions]="{ standalone: true }"
-                        (change)="isTariffListChange(tariff)"
-                      ></mat-checkbox>
+                      <span [matTooltip]="!tariff.selected ? ('ubs-employee.chat-hint' | translate) : ''">
+                        <mat-checkbox
+                          [(ngModel)]="tariff.hasChat"
+                          [ngModelOptions]="{ standalone: true }"
+                          (change)="isTariffListChange(tariff)"
+                          [disabled]="!tariff.selected"
+                        >
+                        </mat-checkbox>
+                      </span>
                     </td>
                   </tr>
                 </tbody>
@@ -169,12 +173,7 @@ <h6>{{ 'ubs-employee.required-fields' | translate }}</h6>
       <button
         type="submit"
         class="addButton action-buttons"
-        [disabled]="
-          employeeForm.invalid ||
-          !employeePositions.length ||
-          isUploading ||
-          (editMode && !isInitialDataChanged && !isInitialImageChanged && !isInitialPositionsChanged && !isInitialTariffsChanged)
-        "
+        [disabled]="isButtonDisabled()"
         (click)="isUpdatingEmployee ? this.updateEmployee() : this.createEmployee()"
       >
         <span *ngIf="isUploading" class="spinner-border spinner-border-sm" role="status" aria-hidden="true"> </span>

diff --git a/...s-admin-employee/ubs-admin-employee-edit-form/ubs-admin-employee-edit-form.component.scss b/...s-admin-employee/ubs-admin-employee-edit-form/ubs-admin-employee-edit-form.component.scss
@@ -113,14 +113,13 @@ form {
 
 .accordion-role-body {
   display: flex;
-  flex-flow: column wrap;
+  flex-wrap: wrap;
   width: 100%;
-  max-height: 140px;
 }
 
 .role-item {
-  display: block;
   width: 50%;
+  box-sizing: border-box;
 }
 
 .checkbox-location,
@@ -296,13 +295,17 @@ label {
   gap: 18px;
 
   .filter-wrapper {
+    position: relative;
     height: 36px;
     width: 230px;
     border: 1px solid var(--ubs-primary-light-grey);
     border-radius: 4px;
+    display: flex;
+    align-items: center;
 
     input {
       padding-left: 15px;
+      padding-right: 30px;
       margin: 0;
       width: 100%;
       height: 100%;
@@ -314,10 +317,8 @@ label {
 
   .icon-style {
     position: absolute;
-    right: 320px;
-    bottom: 448px;
+    right: 10px;
     color: var(--ubs-primary-light-grey);
-    margin: 8px;
   }
 }
 

diff --git a/...ubs-admin-employee/ubs-admin-employee-edit-form/ubs-admin-employee-edit-form.component.ts b/...ubs-admin-employee/ubs-admin-employee-edit-form/ubs-admin-employee-edit-form.component.ts
@@ -8,8 +8,7 @@ import {
   EmployeePositions,
   InitialData,
   TariffForEmployee,
-  EmployeeDataToSend,
-  Tariff
+  EmployeeDataToSend
 } from 'src/app/ubs/ubs-admin/models/ubs-admin.interface';
 import { Store } from '@ngrx/store';
 import { IAppState } from 'src/app/store/state/app.state';
@@ -56,8 +55,9 @@ export class UbsAdminEmployeeEditFormComponent implements OnInit, OnDestroy {
   selectedFile;
   defaultPhotoURL = 'https://csb10032000a548f571.blob.core.windows.net/allfiles/90370622-3311-4ff1-9462-20cc98a64d1ddefault_image.jpg';
   search: FormControl;
-  filteredTariffs = [];
+  filteredTariffs: TariffForEmployee[] = [];
   tariffsFromEditForm = [];
+  isAnyTariffSelected = false;
 
   private addMappers = {
     tariffs: (tariffData) =>
@@ -97,7 +97,7 @@ export class UbsAdminEmployeeEditFormComponent implements OnInit, OnDestroy {
       firstName: [this.data?.firstName ?? '', [Validators.required, Validators.pattern(Patterns.NamePattern), Validators.maxLength(30)]],
       lastName: [this.data?.lastName ?? '', [Validators.required, Validators.pattern(Patterns.NamePattern), Validators.maxLength(30)]],
       phoneNumber: [
-        this.data?.phoneNumber ?? '',
+        this.data?.phoneNumber.replace('+', '') ?? '',
         [Validators.required, Validators.pattern(Patterns.adminPhone), PhoneNumberValidator('UA')]
       ],
       email: [
@@ -167,6 +167,7 @@ export class UbsAdminEmployeeEditFormComponent implements OnInit, OnDestroy {
             hasChat: !!this.tariffsFromEditForm.find((el) => el.id === tariffItem.id)?.hasChat
           };
         });
+        this.isAnyTariffSelected = this.filteredTariffs.some((tariff) => tariff.selected);
       } else {
         this.filteredTariffs = this.tariffs;
       }
@@ -213,11 +214,12 @@ export class UbsAdminEmployeeEditFormComponent implements OnInit, OnDestroy {
     }
   }
 
-  isTariffListChange(tariff: Tariff): void {
+  isTariffListChange(tariff: TariffForEmployee): void {
     tariff.hasChat = tariff.hasChat && tariff.selected;
     if (!this.isInitialTariffsChanged) {
       this.isInitialTariffsChanged = true;
     }
+    this.isAnyTariffSelected = this.filteredTariffs.some((tariff) => tariff.selected);
   }
 
   doesIncludeRole(role) {
@@ -361,4 +363,18 @@ export class UbsAdminEmployeeEditFormComponent implements OnInit, OnDestroy {
       }
     });
   }
+
+  isButtonDisabled(): boolean {
+    return (
+      this.employeeForm.invalid ||
+      !this.employeePositions.length ||
+      this.isUploading ||
+      !this.isAnyTariffSelected ||
+      (this.editMode &&
+        !this.isInitialDataChanged &&
+        !this.isInitialImageChanged &&
+        !this.isInitialPositionsChanged &&
+        !this.isInitialTariffsChanged)
+    );
+  }
 }
diff --git a/src/assets/i18n/ubs-admin/en.json b/src/assets/i18n/ubs-admin/en.json
@@ -633,6 +633,7 @@
     "email": "Email*",
     "position": "Position*",
     "receiving-station": "Receiving station*",
+    "chat-hint": "Add a tariff first",
     "image-input": "Image",
     "picture-description-1": "Drop your",
     "picture-description-2": "image here or",
@@ -645,7 +646,7 @@
     "update": "Save",
     "filter-reset-all": "Reset all",
     "image-error": "The supported formats of the photo are PNG and JPG. Max size is 10MB",
-    "tariffs": "Tariffs",
+    "tariffs": "Tariffs*",
     "tariffs-columns": {
       "region": "Region",
       "city": "City",

diff --git a/src/assets/i18n/ubs-admin/ua.json b/src/assets/i18n/ubs-admin/ua.json
@@ -631,6 +631,7 @@
     "email": "Email*",
     "position": "Посада*",
     "receiving-station": "Станція приймання*",
+    "chat-hint": "Спочатку додайте тариф",
     "image-input": "Фото",
     "picture-description-1": "Перетягніть",
     "picture-description-2": "зображення або",
@@ -643,7 +644,7 @@
     "update": "Зберегти",
     "filter-reset-all": "Очистити все",
     "image-error": "Підтримувані формати фотографії: PNG і JPG. Максимальний розмір – 10 Мб",
-    "tariffs": "Тарифи",
+    "tariffs": "Тарифи*",
     "tariffs-columns": {
       "region": "Область",
       "city": "Місто",