(refactor) LocationEditForm: update scope wrapped in fieldset
This commit is contained in:
Knee Cola
@@ -66,17 +66,18 @@ export const LocationEditForm: FC<LocationEditFormProps> = ({ location, yearMont
|
||||
<TrashIcon className="h-[1em] w-[1em] text-error text-2xl" />
|
||||
</Link>
|
||||
}
|
||||
<input id="locationName" name="locationName" type="text" placeholder={t("location-name-placeholder")} className="input input-bordered w-full" defaultValue={location?.name ?? ""} />
|
||||
<div id="status-error" aria-live="polite" aria-atomic="true">
|
||||
{state.errors?.locationName &&
|
||||
state.errors.locationName.map((error: string) => (
|
||||
<p className="mt-2 text-sm text-red-500" key={error}>
|
||||
{error}
|
||||
</p>
|
||||
))}
|
||||
</div>
|
||||
|
||||
<textarea id="locationNotes" name="locationNotes" className="textarea textarea-bordered my-1 w-full block h-[8em]" placeholder={t("notes-placeholder")} defaultValue={location?.notes ?? ""}></textarea>
|
||||
<fieldset className="fieldset mt-2 p-2">
|
||||
<legend className="fieldset-legend font-semibold uppercase">{t("location-name-legend")}</legend>
|
||||
<input id="locationName" name="locationName" type="text" placeholder={t("location-name-placeholder")} className="input input-bordered w-full placeholder:text-gray-600" defaultValue={location?.name ?? ""} />
|
||||
<div id="status-error" aria-live="polite" aria-atomic="true">
|
||||
{state.errors?.locationName &&
|
||||
state.errors.locationName.map((error: string) => (
|
||||
<p className="mt-2 text-sm text-red-500" key={error}>
|
||||
{error}
|
||||
</p>
|
||||
))}
|
||||
</div>
|
||||
</fieldset>
|
||||
<div id="status-error" aria-live="polite" aria-atomic="true">
|
||||
{state.errors?.locationNotes &&
|
||||
state.errors.locationNotes.map((error: string) => (
|
||||
@@ -86,7 +87,7 @@ export const LocationEditForm: FC<LocationEditFormProps> = ({ location, yearMont
|
||||
))}
|
||||
</div>
|
||||
<fieldset className="fieldset bg-base-200 border-base-300 rounded-box w-xs border p-4 pb-2 mt-4">
|
||||
<legend className="fieldset-legend font-semibold">{t("tenant-2d-code-legend")}</legend>
|
||||
<legend className="fieldset-legend font-semibold uppercase">{t("tenant-2d-code-legend")}</legend>
|
||||
|
||||
<InfoBox className="p-1 mb-1">{t("tenant-2d-code-info")}</InfoBox>
|
||||
|
||||
@@ -156,7 +157,7 @@ export const LocationEditForm: FC<LocationEditFormProps> = ({ location, yearMont
|
||||
|
||||
|
||||
<fieldset className="fieldset bg-base-200 border-base-300 rounded-box w-xs border p-4 pb-2 mt-4">
|
||||
<legend className="fieldset-legend font-semibold">{t("auto-utility-bill-forwarding-legend")}</legend>
|
||||
<legend className="fieldset-legend font-semibold uppercase">{t("auto-utility-bill-forwarding-legend")}</legend>
|
||||
<InfoBox className="p-1 mb-1">{t("auto-utility-bill-forwarding-info")}</InfoBox>
|
||||
|
||||
<div className="form-control">
|
||||
@@ -184,7 +185,7 @@ export const LocationEditForm: FC<LocationEditFormProps> = ({ location, yearMont
|
||||
</fieldset>
|
||||
|
||||
<fieldset className="fieldset bg-base-200 border-base-300 rounded-box w-xs border p-4 pb-2 mt-4">
|
||||
<legend className="fieldset-legend font-semibold">{t("auto-rent-notification-legend")}</legend>
|
||||
<legend className="fieldset-legend font-semibold uppercase">{t("auto-rent-notification-legend")}</legend>
|
||||
<InfoBox className="p-1 mb-1">{t("auto-rent-notification-info")}</InfoBox>
|
||||
|
||||
<div className="form-control">
|
||||
@@ -214,7 +215,7 @@ export const LocationEditForm: FC<LocationEditFormProps> = ({ location, yearMont
|
||||
|
||||
{(autoBillFwd || rentDueNotification) && (
|
||||
<fieldset className="fieldset bg-base-200 border-base-300 rounded-box w-xs border p-4 pb-2 mt-4">
|
||||
<legend className="fieldset-legend font-semibold">{t("tenant-email-legend")}</legend>
|
||||
<legend className="fieldset-legend font-semibold uppercase">{t("tenant-email-legend")}</legend>
|
||||
<input
|
||||
id="tenantEmail"
|
||||
name="tenantEmail"
|
||||
@@ -235,24 +236,34 @@ export const LocationEditForm: FC<LocationEditFormProps> = ({ location, yearMont
|
||||
</fieldset>
|
||||
)}
|
||||
|
||||
{/* Show different options for add vs edit operations */}
|
||||
{!location ? (
|
||||
<div className="form-control">
|
||||
<label className="label cursor-pointer">
|
||||
<span className="label-text">{t("add-to-subsequent-months")}</span>
|
||||
<input type="checkbox" name="addToSubsequentMonths" className="toggle toggle-primary" />
|
||||
</label>
|
||||
</div>
|
||||
) : (
|
||||
<fieldset className="fieldset mt-2 p-2">
|
||||
<legend className="fieldset-legend">{t("update-scope")}</legend>
|
||||
<select defaultValue="current" className="select input-bordered w-full" name="updateScope">
|
||||
<option value="current">{t("update-current-month")}</option>
|
||||
<option value="subsequent">{t("update-subsequent-months")}</option>
|
||||
<option value="all">{t("update-all-months")}</option>
|
||||
</select>
|
||||
</fieldset>
|
||||
)}
|
||||
<fieldset className="fieldset bg-base-200 border-base-300 rounded-box w-xs border p-4 pb-2 mt-4">
|
||||
<legend className="fieldset-legend font-semibold uppercase">{t("scope-legend")}</legend>
|
||||
{!location ? (
|
||||
<div className="form-control">
|
||||
<label className="label cursor-pointer justify-start gap-3">
|
||||
<input
|
||||
type="checkbox"
|
||||
name="addToSubsequentMonths"
|
||||
className="toggle toggle-primary"
|
||||
/>
|
||||
<span className="label-text">{t("add-to-subsequent-months")}</span>
|
||||
</label>
|
||||
</div>
|
||||
|
||||
) : (
|
||||
<>
|
||||
<InfoBox className="p-1 mb-1">{t("update-scope-info")}</InfoBox>
|
||||
<fieldset className="fieldset mt-2 p-2">
|
||||
<legend className="fieldset-legend">{t("update-scope-legend")}</legend>
|
||||
<select defaultValue="current" className="select input-bordered w-full" name="updateScope">
|
||||
<option value="current">{t("update-current-month")}</option>
|
||||
<option value="subsequent">{t("update-subsequent-months")}</option>
|
||||
<option value="all">{t("update-all-months")}</option>
|
||||
</select>
|
||||
</fieldset>
|
||||
</>
|
||||
)}
|
||||
</fieldset>
|
||||
|
||||
<div id="status-error" aria-live="polite" aria-atomic="true">
|
||||
{
|
||||
|
||||
@@ -122,7 +122,8 @@
|
||||
"warning-message": "This operation cannot be undone and will delete the location in all future months!"
|
||||
},
|
||||
"location-edit-form": {
|
||||
"location-name-placeholder": "Realestate name",
|
||||
"location-name-legend": "Realestate name",
|
||||
"location-name-placeholder": "enter realestate name",
|
||||
"notes-placeholder": "Notes",
|
||||
"tenant-2d-code-legend": "TENANT 2D CODE",
|
||||
"tenant-2d-code-info": "2D barcode allows the tenant to quickly and easily pay the amount they owe you for paid utility bills to your IBAN. The barcode will be displayed when the tenant opens the link to the statement for the given month.",
|
||||
@@ -147,8 +148,10 @@
|
||||
"save-button": "Save",
|
||||
"cancel-button": "Cancel",
|
||||
"delete-tooltip": "Delete realestate",
|
||||
"add-to-subsequent-months": "Add to all subsequent months",
|
||||
"update-scope": "Which records do you want to update?",
|
||||
"scope-legend": "Scope of changes",
|
||||
"add-to-subsequent-months": "add to all subsequent months",
|
||||
"update-scope-info": "Location records for each month are stored separately. Please choose which records you want to update.",
|
||||
"update-scope-legend": "I want to update the following records:",
|
||||
"update-current-month": "current month only",
|
||||
"update-subsequent-months": "current and all future months",
|
||||
"update-all-months": "all months",
|
||||
|
||||
@@ -121,7 +121,8 @@
|
||||
"warning-message": "Ova operacija je nepovratna i obrisat će lokaciju u svim mjesecima koji slijede!"
|
||||
},
|
||||
"location-edit-form": {
|
||||
"location-name-placeholder": "Ime nekretnine",
|
||||
"location-name-legend": "Realestate name",
|
||||
"location-name-placeholder": "unesite naziv nekretnine",
|
||||
"notes-placeholder": "Bilješke",
|
||||
"tenant-2d-code-legend": "2D BARKOD ZA PODSTANARA",
|
||||
"tenant-2d-code-info": "2D barkod omogućuje podstanaru da brzo i jednostavno na vaš IBAN uplati iznos koji vam duguje za plaćene režije. Barkod će biti prikazan kada podstanar otvori poveznicu na obračun za zadani mjesec.",
|
||||
@@ -146,11 +147,13 @@
|
||||
"save-button": "Spremi",
|
||||
"cancel-button": "Odbaci",
|
||||
"delete-tooltip": "Brisanje nekretnine",
|
||||
"add-to-subsequent-months": "Dodaj u sve mjesece koji slijede",
|
||||
"update-scope": "Koje zapise želite ažurirati?",
|
||||
"scope-legend": "Opseg promjena",
|
||||
"add-to-subsequent-months": "dodaj u sve mjesece koji slijede",
|
||||
"update-scope-info": "Zapisi o lokaciji su za svaki mjesec pohranjeni zasebno. Molimo odaberite koje zapise želite ažurirati.",
|
||||
"update-scope-legend": "Želim ažurirati sljedeće zapise:",
|
||||
"update-current-month": "samo trenutni mjesec",
|
||||
"update-subsequent-months": "trenutni i svi budući mjeseci",
|
||||
"update-all-months": "svi mjeseci",
|
||||
"update-subsequent-months": "trenutni i sve buduće mjesece",
|
||||
"update-all-months": "sve mjesece",
|
||||
"validation": {
|
||||
"location-name-required": "Ime nekretnine je obavezno",
|
||||
"tenant-first-name-required": "nedostaje ime podstanara",
|
||||
|
||||
Reference in New Issue
Block a user