CapstoneProjectCMC · Fxdonad · Sep 2, 2025 · Sep 2, 2025
diff --git a/src/app/core/interceptors/handle/error-handler.service.ts b/src/app/core/interceptors/handle/error-handler.service.ts
@@ -41,6 +41,13 @@ export class ErrorHandlerService {
         'Bạn đã mua sản phẩm này rồi!',
         'warning'
       );
+    } else if (errorCode === 4059101) {
+      sendNotification(
+        this.store,
+        'Hết tiền!',
+        'Bạn cần nạp tiền vào tài khoản của mình trước nhé!',
+        'error'
+      );
     } else {
       sendNotification(
         this.store,

diff --git a/src/app/core/models/organization.model.ts b/src/app/core/models/organization.model.ts
@@ -86,3 +86,16 @@ export type ParamGetAllBlockOfOrg = {
   activeOnlyMembers?: boolean;
   includeUnassigned?: boolean;
 };
+
+//add user
+export type InfoUserNeedToAdd = {
+  userId: string;
+  role: string;
+  active: string;
+};
+
+export type AddUsersOrgRequest = {
+  members: InfoUserNeedToAdd[];
+  defaultRole: string;
+  active: boolean;
+};
diff --git a/src/app/core/services/api-service/organization.service.ts b/src/app/core/services/api-service/organization.service.ts
@@ -3,6 +3,7 @@ import { ApiMethod } from '../config-service/api.methods';
 import { ApiResponse, IPaginationResponse } from '../../models/api-response';
 import { API_CONFIG } from '../config-service/api.enpoints';
 import {
+  AddUsersOrgRequest,
   BlockResponse,
   CreateOrgRequest,
   EditOrgRequest,
@@ -102,4 +103,11 @@ export class OrganizationService {
       API_CONFIG.ENDPOINTS.GET.GET_BLOCK_DETAILS(blockId, data)
     );
   }
+
+  bulkAddToBlock(blockId: string, data: AddUsersOrgRequest) {
+    return this.api.post<ApiResponse<null>>(
+      API_CONFIG.ENDPOINTS.POST.BULK_ADD_TO_BLOCK(blockId),
+      data
+    );
+  }
 }
diff --git a/src/app/core/services/config-service/api.enpoints.ts b/src/app/core/services/config-service/api.enpoints.ts
@@ -267,6 +267,9 @@ export const API_CONFIG = {
       PURCHASE: '/payment/purchase',
       CREATE_ORGANIZATION: '/org/organization',
       CREATE_BLOCK_IN_ORG: (orgId: string) => `/org/${orgId}/block`,
+      BULK_ADD_TO_ORG: (orgId: string) => `/org/${orgId}/members:bulk`,
+      BULK_ADD_TO_BLOCK: (blockId: string) =>
+        `/org/block/${blockId}/members:bulk`,
     },
     PUT: {
       EDIT_FILE: (id: string) => `/file/api/FileDocument/edit/${id}`,

diff --git a/...tures/excercise/exercise-pages/exercise-code-details/exercise-code-details.component.html b/...tures/excercise/exercise-pages/exercise-code-details/exercise-code-details.component.html
@@ -81,9 +81,7 @@ <h1 class="title">{{ exercise.title }}</h1>
         </div>
         <div class="time-info" title="Giá bài tập">
           <i class="fa-solid fa-money-bill-1-wave"></i>
-          <span>
-            {{ exercise.cost }}
-          </span>
+          <span> {{ exercise.cost | formatView }} VNĐ </span>
         </div>
       </div>
     </div>

diff --git a/...eatures/excercise/exercise-pages/exercise-code-details/exercise-code-details.component.ts b/...eatures/excercise/exercise-pages/exercise-code-details/exercise-code-details.component.ts
@@ -31,6 +31,7 @@ import { isAvailabelTime } from '../../../../shared/utils/availableTime';
 import { PaymentService } from '../../../../core/services/api-service/payment.service';
 import { v4 as uuidv4 } from 'uuid';
 import { IPurChaseTransactionRequest } from '../../../../core/models/service-and-payment';
+import { FormatViewPipe } from '../../../../shared/pipes/format-view.pipe';
 
 @Component({
   selector: 'app-exercise-code-details',
@@ -39,6 +40,7 @@ import { IPurChaseTransactionRequest } from '../../../../core/models/service-and
     FormsModule,
     UpdateCodeDetailsComponent,
     UpdateExerciseComponent,
+    FormatViewPipe,
   ],
   templateUrl: './exercise-code-details.component.html',
   styleUrls: ['./exercise-code-details.component.scss'],
@@ -230,6 +232,7 @@ export class ExerciseCodeDetailsComponent {
             this.authorName = res.result.user.displayName;
             this.authorRoles = Array.from(res.result.user.roles).join(', ');
             this.avatarUrl = res.result.user.avatarUrl ?? avatarUrlDefault;
+            this.isBought = res.result.purchased;
           }
           this.isActionActive = activeForMyContent(
             res.result.user?.username ?? '',

diff --git a/src/app/features/excercise/exercise-pages/exercise-details/exercise-details.component.ts b/src/app/features/excercise/exercise-pages/exercise-details/exercise-details.component.ts
@@ -224,6 +224,7 @@ export class ExerciseDetailsComponent implements OnInit {
             if (res.result.user) {
               this.authorName = res.result.user.displayName;
               this.avatarUrl = res.result.user.avatarUrl;
+              this.isBought = res.result.purchased;
               this.availabelDate = res.result.startTime
                 ? new Date(res.result.startTime)
                 : null;

diff --git a/src/app/features/excercise/exercise-pages/list-exercise/list-exercise.component.ts b/src/app/features/excercise/exercise-pages/list-exercise/list-exercise.component.ts
@@ -89,7 +89,6 @@ export class ListExerciseComponent implements OnInit {
       { value: '1', label: 'Trung bình' },
       { value: '2', label: 'Khó' },
     ];
-    const role = decodeJWT(localStorage.getItem('token') ?? '')?.payload.scope;
   }
 
   private mapExerciseResToCardDataUI(data: ExerciseItem[]): CardExcercise[] {

diff --git a/...anization/organization-component/details-organization/details-organization.component.scss b/...anization/organization-component/details-organization/details-organization.component.scss
@@ -108,7 +108,7 @@
 
       .org-name {
         margin: 0;
-        font-size: 28px;
+        font-size: 24px;
         font-weight: 700;
         color: var(--title-text);
         line-height: 1.2;

diff --git a/...rganization/organization-component/details-organization/details-organization.component.ts b/...rganization/organization-component/details-organization/details-organization.component.ts
@@ -53,9 +53,9 @@ export class DetailsOrganizationComponent implements OnInit {
     });
   }
 
-  getStatusLabel(status: number): string {
+  getStatusLabel(status: number | string): string {
     switch (status) {
-      case 0:
+      case 'Active':
         return 'Hoạt động';
       case 1:
         return 'Tạm ngưng';
@@ -66,9 +66,9 @@ export class DetailsOrganizationComponent implements OnInit {
     }
   }
 
-  getStatusClass(status: number): string {
+  getStatusClass(status: number | string): string {
     switch (status) {
-      case 0:
+      case 'Active':
         return 'status-active';
       case 1:
         return 'status-inactive';

diff --git a/...ion/organization-component/modal-add-user-to-block/modal-add-user-to-block.component.html b/...ion/organization-component/modal-add-user-to-block/modal-add-user-to-block.component.html
@@ -0,0 +1,58 @@
+<div class="modal-backdrop" [class.show]="isOpen" (click)="close()"></div>
+
+<div class="modal-wrapper" [class.show]="isOpen">
+  <div class="modal-content" (click)="$event.stopPropagation()">
+    <header class="modal-header">
+      <h2>Thêm người dùng vào Block</h2>
+      <button class="close-btn" (click)="close()">&times;</button>
+    </header>
+
+    <!-- Search box -->
+    <div class="search-box">
+      <input
+        type="text"
+        [(ngModel)]="searchQuery"
+        (ngModelChange)="onSearchChange($event)"
+        placeholder="Tìm kiếm tên hoặc email..."
+      />
+    </div>
+
+    <!-- Search results -->
+    <div class="results">
+      <div
+        class="user-item"
+        *ngFor="let user of searchResults"
+        (click)="addUser(user)"
+      >
+        <img
+          [src]="user.avatarUrl || '/assets/avatar-default.png'"
+          alt="avatar"
+        />
+        <div>
+          <strong>{{ user.displayName }}</strong>
+          <span>{{ user.email }}</span>
+        </div>
+      </div>
+      <p *ngIf="!searchResults.length && searchQuery">
+        Không tìm thấy kết quả.
+      </p>
+    </div>
+
+    <!-- Selected users -->
+    <div class="selected">
+      <h3>Đã chọn</h3>
+      <div class="chip" *ngFor="let u of selectedUsers">
+        {{ u.userId }}
+        <button (click)="removeUser(u.userId)">×</button>
+      </div>
+    </div>
+
+    <!-- Actions -->
+    <footer class="modal-footer">
+      <button class="btn-cancel" (click)="close()">Hủy</button>
+      <button class="btn-save" [disabled]="submitting" (click)="submit()">
+        {{ submitting ? "Đang lưu..." : "Xác nhận thêm" }}
+      </button>
+    </footer>
+  </div>
+</div>
diff --git a/...ion/organization-component/modal-add-user-to-block/modal-add-user-to-block.component.scss b/...ion/organization-component/modal-add-user-to-block/modal-add-user-to-block.component.scss
@@ -0,0 +1,150 @@
+.modal-backdrop {
+  position: fixed;
+  inset: 0;
+  background: rgba(0, 0, 0, 0.4);
+  opacity: 0;
+  transition: opacity 0.3s ease;
+  pointer-events: none;
+  visibility: hidden;
+
+  &.show {
+    opacity: 1;
+    pointer-events: auto;
+    visibility: visible;
+    z-index: 10000;
+  }
+}
+
+.modal-wrapper {
+  position: fixed;
+  inset: 0;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  transform: translateY(-30px);
+  opacity: 0;
+  transition: all 0.3s ease;
+  visibility: hidden;
+
+  &.show {
+    transform: translateY(0);
+    opacity: 1;
+    visibility: visible;
+    z-index: 10000;
+  }
+}
+
+.modal-content {
+  background: #fff;
+  border-radius: 12px;
+  width: 600px;
+  max-width: 90%;
+  max-height: 80%;
+  overflow-y: auto;
+  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.2);
+  animation: fadeIn 0.3s ease;
+  display: flex;
+  flex-direction: column;
+}
+
+.modal-header,
+.modal-footer {
+  padding: 12px 16px;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
+.search-box {
+  padding: 8px 16px;
+
+  input {
+    width: 100%;
+    padding: 8px 12px;
+    border-radius: 8px;
+    border: 1px solid #ccc;
+  }
+}
+
+.results {
+  padding: 8px 16px;
+  .user-item {
+    display: flex;
+    align-items: center;
+    gap: 12px;
+    padding: 8px;
+    cursor: pointer;
+    border-radius: 8px;
+    transition: background 0.2s;
+
+    &:hover {
+      background: #f5f5f5;
+    }
+
+    img {
+      width: 36px;
+      height: 36px;
+      border-radius: 50%;
+    }
+
+    strong {
+      display: block;
+      font-size: 14px;
+    }
+    span {
+      font-size: 12px;
+      color: #666;
+    }
+  }
+}
+
+.selected {
+  padding: 8px 16px;
+  h3 {
+    margin: 8px 0;
+  }
+  .chip {
+    display: inline-flex;
+    align-items: center;
+    padding: 4px 8px;
+    background: #e5f0ff;
+    border-radius: 16px;
+    margin: 4px;
+    font-size: 13px;
+
+    button {
+      background: none;
+      border: none;
+      margin-left: 6px;
+      cursor: pointer;
+      font-weight: bold;
+    }
+  }
+}
+
+.btn-cancel {
+  padding: 8px 16px;
+  border: none;
+  background: #f1f1f1;
+  border-radius: 8px;
+  cursor: pointer;
+}
+.btn-save {
+  padding: 8px 16px;
+  border: none;
+  background: #2563eb;
+  color: white;
+  border-radius: 8px;
+  cursor: pointer;
+
+  &:disabled {
+    background: #93c5fd;
+  }
+}
+
+.close-btn {
+  font-size: 20px;
+  background: none;
+  border: none;
+  cursor: pointer;
+}