kaimyo-management/src/app/pages/danka-list/danka-list.ts

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<Exclude<KanaRowValue, 'all'>, 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, '');
  }
}