import { Component } from '@angular/core'; import { RouterLink } from '@angular/router'; import { DankaService } from '../../services/dankaService'; import { FamilyService } from '../../services/family-service'; import { AppHeader } from '../../share/header/app-header'; import { AppSideMenu } from '../../share/side-menu/app-side-menu'; import { Danka } from '../../models/danka'; import { FormsModule } from '@angular/forms'; type KanaRowValue = | 'all' | 'a' | 'ka' | 'sa' | 'ta' | 'na' | 'ha' | 'ma' | 'ya' | 'ra' | 'wa'; @Component({ selector: 'app-danka-list', imports: [AppHeader, AppSideMenu, RouterLink, FormsModule], templateUrl: './danka-list.html', styleUrl: './danka-list.scss', }) export class DankaList { dankaList: Danka[] = []; filterDankaList: Danka[] = []; searchKeyword: string = ''; dankaDisplay: number = 0; selectedFilter = 'all'; selectedKanaRow: KanaRowValue = 'all'; kanaRows: { label: string; value: KanaRowValue }[] = [ { label: '全件', value: 'all' }, { label: 'あ行', value: 'a' }, { label: 'か行', value: 'ka' }, { label: 'さ行', value: 'sa' }, { label: 'た行', value: 'ta' }, { label: 'な行', value: 'na' }, { label: 'は行', value: 'ha' }, { label: 'ま行', value: 'ma' }, { label: 'や行', value: 'ya' }, { label: 'ら行', value: 'ra' }, { label: 'わ行', value: 'wa' }, ]; private readonly kanaRowMap: Record, string[]> = { a: ['あ', 'い', 'う', 'え', 'お', 'ア', 'イ', 'ウ', 'エ', 'オ'], ka: ['か', 'き', 'く', 'け', 'こ', 'が', 'ぎ', 'ぐ', 'げ', 'ご', 'カ', 'キ', 'ク', 'ケ', 'コ', 'ガ', 'ギ', 'グ', 'ゲ', 'ゴ'], sa: ['さ', 'し', 'す', 'せ', 'そ', 'ざ', 'じ', 'ず', 'ぜ', 'ぞ', 'サ', 'シ', 'ス', 'セ', 'ソ', 'ザ', 'ジ', 'ズ', 'ゼ', 'ゾ'], ta: ['た', 'ち', 'つ', 'て', 'と', 'だ', 'ぢ', 'づ', 'で', 'ど', 'タ', 'チ', 'ツ', 'テ', 'ト', 'ダ', 'ヂ', 'ヅ', 'デ', 'ド'], na: ['な', 'に', 'ぬ', 'ね', 'の', 'ナ', 'ニ', 'ヌ', 'ネ', 'ノ'], ha: ['は', 'ひ', 'ふ', 'へ', 'ほ', 'ば', 'び', 'ぶ', 'べ', 'ぼ', 'ぱ', 'ぴ', 'ぷ', 'ぺ', 'ぽ', 'ハ', 'ヒ', 'フ', 'ヘ', 'ホ', 'バ', 'ビ', 'ブ', 'ベ', 'ボ', 'パ', 'ピ', 'プ', 'ペ', 'ポ'], ma: ['ま', 'み', 'む', 'め', 'も', 'マ', 'ミ', 'ム', 'メ', 'モ'], ya: ['や', 'ゆ', 'よ', 'ヤ', 'ユ', 'ヨ'], ra: ['ら', 'り', 'る', 'れ', 'ろ', 'ラ', 'リ', 'ル', 'レ', 'ロ'], wa: ['わ', 'を', 'ん', 'ワ', 'ヲ', 'ン'], }; constructor( private dankaService: DankaService, private familyService: FamilyService, ) { this.dankaList = this.dankaService.getDankaList(); this.showAllDanka(); } //全件タグで絞り込み showAllDanka() { this.selectedFilter = 'all'; this.selectedKanaRow = 'all'; this.searchKeyword = ''; this.filterDankaList = this.dankaList; this.dankaDisplay = this.filterDankaList.length; } //電話番号タグで絞り込み filterPhoneAvailable() { this.selectedFilter = 'phone'; this.selectedKanaRow = 'all'; //電話番号タブに該当する檀家を表示 this.filterDankaList = this.dankaList.filter((danka) => { return danka.phones.some((phone) => phone.tel.trim() !== ''); }); this.dankaDisplay = this.filterDankaList.length; } //検索処理 searchDanka() { this.selectedFilter = 'search'; this.selectedKanaRow = 'all'; //検索欄に入力された値から余白を削除 const keyword = this.searchKeyword.trim(); //検索欄が空の場合は檀家の一覧を表示 if (keyword === '') { this.filterDankaList = this.dankaList; this.dankaDisplay = this.filterDankaList.length; return; } //検索欄に値がある場合は値に該当する内容を表示 this.filterDankaList = this.dankaList.filter((danka) => { return ( danka.householdName.includes(keyword) || danka.householdFurigana.includes(keyword) || danka.householder.includes(keyword) || danka.householderFurigana.includes(keyword) || danka.postalCode.includes(keyword) || danka.address.includes(keyword) || danka.phones.some((phone) => phone.tel.includes(keyword) || phone.note.includes(keyword)) ); }); this.dankaDisplay = this.filterDankaList.length; console.log(this.dankaDisplay); } filterByKanaRow(row: KanaRowValue): void { this.selectedFilter = 'kana'; this.selectedKanaRow = row; this.searchKeyword = ''; if (row === 'all') { this.filterDankaList = this.dankaList; this.dankaDisplay = this.filterDankaList.length; return; } this.filterDankaList = this.dankaList.filter((danka) => { const firstKana = this.getDankaSortText(danka).charAt(0); return this.kanaRowMap[row].includes(firstKana); }); this.dankaDisplay = this.filterDankaList.length; } clearDanka() { this.selectedFilter = ''; this.selectedKanaRow = 'all'; this.searchKeyword = ''; this.filterDankaList = []; this.dankaDisplay = 0; } private getDankaSortText(danka: Danka): string { const householderName = this.normalizeName(danka.householder); const householderFamily = this.familyService .getFamiliesByDankaId(danka.id) .find((family) => this.normalizeName(family.name) === householderName); return (householderFamily?.furigana || danka.householder).trim(); } private normalizeName(name: string): string { return name.replace(/\s/g, ''); } }