CluPilotCloud/resources/views/livewire/admin/edit-customer.blade.php

87 lines
4.9 KiB
PHP

{{-- R24: the form scrolls, the title and the buttons do not. This modal is the
reason the rule exists with eight fields it was taller than the window and
its own save button was off the bottom of it. --}}
<x-ui.modal :title="__('edit_customer.title')" :subtitle="__('edit_customer.subtitle')">
<form id="edit-customer" wire:submit="save" class="space-y-4">
<div class="grid gap-4 sm:grid-cols-2">
<x-ui.input name="name" wire:model="name" :label="__('edit_customer.name')" />
<x-ui.input name="contactName" wire:model="contactName" :label="__('edit_customer.contact')" />
</div>
<div class="grid gap-4 sm:grid-cols-2">
<div>
<x-ui.input name="email" type="email" wire:model="email" :label="__('edit_customer.email')" />
{{-- Said before it is done, not after: the address is the portal
login and the key everything matching by address uses. --}}
<p class="mt-1.5 text-xs text-muted">{{ __('edit_customer.email_hint') }}</p>
</div>
<x-ui.input name="phone" wire:model="phone" :label="__('edit_customer.phone')" />
</div>
<div class="grid gap-4 sm:grid-cols-2">
<div>
<label class="text-sm font-medium text-body" for="customerType">{{ __('edit_customer.type') }}</label>
<select id="customerType" wire:model="customerType"
class="mt-1.5 w-full rounded-md border border-line-strong bg-surface px-3 py-2 text-sm text-body">
{{-- No "nobody asked" option: once somebody has answered, the
answer stands until it is replaced by the other one. An
empty selection here leaves the record as it was, and the
hint says which that is. --}}
<option value="">{{ __('edit_customer.type_keep') }}</option>
@foreach ($types as $type)
<option value="{{ $type }}">{{ __('customer_detail.type_'.$type) }}</option>
@endforeach
</select>
<p class="mt-1.5 text-xs text-muted">{{ __('edit_customer.type_hint') }}</p>
</div>
<div>
<x-ui.input name="vatId" wire:model="vatId" :label="__('edit_customer.vat_id')" placeholder="ATU12345678" />
<p class="mt-1.5 text-xs text-muted">{{ __('edit_customer.vat_hint') }}</p>
</div>
</div>
<div>
<p class="block text-sm font-medium text-body">{{ __('edit_customer.address') }}</p>
<div class="mt-1.5 space-y-3">
<x-ui.input name="billingStreet" wire:model="billingStreet" :label="__('settings.billing_street')" />
<div class="grid gap-3 sm:grid-cols-[140px_minmax(0,1fr)]">
<x-ui.input name="billingPostcode" wire:model="billingPostcode" :label="__('settings.billing_postcode')" />
<x-ui.input name="billingCity" wire:model="billingCity" :label="__('settings.billing_city')" />
</div>
<x-ui.input name="billingCountry" wire:model="billingCountry" :label="__('settings.billing_country')" />
</div>
</div>
<div class="max-w-56">
<label class="text-sm font-medium text-body" for="locale">{{ __('edit_customer.locale') }}</label>
<select id="locale" wire:model="locale"
class="mt-1.5 w-full rounded-md border border-line-strong bg-surface px-3 py-2 text-sm text-body">
<option value="">{{ __('edit_customer.locale_default') }}</option>
@foreach ($locales as $code)
<option value="{{ $code }}">{{ __('edit_customer.locale_'.$code) }}</option>
@endforeach
</select>
{{-- What it actually decides: the language of the mail they get. --}}
<p class="mt-1.5 text-xs text-muted">{{ __('edit_customer.locale_hint') }}</p>
</div>
</form>
<x-slot:footer>
<div class="flex flex-wrap gap-2">
{{-- form=, because the button now lives outside the <form> it submits:
that is the price of a footer that does not scroll away, and it
is an HTML attribute rather than a workaround. --}}
<x-ui.button type="submit" form="edit-customer" variant="primary"
wire:loading.attr="disabled" wire:target="save">
{{ __('edit_customer.save') }}
</x-ui.button>
{{-- Livewire.dispatch, not Alpine's: the modal listens for a Livewire
event of that name, and the Alpine form silently does nothing. --}}
<x-ui.button variant="secondary" x-on:click="Livewire.dispatch('closeModal')">
{{ __('edit_customer.cancel') }}
</x-ui.button>
</div>
</x-slot:footer>
</x-ui.modal>