fix edit button & expert ui

Author: Awakich

projects/social_platform/src/app/office/features/project-rating/project-rating.component.html

@@ -29,39 +29,6 @@
         placeholder="Небольшой комментарий, если необходимо"
       ></app-textarea>
     </div>
-    } }<!-- @format -->
-    <form [formGroup]="form" class="rating">
-      <section class="rating__columns">
-        @for (criterion of criteria; track $index) { @if (criterion.type === "int") {
-        <div class="rating__field">
-          <app-range-criterion-input
-            class="rating__input"
-            [max]="criterion.maxValue!"
-            [formControlName]="criterion.id"
-          ></app-range-criterion-input>
-          <label class="text-body-10">{{ criterion.name }}</label>
-        </div>
-        } @if (criterion.type === "bool") {
-        <div class="rating__field">
-          <app-boolean-criterion
-            class="rating__input"
-            [formControlName]="criterion.id"
-          ></app-boolean-criterion>
-          <label class="text-body-10">{{ criterion.name }}</label>
-        </div>
-        } }
-      </section>
-      <section>
-        @for (criterion of criteria; track $index) { @if (criterion.type === "str") {
-        <div class="rating__comment">
-          <app-textarea
-            size="big"
-            [formControlName]="criterion.id"
-            placeholder="Небольшой комментарий, если необходимо"
-          ></app-textarea>
-        </div>
-        } }
-      </section>
-    </form>
+    } }
   </section>
 </form>

projects/social_platform/src/app/office/program/shared/rating-card/rating-card.component.html

@@ -75,18 +75,18 @@
       }
     </div>
 
-    @if (showRatingForm || showRatedWithEdit || showConfirmedState) {
+    @if (showRatingForm || showRatedStatus || showConfirmedState) {
     <div class="card__rated">
       <app-button
         style="flex-grow: 1"
         customTypographyClass="text-body-12"
         size="big"
         [loader]="submitLoading() || confirmLoading()"
-        [color]="showRatedWithEdit ? 'green' : 'primary'"
+        [color]="showRatedStatus ? 'green' : 'primary'"
         [disabled]="programDateFinished()"
         [appearance]="programDateFinished() ? 'outline' : 'inline'"
         [style.opacity]="showConfirmedState ? '0.5' : '1'"
-        (click)="showRatingForm ? confirmRateProject() : null"
+        (click)="showRatingForm ? showConfirmRateModal.set(true) : null"
       >
         {{
           programDateFinished()
@@ -97,7 +97,7 @@
         }}
       </app-button>
 
-      @if (showRatedWithEdit && !programDateFinished()) {
+      @if (showEditButton) {
       <app-button
         appearance="outline"
         size="small"
@@ -126,11 +126,13 @@
         </div>
 
         <div class="cancel__criterias">
+          @if (showConfirmRateModal()) {
           <app-project-rating
             [criteria]="project.criterias"
             [formControl]="form"
             [disabled]="(projectRated() || projectConfirmed()) && !programDateFinished()"
           ></app-project-rating>
+          }
         </div>
 
         <div class="cancel__buttons">

projects/social_platform/src/app/office/program/shared/rating-card/rating-card.component.ts

@@ -142,6 +142,8 @@ export class RatingCardComponent implements OnInit, AfterViewInit, OnDestroy {
 
   showConfirmRateModal = signal(false);
 
+  locallyRatedByCurrentUser = signal(false);
+
   isProjectCriterias = signal(0);
 
   programDateFinished = signal(false);
@@ -225,20 +227,18 @@ export class RatingCardComponent implements OnInit, AfterViewInit, OnDestroy {
       .pipe(finalize(() => this.submitLoading.set(false)))
       .subscribe({
         next: () => {
-          if (this.showConfirmRateModal()) {
-            this.projectConfirmed.set(true);
-            this.showConfirmRateModal.set(false);
-          } else {
-            this.projectRated.set(true);
-            this.showConfirmRateModal.set(true);
-          }
+          this.locallyRatedByCurrentUser.set(true);
+          this.projectRated.set(true);
+          this.projectConfirmed.set(true);
+          this.showConfirmRateModal.set(false);
         },
       });
   }
 
   redoRating(): void {
     this.projectRated.set(false);
     this.projectConfirmed.set(false);
+    this.locallyRatedByCurrentUser.set(false);
   }
 
   get canEdit(): boolean {
@@ -251,17 +251,24 @@ export class RatingCardComponent implements OnInit, AfterViewInit, OnDestroy {
 
     if (!currentProfile || !project) return false;
 
-    return project.scored && project.scoredExpertId === currentProfile.id;
+    const isExpertFromBackend =
+      !!project.scoredExpertId && project.scoredExpertId === currentProfile.id;
+
+    const isExpertLocally = this.locallyRatedByCurrentUser();
+
+    return isExpertFromBackend || isExpertLocally;
   }
 
   get showRatingForm(): boolean {
     return !this.projectRated() && this.canEdit;
   }
 
-  get showRatedWithEdit(): boolean {
-    return (
-      (this.projectRated() || this.projectConfirmed()) && this.canEdit && this.isCurrentUserExpert
-    );
+  get showRatedStatus(): boolean {
+    return this.projectRated() || this.projectConfirmed();
+  }
+
+  get showEditButton(): boolean {
+    return this.showRatedStatus && this.canEdit && this.isCurrentUserExpert;
   }
 
   get showConfirmedState(): boolean {