fix field type custom

This commit is contained in:
rizrmd 2024-05-17 01:28:10 -07:00
parent 356f1daf42
commit 5b4f3b21c0
3 changed files with 13 additions and 12 deletions

View File

@ -9,22 +9,23 @@ import { useLocal } from "@/utils/use-local";
export const Field: FC<FieldProp> = (arg) => {
const { fm } = arg;
const field = useField(arg);
const local = useLocal({ prev_val: fm.data[field.name] });
const name = typeof field.name === 'function' ? field.name() : field.name;
const local = useLocal({ prev_val: fm.data[name] });
const mode = fm.props.label_mode;
const w = field.width;
useEffect(() => {
if (local.prev_val !== fm.data[field.name]) {
if (local.prev_val !== fm.data[name]) {
validate(field, fm);
fm.events.on_change(field.name, fm.data[field.name]);
fm.events.on_change(name, fm.data[name]);
fm.render();
}
}, [fm.data[field.name]]);
}, [fm.data[name]]);
if (field.status === "init" && !isEditor) return null;
const errors = fm.error.get(field.name);
const errors = fm.error.get(name);
const props = { ...arg.props };
delete props.className;
return (

View File

@ -1,7 +1,7 @@
import { createItem } from "@/gen/utils";
import get from "lodash.get";
import { FC, isValidElement, useEffect } from "react";
import { FMLocal, FieldLocal, FieldProp } from "../typings";
import { FMLocal, FieldLocal, FieldProp, FieldTypeCustom } from "../typings";
import { genFieldMitem, updateFieldMItem } from "../utils/gen-mitem";
import { fieldMapping } from "./mapping";
import { FieldLoading } from "./raw/FieldLoading";
@ -31,8 +31,7 @@ export const FieldInput: FC<{
const suffix = typeof field.suffix === "function" ? field.suffix() : typeof field.suffix === "string" ? field.prefix : null;
const name = typeof field.name === 'function' ? field.name() : field.name;
const errors = fm.error.get(name);
const type_field = arg.type; // tipe field
const sub_type_field = arg.sub_type;
let type_field = typeof arg.type === 'function' ? arg.type() : arg.type; // tipe field
return (
<div
@ -84,14 +83,14 @@ export const FieldInput: FC<{
<FieldTypeText
field={field}
fm={fm}
prop={{ type: arg.type, sub_type: arg.sub_type, prefix, suffix } as PropTypeText}
prop={{ type: type_field as any, sub_type: arg.sub_type, prefix, suffix } as PropTypeText}
/>
) : ["single-option"].includes(type_field) ? (
<SingleOption arg={arg} field={field} fm={fm} />
) : ["multi-option"].includes(type_field) ? (
<MultiOption arg={arg} field={field} fm={fm} />
) : (
<>{isValidElement(field.type) && field.type}</>
<>{isValidElement(type_field) && type_field}</>
)}
</div>
)}

View File

@ -27,13 +27,14 @@ export type FMProps = {
on_load_deps?: any[];
};
type FieldType = "-" | "relation" | "switch" | "input" | "single-option" | "multi-option";
export type FieldProp = {
name: string | (() => string);
label: string | (() => string);
desc?: string;
props?: any;
fm: FMLocal;
type: "text" | "relation" | "switch" | "input" | "single-option" | "multi-option";
type: FieldType | (() => FieldType);
// | "number"
// | "textarea"
// | "dropdown"
@ -108,7 +109,7 @@ export type FMLocal = FMInternal & { render: () => void };
export type FieldInternal<T extends FieldProp["type"]> = {
status: "init" | "loading" | "ready";
name: FieldProp["name"];
type: T;
type: T | (() => T);
label: FieldProp["label"];
desc: FieldProp["desc"];
prefix: FieldProp["prefix"];