feat(web): map expense categories to Form 990 lines in the category admin page
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
@@ -10,9 +10,9 @@ export interface MinistryDto { id: number; name_en: string; name_zh: string | nu
|
||||
|
||||
export interface ExpenseSubCategoryDto { id: number; groupId: number; name_en: string; name_zh: string | null; sortOrder: number; isActive: boolean; label?: string; form990LineId: number | null; form990LineCode: string | null; }
|
||||
export interface ExpenseCategoryGroupDto { id: number; name_en: string; name_zh: string | null; sortOrder: number; isActive: boolean; subCategories: ExpenseSubCategoryDto[]; label?: string; form990LineId: number | null; form990LineCode: string | null; }
|
||||
export interface CreateExpenseGroupRequest { name_en: string; name_zh: string | null; sortOrder: number; }
|
||||
export interface CreateExpenseGroupRequest { name_en: string; name_zh: string | null; sortOrder: number; form990LineId: number | null; }
|
||||
export interface UpdateExpenseGroupRequest extends CreateExpenseGroupRequest { isActive: boolean; }
|
||||
export interface CreateExpenseSubCategoryRequest { groupId: number; name_en: string; name_zh: string | null; sortOrder: number; }
|
||||
export interface CreateExpenseSubCategoryRequest { groupId: number; name_en: string; name_zh: string | null; sortOrder: number; form990LineId: number | null; }
|
||||
export interface UpdateExpenseSubCategoryRequest extends CreateExpenseSubCategoryRequest { isActive: boolean; }
|
||||
|
||||
export interface ExpenseListItemDto {
|
||||
|
||||
+18
@@ -61,6 +61,15 @@
|
||||
Sort order
|
||||
<kendo-numerictextbox [(ngModel)]="groupForm.sortOrder" [format]="'n0'" [decimals]="0" [min]="0"></kendo-numerictextbox>
|
||||
</label>
|
||||
<label class="flex flex-col gap-1 md:col-span-2">
|
||||
<span>Form 990 Line / 990 行</span>
|
||||
<kendo-dropdownlist
|
||||
[data]="form990Lines"
|
||||
textField="label" valueField="id" [valuePrimitive]="true"
|
||||
[defaultItem]="{ id: null, label: '(Unmapped / 未對應)' }"
|
||||
[(ngModel)]="groupForm.form990LineId">
|
||||
</kendo-dropdownlist>
|
||||
</label>
|
||||
<label *ngIf="editingGroupId != null" class="flex items-center gap-2 md:col-span-2">
|
||||
<input type="checkbox" [(ngModel)]="groupForm.isActive" /> Active
|
||||
</label>
|
||||
@@ -89,6 +98,15 @@
|
||||
Sort order
|
||||
<kendo-numerictextbox [(ngModel)]="subForm.sortOrder" [format]="'n0'" [decimals]="0" [min]="0"></kendo-numerictextbox>
|
||||
</label>
|
||||
<label class="flex flex-col gap-1 md:col-span-2">
|
||||
<span>Form 990 Line / 990 行</span>
|
||||
<kendo-dropdownlist
|
||||
[data]="form990Lines"
|
||||
textField="label" valueField="id" [valuePrimitive]="true"
|
||||
[defaultItem]="{ id: null, label: '(Unmapped / 未對應)' }"
|
||||
[(ngModel)]="subForm.form990LineId">
|
||||
</kendo-dropdownlist>
|
||||
</label>
|
||||
<label *ngIf="editingSubId != null" class="flex items-center gap-2 md:col-span-2">
|
||||
<input type="checkbox" [(ngModel)]="subForm.isActive" /> Active
|
||||
</label>
|
||||
|
||||
+16
-10
@@ -5,14 +5,16 @@ import { GridModule, CellClickEvent, RowClassArgs } from '@progress/kendo-angula
|
||||
import { ButtonsModule } from '@progress/kendo-angular-buttons';
|
||||
import { DialogsModule } from '@progress/kendo-angular-dialog';
|
||||
import { InputsModule } from '@progress/kendo-angular-inputs';
|
||||
import { DropDownsModule } from '@progress/kendo-angular-dropdowns';
|
||||
import { ContextMenuModule, ContextMenuComponent, ContextMenuSelectEvent } from '@progress/kendo-angular-menu';
|
||||
import { ExpenseCategoryApiService } from '../../services/expense-category-api.service';
|
||||
import { ExpenseCategoryGroupDto, ExpenseSubCategoryDto } from '../../models/expense.model';
|
||||
import { Form990ExpenseLineDto } from '../../../finance-report/models/form990-report.model';
|
||||
|
||||
@Component({
|
||||
selector: 'app-expense-categories-page',
|
||||
standalone: true,
|
||||
imports: [CommonModule, FormsModule, GridModule, ButtonsModule, DialogsModule, InputsModule, ContextMenuModule],
|
||||
imports: [CommonModule, FormsModule, GridModule, ButtonsModule, DialogsModule, InputsModule, DropDownsModule, ContextMenuModule],
|
||||
templateUrl: './expense-categories-page.component.html',
|
||||
styleUrls: ['./expense-categories-page.component.scss'],
|
||||
})
|
||||
@@ -20,6 +22,7 @@ export class ExpenseCategoriesPageComponent implements OnInit {
|
||||
groups: ExpenseCategoryGroupDto[] = [];
|
||||
selectedGroup: ExpenseCategoryGroupDto | null = null;
|
||||
loading = false;
|
||||
form990Lines: Form990ExpenseLineDto[] = [];
|
||||
|
||||
@ViewChild('groupMenu') groupMenu!: ContextMenuComponent;
|
||||
@ViewChild('subMenu') subMenu!: ContextMenuComponent;
|
||||
@@ -30,15 +33,18 @@ export class ExpenseCategoriesPageComponent implements OnInit {
|
||||
|
||||
groupDialogOpen = false;
|
||||
editingGroupId: number | null = null;
|
||||
groupForm = { name_en: '', name_zh: '', sortOrder: 0, isActive: true };
|
||||
groupForm = { name_en: '', name_zh: '', sortOrder: 0, isActive: true, form990LineId: null as number | null };
|
||||
|
||||
subDialogOpen = false;
|
||||
editingSubId: number | null = null;
|
||||
subForm = { name_en: '', name_zh: '', sortOrder: 0, isActive: true };
|
||||
subForm = { name_en: '', name_zh: '', sortOrder: 0, isActive: true, form990LineId: null as number | null };
|
||||
|
||||
constructor(private api: ExpenseCategoryApiService) {}
|
||||
|
||||
ngOnInit(): void { this.load(); }
|
||||
ngOnInit(): void {
|
||||
this.load();
|
||||
this.api.getForm990Lines().subscribe(lines => { this.form990Lines = lines; });
|
||||
}
|
||||
|
||||
load(): void {
|
||||
this.loading = true;
|
||||
@@ -101,16 +107,16 @@ export class ExpenseCategoriesPageComponent implements OnInit {
|
||||
|
||||
openNewGroup(): void {
|
||||
this.editingGroupId = null;
|
||||
this.groupForm = { name_en: '', name_zh: '', sortOrder: this.groups.length + 1, isActive: true };
|
||||
this.groupForm = { name_en: '', name_zh: '', sortOrder: this.groups.length + 1, isActive: true, form990LineId: null };
|
||||
this.groupDialogOpen = true;
|
||||
}
|
||||
openEditGroup(g: ExpenseCategoryGroupDto): void {
|
||||
this.editingGroupId = g.id;
|
||||
this.groupForm = { name_en: g.name_en, name_zh: g.name_zh ?? '', sortOrder: g.sortOrder, isActive: g.isActive };
|
||||
this.groupForm = { name_en: g.name_en, name_zh: g.name_zh ?? '', sortOrder: g.sortOrder, isActive: g.isActive, form990LineId: g.form990LineId };
|
||||
this.groupDialogOpen = true;
|
||||
}
|
||||
saveGroup(): void {
|
||||
const body = { name_en: this.groupForm.name_en, name_zh: this.groupForm.name_zh || null, sortOrder: this.groupForm.sortOrder };
|
||||
const body = { name_en: this.groupForm.name_en, name_zh: this.groupForm.name_zh || null, sortOrder: this.groupForm.sortOrder, form990LineId: this.groupForm.form990LineId };
|
||||
const done = () => { this.groupDialogOpen = false; this.load(); };
|
||||
if (this.editingGroupId == null) this.api.createGroup(body).subscribe(done);
|
||||
else this.api.updateGroup(this.editingGroupId, { ...body, isActive: this.groupForm.isActive }).subscribe(done);
|
||||
@@ -123,17 +129,17 @@ export class ExpenseCategoriesPageComponent implements OnInit {
|
||||
openNewSub(): void {
|
||||
if (!this.selectedGroup) return;
|
||||
this.editingSubId = null;
|
||||
this.subForm = { name_en: '', name_zh: '', sortOrder: this.subCategories.length + 1, isActive: true };
|
||||
this.subForm = { name_en: '', name_zh: '', sortOrder: this.subCategories.length + 1, isActive: true, form990LineId: null };
|
||||
this.subDialogOpen = true;
|
||||
}
|
||||
openEditSub(s: ExpenseSubCategoryDto): void {
|
||||
this.editingSubId = s.id;
|
||||
this.subForm = { name_en: s.name_en, name_zh: s.name_zh ?? '', sortOrder: s.sortOrder, isActive: s.isActive };
|
||||
this.subForm = { name_en: s.name_en, name_zh: s.name_zh ?? '', sortOrder: s.sortOrder, isActive: s.isActive, form990LineId: s.form990LineId };
|
||||
this.subDialogOpen = true;
|
||||
}
|
||||
saveSub(): void {
|
||||
if (!this.selectedGroup) return;
|
||||
const body = { groupId: this.selectedGroup.id, name_en: this.subForm.name_en, name_zh: this.subForm.name_zh || null, sortOrder: this.subForm.sortOrder };
|
||||
const body = { groupId: this.selectedGroup.id, name_en: this.subForm.name_en, name_zh: this.subForm.name_zh || null, sortOrder: this.subForm.sortOrder, form990LineId: this.subForm.form990LineId };
|
||||
const done = () => { this.subDialogOpen = false; this.load(); };
|
||||
if (this.editingSubId == null) this.api.createSub(body).subscribe(done);
|
||||
else this.api.updateSub(this.editingSubId, { ...body, isActive: this.subForm.isActive }).subscribe(done);
|
||||
|
||||
@@ -7,11 +7,12 @@ import {
|
||||
ExpenseCategoryGroupDto, CreateExpenseGroupRequest, UpdateExpenseGroupRequest,
|
||||
CreateExpenseSubCategoryRequest, UpdateExpenseSubCategoryRequest,
|
||||
} from '../models/expense.model';
|
||||
import { Form990ExpenseLineDto } from '../../finance-report/models/form990-report.model';
|
||||
|
||||
@Injectable({ providedIn: 'root' })
|
||||
export class ExpenseCategoryApiService {
|
||||
private readonly endpoint: string;
|
||||
constructor(private http: HttpClient, apiConfig: ApiConfigService) {
|
||||
constructor(private http: HttpClient, private apiConfig: ApiConfigService) {
|
||||
this.endpoint = apiConfig.getApiUrl('expense-categories');
|
||||
}
|
||||
getAll(includeInactive = false): Observable<ExpenseCategoryGroupDto[]> {
|
||||
@@ -29,4 +30,8 @@ export class ExpenseCategoryApiService {
|
||||
createSub(r: CreateExpenseSubCategoryRequest): Observable<{ id: number }> { return this.http.post<{ id: number }>(`${this.endpoint}/subcategories`, r); }
|
||||
updateSub(id: number, r: UpdateExpenseSubCategoryRequest): Observable<void> { return this.http.put<void>(`${this.endpoint}/subcategories/${id}`, r); }
|
||||
deactivateSub(id: number): Observable<void> { return this.http.delete<void>(`${this.endpoint}/subcategories/${id}`); }
|
||||
getForm990Lines(): Observable<Form990ExpenseLineDto[]> {
|
||||
return this.http.get<Form990ExpenseLineDto[]>(this.apiConfig.getApiUrl('form990-report') + '/lines')
|
||||
.pipe(map(rows => rows.map(r => ({ ...r, label: `${r.lineCode} — ${r.name_en}${r.name_zh ? ' / ' + r.name_zh : ''}` }))));
|
||||
}
|
||||
}
|
||||
|
||||
@@ -0,0 +1,8 @@
|
||||
export interface Form990ExpenseLineDto {
|
||||
id: number;
|
||||
lineCode: string;
|
||||
name_en: string;
|
||||
name_zh: string | null;
|
||||
sortOrder: number;
|
||||
label?: string; // bilingual "code — name", filled by service
|
||||
}
|
||||
Reference in New Issue
Block a user