Split the tax details “mega dialog” into separate pages
I needed to place the payment accounts section somewhere, and the most
logical place seemed to be that dialog, where users can set up company
parameters.
However, that dialog was already saturated with related, but ultimately
independent forms, and adding the account section would make things
even worse, specially given that we need to be able to edit those
accounts in a separate page.
We agreed to separate that dialog into tabs, which means separate pages.
When i had everything in a separated page, then i did not know how to
actually share the code for the tabs, and decided that, for now, these
“tabs” would be items from the profile menu. Same function, different
presentation.
2024-08-14 02:08:13 +00:00
|
|
|
{{ define "title" -}}
|
|
|
|
{{- /*gotype: dev.tandem.ws/tandem/numerus/pkg.PaymentMethodsPage*/ -}}
|
|
|
|
{{( pgettext "Payment Methods" "title" )}}
|
|
|
|
{{- end }}
|
|
|
|
|
|
|
|
{{ define "breadcrumbs" -}}
|
|
|
|
{{- /*gotype: dev.tandem.ws/tandem/numerus/pkg.PaymentMethodsPage*/ -}}
|
|
|
|
<nav data-hx-target="main" data-hx-boost="true">
|
|
|
|
<p>
|
|
|
|
<a href="{{ companyURI "/" }}">{{( pgettext "Home" "title" )}}</a> /
|
|
|
|
<a>{{ template "title" . }}</a>
|
|
|
|
</p>
|
|
|
|
</nav>
|
|
|
|
{{- end }}
|
|
|
|
|
|
|
|
{{ define "content" }}
|
|
|
|
{{- /*gotype: dev.tandem.ws/tandem/numerus/pkg.PaymentMethodsPage*/ -}}
|
|
|
|
<section data-hx-target="main" data-hx-swap="innerHTML show:false">
|
|
|
|
<h2>{{ template "title" . }}</h2>
|
|
|
|
<table>
|
|
|
|
<thead>
|
|
|
|
<tr>
|
2024-08-28 09:10:03 +00:00
|
|
|
<th>{{( pgettext "Default" "title" )}}</th>
|
Split the tax details “mega dialog” into separate pages
I needed to place the payment accounts section somewhere, and the most
logical place seemed to be that dialog, where users can set up company
parameters.
However, that dialog was already saturated with related, but ultimately
independent forms, and adding the account section would make things
even worse, specially given that we need to be able to edit those
accounts in a separate page.
We agreed to separate that dialog into tabs, which means separate pages.
When i had everything in a separated page, then i did not know how to
actually share the code for the tabs, and decided that, for now, these
“tabs” would be items from the profile menu. Same function, different
presentation.
2024-08-14 02:08:13 +00:00
|
|
|
<th>{{( pgettext "Payment Method" "title" )}}</th>
|
|
|
|
<th>{{( pgettext "Instructions" "title" )}}</th>
|
|
|
|
<th></th>
|
2024-08-30 00:45:40 +00:00
|
|
|
<th></th>
|
Split the tax details “mega dialog” into separate pages
I needed to place the payment accounts section somewhere, and the most
logical place seemed to be that dialog, where users can set up company
parameters.
However, that dialog was already saturated with related, but ultimately
independent forms, and adding the account section would make things
even worse, specially given that we need to be able to edit those
accounts in a separate page.
We agreed to separate that dialog into tabs, which means separate pages.
When i had everything in a separated page, then i did not know how to
actually share the code for the tabs, and decided that, for now, these
“tabs” would be items from the profile menu. Same function, different
presentation.
2024-08-14 02:08:13 +00:00
|
|
|
</tr>
|
|
|
|
</thead>
|
2024-08-30 00:45:40 +00:00
|
|
|
<tbody data-hx-target="closest tr" data-hx-swap="outerHTML">
|
Split the tax details “mega dialog” into separate pages
I needed to place the payment accounts section somewhere, and the most
logical place seemed to be that dialog, where users can set up company
parameters.
However, that dialog was already saturated with related, but ultimately
independent forms, and adding the account section would make things
even worse, specially given that we need to be able to edit those
accounts in a separate page.
We agreed to separate that dialog into tabs, which means separate pages.
When i had everything in a separated page, then i did not know how to
actually share the code for the tabs, and decided that, for now, these
“tabs” would be items from the profile menu. Same function, different
presentation.
2024-08-14 02:08:13 +00:00
|
|
|
{{ with .PaymentMethods }}
|
2024-08-30 00:45:40 +00:00
|
|
|
{{- range . }}
|
|
|
|
{{- block "row" . }}
|
|
|
|
{{ $confirm := ( gettext "Are you sure?" )}}
|
|
|
|
<tr>
|
|
|
|
<td>
|
|
|
|
<span class="description-text"></span>
|
|
|
|
<input type="radio"
|
|
|
|
form="default_payment_form"
|
|
|
|
aria-label="{{ pgettext "Set as default" "action" }}"
|
|
|
|
name="default_payment_id"
|
|
|
|
value="{{ .Id }}"
|
|
|
|
{{ if .IsDefault }} checked{{ end}}
|
|
|
|
>
|
|
|
|
</td>
|
|
|
|
<td>{{ .Name }}</td>
|
|
|
|
<td>{{ .Instructions }}</td>
|
|
|
|
<td>
|
|
|
|
<a href="{{ companyURI "/payment-methods"}}/{{ .Id }}/edit"
|
|
|
|
aria-label="{{( gettext "Edit payment method" )}}"
|
|
|
|
data-hx-boost="true"
|
|
|
|
data-hx-push-url="false"
|
|
|
|
><i class="ri-edit-2-line"></i></a>
|
|
|
|
</td>
|
|
|
|
<td>
|
|
|
|
<form method="POST" action="{{ companyURI "/payment-methods"}}/{{ .Id }}"
|
|
|
|
data-hx-boost="true"
|
|
|
|
data-hx-confirm="{{ $confirm }}"
|
|
|
|
data-hx-swap="outerHTML swap:1s"
|
|
|
|
>
|
|
|
|
{{ csrfToken }}
|
|
|
|
{{ deleteMethod }}
|
|
|
|
<button class="icon" aria-label="{{( gettext "Delete payment method" )}}"
|
|
|
|
><i class="ri-delete-back-2-line"></i></button>
|
|
|
|
</form>
|
|
|
|
</td>
|
|
|
|
</tr>
|
|
|
|
{{- end }}
|
Split the tax details “mega dialog” into separate pages
I needed to place the payment accounts section somewhere, and the most
logical place seemed to be that dialog, where users can set up company
parameters.
However, that dialog was already saturated with related, but ultimately
independent forms, and adding the account section would make things
even worse, specially given that we need to be able to edit those
accounts in a separate page.
We agreed to separate that dialog into tabs, which means separate pages.
When i had everything in a separated page, then i did not know how to
actually share the code for the tabs, and decided that, for now, these
“tabs” would be items from the profile menu. Same function, different
presentation.
2024-08-14 02:08:13 +00:00
|
|
|
{{- end }}
|
|
|
|
{{ else }}
|
|
|
|
<tr>
|
2024-08-30 00:45:40 +00:00
|
|
|
<td colspan="5">{{( gettext "No payment methods added yet." )}}</td>
|
Split the tax details “mega dialog” into separate pages
I needed to place the payment accounts section somewhere, and the most
logical place seemed to be that dialog, where users can set up company
parameters.
However, that dialog was already saturated with related, but ultimately
independent forms, and adding the account section would make things
even worse, specially given that we need to be able to edit those
accounts in a separate page.
We agreed to separate that dialog into tabs, which means separate pages.
When i had everything in a separated page, then i did not know how to
actually share the code for the tabs, and decided that, for now, these
“tabs” would be items from the profile menu. Same function, different
presentation.
2024-08-14 02:08:13 +00:00
|
|
|
</tr>
|
|
|
|
{{ end }}
|
|
|
|
</tbody>
|
2024-08-28 09:10:03 +00:00
|
|
|
{{ if gt (len .PaymentMethods) 1 -}}
|
|
|
|
<tfoot>
|
|
|
|
<tr>
|
|
|
|
<td>
|
|
|
|
<form id="default_payment_form"
|
|
|
|
method="POST"
|
|
|
|
action="{{ companyURI "/payment-methods" }}/default"
|
|
|
|
data-hx-boost="true"
|
|
|
|
>
|
|
|
|
{{ csrfToken }}
|
|
|
|
{{ putMethod }}
|
|
|
|
{{ if .UpdateDefaultError -}}
|
|
|
|
<p>{{ .UpdateDefaultError}}</p>
|
|
|
|
{{- end }}
|
|
|
|
<button>{{( pgettext "Set" "action")}}</button>
|
|
|
|
</form>
|
|
|
|
</td>
|
2024-08-30 00:45:40 +00:00
|
|
|
<td colspan="4"></td>
|
2024-08-28 09:10:03 +00:00
|
|
|
</tr>
|
|
|
|
</tfoot>
|
|
|
|
{{- end }}
|
Split the tax details “mega dialog” into separate pages
I needed to place the payment accounts section somewhere, and the most
logical place seemed to be that dialog, where users can set up company
parameters.
However, that dialog was already saturated with related, but ultimately
independent forms, and adding the account section would make things
even worse, specially given that we need to be able to edit those
accounts in a separate page.
We agreed to separate that dialog into tabs, which means separate pages.
When i had everything in a separated page, then i did not know how to
actually share the code for the tabs, and decided that, for now, these
“tabs” would be items from the profile menu. Same function, different
presentation.
2024-08-14 02:08:13 +00:00
|
|
|
</table>
|
|
|
|
|
|
|
|
<form method="POST" action="{{ companyURI "/payment-methods" }}" data-hx-boost="true">
|
|
|
|
<h3>{{( pgettext "New Payment Method" "title")}}</h3>
|
|
|
|
<fieldset>
|
|
|
|
{{ csrfToken }}
|
|
|
|
{{ with .Form -}}
|
|
|
|
{{ template "input-field" .Name }}
|
|
|
|
{{ template "input-field" .Instructions }}
|
|
|
|
{{- end }}
|
|
|
|
</fieldset>
|
|
|
|
<footer>
|
|
|
|
<button>{{( pgettext "Add new payment method" "action" )}}</button>
|
|
|
|
</footer>
|
|
|
|
</form>
|
|
|
|
</section>
|
|
|
|
{{- end }}
|