<form data-id="contract-form">
    <% if ( cd ) {  %>

        <input type="hidden"
               name="id"
               value="<%= cd.id %>" />

    <% } else {   %>

        <input type="hidden"
               name="team_id"
               value="<%= groupId %>" />

    <% }    %>

    <div class="hr-line-dashed"></div>

    <div class="form-group row">
        <label class="col-sm-2 col-form-label">
            Vertragsgeber
        </label>
        <div class="col-sm-10">
            <% if ( group.hasValidContracteeData() )    { %>
                <input type="text"
                       class="form-control"
                       value="<%= cd ? cd.getContracteeData( 'groupName' ) : group.display_name %>, <%= cd ? cd.getContracteeData( 'name' ) : group.getContracteeData( 'name', '' ) %>, <%= cd ? cd.getContracteeData( 'street' ) : group.getContracteeData( 'street', '' ) %>, <%= cd ? cd.getContracteeData( 'zip_code' ) : group.getContracteeData( 'zip_code', '' ) %> <%= cd ? cd.getContracteeData( 'city' ) : group.getContracteeData( 'city', '' ) %>, <%= cd ? Countries.getNameByKey( cd.getContracteeData( 'country' ) ) : Countries.getNameByKey( group.getContracteeData( 'country', 'de' ) ) %>"
                       disabled>
                <span class="form-text m-b-none">
                    <i>Diese Angaben können Sie in den <a href="/#/contract/master-data/<%= groupId %>">Stammdaten</a> ändern.</i>
                </span>
            <% } else { %>
                <div class="alert alert-danger">
                    Bitte aktualisieren Ihre Vertragsdaten der <a href="/#/contract/master-data/<%= groupId %>">Stammdaten</a>.
                </div>
            <% }    %>
        </div>
    </div>

    <div class="hr-line-dashed"></div>

    <div class="form-group row">
        <label class="col-sm-2 col-form-label">
            Vertragsnehmer (Mitglied)
        </label>
        <div class="col-sm-10">
            <% if ( cd ) {  %>
                <input type="text"
                       value="<%= cd.getProfileFirstName() %> <%= cd.getProfileLastName() %> (ID: <%= ( null !== cd.getProfileId() ) ? cd.getProfileId() : '-' %>)"
                       disabled="disabled"
                       class="form-control" />
            <% } else { %>
                <select class="form-control m-b"
                        name="profile_id">
                    <% for ( let mi = 0; mi < members.length; mi++ ) {  %>
                        <option value="<%= members[ mi ].id %>"
                                <%= profileId && members[ mi ].id == profileId ? 'selected="selected"' : '' %>
                                >
                            <%= members[ mi ].getName() %> (ID: <%= members[ mi ].id %>)
                        </option>
                    <% }    %>
                </select>
            <% }    %>
        </div>
    </div>
    <div class="form-group row">
        <label class="col-sm-2 col-form-label">
            Adresse
        </label>
        <div class="col-sm-10">
            <input type="text"
                   value="<%= cd && cd.profile_data_js && cd.profile_data_js.street ? cd.profile_data_js.street : '' %>"
                   name="street"
                   placeholder="Straße"
                   class="form-control" />
        </div>
    </div>
    <div class="form-group row">
        <label class="col-sm-2 col-form-label">
            &nbsp;
        </label>
        <div class="col-sm-3">
            <input type="text"
                   value="<%= cd && cd.profile_data_js && cd.profile_data_js.zip_code ? cd.profile_data_js.zip_code : '' %>"
                   placeholder="PLZ"
                   name="zip_code"
                   class="form-control" />
        </div>
        <div class="col-sm-7">
            <input type="text"
                   value="<%= cd && cd.profile_data_js && cd.profile_data_js.city ? cd.profile_data_js.city : '' %>"
                   placeholder="Stadt"
                   name="city"
                   class="form-control" />
        </div>
    </div>
    <div class="form-group row">
        <label class="col-sm-2 col-form-label">
            &nbsp;
        </label>
        <div class="col-sm-10">
            <select name="country"
                    class="form-control"
                    required>
                <% var countries = Countries.getAll(); %>
                <% for ( let ci = 0; ci < countries.length; ci++ ) {    %>
                    <option value="<%= countries[ ci ].key %>"
                        <%= ( cd && cd.profile_data_js && cd.profile_data_js.country && cd.profile_data_js.country === countries[ ci ].key ) ? 'selected' : '' %>
                    >
                        <%= countries[ ci ].name %>
                    </option>

                <% }    %>
            </select>
        </div>
    </div>

    <div class="hr-line-dashed"></div>

    <div class="form-group row">
        <label class="col-sm-2 col-form-label">
            Name
        </label>
        <div class="col-sm-10">
            <input type="text"
                   name="name"
                   placeholder="Vertragsname (bspw. 10er Karte etc)"
                   required
                   value="<%= cd && cd.name ? cd.name : '' %>"
                   class="form-control" />
        </div>
    </div>

    <div class="hr-line-dashed"></div>

    <div class="form-group row">
        <label class="col-sm-2 col-form-label">
            Typ
        </label>
        <div class="col-sm-10">
            <div style="display: inline-block; margin-right: 32px;">
                <label>
                    <input type="radio"
                           value="flatrate"
                           <%= ( null === cd || cd.type === 'flatrate' ) ? 'checked' : '' %>
                           name="type" />
                    Flatrate
                </label>
            </div>
            <div style="display: inline-block">
                <label>
                    <input type="radio"
                           value="quota"
                           <%= ( null !== cd && cd.type !== 'flatrate' ) ? 'checked' : '' %>
                           name="type" />
                    Kontingent
                </label>
            </div>
        </div>
    </div>

    <div class="hr-line-dashed"></div>

    <div class="form-group row">
        <label class="col-sm-2 col-form-label">
            Summe Abrechnungsfaktor
        </label>
        <div class="col-sm-10">
            <input type="number"
                   name="max_price_factor"
                   step="0.01"
                   value="<%= cd ? ( cd.max_price_factor / 100 ) : 10 %>"
                   <%= ( null === cd || cd.type === 'flatrate' ) ? 'disabled' : '' %>
                   class="form-control" />
            <span class="form-text m-b-none">
                Wertigkeit des Vertrages (siehe Abrechnungsfaktor bei den Terminen)
            </span>
        </div>
    </div>

    <% if ( cd )    {   %>

        <div class="hr-line-dashed"></div>

        <div class="form-group row">
            <label class="col-sm-2 col-form-label">
                Abrechnungsfaktor aktuell
            </label>
            <div class="col-sm-10">
                <input type="number"
                       name="current_price_factor"
                       step="0.01"
                       value="<%= cd ? ( cd.current_price_factor / 100 ) : 10 %>"
                       disabled
                       class="form-control" />
                <span class="form-text m-b-none">
                    Dieser Wert wird dynamisch bei der Verrechnung von Teilnahmen zum Vertrag errechnet und gesetzt.
                </span>
            </div>
        </div>

    <% }    %>

    <div class="hr-line-dashed"></div>

    <div class="form-group row">
        <label class="col-sm-2 col-form-label">
            Preis
        </label>
        <div class="col-sm-10">
            <div class="input-group m-b">
                <div class="input-group-prepend">
                    <% if ( cd ) {  %>
                        <span class="input-group-addon"><%= cd.currency %></span>
                    <% } else {     %>
                        <select class="form-control"
                                style="height: 35px"
                                name="currency">
                            <option value="EUR" <%= cd && cd.currency == 'EUR' ? 'selected' : '' %>>EUR</option>
                            <option value="CHF" <%= cd && cd.currency == 'CHF' ? 'selected' : '' %>>CHF</option>
                        </select>
                    <% }    %>
                </div>
                <input type="number"
                       name="price"
                       step="0.01"
                       value="<%= cd ? ( cd.price / 100 ) : 0 %>"
                       class="form-control" />
            </div>
        </div>
    </div>

    <% if ( cd ) {  %>

        <div class="hr-line-dashed"></div>

        <div class="form-group row">
            <label class="col-sm-2 col-form-label">
                Eingezahlt
            </label>
            <div class="col-sm-10">
                <div class="input-group m-b">
                    <div class="input-group-prepend">
                        <span class="input-group-addon"><%= cd.currency %></span>
                    </div>
                    <input type="number"
                           name="price_payed"
                           step="0.01"
                           value="<%= cd ? ( cd.price_payed / 100 ) : 0 %>"
                           class="form-control" />
                </div>
            </div>
        </div>

    <% }    %>

    <div class="hr-line-dashed"></div>

    <div class="form-group row">
        <label class="col-sm-2 col-form-label">
            Zahlungsfrist bis
        </label>
        <div class="col-sm-10">
            <input type="date"
                   name="payment_due_date"
                   value="<%= cd ? cd.getMomentPaymentDueDate().format( 'YYYY-MM-DD' ) : moment().add( '14', 'days' ).format( 'YYYY-MM-DD' ) %>"
                   required
                   class="form-control" />
        </div>
    </div>

    <div class="hr-line-dashed"></div>

    <div class="form-group row">
        <label class="col-sm-2 col-form-label">
            Lauzeit Start
        </label>
        <div class="col-sm-10">
            <input type="date"
                   name="start_date"
                   value="<%= cd ? cd.getMomentStartDate().format( 'YYYY-MM-DD' ) : moment().format( 'YYYY-MM-DD' ) %>"
                   required
                   class="form-control" />
        </div>
    </div>

    <div class="hr-line-dashed"></div>

    <div class="form-group row">
        <label class="col-sm-2 col-form-label">
            Lauzeit Ende
        </label>
        <div class="col-sm-10">
            <input type="date"
                   name="end_date"
                   value="<%= cd ? cd.getMomentEndDate().format( 'YYYY-MM-DD' ) : moment().add( '1', 'year' ).format( 'YYYY-MM-DD' ) %>"
                   required
                   class="form-control" />
        </div>
    </div>

    <div class="hr-line-dashed"></div>

    <div class="form-group row">
        <label class="col-sm-2 col-form-label">
            Interne Notiz
        </label>
        <div class="col-sm-10">
            <textarea
                   name="admin_note"
                   class="form-control"><%= cd && cd.admin_note ? cd.admin_note : '' %></textarea>
            <span class="form-text m-b-none">
                Dieser Text wird dem Mitglied nicht angezeigt.
            </span>
        </div>
    </div>

    <div class="hr-line-dashed"></div>
</form>