This commit is contained in:
Rizky 2024-12-01 13:39:49 +00:00
parent 42eace5e4f
commit 874c9f8fa1
8 changed files with 35 additions and 64 deletions

View File

@ -108,12 +108,12 @@ export const Field: FC<FieldProp> = (arg) => {
typeof field.hidden === "function"
? field.hidden()
: typeof field.hidden === "string"
? field.hidden === "n"
? false
: true
: typeof field.hidden === "boolean"
? field.hidden
: true;
? field.hidden === "n"
? false
: true
: typeof field.hidden === "boolean"
? field.hidden
: true;
if (!show) return <></>;
return (

View File

@ -35,6 +35,7 @@ export const FieldInput: FC<{
const errors = fm.error.get(name);
let type_field: any = typeof arg.type === "function" ? arg.type() : arg.type; // tipe field
const disabled =
typeof field.disabled === "function" ? field.disabled() : field.disabled;
let custom = <></>;

View File

@ -38,8 +38,8 @@ export type PropTypeInput = {
placeholder?: string;
onFocus?: (e: FocusEvent<HTMLDivElement>) => void;
onBlur?: (e: FocusEvent<HTMLDivElement>) => void;
onChange?: (val: any) => void;
model_upload?: "upload" | "import";
onChange?: (value: any) => void;
};
const parse = parser.exportAsFunctionAny("en-US");
@ -102,10 +102,9 @@ export const FieldTypeInput: FC<{
const renderOnChange = () => {
input.render();
// if (field.on_change) {
// field.on_change({ value: fm.data[field.name], name: field.name, fm });
// }
if (prop.onChange) {
prop.onChange(fm.data[field.name]);
}
clearTimeout(input.change_timeout);
input.change_timeout = setTimeout(fm.render, 300);
};
@ -178,25 +177,9 @@ export const FieldTypeInput: FC<{
/>
);
case "upload":
return (
<FieldUpload
arg={arg}
field={field}
fm={fm}
prop={prop}
on_change={arg.on_change}
/>
);
return <FieldUpload arg={arg} field={field} fm={fm} prop={prop} />;
case "import":
return (
<FieldUpload
arg={arg}
field={field}
fm={fm}
prop={prop}
on_change={arg.on_change}
/>
);
return <FieldUpload arg={arg} field={field} fm={fm} prop={prop} />;
case "money":
return (
<>
@ -223,10 +206,6 @@ export const FieldTypeInput: FC<{
? new Date(value?.startDate)
: null;
renderOnChange();
if (prop.onChange) {
prop.onChange(fm.data[field.name]);
}
}}
/>
);
@ -255,10 +234,6 @@ export const FieldTypeInput: FC<{
onChange={(ev) => {
fm.data[field.name] = ev.currentTarget.value.replace(/\D/g, "");
renderOnChange();
if (prop.onChange) {
prop.onChange(fm.data[field.name]);
}
}}
inputMode="decimal"
value={format(value, {
@ -369,9 +344,6 @@ export const FieldTypeInput: FC<{
onChange={async (ev) => {
fm.data[field.name] = ev.currentTarget.value;
renderOnChange();
if (prop.onChange) {
await prop.onChange(fm.data[field.name]);
}
clearTimeout(internal.search_timeout);
internal.search_timeout = setTimeout(() => {
@ -403,10 +375,6 @@ export const FieldTypeInput: FC<{
fm.data[field.name] = parseInt(fm.data[field.name]);
}
renderOnChange();
if (prop.onChange) {
prop.onChange(fm.data[field.name]);
}
}}
placeholder={prop.placeholder || arg.placeholder || ""}
value={value}

View File

@ -2,7 +2,6 @@ import { useLocal } from "lib/utils/use-local";
import { FC, useEffect } from "react";
import { FMLocal, FieldLocal, FieldProp } from "../../typings";
import { PropTypeInput } from "./TypeInput";
import { isEmptyString } from "lib/utils/is-empty-string";
export const FieldMoney: FC<{
field: FieldLocal;
fm: FMLocal;
@ -42,8 +41,11 @@ export const FieldMoney: FC<{
formatCurrency(rawValue)
);
fm.render();
if (field.on_change) {
field.on_change({
input.value = formatCurrency(fm.data[field.name]);
input.render();
if (arg.on_change) {
arg.on_change({
value: convertionCurrencyNumber(
formatCurrency(fm.data[field.name])
),
@ -51,8 +53,6 @@ export const FieldMoney: FC<{
fm,
});
}
input.value = formatCurrency(fm.data[field.name]);
input.render();
} else {
input.value = rawValue;
input.render();

View File

@ -1,9 +1,9 @@
import { REGEXP_ONLY_DIGITS } from "input-otp";
import { InputOTP, InputOTPGroup, InputOTPSlot } from "lib/comps/ui/input-otp";
import { useLocal } from "lib/utils/use-local";
import { FC, useEffect } from "react";
import { FC } from "react";
import { FieldLocal, FieldProp, FMLocal } from "../../typings";
import { PropTypeInput } from "./TypeInput";
import { InputOTP, InputOTPGroup, InputOTPSlot } from "lib/comps/ui/input-otp";
import { REGEXP_ONLY_DIGITS } from "input-otp";
export const FieldOTP: FC<{
digit: number;
@ -11,7 +11,7 @@ export const FieldOTP: FC<{
fm: FMLocal;
prop: PropTypeInput;
arg: FieldProp;
}> = ({ digit, fm, field }) => {
}> = ({ digit, fm, field, arg }) => {
const local = useLocal({
otp: "",
ref: [] as HTMLInputElement[],
@ -37,8 +37,8 @@ export const FieldOTP: FC<{
onChange={(value) => {
local.otp = value;
local.render();
if (field.on_change) {
field.on_change({ value, name: field.name, fm });
if (arg.on_change) {
arg.on_change({ value: local.otp, fm, name: field.name });
}
}}
pattern={REGEXP_ONLY_DIGITS}

View File

@ -10,12 +10,11 @@ export const FieldUpload: FC<{
prop: PropTypeInput;
styling?: string;
arg: FieldProp;
on_change: (e: any) => void | Promise<void>;
}> = (pass) => {
const { field, fm, prop, on_change, arg } = pass;
const { field, fm, prop, arg } = pass;
let mode = field.prop.upload?.mode || "single-file";
if (mode === "single-file") {
return <FieldUploadSingle {...pass} />;
}
return <FieldUploadMulti {...pass} />;
return <FieldUploadMulti {...pass} />;
};

View File

@ -15,8 +15,7 @@ export const FieldUploadMulti: FC<{
prop: PropTypeInput;
styling?: string;
arg: FieldProp;
on_change: (e: any) => void | Promise<void>;
}> = ({ field, fm, prop, on_change, arg }) => {
}> = ({ field, fm, prop, arg }) => {
let value: string = (fm.data[field.name] || "").trim();
const input = useLocal({

View File

@ -16,7 +16,11 @@ export const FieldUploadSingle: FC<{
prop: PropTypeInput;
styling?: string;
arg: FieldProp;
on_change: (e: any) => void | Promise<void>;
on_change?: (arg: {
value: any;
name: string;
fm: any;
}) => void | Promise<void>;
}> = ({ field, fm, prop, on_change, arg }) => {
const styling = arg.upload_style ? arg.upload_style : "full";
const disabled =
@ -57,9 +61,9 @@ export const FieldUploadSingle: FC<{
const jsonData = XLSX.utils.sheet_to_json(worksheet);
if (typeof on_change === "function") {
on_change({
value: jsonData,
file: file,
binnary: e.target.result,
value: { jsonData, file: file, binary: e.target.result },
fm,
name: field.name,
});
}
}