Marco/infoalloggi-monorepo
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages 6 Wiki Activity Actions

feat(forms): Add skip options and expiration date for temporary motivation in service forms

Browse source
This commit is contained in:
Marco Pedone 2025-10-30 19:39:35 +01:00
parent 7dcbaa68f3
commit 9e495caf29
5 changed files with 405 additions and 104 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
apps/infoalloggi/src/components/servizio/servizio_actions.tsx
View file

@ -303,7 +303,7 @@ const EditPreferenze = () => {
Preferenze
</CredenzaDescription>
</CredenzaHeader>
<CredenzaBody className="max-h-[80vh] w-full overflow-y-auto pb-5">
<CredenzaBody className="max-h-[80vh] w-full max-w-3xl overflow-y-auto pb-5">
{isLoading ? (
<LoadingPage />
) : (

90
apps/infoalloggi/src/forms/FormEditServizioAdmin.tsx
View file

@ -32,6 +32,9 @@ const Schema = z.object({
isOkConsulenza: z.boolean(),
isOkSaldo: z.boolean(),
isSent: z.boolean(),
skipPayment: z.boolean(),
skipControlloDoc: z.boolean(),
skipDocMotivazione: z.boolean(),
});
export type FormValues = z.infer<typeof Schema>;
@ -58,6 +61,9 @@ export const FormEditServizio = ({
isOkConsulenza: false,
isOkSaldo: false,
isSent: false,
skipPayment: false,
skipControlloDoc: false,
skipDocMotivazione: false,
};
}
const { locale, t } = useTranslation();
@ -161,10 +167,7 @@ export const FormEditServizio = ({
autoFocus
captionLayout="dropdown"
defaultMonth={field.value || new Date()}
disabled={(date) =>
date > new Date() || date < new Date("1900-01-01")
}
endMonth={new Date()}
endMonth={new Date(2050, 12)}
locale={DatePickerLocale}
mode="single"
onSelect={field.onChange}
@ -266,6 +269,85 @@ export const FormEditServizio = ({
)}
/>
</div>
<div className="flex w-full flex-col items-start justify-between gap-4 sm:flex-row">
<FormField
control={form.control}
name="skipPayment"
render={({ field }) => (
<FormItem className="w-full">
<div className="flex flex-wrap items-center gap-x-2">
<FormLabel htmlFor="skipPayment">Salta Pagamento</FormLabel>
<FormControl>
<Switch
checked={field.value}
className="data-[state=checked]:bg-neutral-700"
id="skipPayment"
onCheckedChange={field.onChange}
/>
</FormControl>
<FormMessage />
</div>
<FormDescription>
Salta la richiesta di pagamento al cliente (per tutti i
pagamenti)
</FormDescription>
</FormItem>
)}
/>
<FormField
control={form.control}
name="skipControlloDoc"
render={({ field }) => (
<FormItem className="w-full">
<div className="flex flex-wrap items-center gap-x-2">
<FormLabel htmlFor="skipControlloDoc">
Salta controllo documento
</FormLabel>
<FormControl>
<Switch
checked={field.value}
className="data-[state=checked]:bg-neutral-700"
id="skipControlloDoc"
onCheckedChange={field.onChange}
/>
</FormControl>
<FormMessage />
</div>
<FormDescription>
Salta la richiesta del documento del cliente al momento dello
sblocco contatti
</FormDescription>
</FormItem>
)}
/>
<FormField
control={form.control}
name="skipDocMotivazione"
render={({ field }) => (
<FormItem className="w-full">
<div className="flex flex-wrap items-center gap-x-2">
<FormLabel htmlFor="skipDocMotivazione">
Salta documento motivazione
</FormLabel>
<FormControl>
<Switch
checked={field.value}
className="data-[state=checked]:bg-neutral-700"
id="skipDocMotivazione"
onCheckedChange={field.onChange}
/>
</FormControl>
<FormMessage />
</div>
<FormDescription>
Salta l&apos;invio del documento di motivazione al cliente al
momento della conferma annuncio
</FormDescription>
</FormItem>
)}
/>
</div>
<Button type="submit">Salva</Button>
</form>
</Form>

259
apps/infoalloggi/src/forms/FormNewServizio.tsx
View file

@ -1,3 +1,6 @@
import { format } from "date-fns";
import { it } from "date-fns/locale";
import { CalendarIcon } from "lucide-react";
import { z } from "zod/v4";
import { Counter } from "~/components/counter";
import {
@ -12,7 +15,14 @@ import {
import { MultiSelect, UnpackOptions } from "~/components/custom_ui/multiselect";
import { Badge } from "~/components/ui/badge";
import { Button } from "~/components/ui/button";
import { Calendar } from "~/components/ui/calendar";
import { Label } from "~/components/ui/label";
import {
Popover,
PopoverContent,
PopoverTrigger,
} from "~/components/ui/popover";
import { Separator } from "~/components/ui/separator";
import { Slider } from "~/components/ui/slider";
import { Switch } from "~/components/ui/switch";
import { cn } from "~/lib/utils";
@ -39,6 +49,10 @@ const Schema = z
reddito: z.string().nullable(),
terrazzo: z.boolean(),
tipologia: z.custom<TipologiaPosizioneEnum>(),
scadenza_motivazione_transitoria: z.date().nullable(),
skipPayment: z.boolean(),
skipControlloDoc: z.boolean(),
skipDocMotivazione: z.boolean(),
})
.superRefine(({ n_adulti }, refinementContext) => {
if (n_adulti <= 0) {
@ -87,6 +101,10 @@ export const FormNewServizio = ({
reddito: "",
terrazzo: false,
tipologia: TipologiaPosizioneEnum.Transitorio,
scadenza_motivazione_transitoria: null,
skipPayment: false,
skipControlloDoc: false,
skipDocMotivazione: false,
};
}
const { locale, t } = useTranslation();
@ -381,66 +399,118 @@ export const FormNewServizio = ({
/>
{tipologia === TipologiaPosizioneEnum.Transitorio ? (
<FormField
control={form.control}
key={tipologia}
name="motivazione_transitorio"
render={({ field }) => {
const existingValue = t.preferenze.motivazioni_mappings.find(
(m) => m.id === field.value,
);
return (
<FormItem>
<div className="items-top flex w-full flex-col justify-between gap-4 sm:flex-row">
<FormField
control={form.control}
key={tipologia}
name="motivazione_transitorio"
render={({ field }) => {
const existingValue = t.preferenze.motivazioni_mappings.find(
(m) => m.id === field.value,
);
return (
<FormItem className="w-full">
<div className="flex w-full flex-wrap items-center gap-x-2">
<FormLabel htmlFor="motivazione_transitorio">
{t.preferenze.motivazione_label}
</FormLabel>
<FormMessage />
</div>
{isLimited ? (
<div className="space-y-0">
<p className="font-semibold text-lg">
{existingValue?.title}
</p>
<p className="text-muted-foreground text-sm">
La motivazione non può essere modificata. Contatta il
supporto se necessario.
</p>
</div>
) : (
<>
<MultiSelect
defaultValue={
existingValue
? {
label: existingValue.title,
value: existingValue.id,
}
: undefined
}
elementId="select-motivazione_transitorio"
elementName="motivazione_transitorio"
isMulti={false}
onValueChange={(value) => {
field.onChange(value.value);
}}
options={t.preferenze.motivazioni_mappings.map(
(option) => ({
label: option.title,
value: option.id,
}),
)}
placeholder={t.seleziona_placeholder}
/>
<FormDescription>
{t.preferenze.motivazione_desc}
</FormDescription>
</>
)}
</FormItem>
);
}}
/>
<FormField
control={form.control}
name="scadenza_motivazione_transitoria"
render={({ field }) => (
<FormItem className="flex w-full flex-col">
<div className="flex flex-wrap items-center gap-x-2">
<FormLabel htmlFor="motivazione_transitorio">
{t.preferenze.motivazione_label}
<FormLabel htmlFor="scadenza_motivazione_transitoria">
Scadenza motivazione
</FormLabel>
<FormMessage />
</div>
{isLimited ? (
<div className="space-y-0">
<p className="font-semibold text-lg">
{existingValue?.title}
</p>
<p className="text-muted-foreground text-sm">
La motivazione non può essere modificata. Contatta il
supporto se necessario.
</p>
</div>
) : (
<>
<MultiSelect
defaultValue={
existingValue
? {
label: existingValue.title,
value: existingValue.id,
}
: undefined
}
elementId="select-motivazione_transitorio"
elementName="motivazione_transitorio"
isMulti={false}
onValueChange={(value) => {
field.onChange(value.value);
}}
options={t.preferenze.motivazioni_mappings.map(
(option) => ({
label: option.title,
value: option.id,
}),
)}
placeholder={t.seleziona_placeholder}
<Popover>
<PopoverTrigger asChild>
<FormControl>
<Button
className={cn(
"h-[42px] w-full pl-3 text-left font-medium",
!field.value && "text-muted-foreground",
`rounded-lg border border-neutral-300 bg-white text-primary shadow-xs outline-hidden file:border-0 file:bg-transparent file:font-medium file:text-sm hover:border-neutral-400 focus:border-neutral-400 disabled:cursor-not-allowed disabled:opacity-50 aria-expanded:border-neutral-400 dark:border-neutral-500 dark:bg-primary dark:text-white dark:aria-expanded:border-neutral-400 dark:focus:border-transparent dark:hover:border-neutral-400 dark:placeholder:text-neutral-400`,
)}
id="scadenza_motivazione_transitoria"
variant={"outline"}
>
{field.value ? (
format(field.value, "PPP", {
locale: it,
})
) : (
<span>{t.anagrafica.scegli_data}</span>
)}
<CalendarIcon className="ml-auto size-4 opacity-50" />
</Button>
</FormControl>
</PopoverTrigger>
<PopoverContent align="start" className="w-auto p-0">
<Calendar
autoFocus
captionLayout="dropdown"
defaultMonth={field.value || new Date()}
endMonth={new Date(2050, 12)}
locale={it}
mode="single"
onSelect={field.onChange}
selected={field.value || undefined}
/>
<FormDescription>
{t.preferenze.motivazione_desc}
</FormDescription>
</>
)}
</PopoverContent>
</Popover>
</FormItem>
);
}}
/>
)}
/>
</div>
) : (
<FormField
control={form.control}
@ -511,6 +581,87 @@ export const FormNewServizio = ({
})}
</div>
</div>
<Separator />
<div className="flex w-full flex-col items-start justify-between gap-4 sm:flex-row">
<FormField
control={form.control}
name="skipPayment"
render={({ field }) => (
<FormItem className="w-full">
<div className="flex flex-wrap items-center gap-x-2">
<FormLabel htmlFor="skipPayment">Salta Pagamento</FormLabel>
<FormControl>
<Switch
checked={field.value}
className="data-[state=checked]:bg-neutral-700"
id="skipPayment"
onCheckedChange={field.onChange}
/>
</FormControl>
<FormMessage />
</div>
<FormDescription>
Salta la richiesta di pagamento al cliente (per tutti i
pagamenti)
</FormDescription>
</FormItem>
)}
/>
<FormField
control={form.control}
name="skipControlloDoc"
render={({ field }) => (
<FormItem className="w-full">
<div className="flex flex-wrap items-center gap-x-2">
<FormLabel htmlFor="skipControlloDoc">
Salta controllo documento
</FormLabel>
<FormControl>
<Switch
checked={field.value}
className="data-[state=checked]:bg-neutral-700"
id="skipControlloDoc"
onCheckedChange={field.onChange}
/>
</FormControl>
<FormMessage />
</div>
<FormDescription>
Salta la richiesta del documento del cliente al momento dello
sblocco contatti
</FormDescription>
</FormItem>
)}
/>
<FormField
control={form.control}
name="skipDocMotivazione"
render={({ field }) => (
<FormItem className="w-full">
<div className="flex flex-wrap items-center gap-x-2">
<FormLabel htmlFor="skipDocMotivazione">
Salta documento motivazione
</FormLabel>
<FormControl>
<Switch
checked={field.value}
className="data-[state=checked]:bg-neutral-700"
id="skipDocMotivazione"
onCheckedChange={field.onChange}
/>
</FormControl>
<FormMessage />
</div>
<FormDescription>
Salta l&apos;invio del documento di motivazione al cliente al
momento della conferma annuncio
</FormDescription>
</FormItem>
)}
/>
</div>
<Button type="submit">Salva</Button>
</form>

150
apps/infoalloggi/src/forms/FormNewServizioAcquisto.tsx
View file

@ -112,6 +112,7 @@ const FormNewServizioSchema = z.object({
telefono: z.string(),
terrazzo: z.boolean(),
tipologia: z.custom<TipologiaPosizioneEnum>(),
scadenza_motivazione_transitoria: z.date().nullable(),
});
type FormNewServizioValues = z.infer<typeof FormNewServizioSchema>;
@ -140,6 +141,7 @@ export const FormNewServizioAcquisto = ({
permanenza,
entromese,
motivazione_transitorio,
scadenza_motivazione_transitoria,
reddito,
azienda,
p_iva,
@ -254,6 +256,14 @@ export const FormNewServizioAcquisto = ({
path: ["motivazione_transitorio"],
});
}
if (!scadenza_motivazione_transitoria) {
refinementContext.issues.push({
code: "custom",
input: "",
message: "Inserisci la scadenza della motivazione",
path: ["scadenza_motivazione_transitoria"],
});
}
} else {
if (reddito === "" || reddito === null) {
refinementContext.issues.push({
@ -684,54 +694,107 @@ export const FormNewServizioAcquisto = ({
</div>
{tipologia === TipologiaPosizioneEnum.Transitorio ? (
<FormField
control={form.control}
key={tipologia}
name="motivazione_transitorio"
render={({ field }) => {
const existingValue = t.preferenze.motivazioni_mappings.find(
(m) => m.id === field.value,
);
<>
<FormField
control={form.control}
key={tipologia}
name="motivazione_transitorio"
render={({ field }) => {
const existingValue =
t.preferenze.motivazioni_mappings.find(
(m) => m.id === field.value,
);
return (
<FormItem>
return (
<FormItem>
<div className="flex flex-wrap items-center gap-x-2">
<FormLabel htmlFor="motivazione_transitorio">
{t.preferenze.motivazione_label}
</FormLabel>
<FormMessage />
</div>
<MultiSelect
defaultValue={
existingValue
? {
label: existingValue.title,
value: existingValue.id,
}
: undefined
}
elementId="select-motivazione_transitorio"
elementName="motivazione_transitorio"
isMulti={false}
onValueChange={(value) => {
field.onChange(value.value);
}}
options={t.preferenze.motivazioni_mappings.map(
(option) => ({
label: option.title,
value: option.id,
}),
)}
placeholder={t.seleziona_placeholder}
/>
<FormDescription>
{t.preferenze.motivazione_desc}
</FormDescription>
</FormItem>
);
}}
/>
<FormField
control={form.control}
name="scadenza_motivazione_transitoria"
render={({ field }) => (
<FormItem className="flex w-full flex-col">
<div className="flex flex-wrap items-center gap-x-2">
<FormLabel htmlFor="motivazione_transitorio">
{t.preferenze.motivazione_label}
<FormLabel htmlFor="scadenza_motivazione_transitoria">
Scadenza motivazione
</FormLabel>
<FormMessage />
</div>
<MultiSelect
defaultValue={
existingValue
? {
label: existingValue.title,
value: existingValue.id,
}
: undefined
}
elementId="select-motivazione_transitorio"
elementName="motivazione_transitorio"
isMulti={false}
onValueChange={(value) => {
field.onChange(value.value);
}}
options={t.preferenze.motivazioni_mappings.map(
(option) => ({
label: option.title,
value: option.id,
}),
)}
placeholder={t.seleziona_placeholder}
/>
<FormDescription>
{t.preferenze.motivazione_desc}
</FormDescription>
<Popover>
<PopoverTrigger asChild>
<FormControl>
<Button
className={cn(
"h-[42px] w-full pl-3 text-left font-medium",
!field.value && "text-muted-foreground",
`rounded-lg border border-neutral-300 bg-white text-primary shadow-xs outline-hidden file:border-0 file:bg-transparent file:font-medium file:text-sm hover:border-neutral-400 focus:border-neutral-400 disabled:cursor-not-allowed disabled:opacity-50 aria-expanded:border-neutral-400 dark:border-neutral-500 dark:bg-primary dark:text-white dark:aria-expanded:border-neutral-400 dark:focus:border-transparent dark:hover:border-neutral-400 dark:placeholder:text-neutral-400`,
)}
id="scadenza_motivazione_transitoria"
variant={"outline"}
>
{field.value ? (
format(field.value, "PPP", {
locale: it,
})
) : (
<span>{t.anagrafica.scegli_data}</span>
)}
<CalendarIcon className="ml-auto size-4 opacity-50" />
</Button>
</FormControl>
</PopoverTrigger>
<PopoverContent align="start" className="w-auto p-0">
<Calendar
autoFocus
captionLayout="dropdown"
defaultMonth={field.value || new Date()}
endMonth={new Date(2050, 12)}
locale={it}
mode="single"
onSelect={field.onChange}
selected={field.value || undefined}
/>
</PopoverContent>
</Popover>
</FormItem>
);
}}
/>
)}
/>
</>
) : (
<FormField
control={form.control}
@ -920,9 +983,6 @@ export const FormNewServizioAcquisto = ({
autoFocus
captionLayout="dropdown"
defaultMonth={field.value}
disabled={(date) =>
date > new Date() || date < new Date("1900-01-01")
}
endMonth={new Date()}
locale={DatePickerLocale}
mode="single"

8
apps/infoalloggi/src/schemas/public/Servizio.ts
View file

@ -66,6 +66,14 @@ export default interface ServizioTable {
doc_personale_retro_ref: ColumnType<UsersStorageUserStorageId | null, UsersStorageUserStorageId | null, UsersStorageUserStorageId | null>;
doc_motivazione_ref: ColumnType<UsersStorageUserStorageId | null, UsersStorageUserStorageId | null, UsersStorageUserStorageId | null>;
scadenza_motivazione_transitoria: ColumnType<Date | null, Date | string | null, Date | string | null>;
skipPayment: ColumnType<boolean, boolean | undefined, boolean>;
skipControlloDoc: ColumnType<boolean, boolean | undefined, boolean>;
skipDocMotivazione: ColumnType<boolean, boolean | undefined, boolean>;
}
export type Servizio = Selectable<ServizioTable>;