jordi fita mas
d697b340e9
By default, when using hx-boost, HTMx adds the `show:top` modifier to `hx-swap`. This is actually the wanted behaviour in these cases, because it means that you are following a link to a “different” page, and it makes sense to start from the top. However, for quote and invoice forms is a hindrance because you are usually editing the bottom-most product, as new lines are appended, therefore you are all the time having to scroll down to the line. Every. Single. Time. Here i reverted the show:top to just show:false to keep the scroll as is. I also added the show:bottom to the new product button, because that way the window show entirely the new line. I could not use `show🪟bottom`, however, despite appearing in the documentation, because that, somehow, ended up doing the same as `show🪟top`. Not sure if a bug or something i did not understand. Closes #58.
108 lines
4.7 KiB
Plaintext
108 lines
4.7 KiB
Plaintext
{{ define "title" -}}
|
|
{{ printf ( pgettext "Edit Quotation “%s”" "title" ) .Number }}
|
|
{{- end }}
|
|
|
|
{{ define "breadcrumbs" -}}
|
|
{{- /*gotype: dev.tandem.ws/tandem/numerus/pkg.editQuotationPage*/ -}}
|
|
<nav data-hx-target="main" data-hx-boost="true">
|
|
<p>
|
|
<a href="{{ companyURI "/" }}">{{( pgettext "Home" "title" )}}</a> /
|
|
<a href="{{ companyURI "/quotes"}}">{{( pgettext "Quotations" "title" )}}</a> /
|
|
<a>{{ .Number }}</a>
|
|
</p>
|
|
</nav>
|
|
{{- end }}
|
|
|
|
{{ define "content" }}
|
|
{{- /*gotype: dev.tandem.ws/tandem/numerus/pkg.editQuotationPage*/ -}}
|
|
<section id="quote-dialog-content" data-hx-target="main">
|
|
<h2>{{ printf (pgettext "Edit Quotation “%s”" "title") .Number }}</h2>
|
|
<form method="POST" action="{{ companyURI "/quotes/" }}{{ .Slug }}/edit"
|
|
data-hx-boost="true"
|
|
data-hx-swap="innerHTML show:false"
|
|
>
|
|
{{ csrfToken }}
|
|
|
|
{{ with .Form -}}
|
|
{{ if .RemovedProduct -}}
|
|
<div role="alert">
|
|
{{ with .RemovedProduct -}}
|
|
<p>{{printf (gettext "Product “%s” removed") .Name}}</p>
|
|
<button type="submit"
|
|
formnovalidate
|
|
name="action" value="restore-product"
|
|
>{{( pgettext "Undo" "action" )}}</button>
|
|
{{ template "hidden-field" .QuoteProductId }}
|
|
{{ template "hidden-field" .ProductId }}
|
|
{{ template "hidden-field" .Name }}
|
|
{{ template "hidden-field" .Price }}
|
|
{{ template "hidden-field" .Quantity }}
|
|
{{ template "hidden-field" .Discount }}
|
|
{{ template "hidden-field" .Description }}
|
|
{{ template "hidden-select-field" .Tax }}
|
|
{{- end }}
|
|
</div>
|
|
{{- end }}
|
|
|
|
<div class="quote-data">
|
|
{{ template "select-field" .Customer }}
|
|
{{ template "hidden-field" .Date }}
|
|
{{ template "tags-field" .Tags }}
|
|
{{ template "select-field" .PaymentMethod }}
|
|
{{ template "select-field" .QuoteStatus }}
|
|
{{ template "input-field" .TermsAndConditions }}
|
|
{{ template "input-field" .Notes }}
|
|
</div>
|
|
|
|
{{- range $product := .Products }}
|
|
{{ template "quote-product-form" . }}
|
|
{{- end }}
|
|
{{- end }}
|
|
|
|
<table id="quote-summary">
|
|
<tbody>
|
|
<tr>
|
|
<th scope="row">{{(pgettext "Subtotal" "title")}}</th>
|
|
<td class="numeric">{{ .Subtotal | formatPrice }}</td>
|
|
</tr>
|
|
{{- range $tax := .Taxes }}
|
|
<tr>
|
|
<th scope="row">{{ index . 0 }}</th>
|
|
<td class="numeric">{{ index . 1 | formatPrice }}</td>
|
|
</tr>
|
|
{{- end }}
|
|
<tr>
|
|
<th scope="row">{{(pgettext "Total" "title")}}</th>
|
|
<td class="numeric">{{ .Total | formatPrice }}</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
|
|
<fieldset class="button-bar">
|
|
<button formnovalidate
|
|
name="action" value="select-products"
|
|
data-hx-get="{{ companyURI "/quotes/product-form" }}"
|
|
data-hx-target="#quote-summary"
|
|
data-hx-swap="beforebegin show:bottom"
|
|
data-hx-select="unset"
|
|
data-hx-vals="js:{index: document.querySelectorAll('.new-quote-product').length}"
|
|
type="submit">{{( pgettext "Add products" "action" )}}</button>
|
|
<button formnovalidate
|
|
id="recompute-button"
|
|
name="action" value="update"
|
|
type="submit">{{( pgettext "Update" "action" )}}</button>
|
|
<button class="primary" name="_method" value="PUT"
|
|
formaction="{{ companyURI "/quotes" }}/{{ .Slug }}"
|
|
type="submit">{{( pgettext "Save" "action" )}}</button>
|
|
</fieldset>
|
|
|
|
</form>
|
|
</section>
|
|
|
|
<script>
|
|
document.body.addEventListener('recompute', function () {
|
|
document.getElementById('recompute-button').click();
|
|
});
|
|
</script>
|
|
{{- end }}
|