This commit is contained in:
rizky 2024-04-26 18:14:13 -07:00
parent af3fc9381e
commit 48b6b284b3
5 changed files with 44 additions and 22 deletions

View File

@ -1,24 +1,33 @@
import { useLocal } from "@/utils/use-local";
import { icon } from "../icon";
import { FC } from "react";
export const TitleBack: FC<{
label: string;
url: string;
name_page: string;
}> = ({ label, url, name_page }) => {
label: string | (() => Promise<string>);
on_back: () => void;
}> = ({ label, on_back: on_back }) => {
const local = useLocal({ label: "" }, async () => {
if (typeof label === "function") {
local.label = await label();
} else {
local.label = label;
}
local.render();
});
return (
<div className="c-bg-gray-100 c-px-2 c-w-full c-h-[20px] c-flex c-py-2">
<div className="c-bg-white c-px-2 c-w-full c-min-h-[20px] c-flex c-py-2">
<div
className="c-mr-2 hover:c-cursor-pointer"
onClick={() => {
navigate(`${url}`);
if (typeof on_back === "function") {
on_back();
}
}}
>
{icon.left}
</div>
<div>{label || "-"}</div>
<div>{local.label || "-"}</div>
</div>
);
};

View File

@ -1,5 +1,5 @@
import { getPathname } from "@/exports";
import { useLocal } from "@/utils/use-local";
import get from "lodash.get";
import { FC, useEffect, useRef } from "react";
import { createPortal } from "react-dom";
import { Toaster } from "sonner";
@ -7,7 +7,6 @@ import { FMInternal, FMProps } from "./typings";
import { editorFormData } from "./utils/ed-data";
import { formInit } from "./utils/init";
import { formReload } from "./utils/reload";
import { getPathname } from "../../..";
const editorFormWidth = {} as Record<string, { w: number; f: any }>;

View File

@ -4,18 +4,22 @@ import { useField } from "../utils/use-field";
import { validate } from "../utils/validate";
import { FieldInput } from "./FieldInput";
import { Label } from "./Label";
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 mode = fm.props.label_mode;
const w = field.width;
useEffect(() => {
if (local.prev_val !== fm.data[field.name]) {
validate(field, fm);
fm.events.on_change(field.name, fm.data[field.name]);
fm.render();
}
}, [fm.data[field.name]]);
if (field.status === "init" && !isEditor) return null;

View File

@ -29,9 +29,15 @@ export const FieldInput: FC<{
);
let found = null as any;
if (childs && childs.length > 0 && field.type !== "custom") {
for (const child of childs) {
const mp = (fieldMapping as any)[field.type];
let mp = (fieldMapping as any)[field.type];
if (!mp) {
mp = (fieldMapping as any)["text"];
}
if (child.component?.id === mp.id) {
found = child;
@ -86,8 +92,7 @@ export const FieldInput: FC<{
? field.focused
? "c-border-red-600 c-bg-red-50 c-outline c-outline-red-700"
: "c-border-red-600 c-bg-red-50"
: field.focused &&
"c-border-blue-700 c-outline c-outline-blue-700",
: field.focused && "c-border-blue-700 c-outline c-outline-blue-700",
css`
& > .field-inner {
min-height: 35px;

View File

@ -23,7 +23,12 @@ export const genFieldMitem = (arg: {
?.get("content")
?.get("childs");
const component = fieldMapping[field.type as "text"];
let component = fieldMapping[field.type as "text"];
if (!component) {
component = fieldMapping["text"];
}
if (component) {
const item = createItem({
component: component as any,