@let parametreler = parametreProxy(firma()?.parametreler);

<div style="margin-top: 0em;">
    <div class="flex flex-row justify-content-center flex-wrap card-container">
        <img src="./app/uyar/firmalar.png"
             height="128" />
    </div>
</div>
<nz-row nzJustify="center"
        style="width:100%">
    <div class="text-3xl font-semibold">
        {{ parametreler?.ismi ?? "" }}
    </div>
</nz-row>
<nz-row nzJustify="center"
        style="width:100%">
    <div class="text-base text-500">
        {{ parametreler?.aciklama ?? "" }}
    </div>
</nz-row>

<div style="display: flex;flex-direction: row;align-items: center;width: 100%;justify-content: center;">

    <a class="ui label hoverable hover:zipla-5 active:zipla-5"
       routerLinkActive='orange'
       [routerLink]="['/🧩/🌀/🏭/🏢/' + (firma()._id ?? 'nil')+ '/🏠']">
        🏠
    </a>
    <a class="ui label hoverable hover:zipla-5 active:zipla-5"
       routerLinkActive='orange'
       [routerLink]="['/🧩/🌀/🏭/🏢/' + (firma()._id ?? 'nil')+ '/👷']">
        👷‍♀️
        Personeller
    </a>
    <a class="ui label hoverable hover:zipla-5 active:zipla-5"
       routerLinkActive='orange'
       [routerLink]="['/👨/👨/👪/👀']">
        👀
        Projeler
    </a>
    <a class="ui label hoverable hover:zipla-5 active:zipla-5"
       routerLinkActive='orange'
       [routerLink]="['/👨/👨/👪/🕵🏻']">
        📧
        E-Postalar
    </a>
    <a class="ui label hoverable hover:zipla-5 active:zipla-5"
       routerLinkActive='orange'
       [routerLink]="['/👨/👨/👪/🔎']">
        ⚙
        Ayarlar
    </a>
</div>

<div class="w-full"
     style="max-width: 640px;">
    <!-- NOT:  Hareket Bulunamadı -->
    @defer (on timer(1000)) {
    @if (listeIstek.liste.length < 1)
      {
      <div
      class="ui placeholder segment">
        <div class="ui icon header">
            @if (listeIstek.mesgul) {
            <i class="spinner loading icon"></i>
            } @else {
            <i class="archway icon"></i>
            }
            {{ listeIstek.mesgul ? 'Okunuyor' : 'Firma Bulunamadı' }}
        </div>
</div>
} @else {
@for (k of listeIstek.liste; track $index) {
<!-- @let parametreler = parametreProxy(k.parametreler); -->

<fikoyt-uyar-firma-item [(firma)]="k"></fikoyt-uyar-firma-item>
<!-- <div>
    {{ parametreler.ismi }} -> {{ parametreler.aciklama }}
</div> -->

}
@if (listeIstek.sayfalama.sayi){
<nz-row nzJustify="center"
        style="margin-top: 1em;position: -webkit-sticky;position: sticky;bottom: 5px;">
    <div
         style="/*max-width: 960px;*/row-gap: 10px;width: 100%;display: flex;flex-wrap: wrap;justify-content: end;column-gap: 10px;margin-right:1em;">

        <nz-pagination #sayfalayici
                       [nzSimple]="false"
                       [nzTotal]="listeIstek.sayfalama.toplamKayitSayisi"
                       style="background: white;padding: 0px 10px;border-radius: 2em;box-shadow: 0px 4px 8px -2px rgba(9, 30, 66, 0.25), 0px 0px 0px 1px rgba(9, 30, 66, 0.08);"
                       [nzPageSize]="listeIstek.sayfalama.sayi"
                       (nzPageSizeChange)="listeIstek.sayiDegistir($event);"
                       nzSize="small"
                       [nzPageSizeOptions]="[5, 10, 15]"
                       [nzPageIndex]="listeIstek.sayfalama.sayfa"
                       (nzPageIndexChange)="listeIstek.sayfaDegistir($event);"
                       nzShowSizeChanger
                       nzShowQuickJumper
                       [nzDisabled]="listeIstek.mesgul"></nz-pagination>
    </div>
</nz-row>
}
}
} @placeholder {
<div class="ui placeholder segment">
    <div class="ui icon header">
        <i class="spinner loading icon"></i>

        Firmalar Alınıyor
    </div>
</div>
} @loading {
<div class="ui placeholder segment">
    <div class="ui icon header">
        <i class="spinner loading icon"></i>

        Personeller Alınıyor
    </div>
</div>
} @error {
<div class="ui placeholder segment">
    <div class="ui icon header">
        <i class="exclamation triangle icon"></i> Liste yüklenemedi.
    </div>
</div>
}
</div>