mirror of
https://github.com/opelly27/WinStudentGoalTracker.git
synced 2026-05-20 15:47:35 +00:00
Added short name to benchmarks
This commit is contained in:
+6
-2
@@ -15,14 +15,18 @@
|
||||
@if (loaded()) {
|
||||
<div class="detail-card">
|
||||
<div class="field">
|
||||
<span class="field-label">Goal</span>
|
||||
<span class="field-value">{{ goalCategory }}</span>
|
||||
<span class="field-label">Goal: {{ goalCategory }}</span>
|
||||
</div>
|
||||
<div class="field">
|
||||
<label class="field-label" for="benchmarkText">Benchmark</label>
|
||||
<textarea id="benchmarkText" class="field-input field-textarea" [(ngModel)]="benchmarkText" rows="4"
|
||||
placeholder="Enter benchmark text..."></textarea>
|
||||
</div>
|
||||
<div class="field">
|
||||
<label class="field-label" for="shortName">Short Name</label>
|
||||
<input id="shortName" class="field-input" type="text" [(ngModel)]="shortName" maxlength="50"
|
||||
placeholder="Optional" />
|
||||
</div>
|
||||
@if (!isNew()) {
|
||||
<div class="metadata">
|
||||
@if (createdByName) {
|
||||
|
||||
+22
-4
@@ -42,9 +42,11 @@ export class BenchmarkCardFull implements OnDestroy {
|
||||
protected readonly successMessage = signal<string | null>(null);
|
||||
protected readonly saving = signal(false);
|
||||
|
||||
// Form field
|
||||
// Form fields
|
||||
protected benchmarkText = '';
|
||||
protected shortName = '';
|
||||
private savedBenchmarkText = '';
|
||||
private savedShortName = '';
|
||||
|
||||
// Read-only metadata
|
||||
protected goalCategory = '';
|
||||
@@ -58,7 +60,8 @@ export class BenchmarkCardFull implements OnDestroy {
|
||||
// Returns true if the benchmark text has unsaved changes.
|
||||
// *****************************************************************
|
||||
hasChanges(): boolean {
|
||||
return this.benchmarkText !== this.savedBenchmarkText;
|
||||
return this.benchmarkText !== this.savedBenchmarkText
|
||||
|| this.shortName !== this.savedShortName;
|
||||
}
|
||||
|
||||
// ************************ Public Methods *************************
|
||||
@@ -77,11 +80,13 @@ export class BenchmarkCardFull implements OnDestroy {
|
||||
const result = await this.studentService.createBenchmark(this.studentId, {
|
||||
goalId: this.goalId,
|
||||
benchmark: this.benchmarkText,
|
||||
shortName: this.shortName || undefined,
|
||||
});
|
||||
this.saving.set(false);
|
||||
if (result.success) {
|
||||
this.successMessage.set('Benchmark created.');
|
||||
this.savedBenchmarkText = this.benchmarkText;
|
||||
this.savedShortName = this.shortName;
|
||||
this.studentService.notifyDataChanged();
|
||||
if (result.payload?.benchmarkId) {
|
||||
this.router.navigate(['/students', this.studentId, 'goals', this.goalId, 'benchmarks', result.payload.benchmarkId]);
|
||||
@@ -90,11 +95,19 @@ export class BenchmarkCardFull implements OnDestroy {
|
||||
this.errorMessage.set(result.message);
|
||||
}
|
||||
} else {
|
||||
const result = await this.studentService.updateBenchmark(this.studentId, this.benchmarkId!, this.benchmarkText);
|
||||
const shortNameChanged = this.shortName !== this.savedShortName;
|
||||
const result = await this.studentService.updateBenchmark(this.studentId, this.benchmarkId!, this.benchmarkText, this.shortName || undefined);
|
||||
this.saving.set(false);
|
||||
if (result.success) {
|
||||
this.savedBenchmarkText = this.benchmarkText;
|
||||
this.savedShortName = this.shortName;
|
||||
this.successMessage.set('Changes saved.');
|
||||
if (shortNameChanged) {
|
||||
this.studentService.updateSidebarLabel(
|
||||
['/students', this.studentId, 'goals', this.goalId, 'benchmarks', this.benchmarkId!],
|
||||
this.shortName || this.benchmarkText
|
||||
);
|
||||
}
|
||||
} else {
|
||||
this.errorMessage.set(result.message);
|
||||
}
|
||||
@@ -106,12 +119,13 @@ export class BenchmarkCardFull implements OnDestroy {
|
||||
// *****************************************************************
|
||||
onCancel() {
|
||||
this.benchmarkText = this.savedBenchmarkText;
|
||||
this.shortName = this.savedShortName;
|
||||
this.errorMessage.set(null);
|
||||
this.successMessage.set(null);
|
||||
}
|
||||
|
||||
onBack() {
|
||||
this.router.navigate(['/students', this.studentId, 'benchmarks']);
|
||||
this.router.navigate(['/students', this.studentId, 'goals', this.goalId, 'benchmarks']);
|
||||
}
|
||||
|
||||
ngOnDestroy() {
|
||||
@@ -127,7 +141,9 @@ export class BenchmarkCardFull implements OnDestroy {
|
||||
if (!this.benchmarkId) {
|
||||
this.isNew.set(true);
|
||||
this.benchmarkText = '';
|
||||
this.shortName = '';
|
||||
this.savedBenchmarkText = '';
|
||||
this.savedShortName = '';
|
||||
this.loadGoalCategory();
|
||||
this.loaded.set(true);
|
||||
return;
|
||||
@@ -147,7 +163,9 @@ export class BenchmarkCardFull implements OnDestroy {
|
||||
}
|
||||
|
||||
this.benchmarkText = bm.benchmark;
|
||||
this.shortName = bm.shortName ?? '';
|
||||
this.savedBenchmarkText = bm.benchmark;
|
||||
this.savedShortName = bm.shortName ?? '';
|
||||
this.goalCategory = bm.goalCategory;
|
||||
this.createdByName = bm.createdByName;
|
||||
this.createdAt = bm.createdAt;
|
||||
|
||||
@@ -0,0 +1 @@
|
||||
<p>progress-edit works!</p>
|
||||
+23
@@ -0,0 +1,23 @@
|
||||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { ProgressEdit } from './progress-edit';
|
||||
|
||||
describe('ProgressEdit', () => {
|
||||
let component: ProgressEdit;
|
||||
let fixture: ComponentFixture<ProgressEdit>;
|
||||
|
||||
beforeEach(async () => {
|
||||
await TestBed.configureTestingModule({
|
||||
imports: [ProgressEdit]
|
||||
})
|
||||
.compileComponents();
|
||||
|
||||
fixture = TestBed.createComponent(ProgressEdit);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,11 @@
|
||||
import { Component } from '@angular/core';
|
||||
|
||||
@Component({
|
||||
selector: 'app-progress-edit',
|
||||
imports: [],
|
||||
templateUrl: './progress-edit.html',
|
||||
styleUrl: './progress-edit.scss',
|
||||
})
|
||||
export class ProgressEdit {
|
||||
|
||||
}
|
||||
@@ -37,6 +37,11 @@ export class Home implements OnDestroy {
|
||||
).subscribe(() => {
|
||||
this.expandToRoute(this.router.url);
|
||||
});
|
||||
|
||||
// Patch individual sidebar node labels without a full rebuild.
|
||||
this.labelSub = this.studentService.sidebarLabelUpdate$.subscribe(update => {
|
||||
this.patchNodeLabel(this.sidebarTree(), update.routerLink, update.label);
|
||||
});
|
||||
}
|
||||
|
||||
// ************************** Declarations *************************
|
||||
@@ -45,6 +50,7 @@ export class Home implements OnDestroy {
|
||||
private readonly router = inject(Router);
|
||||
private readonly studentService = inject(StudentService);
|
||||
private readonly routeSub: Subscription;
|
||||
private readonly labelSub: Subscription;
|
||||
protected readonly sidebarExpanded = signal(true);
|
||||
protected readonly sidebarTree = signal<SidebarNode[]>([]);
|
||||
|
||||
@@ -68,10 +74,28 @@ export class Home implements OnDestroy {
|
||||
|
||||
ngOnDestroy() {
|
||||
this.routeSub.unsubscribe();
|
||||
this.labelSub.unsubscribe();
|
||||
}
|
||||
|
||||
// ********************** Support Procedures ***********************
|
||||
|
||||
// *****************************************************************
|
||||
// Recursively walks the sidebar tree to find a node whose
|
||||
// routerLink matches the given link, and updates its label.
|
||||
// *****************************************************************
|
||||
private patchNodeLabel(nodes: SidebarNode[], routerLink: string[], label: string): boolean {
|
||||
for (const node of nodes) {
|
||||
if (node.routerLink && node.routerLink.join('/') === routerLink.join('/')) {
|
||||
node.label = label;
|
||||
return true;
|
||||
}
|
||||
if (node.children && this.patchNodeLabel(node.children, routerLink, label)) {
|
||||
return true;
|
||||
}
|
||||
}
|
||||
return false;
|
||||
}
|
||||
|
||||
// *****************************************************************
|
||||
// Loads student list, sorts by identifier, and builds the sidebar
|
||||
// tree with lazy-loading callbacks for goals and benchmarks.
|
||||
@@ -125,9 +149,8 @@ export class Home implements OnDestroy {
|
||||
childCount: 2,
|
||||
children: [
|
||||
{
|
||||
label: 'Progress Events',
|
||||
label: goal.progressEventCount > 0 ? `Progress Events (${goal.progressEventCount})` : 'Progress Events',
|
||||
routerLink: ['/students', studentId, 'goals', goal.goalId, 'progress'],
|
||||
childCount: goal.progressEventCount,
|
||||
},
|
||||
{
|
||||
label: 'Benchmarks',
|
||||
@@ -152,7 +175,7 @@ export class Home implements OnDestroy {
|
||||
return result.payload.benchmarks
|
||||
.filter(b => b.goalId === goalId)
|
||||
.map(b => ({
|
||||
label: b.benchmark,
|
||||
label: b.shortName || b.benchmark,
|
||||
routerLink: ['/students', studentId, 'goals', goalId, 'benchmarks', b.benchmarkId],
|
||||
}));
|
||||
}
|
||||
|
||||
@@ -8,6 +8,7 @@ export interface BenchmarkDto {
|
||||
goalId: string;
|
||||
goalCategory: string;
|
||||
benchmark: string;
|
||||
shortName?: string;
|
||||
createdByName: string;
|
||||
createdAt: Date;
|
||||
updatedAt: Date | null;
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
import { HttpClient, HttpErrorResponse } from '@angular/common/http';
|
||||
import { inject, Injectable, signal } from '@angular/core';
|
||||
import { firstValueFrom } from 'rxjs';
|
||||
import { firstValueFrom, Subject } from 'rxjs';
|
||||
import { environment } from '../../../environments/environment';
|
||||
import { ApiResult } from '../classes/api-result';
|
||||
import { ResponseResult } from '../classes/auth.models';
|
||||
@@ -27,6 +27,10 @@ export class StudentService {
|
||||
// Incremented after any data mutation so subscribers can refresh.
|
||||
readonly dataVersion = signal(0);
|
||||
|
||||
// Emits targeted label updates for sidebar nodes without a full rebuild.
|
||||
private readonly _sidebarLabelUpdate = new Subject<{ routerLink: string[]; label: string }>();
|
||||
readonly sidebarLabelUpdate$ = this._sidebarLabelUpdate.asObservable();
|
||||
|
||||
// ************************** Properties ***************************
|
||||
|
||||
// ************************ Public Methods *************************
|
||||
@@ -38,6 +42,14 @@ export class StudentService {
|
||||
this.dataVersion.update(v => v + 1);
|
||||
}
|
||||
|
||||
// *****************************************************************
|
||||
// Emits a targeted sidebar label update for a specific node,
|
||||
// avoiding the full tree rebuild that notifyDataChanged triggers.
|
||||
// *****************************************************************
|
||||
updateSidebarLabel(routerLink: string[], label: string) {
|
||||
this._sidebarLabelUpdate.next({ routerLink, label });
|
||||
}
|
||||
|
||||
// *****************************************************************
|
||||
// Returns student card summaries for the authenticated user.
|
||||
// *****************************************************************
|
||||
@@ -186,7 +198,7 @@ export class StudentService {
|
||||
// *****************************************************************
|
||||
// Creates a new benchmark for a student.
|
||||
// *****************************************************************
|
||||
async createBenchmark(studentId: string, data: { goalId: string; benchmark: string }): Promise<ApiResult<any>> {
|
||||
async createBenchmark(studentId: string, data: { goalId: string; benchmark: string; shortName?: string }): Promise<ApiResult<any>> {
|
||||
try {
|
||||
const result = await firstValueFrom(
|
||||
this.http.post<ResponseResult<any>>(`${this.base}/api/Student/${studentId}/benchmarks`, data)
|
||||
@@ -202,10 +214,10 @@ export class StudentService {
|
||||
// *****************************************************************
|
||||
// Updates a benchmark's text.
|
||||
// *****************************************************************
|
||||
async updateBenchmark(studentId: string, benchmarkId: string, benchmarkText: string): Promise<ApiResult<any>> {
|
||||
async updateBenchmark(studentId: string, benchmarkId: string, benchmarkText: string, shortName?: string): Promise<ApiResult<any>> {
|
||||
try {
|
||||
const result = await firstValueFrom(
|
||||
this.http.put<ResponseResult<any>>(`${this.base}/api/Student/${studentId}/benchmarks/${benchmarkId}`, { benchmark: benchmarkText })
|
||||
this.http.put<ResponseResult<any>>(`${this.base}/api/Student/${studentId}/benchmarks/${benchmarkId}`, { benchmark: benchmarkText, shortName })
|
||||
);
|
||||
return result.success
|
||||
? ApiResult.ok(result.data)
|
||||
|
||||
Reference in New Issue
Block a user