fix(dashboard): resolve tutorial QA notes (clips 2–6)
- settings/company: show success toast on save (2.1) - inspection templates: add explicit Save button (2.6) - parts: label price fields with AED currency (3.1) - service groups: add parts/services picker to packages (3.3) - vehicles: add insurance (has_insurance + insurance type) field (4.2) - appointments: add calendar view with list/calendar toggle (5.1) - job card check-in: require department (5.4) - job card payments: refresh job card/invoice queries so PAID shows (5.6) - vendors: add phone + address fields (6.1) - bill payments: surface real vendor/employee validation errors (6.4) Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
Claude Opus 4.8
+72
-2
@@ -8,11 +8,13 @@ import { FieldGroup } from "@/shared/components/ui/field"
|
||||
import {
|
||||
Rhform,
|
||||
RhfTextField,
|
||||
RhfAsyncSelectField,
|
||||
} from "@/shared/components/form"
|
||||
import { toast } from "sonner"
|
||||
import { useAuthApi } from "@/shared/useApi"
|
||||
import { useResourceForm } from "@/shared/hooks/use-resource-form"
|
||||
import { useFormMutation } from "@/shared/hooks/use-form-mutation"
|
||||
import { toId, toRelation } from "@/shared/lib/utils"
|
||||
|
||||
import {
|
||||
vendorFormSchema,
|
||||
@@ -31,24 +33,44 @@ export type VendorFormProps = {
|
||||
// ── Default values ──
|
||||
|
||||
const DEFAULT_VALUES: VendorFormValues = {
|
||||
salutation:"Mr.",
|
||||
salutation: "Mr.",
|
||||
first_name: "",
|
||||
last_name: "",
|
||||
company_name: "",
|
||||
email: "",
|
||||
phone: "",
|
||||
alternate_phone: "",
|
||||
address_line_1: "",
|
||||
address_line_2: "",
|
||||
city: "",
|
||||
zip_code: "",
|
||||
country: null,
|
||||
state: null,
|
||||
} as any
|
||||
|
||||
// ── Mapping helpers ──
|
||||
|
||||
const mapLookupOption = (item: any) => ({ value: String(item.id), label: item.name })
|
||||
const STORE_OBJECT = { getOptionValue: (o: any) => o, getOptionLabel: (o: any) => o.label }
|
||||
|
||||
function mapToFormValues(data: unknown): VendorFormValues {
|
||||
const d = (data as any)?.data ?? data ?? {}
|
||||
const address = Array.isArray(d.addresses) ? d.addresses[0] ?? {} : {}
|
||||
|
||||
return {
|
||||
first_name: d.first_name || "",
|
||||
last_name: d.last_name || "",
|
||||
company_name: d.company_name || "",
|
||||
email: d.email || "",
|
||||
}
|
||||
phone: d.phone || "",
|
||||
alternate_phone: d.alternate_phone || "",
|
||||
address_line_1: address.address_line_1 || "",
|
||||
address_line_2: address.address_line_2 || "",
|
||||
city: address.city || "",
|
||||
zip_code: address.zip_code || "",
|
||||
country: toRelation(address.country_id, address.country?.name),
|
||||
state: toRelation(address.state_id, address.state?.name),
|
||||
} as VendorFormValues
|
||||
}
|
||||
|
||||
function mapFormToPayload(values: VendorFormValues) {
|
||||
@@ -57,6 +79,14 @@ function mapFormToPayload(values: VendorFormValues) {
|
||||
last_name: values.last_name || undefined,
|
||||
company_name: values.company_name || undefined,
|
||||
email: values.email || undefined,
|
||||
phone: values.phone || undefined,
|
||||
alternate_phone: values.alternate_phone || undefined,
|
||||
address_line_1: values.address_line_1 || undefined,
|
||||
address_line_2: values.address_line_2 || undefined,
|
||||
city: values.city || undefined,
|
||||
zip_code: values.zip_code || undefined,
|
||||
country_id: toId(values.country),
|
||||
state_id: toId(values.state),
|
||||
}
|
||||
}
|
||||
|
||||
@@ -113,6 +143,46 @@ export function VendorForm({ resourceId, initialData, onSuccess }: VendorFormPro
|
||||
<RhfTextField name="company_name" label="Company Name" placeholder="Acme Supplies" required />
|
||||
<RhfTextField name="email" label="Email" placeholder="vendor@example.com" type="email" required />
|
||||
|
||||
<div className="grid grid-cols-1 gap-4 sm:grid-cols-2">
|
||||
<RhfTextField name="phone" label="Phone" placeholder="+971501234567" type="tel" />
|
||||
<RhfTextField name="alternate_phone" label="Alternate Phone" placeholder="+971509876543" type="tel" />
|
||||
</div>
|
||||
|
||||
{/* ── Address ── */}
|
||||
<div className="border-t pt-4">
|
||||
<h3 className="mb-3 text-sm font-semibold">Address</h3>
|
||||
<RhfTextField name="address_line_1" label="Address Line 1" placeholder="Street 10" />
|
||||
<div className="mt-4">
|
||||
<RhfTextField name="address_line_2" label="Address Line 2" placeholder="Near Central Plaza" />
|
||||
</div>
|
||||
|
||||
<div className="mt-4 grid grid-cols-1 gap-4 sm:grid-cols-2">
|
||||
<RhfAsyncSelectField
|
||||
name="country"
|
||||
label="Country"
|
||||
placeholder="Select country"
|
||||
queryKey={["countries"]}
|
||||
listFn={() => api.geo.countries()}
|
||||
mapOption={mapLookupOption}
|
||||
{...STORE_OBJECT}
|
||||
/>
|
||||
<RhfAsyncSelectField
|
||||
name="state"
|
||||
label="State"
|
||||
placeholder="Select state"
|
||||
queryKey={["states"]}
|
||||
listFn={() => api.geo.states()}
|
||||
mapOption={mapLookupOption}
|
||||
{...STORE_OBJECT}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="mt-4 grid grid-cols-1 gap-4 sm:grid-cols-2">
|
||||
<RhfTextField name="city" label="City" placeholder="Dubai" />
|
||||
<RhfTextField name="zip_code" label="Zip Code" placeholder="00000" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<Button type="submit" variant="default" disabled={isPending}>
|
||||
{isEditing ? <Save /> : <Plus />}
|
||||
{isPending
|
||||
|
||||
+13
@@ -11,6 +11,11 @@ const optionalNumberSchema = z.preprocess(
|
||||
z.coerce.number().int().optional(),
|
||||
)
|
||||
|
||||
const relationFieldSchema = z
|
||||
.object({ value: z.string(), label: z.string() })
|
||||
.nullable()
|
||||
.optional()
|
||||
|
||||
const vendorFormSchema = z.object({
|
||||
first_name: z.string().trim().min(1, "First name is required").max(50, "First name must be at most 50 characters"),
|
||||
last_name: z.string().trim().min(1, "Last name is required").max(50, "Last name must be at most 50 characters"),
|
||||
@@ -22,6 +27,14 @@ const vendorFormSchema = z.object({
|
||||
opening_balance: optionalNumberSchema,
|
||||
credit_limit: optionalNumberSchema,
|
||||
website: optionalStringMaxSchema(255),
|
||||
// ── Address (optional). Persisted by the backend store endpoint when
|
||||
// address_line_1 + country + state are provided. ──
|
||||
address_line_1: optionalStringMaxSchema(255),
|
||||
address_line_2: optionalStringMaxSchema(255),
|
||||
city: optionalStringMaxSchema(100),
|
||||
zip_code: optionalStringMaxSchema(20),
|
||||
country: relationFieldSchema,
|
||||
state: relationFieldSchema,
|
||||
})
|
||||
|
||||
type VendorFormValues = z.infer<typeof vendorFormSchema>
|
||||
|
||||
Reference in New Issue
Block a user