{% extends "users/publicbase.html" %}
{% load crispy_forms_tags %}
{% block content %}
<style type="text/css">
.square_private_arrow {
  float: right;
  margin-right: -20px;
  margin-top: -13px;
  margin-bottom: -13px;
    width: 35px;
    height: 83px;
    background-color: #ee1b3b;
    color: #ffffff;
    -webkit-clip-path:polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
}

.square_company_arrow {
  float: right;
  margin-right: -20px;
  margin-top: -13px;
  margin-bottom: -13px;
    width: 35px;
    height: 83px;
    background-color: #5c5554;
    color: #ffffff;
    -webkit-clip-path:polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
}
.h2_in_arrow {
  margin-left: 12px;
  margin-top:  2px;
  font-size: 16pt;
}

.tabelement {

}

</style>

<style type="text/css">
  #logincard {
    width: 80%;   
    margin-top: 2%;
  }
</style>
<div class="card mx-auto" id="logincard">
  <div class="card-body">
  <h2>Notfallhilfe für die Agentur {{agencydata.name}}
    <a style="float: right" class="btn btn-secondary btn-sm mr-2 " href="{% url 'closeexternalrecoverdir' agencydata.pk %}"><i class="fas fa-lock"></i></a>
  </h2>
  <hr>
  <h3 style="color: #ee1b3b; font-style: bold;">Private Unterlagen</h3>
<!-- ACCORDION START -->
<div id="accordion">
  <!-- 1. NOTFALLLEITFADEN -->
  <div class="card">
    <div class="card-header" id="headingOne">
      <h5 class="mb-0">
        <button class="btn btn-link tabelement" data-toggle="collapse" data-target="#rd_1" aria-expanded="true" aria-controls="rd_1">
          <h4 style="margin-top: 11px;">1. Handlungsleitfaden & Vorsorgedokumente</h4>
        </button>
        <span style="float: right;">
          <span class="square_private_arrow"><h2 class="h2_in_arrow">1</h2></span>
        </span>
      </h5>
    </div>

    <div id="rd_1" class="collapse" aria-labelledby="headingOne" data-parent="#accordion">
      <div class="card-body">
        
        <a href="/#" data-toggle="modal" data-target="#hl">
          <h4>Handlungsleitfaden betrachten</h4>
        </a>
        <hr>

        <!-- HANDLUNGSLEITFADEN MODAL -->
        <div class="modal fade" id="hl" tabindex="-1" role="dialog" aria-labelledby="hl_label" aria-hidden="true">
          <div class="modal-dialog modal-lg" role="document">
            <div class="modal-content">
              <div class="modal-header">
                <h5 class="modal-title" id="exampleModalLabel">Handlungsleitfen</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                  <span aria-hidden="true">&times;</span>
                </button>
              </div>
              <div class="modal-body">
                
                  <h4>1. Bitte die zuständigen Regionaldirektion (RD) kontaktieren und um Hilfe bitten.</h4>
                  <table>
                    <tr>
                      <td>Zuständige RD</td>
                      <td>{{hl.rd_main|default:""}}</td>
                    </tr>
                    <tr>
                      <td>Name des RD-Leiters</td>
                      <td>{{hl.rd_name|default:""}}</td>
                    </tr>
                    <tr>
                      <td>Adresse</td>
                      <td>{{hl.rd_adresse|default:""}}</td>
                    </tr>
                    <tr>
                      <td>Telefon</td>
                      <td>{{hl.rd_tel|default:""}}</td>
                    </tr>
                    <tr>
                      <td>E-Mail</td>
                      <td>{{hl.rd_mail|default:""}}</td>
                    </tr>
                  </table>
                  <hr>
                  <h4>2. Kontaktiere bitte den Interessenverband VVE e.V. und bitte ihn um Hilfe.</h4>
                  <br />
                  <b>Geschäftstelle des VVE e.V.</b><br />
                  Verband der selbständigen Verischerungskaufleute er ERGO Gesellschaften e.V.<br />
                  Frankenthaler Str. 2<br />
                  68519 Viernheim<br /><br />
                  Telefon: 06204/964060<br />
                  E-Mail: geschaeftsstelle@myvve.de<br />
                  <hr>
                  <h4>3. Bitte beachte die nachfolgenden Unterlagen und Informationen innerhalb dieser Notfallhilfe. Hierbei handelt es sich um wichtige Unterlagen für den Notfall.</h4>
                  <hr>
                  <h4>4. Ich bin BVK Mitglied (Bundersverband Deutscher Versicherungskaufleute e.V.).</h4>
                  <br />
                  <p>Mitgliedsnummer: {{hl.bvk_number|default:""}}</p>
                  <b>Bundesverband Deutscher Versicherungskaufleute e.V.</b><br />
                  Kekuléstraße 12<br />
                  53115 Bonn<br /><br />
                  Telefon: 0228/22805-0<br />
                  E-Mail: bvk@bvk.de<br />
                  <hr>
                  <h4>5. Bei nachgelagerten Rechtsfragen wende Dich bitte an meinen Rechschutzversicherer.</h4>
                  <table>
                    <tr>
                      <td>Rechtsschutzversicherer</td>
                      <td>{{hl.rv_name|default:""}}</td>
                    </tr>
                    <tr>
                      <td>Versicherungsnummer</td>
                      <td>{{hl.rv_number|default:""}}</td>
                    </tr>
                    <tr>
                      <td>Telefon 1</td>
                      <td>{{hlvf.rv_tel_1|default:""}}</td>
                    </tr>
                    <tr>
                      <td>Telefon 2</td>
                      <td>{{hlvf.rv_tel_2|default:""}}</td>
                    </tr>
                  </table>



              </div>
              <div class="modal-footer">
                <button type="button" class="btn btn-primary" data-dismiss="modal">Schließen</button>
              </div>
            </div>
          </div>
        </div>

      <h4>Familie und Freunde
      </h4>
      <table class="table table-hover" id="a1_fc" >
            <thead>
            <tr>
              <th scope="col">Name</th>
              <th scope="col">Beziehung</th>
              <th scope="col">Adresse</th>
              <th scope="col">Telefon</th>
              <th scope="col">E-Mail</th>
            </tr>
          </thead>
          <tbody >
            {% for familyc in area_1_fc %}
            <tr>
              <td><a href="/#" data-toggle="modal" data-target="#familyc_{{familyc.pk}}">{{familyc.rd_name|default:""}}</a></td>
              <td>{{familyc.rd_rel|default:""}}</td>
              <td>{{familyc.rd_adresse|default:""}}</td>
              <td>{{familyc.rd_tel|default:""}}</td>
              <td>{{familyc.rd_mail|default:""}}</td>
            </tr>
            {% endfor %}
          </tbody>
        </table>

        <hr>
        <h4>Vertrauensperson
        </h4>
        <table class="table table-hover" id="a1_trust" >
              <thead>
              <tr>
                <th scope="col">Name</th>
                <th scope="col">Firma</th>
                <th scope="col">Adresse</th>
                <th scope="col">Telefon</th>
                <th scope="col">E-Mail</th>
              </tr>
            </thead>
            <tbody >
              {% for trust in area_1_trust %}
              <tr>
                <td><a href="/#" data-toggle="modal" data-target="#trust_{{trust.pk}}">{{trust.rd_name|default:""}}</a></td>
                <td>{{trust.rd_company|default:""}}</td>
                <td>{{trust.rd_adresse|default:""}}</td>
                <td>{{trust.rd_tel|default:""}}</td>
                <td>{{trust.rd_mail|default:""}}</td>
              </tr>
              {% endfor %}
            </tbody>
          </table>


          <hr>
          <h4>Vorsorgedokumente
          </h4>
          <table class="table table-hover" id="a1_docs" >
                <thead>
                <tr>
                  <th scope="col">Name</th>
                  <th scope="col">Datum</th>
                  <th scope="col">Beschreibung</th>
                  <th scope="col">&nbsp;</th>
                </tr>
              </thead>
              <tbody >
               {% for doc in area_1_doc %}
                <tr>
                   <td>{{doc.document_name|default:""}}</a></td>
                   <td>{{doc.document_date|date:"d.m.Y"|default:""}}</td>
                   <td>{{doc.document_desc|default:""}}</td>
                   <td><a href="{% url 'getdoc' doc.document agencydata.pk %}" target="_blank">Download</a></td>
                </tr>
              {% endfor %}
              </tbody>
            </table>
      </div>
    </div>
  </div>

{% for familyc in area_1_fc %}
<!-- MODAL FAMILIEN UND FREUNDE -->
<div class="modal fade" id="familyc_{{familyc.pk}}" tabindex="-1" role="dialog" aria-labelledby="" aria-hidden="true">
  <div class="modal-dialog modal-lg" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalLabel">Kontakt betrachten</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        
          <table>
          <tr>
            <td>Name:</td>
            <td>{{familyc.rd_name|default:""}}</td>
          </tr>
          <tr>
            <td>Beziehung:</td>
            <td>{{familyc.rd_rel|default:""}}</td>
          </tr>
          <tr>
            <td>Adresse:</td>
            <td>{{familyc.rd_adresse|default:""}}</td>
          </tr>
          <tr>
            <td>Telefonnummer:</td>
            <td>{{familyc.rd_tel|default:""}}</td>
          </tr>
          <tr>
            <td>E-Mailadresse:</td>
            <td>{{familyc.rd_mail|default:""}}</td>
          </tr>
        </table>


      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-primary" data-dismiss="modal">Schließen</button>
      </div>
    </div>
  </div>
</div>
{% endfor %}

<!-- MODAL FÜR VERTRAUENSPERSONEN -->
{% for trust in area_1_trust %}
<div class="modal fade" id="trust_{{trust.pk}}" tabindex="-1" role="dialog" aria-labelledby="" aria-hidden="true">
  <div class="modal-dialog modal-lg" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalLabel">Vertraunsperson betrachten</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        <table>
          <tr>
            <td>Name:</td>
            <td>{{trust.rd_name}}</td>
          </tr>
          <tr>
            <td>Firma:</td>
            <td>{{trust.rd_company}}</td>
          </tr>
          <tr>
            <td>Adresse:</td>
            <td>{{trust.rd_adresse}}</td>
          </tr>
          <tr>
            <td>Telefonnummer:</td>
            <td>{{trust.rd_tel}}</td>
          </tr>
          <tr>
            <td>E-Mailadresse:</td>
            <td>{{trust.rd_mail|default:""}}</td>
          </tr>
        </table>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-primary" data-dismiss="modal">Schließen</button>
      </div>
    </div>
  </div>
</div>
{% endfor %}

<!-- 2. ABSICHERUNG VERMÖGEN IMMOBILIEN -->
<div class="card">
  <div class="card-header" id="headingOne">
    <h5 class="mb-0">
      <button class="btn btn-link tabelement"  data-toggle="collapse" data-target="#rd_2" aria-expanded="true" aria-controls="rd_2">
        <h4 style="margin-top: 11px;">2. Absicherung, Vermögen & Immobilien</h4>
      </button>
  <span style="float: right;">
        <span class="square_private_arrow"><h2 class="h2_in_arrow">2</h2></span>
      </span>
    </h5>
  </div>

  <div id="rd_2" class="collapse" aria-labelledby="headingOne" data-parent="#accordion">
    <div class="card-body">
      
      <a href="/#" data-toggle="modal" data-target="#hlfv">
        <h4>Handlungsleitfaden für Vorsoroge & Finanzen betrachten</h4>
      </a>
      <hr>

      <h4>Bank-, Konto- & Depot-Vollmachten
      </h4>
      <table class="table table-hover" id="a2_deposit" >
            <thead>
            <tr>
              <th scope="col">Name</th>
              <th scope="col">Anschrift</th>
              <th scope="col">Bank</th>
            </tr>
          </thead>
          <tbody >
            {% for ele in area_2_deposit %}
            <tr>
              <td><a href="/#" data-toggle="modal" data-target="#deposit_{{ele.pk}}">{{ele.geber_name|default:""}}</a></td>
              <td>{{ele.geber_adresse|default:""}}</td>
              <td>{{ele.geber_bank|default:""}}</td>
            </tr>
            {% endfor %}
          </tbody>
        </table>
      <hr>
        <h4>Digitaler Versicherungsordner
        <a class="btn btn-primary btn mb-3 btn-sm " href="{% url 'rd-a2-addergo' %}" style="float: right;"><i class="fas fa-plus"></i>&nbsp;Zugangsdaten</a>
        </h4>
        <table class="table table-hover" id="a2_ergo" >
              <thead>
              <tr>
                <th scope="col">Benutzername</th>
              </tr>
            </thead>
            <tbody >
              {% for ele in area_2_ergo %}
              <tr>
                <td><a href="/#" data-toggle="modal" data-target="#ergo_{{ele.pk}}">{{ele.ergo_username}}</a></td>
              </tr>
              {% endfor %}
            </tbody>
          </table>
      <hr>

    <h4>Online-Banking
   </h4>
    <table class="table table-hover" id="area_2_onlinebank" >
          <thead>
          <tr>
            <th scope="col">Internetadresse/Bankname</th>
          </tr>
        </thead>
        <tbody >
          {% for ele in area_2_onlinebank %}
          <tr>
            <td><a href="/#" data-toggle="modal" data-target="#onlinebank_{{ele.pk}}">{{ele.web_address}}</a></td>
          </tr>
          {% endfor %}
        </tbody>
      </table>

      <hr>
      <h4>Wertpapiere, Versicherungsscheine & Altersvorsorge
      </h4>
      <table class="table table-hover" id="a2_docs" >
            <thead>
            <tr>
              <th scope="col">Name</th>
              <th scope="col">Datum</th>
              <th scope="col">Beschreibung</th>
              <th scope="col">&nbsp;</th>
            </tr>
          </thead>
          <tbody >
           {% for doc in area_2_doc %}
            <tr>
               <td>{{doc.document_name|default:""}}</a></td>
               <td>{{doc.document_date|date:"d.m.Y"|default:""}}</td>
               <td>{{doc.document_desc|default:""}}</td>
               <td><a href="{% url 'getdoc' doc.document agencydata.pk %}" target="_blank">Download</a></td>
            </tr>
          {% endfor %}
          </tbody>
        </table>

        

       <!-- HANDLUNGSLEITFADEN Vorsorge und Finanzen -->
      <div class="modal fade" id="hlfv" tabindex="-1" role="dialog" aria-labelledby="hl_label" aria-hidden="true">
        <div class="modal-dialog modal-lg" role="document">
          <div class="modal-content">
            <div class="modal-header">
              <h5 class="modal-title" id="exampleModalLabel">Handlungsleitfen Vorsorge & Finanzen</h5>
              <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                <span aria-hidden="true">&times;</span>
              </button>
            </div>
            <div class="modal-body">
              
              <h4>1. Bitte meinen zuständigen Versicherungsberater kontaktieren.</h4>
          <table>
            <tr>
              <td>Unternehmen</td>
              <td>{{hlvf.vf_ver_company|default:""}}</td>
            </tr>
            <tr>
              <td>Name</td>
              <td>{{hlvf.vf_ver_name|default:""}}</td>
            </tr>
            <tr>
              <td>Adresse</td>
              <td>{{hlvf.vf_ver_adresse|default:""}}</td>
            </tr>
            <tr>
              <td>Telefon</td>
              <td>{{hlvf.vf_ver_tel|default:""}}</td>
            </tr>
            <tr>
              <td>E-Mail</td>
              <td>{{hlvf.vf_ver_mail|default:""}}</td>
            </tr>
          </table>
          <hr>
          <h4>2. Bitte meinen zuständigen Finanzberater kontaktieren.</h4>
          <table>
            <tr>
              <td>Unternehmen</td>
              <td>{{hlvf.vf_fb_company|default:""}}</td>
            </tr>
            <tr>
              <td>Name</td>
              <td>{{hlvf.vf_fb_name|default:""}}</td>
            </tr>
            <tr>
              <td>Adresse</td>
              <td>{{hlvf.vf_fb_adresse|default:""}}</td>
            </tr>            
            <tr>
              <td>Telefon</td>
              <td>{{hlvf.vf_fb_tel|default:""}}</td>
            </tr>
            <tr>
              <td>E-Mail</td>
              <td>{{hlvf.vf_fb_mail|default:""}}</td>
            </tr>
          </table>
          <hr>
          <h4>3. Eventuell ist es nötig, meinen Rechtsschutzversicherer zu kontaktieren.</h4>
          <table>
            <tr>
              <td>Rechtsschutzversicherer</td>
              <td>{{hlvf.vf_rv_name|default:""}}</td>
            </tr>
            <tr>
              <td>Versicherungsnummer</td>
              <td>{{hlvf.vf_rv_number|default:""}}</td>
            </tr>
            <tr>
              <td>Telefon 1</td>
              <td>{{hlvf.vf_rv_tel_1|default:""}}</td>
            </tr>
            <tr>
              <td>Telefon 2</td>
              <td>{{hlvf.vf_rv_tel_2|default:""}}</td>
            </tr>
          </table>

            </div>
            <div class="modal-footer">
              <button type="button" class="btn btn-primary" data-dismiss="modal">Schließen</button>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

{% for deposit in area_2_deposit %}
<!-- MODAL Bankkonto -->
<div class="modal fade" id="deposit_{{deposit.pk}}" tabindex="-1" role="dialog" aria-labelledby="" aria-hidden="true">
  <div class="modal-dialog modal-lg" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalLabel">Kont-/Depot-/Schrankfachinhaber/Vollmachtgeber</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        
       <h4>Kont-/Depot-/Schrankfachinhaber/Vollmachtgeber</h4>
    <table>
      <tr>
        <td>Name</td>
        <td>{{deposit.geber_name|default:""}}</td>
      </tr>
      <tr>
        <td>Anschrift</td>
        <td>{{deposit.geber_adresse|default:""}}</td>
      </tr>
      <tr>
        <td>Name, Anschrift Bank</td>
        <td>{{deposit.geber_bank|default:""}}</td>
      </tr>
    </table>
    <hr>
    <h4>Bevollmächtigte Person</h4>
    <table>
      <tr>
        <td>Name</td>
        <td>{{deposit.nehmer_name|default:""}}</td>
      </tr>
      <tr>
        <td>Anschrift</td>
        <td>{{deposit.nehmer_adresse|default:""}}</td>
      </tr>
      <tr>
        <td>Geburtsdatum</td>
        <td>{{deposit.nehmer_geb|default:""}}</td>
      </tr>
      <tr>
        <td>Telefon-Nr.</td>
        <td>{{deposit.nehmer_tel|default:""}}</td>
      </tr>
    </table>
      {% if deposit.vollmacht_doc %}
      <h4><a href="{% url 'getdoc' deposit.vollmacht_doc agencydata.pk %}" target="_blank">Vollmachtsdokument herunterladen</a></h4>
      {% endif %}

      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-primary" data-dismiss="modal">Schließen</button>
      </div>
    </div>
  </div>
</div>
{% endfor %}

{% for ergo in area_2_ergo %}
<!-- MODAL Ergo Versicherungsordner -->
<div class="modal fade" id="ergo_{{ergo.pk}}" tabindex="-1" role="dialog" aria-labelledby="" aria-hidden="true">
  <div class="modal-dialog modal-lg" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalLabel">Digitaler Versicherungsordner</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        
       <p>Meine Versicherungen sind im ERGO-Kundenportal hinterlegt. Mit folgenden Zugangsdaten erhälst Du alle Informationen zu bestehenden Versicherungen, Versicherungsnummern und Kontaktmöglichkeiten.
    <h4>Applikation: ERGO meine Versicherung</h4>
    <table>
      <tr>
        <td>Benutzername:</td>
        <td>{{ergo.ergo_username}}</td>
      </tr>
      <tr>
        <td>Passwort:</td>
        <td>{{ergo.ergo_password}}</td>
      </tr>
    </table>

      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-primary" data-dismiss="modal">Schließen</button>
      </div>
    </div>
  </div>
</div>
{% endfor %}

{% for onlinebank in area_2_onlinebank %}
<!-- MODAL Online Banking -->
<div class="modal fade" id="onlinebank_{{onlinebank.pk}}" tabindex="-1" role="dialog" aria-labelledby="" aria-hidden="true">
  <div class="modal-dialog modal-lg" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalLabel">Online-Banking</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        
     <h4>Bankdaten</h4>
    <table>
      <tr>
        <td>Internetadresse:</td>
        <td><a href="https://{{onlinebank.web_address}}" target="_blank">{{onlinebank.web_address}}</a></td>
      </tr>
      <tr>
        <td>Benutzername:</td>
        <td>{{onlinebank.web_username|default:""}}</td>
      </tr>
      <tr>
        <td>Passwort:</td>
        <td>{{onlinebank.web_password|default:""}}</td>
      </tr>
       <tr>
        <td>BIC:</td>
        <td>{{onlinebank.bic|default:""}}</td>
      </tr>
       <tr>
        <td>IBAN:</td>
        <td>{{onlinebank.iban|default:""}}</td>
      </tr>
      <tr>
        <td>Mit meinem Account soll Folgendes passieren:</td>
        <td>{{onlinebank.accountactivity|default:""}}</td>
      </tr>
    </table>
    {% if onlinebank.vollmacht_doc %}
    <h4><a href="{% url 'getdoc' onlinebank.document agencydata.pk %}" target="_blank">Vollmachtsdokument herunterladen</a></h4>
    {% endif %}
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-primary" data-dismiss="modal">Schließen</button>
      </div>
    </div>
  </div>
</div>
{% endfor %}

<!-- 3. Verträge -->
<div class="card">
  <div class="card-header" id="headingOne">
    <h5 class="mb-0">
      <button class="btn btn-link tabelement"  onclick="javascript:newTabOpen(3)" data-toggle="collapse" data-target="#rd_3" aria-expanded="true" aria-controls="rd_3">
        <h4 style="margin-top: 11px;">3. Verträge</h4>
      </button>
  <span style="float: right;">
        <span class="square_private_arrow"><h2 class="h2_in_arrow">3</h2></span>
      </span>
    </h5>
  </div>

  <div id="rd_3" class="collapse" aria-labelledby="headingOne" data-parent="#accordion">
    <div class="card-body">
      
      <h4>Streaming Abonnements
      <a class="btn btn-primary btn btn-sm mb-3" href="{% url 'rd-a3-addstreaming' %}" style="float: right;"><i class="fas fa-plus"></i>&nbsp;Streaming-Abo</a>
      </h4>
      <table class="table table-hover" id="a3_abos" >
            <thead>
            <tr>
              <th scope="col">Name</th>
              <th scope="col">Benutzername</th>
            </tr>
          </thead>
          <tbody >
            {% for ele in area_3_abos %}
            <tr>
              <td><a href="/#" data-toggle="modal" data-target="#streaming_{{ele.pk}}">{{ele.name|default:""}}</a></td>
              <td>{{ele.username|default:""}}</td>
            </tr>
            {% endfor %}
          </tbody>
        </table>
      <hr>
      <h4>Verträge
      </h4>
      <table class="table table-hover" id="a3_docs" >
            <thead>
            <tr>
              <th scope="col">Name</th>
              <th scope="col">Datum</th>
              <th scope="col">Beschreibung</th>
              <th scope="col">&nbsp;</th>
            </tr>
          </thead>
          <tbody >
           {% for doc in area_3_doc %}
            <tr>
               <td>{{doc.document_name|default:""}}</a></td>
               <td>{{doc.document_date|date:"d.m.Y"|default:""}}</td>
               <td>{{doc.document_desc|default:""}}</td>
               <td><a href="{% url 'getdoc' doc.document agencydata.pk %}" target="_blank">Download</a></td>
            </tr>
          {% endfor %}
          </tbody>
        </table>
    </div>
  </div>
</div>

{% for streaming in area_3_abos %}
<!-- MODAL Streamingabos -->
<div class="modal fade" id="streaming_{{streaming.pk}}" tabindex="-1" role="dialog" aria-labelledby="" aria-hidden="true">
  <div class="modal-dialog modal-lg" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalLabel">Streaming-Abo</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        
      <h4>Streaming-Dienst</h4>
        <table>
          <tr>
            <td>Name:</td>
            <td>{{streaming.name}}</td>
          </tr>
          <tr>
            <td>Benutzername:</td>
            <td>{{streaming.username|default:""}}</td>
          </tr>
          <tr>
            <td>Passwort:</td>
            <td>{{streaming.password|default:""}}</td>
          </tr>
          <tr>
            <td>Mit meinem Account soll Folgendes passieren:</td>
            <td>{{streaming.accountactivity|default:""}}</td>
          </tr>
        </table>
        <hr>
        {% if streaming.vollmacht_doc %}
        <h4><a href="{% url 'getdoc' streaming.vollmacht_doc agencydata.pk %}" target="_blank">Vollmachtsdokument anschauen</a></h4>
        {% endif %}

      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-primary" data-dismiss="modal">Schließen</button>
      </div>
    </div>
  </div>
</div>
{% endfor %}

<!-- 4. Digitale Konten -->
<div class="card">
  <div class="card-header" id="headingOne">
    <h5 class="mb-0">
      <button class="btn btn-link tabelement" onclick="javascript:newTabOpen(4)" data-toggle="collapse" data-target="#rd_4" aria-expanded="true" aria-controls="rd_4">
        <h4 style="margin-top: 11px;">4. Digitale Konten & Passwörter</h4>
      </button>
  <span style="float: right;">
        <span class="square_private_arrow"><h2 class="h2_in_arrow">4</h2></span>
      </span>
    </h5>
  </div>

  <div id="rd_4" class="collapse" aria-labelledby="headingOne" data-parent="#accordion">
    <div class="card-body">
      

      <h4>Online-Accounts (Messenger, E-Mail-Accounts, Social-Media etc.)
    </h4>
    <table class="table table-hover" id="a4_digitalaccount" >
          <thead>
          <tr>
            <th scope="col">Name</th>
            <th scope="col">Link</th>
            <th scope="col">Benutzername</th>
          </tr>
        </thead>
        <tbody >
          {% for ele in area_4_digitalaccount %}
          <tr>
            <td><a href="/#" data-toggle="modal" data-target="#account_{{ele.pk}}">{{ele.name|default:""}}</a></td>
            <td>{{ele.link|default:""}}</td>
            <td>{{ele.username|default:""}}</td>
          </tr>
          {% endfor %}
        </tbody>
      </table>

    <hr>
   <h4>Dokumente
    </h4>
    <table class="table table-hover" id="a4_docs" >
          <thead>
          <tr>
            <th scope="col">Name</th>
            <th scope="col">Datum</th>
            <th scope="col">Beschreibung</th>
            <th scope="col">&nbsp;</th>
          </tr>
      </thead>
      <tbody >
       {% for doc in area_4_doc %}
        <tr>
           <td>{{doc.document_name|default:""}}</a></td>
           <td>{{doc.document_date|date:"d.m.Y"|default:""}}</td>
           <td>{{doc.document_desc|default:""}}</td>
           <td><a href="{% url 'getdoc' doc.document agencydata.pk %}" target="_blank">Download</a></td>
        </tr>
      {% endfor %}
      </tbody>
    </table>

    </div>
  </div>
</div>

{% for account in area_4_digitalaccount %}
<!-- MODAL Digitale Accounts -->
<div class="modal fade" id="account_{{account.pk}}" tabindex="-1" role="dialog" aria-labelledby="" aria-hidden="true">
  <div class="modal-dialog modal-lg" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalLabel">Digitaler Account</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        
 
        <h4>Online-Account</h4>
        <table>
          <tr>
            <td>Name:</td>
            <td>{{account.name|default:""}}</td>
          </tr>
          <tr>
            <td>Link:</td>
            <td>{{account.link|default:""}}</td>
          </tr>
          <tr>
            <td>Benutzername:</td>
            <td>{{account.username|default:""}}</td>
          </tr>
          <tr>
            <td>Passwort:</td>
            <td>{{account.password|default:""}}</td>
          </tr>
          <tr>
            <td>E-Mail:</td>
            <td>{{account.mail|default:""}}</td>
          </tr>
          <tr>
            <td>Mit meinem Account soll Folgendes passieren:</td>
            <td>{{account.accountactivity|default:""}}</td>
          </tr>
        </table>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-primary" data-dismiss="modal">Schließen</button>
      </div>
    </div>
  </div>
</div>
{% endfor %}
  <br />
  <h3 style="color: #5c5554; font-style: bold;">Gewerbliche Unterlagen</h3>
  <!-- GEWERBE -->
  <!-- 5. Vorsorgedokumente -->
  <div class="card">
    <div class="card-header" id="headingOne">
      <h5 class="mb-0">
        <button class="btn btn-link tabelement" onclick="javascript:newTabOpen(5)" data-toggle="collapse" data-target="#rd_5" aria-expanded="true" aria-controls="rd_5">
          <h4 style="margin-top: 11px;">5. Vorsorgedokumente</h4>
        </button>
    <span style="float: right;">
          <span class="square_company_arrow"><h2 class="h2_in_arrow">5</h2></span>
        </span>
      </h5>
    </div>

    <div id="rd_5" class="collapse" aria-labelledby="headingOne" data-parent="#accordion">
      <div class="card-body">
        

        <h4>Personal, interne und externe Partner inkl. Funktionen usw.
    </h4>
      <hr>
      <table class="table table-hover" id="a5_personal" >
        <thead>
        <tr>
          <th scope="col">Name</th>
          <th scope="col">Funktion</th>
          <th scope="col">Intern/Extern</th>
        </tr>
      </thead>
      <tbody >
        {% for ele in area_5_personal %}
        <tr>
          <td><a href="/#" data-toggle="modal" data-target="#personal_{{ele.pk}}">{{ele.name|default:""}}</a></td>
          <td>{{ele.function|default:""}}</td>
          <td>
            {% if ele.inorex == "in" %} Intern 
            {% elif ele.inorex == "ex" %} Extern
            {% else %} {% endif %}
          </td>
        </tr>
        {% endfor %}
        {% for us in users_of_agency %}
        <tr>
          <td><a href="/#" data-toggle="modal" data-target="#personal_in_{{us.pk}}">{{us.get_full_name}}</a></td>
          <td>{{us.profile.func|default:""}}</td>
          <td>
            Intern
          </td>
          <td>
          </td>
        </tr>
        {% endfor %}
      </tbody>
    </table>
        <hr>

        <h4>Dokumente
        </h4>
        <table class="table table-hover" id="a5_docs" >
              <thead>
              <tr>
                <th scope="col">Name</th>
                <th scope="col">Datum</th>
                <th scope="col">Beschreibung</th>
                <th scope="col">&nbsp;</th>
              </tr>
          </thead>
          <tbody >
           {% for doc in area_5_doc %}
            <tr>
               <td>{{doc.document_name|default:""}}</a></td>
               <td>{{doc.document_date|date:"d.m.Y"|default:""}}</td>
               <td>{{doc.document_desc|default:""}}</td>
               <td><a href="{% url 'getdoc' doc.document agencydata.pk %}" target="_blank">Download</a></td>
            </tr>
          {% endfor %}
          </tbody>
        </table>



        </div>
      </div>
  </div>

{% for personal in area_5_personal %}
<!-- MODAL Personalaccounts EXTERN -->
<div class="modal fade" id="personal_{{personal.pk}}" tabindex="-1" role="dialog" aria-labelledby="" aria-hidden="true">
  <div class="modal-dialog modal-lg" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalLabel">Personaldaten Extern</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">


           <h4>Personal und Partner</h4>
    <table>
      <tr>
        <td>Name:</td>
        <td>{{personal.name}}</td>
      </tr>
      <tr>
        <td>Function:</td>
        <td>{{personal.function|default:""}}</td>
      </tr>
      <tr>
        <td>Intern/Extern:</td>
        <td>
          {% if personal.inorex == "in" %} Intern 
          {% elif personal.inorex == "ex" %} Extern
          {% else %} {% endif %}
        </td>
      </tr>
      <tr>
        <td>PNR:</td>
        <td>{{personal.pnr|default:""}}</td>
      </tr>
      <tr>
        <td>ONR:</td>
        <td>{{personal.onr|default:""}}</td>
      </tr>
      <tr>
        <td>Email-Adresse:</td>
        <td>{{personal.mail|default:""}}</td>
      </tr>
      <tr>
        <td>Telefon:</td>
        <td>{{personal.tel|default:""}}</td>
      </tr>
      <tr>
        <td>Adresse:</td>
        <td>{{personal.adresse|default:""}}</td>
      </tr>
    </table>



      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-primary" data-dismiss="modal">Schließen</button>
      </div>
    </div>
  </div>
</div>
{% endfor %}

{% for personal in users_of_agency %}
<!-- MODAL Personalaccounts INTERN -->
<div class="modal fade" id="personal_in_{{personal.pk}}" tabindex="-1" role="dialog" aria-labelledby="" aria-hidden="true">
  <div class="modal-dialog modal-lg" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalLabel">Personaldaten Intern</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">


           <h4>Personal und Partner</h4>
    <table>
      <tr>
        <td>Name:</td>
        <td>{{personal.get_full_name}}</td>
      </tr>
      <tr>
        <td>Function:</td>
        <td>{{personal.profile.compfunc|default:""}}</td>
      </tr>
      <tr>
        <td>Intern/Extern:</td>
        <td>Intern </td>
      </tr>
      <tr>
        <td>Email-Adresse:</td>
        <td>{{personal.email|default:""}}</td>
      </tr>
      <tr>
        <td>Telefon:</td>
        <td>{{personal.profile.phoneland|default:""}} / {{personal.profile.phonemobile|default:""}} / {{personal.profile.phone_public|default:""}}</td>
      </tr>
      </table>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-primary" data-dismiss="modal">Schließen</button>
      </div>
    </div>
  </div>
</div>
{% endfor %}

<!-- 6. Vorsorge und Finanzen -->
<div class="card">
  <div class="card-header" id="headingOne">
    <h5 class="mb-0">
      <button class="btn btn-link tabelement"  data-toggle="collapse" data-target="#rd_6" aria-expanded="true" aria-controls="rd_6">
        <h4 style="margin-top: 11px;">6. Vorsorge & Finanzen</h4>
      </button>
  <span style="float: right;">
        <span class="square_company_arrow"><h2 class="h2_in_arrow">6</h2></span>
      </span>
    </h5>
  </div>

  <div id="rd_6" class="collapse" aria-labelledby="headingOne" data-parent="#accordion">
    <div class="card-body">
     
    <h4>Bankkonten und Online-Bankzugänge
    </h4>
    <table class="table table-hover" id="area_6_onlinebank" >
          <thead>
          <tr>
            <th scope="col">Internetadresse/Bankname</th>
          </tr>
        </thead>
        <tbody >
          {% for ele in area_6_onlinebank %}
          <tr>
            <td><a href="/#" data-toggle="modal" data-target="#deposit_6_{{ele.pk}}">{{ele.web_address}}</a></td>
          </tr>
          {% endfor %}
        </tbody>
      </table>
    <hr>

       <h4>Dokumente
    </h4>
    <table class="table table-hover" id="a6_docs" >
          <thead>
          <tr>
            <th scope="col">Name</th>
            <th scope="col">Datum</th>
            <th scope="col">Beschreibung</th>
            <th scope="col">&nbsp;</th>
          </tr>
      </thead>
      <tbody >
       {% for doc in area_6_doc %}
        <tr>
           <td>{{doc.document_name|default:""}}</a></td>
           <td>{{doc.document_date|date:"d.m.Y"|default:""}}</td>
           <td>{{doc.document_desc|default:""}}</td>
           <td><a href="{% url 'getdoc' doc.document agencydata.pk %}" target="_blank">Download</a></td>
        </tr>
      {% endfor %}
      </tbody>
    </table>
    </div>
  </div>
</div>

{% for onlinebank in area_6_onlinebank %}
<!-- MODAL Online Banking -->
<div class="modal fade" id="deposit_6_{{onlinebank.pk}}" tabindex="-1" role="dialog" aria-labelledby="" aria-hidden="true">
  <div class="modal-dialog modal-lg" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalLabel">Online-Banking</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        
     <h4>Bankdaten</h4>
    <table>
      <tr>
        <td>Internetadresse:</td>
        <td><a href="https://{{onlinebank.web_address}}" target="_blank">{{onlinebank.web_address}}</a></td>
      </tr>
      <tr>
        <td>Benutzername:</td>
        <td>{{onlinebank.web_username|default:""}}</td>
      </tr>
      <tr>
        <td>Passwort:</td>
        <td>{{onlinebank.web_password|default:""}}</td>
      </tr>
       <tr>
        <td>BIC:</td>
        <td>{{onlinebank.bic|default:""}}</td>
      </tr>
       <tr>
        <td>IBAN:</td>
        <td>{{onlinebank.iban|default:""}}</td>
      </tr>
      <tr>
        <td>Mit meinem Account soll Folgendes passieren:</td>
        <td>{{onlinebank.accountactivity|default:""}}</td>
      </tr>
    </table>
    {% if onlinebank.vollmacht_doc %}
    <h4><a href="{% url 'getdoc' onlinebank.document agencydata.pk %}" target="_blank">Vollmachtsdokument herunterladen</a></h4>
    {% endif %}
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-primary" data-dismiss="modal">Schließen</button>
      </div>
    </div>
  </div>
</div>
{% endfor %}

<!-- 7. Immobilien -->
<div class="card">
  <div class="card-header" id="headingOne">
    <h5 class="mb-0">
      <button class="btn btn-link tabelement"  data-toggle="collapse" data-target="#rd_7" aria-expanded="true" aria-controls="rd_7">
        <h4 style="margin-top: 11px;">7. Immobilien</h4>
      </button>
  <span style="float: right;">
        <span class="square_company_arrow"><h2 class="h2_in_arrow">7</h2></span>
      </span>
    </h5>
  </div>

  <div id="rd_7" class="collapse" aria-labelledby="headingOne" data-parent="#accordion">
    <div class="card-body">
      


    <h4>Verträge 
    </h4>
    <table class="table table-hover" id="a7_contract" >
          <thead>
          <tr>
            <th scope="col">Vertrags-Typ</th>
            <th scope="col">Eigentümer etc.</th>
          </tr>
        </thead>
        <tbody >
         {% for contract in area_7_contract %}
          <tr>
             <td><a href="/#" data-toggle="modal" data-target="#contract_7_{{contract.pk}}">{{contract.contract_typ|default:""}}</a></td>
             <td>{{contract.contract_owner|default:""}}</td>
          </tr>
        {% endfor %}
       </tbody>
    </table>
    <hr>




       <h4>Dokumente
    </h4>
    <table class="table table-hover" id="a7_docs" >
          <thead>
          <tr>
            <th scope="col">Name</th>
            <th scope="col">Datum</th>
            <th scope="col">Beschreibung</th>
            <th scope="col">&nbsp;</th>
          </tr>
      </thead>
      <tbody >
       {% for doc in area_7_doc %}
        <tr>
           <td>{{doc.document_name|default:""}}</a></td>
           <td>{{doc.document_date|date:"d.m.Y"|default:""}}</td>
           <td>{{doc.document_desc|default:""}}</td>
           <td><a href="{% url 'getdoc' doc.document agencydata.pk %}" target="_blank">Download</a></td>
        </tr>
      {% endfor %}
      </tbody>
    </table>



    </div>
  </div>
</div>

 {% for contract in area_7_contract %}
<!-- MODAL Verträge Bereich 7 -->
<div class="modal fade" id="contract_7_{{contract.pk}}" tabindex="-1" role="dialog" aria-labelledby="" aria-hidden="true">
  <div class="modal-dialog modal-lg" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalLabel">Verträge</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        
     <h4>Vertragsinformationen</h4>
    <table>
      <tr>
        <td>Typ</td>
        <td>{{contract.contract_typ|default:""}}</td>
      </tr>
      <tr>
        <td>Eigentümer/Immobilie/etc.</td>
        <td>{{contract.contract_owner|default:""}}</td>
      </tr>
      <tr>
        <td>Lizenz</td>
        <td>{{contract.license|default:""}}</td>
      </tr>
       <tr>
        <td>Info 1</td>
        <td>{{contract.info1|default:""}}</td>
      </tr>
      <tr>
        <td>Info 2</td>
        <td>{{contract.info2|default:""}}</td>
      </tr>
      <tr>
        <td>Adresse</td>
        <td>{{contract.ad|default:""}}</td>
      </tr>
      <tr>
        <td>Telefon</td>
        <td>{{contract.tel|default:""}}</td>
      </tr>
      <tr>
        <td>E-Mail</td>
        <td>{{contract.mail|default:""}}</td>
      </tr>
    </table>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-primary" data-dismiss="modal">Schließen</button>
      </div>
    </div>
  </div>
</div>
{% endfor %}

<!-- 8. Verträge -->
<div class="card">
  <div class="card-header" id="headingOne">
    <h5 class="mb-0">
      <button class="btn btn-link tabelement"  data-toggle="collapse" data-target="#rd_8" aria-expanded="true" aria-controls="rd_8">
        <h4 style="margin-top: 11px;">8. Verträge</h4>
      </button>
  <span style="float: right;">
        <span class="square_company_arrow"><h2 class="h2_in_arrow">8</h2></span>
      </span>
    </h5>
  </div>

  <div id="rd_8" class="collapse" aria-labelledby="headingOne" data-parent="#accordion">
    <div class="card-body">
     

      <h4>Digitale Accounts (Webseiten, E-Mail etc.)
      </h4>
      <table class="table table-hover" id="a8_digitalaccount" >
            <thead>
            <tr>
              <th scope="col">Name</th>
              <th scope="col">Link</th>
              <th scope="col">Benutzername</th>
            </tr>
          </thead>
          <tbody >
            {% for ele in area_8_digitalaccount %}
            <tr>
              <td><a href="/#" data-toggle="modal" data-target="#digi_8_{{ele.pk}}">{{ele.name|default:""}}</a></td>
              <td>{{ele.link|default:""}}</td>
              <td>{{ele.username|default:""}}</td>
            </tr>
            {% endfor %}
          </tbody>
        </table>
      <hr>


       <h4>Dokumente
    </h4>
    <table class="table table-hover" id="a8_docs" >
          <thead>
          <tr>
            <th scope="col">Name</th>
            <th scope="col">Datum</th>
            <th scope="col">Beschreibung</th>
            <th scope="col">&nbsp;</th>
          </tr>
      </thead>
      <tbody >
       {% for doc in area_8_doc %}
        <tr>
           <td>{{doc.document_name|default:""}}</a></td>
           <td>{{doc.document_date|date:"d.m.Y"|default:""}}</td>
           <td>{{doc.document_desc|default:""}}</td>
           <td><a href="{% url 'getdoc' doc.document agencydata.pk %}" target="_blank">Download</a></td>
        </tr>
      {% endfor %}
      </tbody>
    </table>



    </div>
  </div>
</div>

{% for account in area_8_digitalaccount %}
<!-- MODAL Digitale Accounts -->
<div class="modal fade" id="digi_8_{{account.pk}}" tabindex="-1" role="dialog" aria-labelledby="" aria-hidden="true">
  <div class="modal-dialog modal-lg" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalLabel">Digitaler Account</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        
 
        <h4>Online-Account</h4>
        <table>
          <tr>
            <td>Name:</td>
            <td>{{account.name|default:""}}</td>
          </tr>
          <tr>
            <td>Link:</td>
            <td>{{account.link|default:""}}</td>
          </tr>
          <tr>
            <td>Benutzername:</td>
            <td>{{account.username|default:""}}</td>
          </tr>
          <tr>
            <td>Passwort:</td>
            <td>{{account.password|default:""}}</td>
          </tr>
          <tr>
            <td>E-Mail:</td>
            <td>{{account.mail|default:""}}</td>
          </tr>
          <tr>
            <td>Mit meinem Account soll Folgendes passieren:</td>
            <td>{{account.accountactivity|default:""}}</td>
          </tr>
        </table>

      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-primary" data-dismiss="modal">Schließen</button>
      </div>
    </div>
  </div>
</div>
{% endfor %}

<!-- 9. Sonstiges -->
<div class="card">
  <div class="card-header" id="headingOne">
    <h5 class="mb-0">
      <button class="btn btn-link tabelement"  data-toggle="collapse" data-target="#rd_9" aria-expanded="true" aria-controls="rd_9">
        <h4 style="margin-top: 11px;">9. Sonstiges</h4>
      </button>
  <span style="float: right;">
        <span class="square_company_arrow"><h2 class="h2_in_arrow">9</h2></span>
      </span>
    </h5>
  </div>

  <div id="rd_9" class="collapse" aria-labelledby="headingOne" data-parent="#accordion">
    <div class="card-body">
    


        <h4>Sonstige Datenelemente
        </h4>
        <table class="table table-hover" id="area_9_else" >
              <thead>
              <tr>
                <th scope="col">Name/Titel etc.</th>
                <th scope="col">Beschreibung</th>
              </tr>
            </thead>
            <tbody >
              {% for ele in area_9_else %}
              <tr>
                <td><a href="/#" data-toggle="modal" data-target="#else_{{ele.pk}}">{{ele.name}}</a></td>
                <td>{{ele.desc}}</td>
              </tr>
              {% endfor %}
            </tbody>
          </table>
        <hr>



       <h4>Dokumente
    </h4>
    <table class="table table-hover" id="a9_docs" >
          <thead>
          <tr>
            <th scope="col">Name</th>
            <th scope="col">Datum</th>
            <th scope="col">Beschreibung</th>
            <th scope="col">&nbsp;</th>
          </tr>
      </thead>
      <tbody >
       {% for doc in area_9_doc %}
        <tr>
           <td>{{doc.document_name|default:""}}</a></td>
           <td>{{doc.document_date|date:"d.m.Y"|default:""}}</td>
           <td>{{doc.document_desc|default:""}}</td>
           <td><a href="{% url 'getdoc' doc.document agencydata.pk %}" target="_blank">Download</a></td>
        </tr>
      {% endfor %}
      </tbody>
    </table>



    </div>
  </div>
</div>

{% for else in area_9_else %}
<!-- MODAL Digitale Accounts -->
<div class="modal fade" id="else_{{else.pk}}" tabindex="-1" role="dialog" aria-labelledby="" aria-hidden="true">
  <div class="modal-dialog modal-lg" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalLabel">Sonstige Datenelemente</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        
       <h4>Informationen</h4>
          <table>
            <tr>
              <td>Name</td>
              <td>{{else.name|default:""}}</td>
            </tr>
            <tr>
              <td>Beschreibung:</td>
              <td>{{else.desc|default:""}}</td>
            </tr>
          </table>

            </div>
            <div class="modal-footer">
              <button type="button" class="btn btn-primary" data-dismiss="modal">Schließen</button>
            </div>
          </div>
        </div>
      </div>
{% endfor %}

</div>
</div>
</div>
<script type="text/javascript">
  $(document).ready(function(){

    // ALL DATABALES ACTIVATE 
     $('#a1_fc').DataTable({
      "language": {
        "search" : "Suche",
        "info": "Zeige _START_ bis _END_ von _TOTAL_ Einträgen",
        "lengthMenu":     "Zeige _MENU_ Einträge",
        "zeroRecords": "Nichts gefunden",
        "infoEmpty": "Keine Einträge",
        "paginate": {
            "first":      "Erste",
            "last":       "Letzte",
            "next":       "Nächste",
            "previous":   "Zurück"
        },
      },
      "pageLength": 50,
      "buttons" : {
        "className" : "btn-danger"
      }
    });


     $('#a1_trust').DataTable({
      "language": {
        "search" : "Suche",
        "info": "Zeige _START_ bis _END_ von _TOTAL_ Einträgen",
        "lengthMenu":     "Zeige _MENU_ Einträge",
        "zeroRecords": "Nichts gefunden",
        "infoEmpty": "Keine Einträge",
        "paginate": {
            "first":      "Erste",
            "last":       "Letzte",
            "next":       "Nächste",
            "previous":   "Zurück"
        },
      },
      "pageLength": 50,
      "buttons" : {
        "className" : "btn-danger"
      }
    });


     $('#a1_docs').DataTable({
      "language": {
        "search" : "Suche",
        "info": "Zeige _START_ bis _END_ von _TOTAL_ Einträgen",
        "lengthMenu":     "Zeige _MENU_ Einträge",
        "zeroRecords": "Nichts gefunden",
        "infoEmpty": "Keine Einträge",
        "paginate": {
            "first":      "Erste",
            "last":       "Letzte",
            "next":       "Nächste",
            "previous":   "Zurück"
        },
      },
      "pageLength": 50,
      "buttons" : {
        "className" : "btn-danger"
      }
    });

     $('#a2_docs').DataTable({
      "language": {
        "search" : "Suche",
        "info": "Zeige _START_ bis _END_ von _TOTAL_ Einträgen",
        "lengthMenu":     "Zeige _MENU_ Einträge",
        "zeroRecords": "Nichts gefunden",
        "infoEmpty": "Keine Einträge",
        "paginate": {
            "first":      "Erste",
            "last":       "Letzte",
            "next":       "Nächste",
            "previous":   "Zurück"
        },
      },
      "pageLength": 50,
      "buttons" : {
        "className" : "btn-danger"
      }
    });

        $('#a2_deposit').DataTable({
      "language": {
        "search" : "Suche",
        "info": "Zeige _START_ bis _END_ von _TOTAL_ Einträgen",
        "lengthMenu":     "Zeige _MENU_ Einträge",
        "zeroRecords": "Nichts gefunden",
        "infoEmpty": "Keine Einträge",
        "paginate": {
            "first":      "Erste",
            "last":       "Letzte",
            "next":       "Nächste",
            "previous":   "Zurück"
        },
      },
      "pageLength": 50,
      "buttons" : {
        "className" : "btn-danger"
      }
    });


      $('#a2_ergo').DataTable({
      "language": {
        "search" : "Suche",
        "info": "Zeige _START_ bis _END_ von _TOTAL_ Einträgen",
        "lengthMenu":     "Zeige _MENU_ Einträge",
        "zeroRecords": "Nichts gefunden",
        "infoEmpty": "Keine Einträge",
        "paginate": {
            "first":      "Erste",
            "last":       "Letzte",
            "next":       "Nächste",
            "previous":   "Zurück"
        },
      },
      "pageLength": 50,
      "buttons" : {
        "className" : "btn-danger"
      }
    });


      $('#area_2_onlinebank').DataTable({
      "language": {
        "search" : "Suche",
        "info": "Zeige _START_ bis _END_ von _TOTAL_ Einträgen",
        "lengthMenu":     "Zeige _MENU_ Einträge",
        "zeroRecords": "Nichts gefunden",
        "infoEmpty": "Keine Einträge",
        "paginate": {
            "first":      "Erste",
            "last":       "Letzte",
            "next":       "Nächste",
            "previous":   "Zurück"
        },
      },
      "pageLength": 50,
      "buttons" : {
        "className" : "btn-danger"
      }
    });        


 $('#a3_abos').DataTable({
      "language": {
        "search" : "Suche",
        "info": "Zeige _START_ bis _END_ von _TOTAL_ Einträgen",
        "lengthMenu":     "Zeige _MENU_ Einträge",
        "zeroRecords": "Nichts gefunden",
        "infoEmpty": "Keine Einträge",
        "paginate": {
            "first":      "Erste",
            "last":       "Letzte",
            "next":       "Nächste",
            "previous":   "Zurück"
        },
      },
      "pageLength": 50,
      "buttons" : {
        "className" : "btn-danger"
      }
    });        


 $('#a3_docs').DataTable({
      "language": {
        "search" : "Suche",
        "info": "Zeige _START_ bis _END_ von _TOTAL_ Einträgen",
        "lengthMenu":     "Zeige _MENU_ Einträge",
        "zeroRecords": "Nichts gefunden",
        "infoEmpty": "Keine Einträge",
        "paginate": {
            "first":      "Erste",
            "last":       "Letzte",
            "next":       "Nächste",
            "previous":   "Zurück"
        },
      },
      "pageLength": 50,
      "buttons" : {
        "className" : "btn-danger"
      }
    });        


 $('#a4_docs').DataTable({
      "language": {
        "search" : "Suche",
        "info": "Zeige _START_ bis _END_ von _TOTAL_ Einträgen",
        "lengthMenu":     "Zeige _MENU_ Einträge",
        "zeroRecords": "Nichts gefunden",
        "infoEmpty": "Keine Einträge",
        "paginate": {
            "first":      "Erste",
            "last":       "Letzte",
            "next":       "Nächste",
            "previous":   "Zurück"
        },
      },
      "pageLength": 50,
      "buttons" : {
        "className" : "btn-danger"
      }
    });  


 $('#a4_digitalaccount').DataTable({
      "language": {
        "search" : "Suche",
        "info": "Zeige _START_ bis _END_ von _TOTAL_ Einträgen",
        "lengthMenu":     "Zeige _MENU_ Einträge",
        "zeroRecords": "Nichts gefunden",
        "infoEmpty": "Keine Einträge",
        "paginate": {
            "first":      "Erste",
            "last":       "Letzte",
            "next":       "Nächste",
            "previous":   "Zurück"
        },
      },
      "pageLength": 50,
      "buttons" : {
        "className" : "btn-danger"
      }
    });  


 $('#a5_personal').DataTable({
      "language": {
        "search" : "Suche",
        "info": "Zeige _START_ bis _END_ von _TOTAL_ Einträgen",
        "lengthMenu":     "Zeige _MENU_ Einträge",
        "zeroRecords": "Nichts gefunden",
        "infoEmpty": "Keine Einträge",
        "paginate": {
            "first":      "Erste",
            "last":       "Letzte",
            "next":       "Nächste",
            "previous":   "Zurück"
        },
      },
      "pageLength": 50,
      "buttons" : {
        "className" : "btn-danger"
      }
    }); 
     

 $('#a5_docs').DataTable({
      "language": {
        "search" : "Suche",
        "info": "Zeige _START_ bis _END_ von _TOTAL_ Einträgen",
        "lengthMenu":     "Zeige _MENU_ Einträge",
        "zeroRecords": "Nichts gefunden",
        "infoEmpty": "Keine Einträge",
        "paginate": {
            "first":      "Erste",
            "last":       "Letzte",
            "next":       "Nächste",
            "previous":   "Zurück"
        },
      },
      "pageLength": 50,
      "buttons" : {
        "className" : "btn-danger"
      }
    }); 
     
     $('#a6_docs').DataTable({
      "language": {
        "search" : "Suche",
        "info": "Zeige _START_ bis _END_ von _TOTAL_ Einträgen",
        "lengthMenu":     "Zeige _MENU_ Einträge",
        "zeroRecords": "Nichts gefunden",
        "infoEmpty": "Keine Einträge",
        "paginate": {
            "first":      "Erste",
            "last":       "Letzte",
            "next":       "Nächste",
            "previous":   "Zurück"
        },
      },
      "pageLength": 50,
      "buttons" : {
        "className" : "btn-danger"
      }
    }); 

     $('#a7_docs').DataTable({
      "language": {
        "search" : "Suche",
        "info": "Zeige _START_ bis _END_ von _TOTAL_ Einträgen",
        "lengthMenu":     "Zeige _MENU_ Einträge",
        "zeroRecords": "Nichts gefunden",
        "infoEmpty": "Keine Einträge",
        "paginate": {
            "first":      "Erste",
            "last":       "Letzte",
            "next":       "Nächste",
            "previous":   "Zurück"
        },
      },
      "pageLength": 50,
      "buttons" : {
        "className" : "btn-danger"
      }
    }); 

     $('#a8_docs').DataTable({
      "language": {
        "search" : "Suche",
        "info": "Zeige _START_ bis _END_ von _TOTAL_ Einträgen",
        "lengthMenu":     "Zeige _MENU_ Einträge",
        "zeroRecords": "Nichts gefunden",
        "infoEmpty": "Keine Einträge",
        "paginate": {
            "first":      "Erste",
            "last":       "Letzte",
            "next":       "Nächste",
            "previous":   "Zurück"
        },
      },
      "pageLength": 50,
      "buttons" : {
        "className" : "btn-danger"
      }
    }); 

       $('#a9_docs').DataTable({
      "language": {
        "search" : "Suche",
        "info": "Zeige _START_ bis _END_ von _TOTAL_ Einträgen",
        "lengthMenu":     "Zeige _MENU_ Einträge",
        "zeroRecords": "Nichts gefunden",
        "infoEmpty": "Keine Einträge",
        "paginate": {
            "first":      "Erste",
            "last":       "Letzte",
            "next":       "Nächste",
            "previous":   "Zurück"
        },
      },
      "pageLength": 50,
      "buttons" : {
        "className" : "btn-danger"
      }
    }); 
     


       $('#area_6_onlinebank').DataTable({
      "language": {
        "search" : "Suche",
        "info": "Zeige _START_ bis _END_ von _TOTAL_ Einträgen",
        "lengthMenu":     "Zeige _MENU_ Einträge",
        "zeroRecords": "Nichts gefunden",
        "infoEmpty": "Keine Einträge",
        "paginate": {
            "first":      "Erste",
            "last":       "Letzte",
            "next":       "Nächste",
            "previous":   "Zurück"
        },
      },
      "pageLength": 50,
      "buttons" : {
        "className" : "btn-danger"
      }
    }); 



       $('#a7_contract').DataTable({
      "language": {
        "search" : "Suche",
        "info": "Zeige _START_ bis _END_ von _TOTAL_ Einträgen",
        "lengthMenu":     "Zeige _MENU_ Einträge",
        "zeroRecords": "Nichts gefunden",
        "infoEmpty": "Keine Einträge",
        "paginate": {
            "first":      "Erste",
            "last":       "Letzte",
            "next":       "Nächste",
            "previous":   "Zurück"
        },
      },
      "pageLength": 50,
      "buttons" : {
        "className" : "btn-danger"
      }
    }); 

       $('#a8_digitalaccount').DataTable({
      "language": {
        "search" : "Suche",
        "info": "Zeige _START_ bis _END_ von _TOTAL_ Einträgen",
        "lengthMenu":     "Zeige _MENU_ Einträge",
        "zeroRecords": "Nichts gefunden",
        "infoEmpty": "Keine Einträge",
        "paginate": {
            "first":      "Erste",
            "last":       "Letzte",
            "next":       "Nächste",
            "previous":   "Zurück"
        },
      },
      "pageLength": 50,
      "buttons" : {
        "className" : "btn-danger"
      }
    }); 


       $('#area_9_else').DataTable({
      "language": {
        "search" : "Suche",
        "info": "Zeige _START_ bis _END_ von _TOTAL_ Einträgen",
        "lengthMenu":     "Zeige _MENU_ Einträge",
        "zeroRecords": "Nichts gefunden",
        "infoEmpty": "Keine Einträge",
        "paginate": {
            "first":      "Erste",
            "last":       "Letzte",
            "next":       "Nächste",
            "previous":   "Zurück"
        },
      },
      "pageLength": 50,
      "buttons" : {
        "className" : "btn-danger"
      }
    }); 



  })
</script>
{% endblock content %}