import { Component, OnInit } from '@angular/core'; import { CommonModule } from '@angular/common'; import { FormsModule } from '@angular/forms'; import { GridModule } from '@progress/kendo-angular-grid'; import { InputsModule } from '@progress/kendo-angular-inputs'; import { ButtonsModule } from '@progress/kendo-angular-buttons'; import { DialogsModule } from '@progress/kendo-angular-dialog'; import { DropDownsModule } from '@progress/kendo-angular-dropdowns'; import { MinistryApiService } from '../../services/ministry-api.service'; import { MinistryDto, CreateMinistryRequest, UpdateMinistryRequest, } from '../../models/ministry.model'; import { PageHeaderActionsDirective } from '../../../../shared/directives/page-header-actions.directive'; @Component({ selector: 'app-ministries-page', standalone: true, imports: [CommonModule, FormsModule, GridModule, InputsModule, ButtonsModule, DialogsModule, DropDownsModule, PageHeaderActionsDirective], templateUrl: './ministries-page.component.html', styleUrls: ['./ministries-page.component.scss'], }) export class MinistriesPageComponent implements OnInit { data: MinistryDto[] = []; isLoading = false; includeInactive = false; readonly functionalClassOptions = [ { value: 'Program', label: 'Program / 事工服務' }, { value: 'ManagementGeneral', label: 'Management & General / 管理' }, { value: 'Fundraising', label: 'Fundraising / 募款' }, ]; showDialog = false; editing: MinistryDto | null = null; form: UpdateMinistryRequest = this.blankForm(); constructor(private api: MinistryApiService) {} ngOnInit(): void { this.load(); } load(): void { this.isLoading = true; this.api.getAll(this.includeInactive).subscribe({ next: rows => { this.data = rows; this.isLoading = false; }, error: () => { this.isLoading = false; }, }); } openAdd(): void { this.editing = null; this.form = this.blankForm(); this.showDialog = true; } openEdit(m: MinistryDto): void { this.editing = m; this.form = { name_en: m.name_en, name_zh: m.name_zh, description_en: m.description_en, description_zh: m.description_zh, isActive: m.isActive, sortOrder: m.sortOrder, defaultFunctionalClass: m.defaultFunctionalClass || 'Program', }; this.showDialog = true; } save(): void { if (this.editing) { this.api.update(this.editing.id, this.form).subscribe(() => { this.showDialog = false; this.load(); }); } else { const create: CreateMinistryRequest = { name_en: this.form.name_en, name_zh: this.form.name_zh, description_en: this.form.description_en, description_zh: this.form.description_zh, sortOrder: this.form.sortOrder, defaultFunctionalClass: this.form.defaultFunctionalClass, }; this.api.create(create).subscribe(() => { this.showDialog = false; this.load(); }); } } deactivate(m: MinistryDto): void { if (!confirm(`Deactivate "${m.name_en}"?`)) return; this.api.deactivate(m.id).subscribe(() => this.load()); } private blankForm(): UpdateMinistryRequest { return { name_en: '', name_zh: null, description_en: null, description_zh: null, isActive: true, sortOrder: 0, defaultFunctionalClass: 'Program' }; } }