{{ define "title" -}}
    {{( pgettext "Invoices" "title" )}}
{{- end }}

{{ define "breadcrumb" -}}
{{- end }}

{{ define "content" }}
    {{- /*gotype: dev.tandem.ws/tandem/camper/pkg/invoice.invoiceIndex*/ -}}
    <form id="batch-form" action="/admin/invoices/batch" method="post">
        {{ CSRFInput }}
        <fieldset>
            {{ with .Filters }}
                {{ with .Customer }}<input type="hidden" name="{{ .Name }}" value="{{ .String }}">{{ end }}
                {{ with .InvoiceStatus }}<input type="hidden" name="{{ .Name }}" value="{{ .String }}">{{ end }}
                {{ with .FromDate }}<input type="hidden" name="{{ .Name }}" value="{{ .Val }}">{{ end }}
                {{ with .ToDate }}<input type="hidden" name="{{ .Name }}" value="{{ .Val }}">{{ end }}
                {{ with .InvoiceStatus }}<input type="hidden" name="{{ .Name }}" value="{{ .String }}">{{ end }}
            {{ end }}
        </fieldset>
        <footer>
            {{ template "filters-toggle" }}
            <button type="submit"
                    name="action" value="download"
            >{{( pgettext "Download invoices" "action" )}}</button>
            <button type="submit"
                    name="action" value="export"
            >{{( pgettext "Export list" "action" )}}</button>
        </footer>
    </form>
    <form class="filters" method="GET" action="/admin/invoices"
          data-hx-target="main" data-hx-boost="true" data-hx-trigger="change,search,submit"
          aria-labelledby="filters-toggle"
    >
        <fieldset>
            {{ with .Filters }}
                {{ with .Customer -}}
                    <label>
                        {{( pgettext "Customer" "input" )}}<br>
                        <select name="{{ .Name }}"
                                {{ template "error-attrs" . }}
                        >
                            <option value="">{{( gettext "All customers" )}}</option>
                            {{ template "list-options" . }}
                        </select><br>
                        {{ template "error-message" . }}
                    </label>
                {{- end }}
                {{ with .InvoiceStatus -}}
                    <label>
                        {{( pgettext "Invoice status" "input" )}}<br>
                        <select name="{{ .Name }}"
                                {{ template "error-attrs" . }}
                        >
                            <option value="">{{( gettext "All statuses" )}}</option>
                            {{ template "list-options" . }}
                        </select><br>
                        {{ template "error-message" . }}
                    </label>
                {{- end }}
                {{ with .FromDate -}}
                    <label>
                        {{( pgettext "From date" "input" )}}<br>
                        <input type="date"
                               name="{{ .Name }}" value="{{ .Val }}" {{ template "error-attrs" . }}
                        ><br>
                        {{ template "error-message" . }}
                    </label>
                {{- end }}
                {{ with .ToDate -}}
                    <label>
                        {{( pgettext "To date" "input" )}}<br>
                        <input type="date"
                               name="{{ .Name }}" value="{{ .Val }}" {{ template "error-attrs" . }}
                        ><br>
                        {{ template "error-message" . }}
                    </label>
                {{- end }}
                {{ with .InvoiceNumber -}}
                    <label>
                        {{( pgettext "Invoice number" "input" )}}<br>
                        <input type="text"
                               name="{{ .Name }}" value="{{ .Val }}" {{ template "error-attrs" . }}
                        ><br>
                        {{ template "error-message" . }}
                    </label>
                {{- end }}
            {{ end }}
        </fieldset>
        <noscript>
            <button type="submit">{{( pgettext "Filter" "action" )}}</button>
        </noscript>
        {{ if .Filters.HasValue }}
            <a href="/admin/invoices" class="button">{{( pgettext "Reset" "action" )}}</a>
        {{ end }}
    </form>
    <a href="/admin/invoices/new">{{( pgettext "Add invoice" "action" )}}</a>
    <h2>{{ template "title" . }}</h2>
    <table id="invoice-list">
        <thead>
        <tr>
            <th>{{( pgettext "All" "invoice" )}}</th>
            <th>{{( pgettext "Date" "title" )}}</th>
            <th>{{( pgettext "Invoice Num." "title" )}}</th>
            <th>{{( pgettext "Customer" "title" )}}</th>
            <th>{{( pgettext "Status" "title" )}}</th>
            <th>{{( pgettext "Download" "title" )}}</th>
            <th class="numeric">{{( pgettext "Amount" "title" )}}</th>
        </tr>
        </thead>
        <tbody>
        {{ with .Invoices }}
            {{- range $invoice := . }}
                <tr>
                    {{ $title := .Number | printf (pgettext "Select invoice %v" "action") }}
                    <td><input type="checkbox" form="batch-form"
                               name="invoice" value="{{ .Slug }}"
                               aria-label="{{ $title }}"
                               title="{{ $title }}"/></td>
                    <td>{{ .Date|formatDate }}</td>
                    <td><a href="/admin/invoices/{{ .Slug }}">{{ .Number }}</a></td>
                    <td>{{ .CustomerName }}</td>
                    <td class="invoice-status-{{ .Status }}">
                        <details class="invoice-status menu">
                            <summary >{{ .StatusLabel }}</summary>
                            <form data-hx-put="/admin/invoices/{{ .Slug }}">
                                {{ CSRFInput }}
                                <input type="hidden" name="quick" value="status">
                                <ul role="menu">
                                    {{- range $status, $name := $.InvoiceStatuses }}
                                        {{- if ne $status $invoice.Status }}
                                            <li role="presentation">
                                                <button role="menuitem" type="submit"
                                                        name="invoice_status" value="{{ $status }}"
                                                        class="invoice-status-{{ $status }}"
                                                >{{ $name }}</button>
                                            </li>
                                        {{- end }}
                                    {{- end }}
                                </ul>
                            </form>
                        </details>
                    </td>
                    {{- $title = .Number | printf (pgettext "Download invoice %s" "action") -}}
                    <td class="invoice-download"><a href="/admin/invoices/{{ .Slug }}.pdf"
                                                    download="{{ .Number}}-{{ .CustomerName | slugify }}.pdf"
                                                    title="{{( pgettext "Download invoice" "action" )}}"
                                                    aria-label="{{ $title }}">⤓</a></td>
                    <td class="numeric">{{ .Total|formatPrice }}</td>
                </tr>
            {{- end }}
        {{ else }}
            <tr>
                <td colspan="9">{{( gettext "No invoices added yet." )}}</td>
            </tr>
        {{ end }}
        </tbody>
        {{ if .Invoices }}
            <tfoot>
            <tr>
                <th scope="row" colspan="6">{{( gettext "Total" )}}</th>
                <td class="numeric">{{ .TotalAmount|formatPrice }}</td>
                <td colspan="2"></td>
            </tr>
            </tfoot>
        {{ end }}
    </table>
{{- end }}