diff --git a/frontend/components/global/AutoForm.vue b/frontend/components/global/AutoForm.vue index 8407e7603..209c6f5cc 100644 --- a/frontend/components/global/AutoForm.vue +++ b/frontend/components/global/AutoForm.vue @@ -86,6 +86,25 @@ validate-on="input" /> + + + (() => [ { label: i18n.t("general.name"), varName: "name", @@ -267,7 +282,57 @@ const formItems: AutoFormItems = [ varName: "fraction", type: fieldTypes.BOOLEAN, }, -]; + { + label: i18n.t("data-pages.units.standard-quantity"), + varName: "standardQuantity", + type: fieldTypes.NUMBER, + numberInputConfig: { + min: 0, + max: undefined, + precision: undefined, + controlVariant: "hidden", + }, + }, + { + label: i18n.t("data-pages.units.standard-unit"), + varName: "standardUnit", + type: fieldTypes.SELECT, + options: [ + { + text: i18n.t("data-pages.units.standard-unit-labels.fluid-ounce"), + value: "fluid_ounce", + }, + { + text: i18n.t("data-pages.units.standard-unit-labels.cup"), + value: "cup", + }, + { + text: i18n.t("data-pages.units.standard-unit-labels.ounce"), + value: "ounce", + }, + { + text: i18n.t("data-pages.units.standard-unit-labels.pound"), + value: "pound", + }, + { + text: i18n.t("data-pages.units.standard-unit-labels.milliliter"), + value: "milliliter", + }, + { + text: i18n.t("data-pages.units.standard-unit-labels.liter"), + value: "liter", + }, + { + text: i18n.t("data-pages.units.standard-unit-labels.gram"), + value: "gram", + }, + { + text: i18n.t("data-pages.units.standard-unit-labels.kilogram"), + value: "kilogram", + }, + ] as StandardizedUnitTypeOption[], + }, +]); // ============================================================ // Create diff --git a/frontend/types/auto-forms.ts b/frontend/types/auto-forms.ts index 4b3663bb2..6c194040b 100644 --- a/frontend/types/auto-forms.ts +++ b/frontend/types/auto-forms.ts @@ -1,11 +1,28 @@ import type { VForm as VuetifyForm } from "vuetify/components/VForm"; -type FormFieldType = "text" | "textarea" | "list" | "select" | "object" | "boolean" | "color" | "password"; +type FormFieldType + = | "text" + | "textarea" + | "number" + | "list" + | "select" + | "object" + | "boolean" + | "color" + | "password"; export type FormValidationRule = (value: any) => boolean | string; export interface FormSelectOption { text: string; + value?: string; +} + +export interface FormFieldNumberInputConfig { + min?: number; + max?: number; + precision?: number; + controlVariant?: "split" | "default" | "hidden" | "stacked"; } export interface FormField { @@ -18,8 +35,9 @@ export interface FormField { rules?: FormValidationRule[]; disableUpdate?: boolean; disableCreate?: boolean; + numberInputConfig?: FormFieldNumberInputConfig; options?: FormSelectOption[]; - selectReturnValue?: string; + selectReturnValue?: "text" | "value"; } export type AutoFormItems = FormField[];