checkpoint masterdetail

This commit is contained in:
rizrmd 2024-05-24 05:33:41 -07:00
parent 27d500f63c
commit 34f9c3a631
7 changed files with 159 additions and 163 deletions

View File

@ -44,10 +44,6 @@ export const TypeCustom: FC<{ field: FieldLocal; fm: FMLocal }> = ({
if (local.result) { if (local.result) {
if (isValidElement(local.result)) { if (isValidElement(local.result)) {
el = local.result; el = local.result;
} else {
if (local.result.field === "text") {
el = <FieldTypeText field={field} fm={fm} prop={local.result} />;
}
} }
} }

View File

@ -34,7 +34,7 @@ export const MDMain: FC<{ md: MDLocal; mdr: MDRef }> = ({ md, mdr }) => {
return ( return (
<> <>
{md.props.show_head === "only-master" && <MDHeader md={md} mdr={mdr} />} {md.props.show_head === "only-master" && <MDHeader md={md} mdr={mdr} />}
<PassProp md={md}>{md.master.internal}</PassProp> {/* <PassProp md={md}>{md.master.internal}</PassProp> */}
</> </>
); );
}; };

View File

@ -27,7 +27,7 @@ export const MDTab: FC<{ md: MDLocal; mdr: MDRef }> = ({ md, mdr }) => {
{md.props.tab_mode !== "hidden" && md.tab.list.length > 1 && ( {md.props.tab_mode !== "hidden" && md.tab.list.length > 1 && (
<MDNavTab md={md} mdr={mdr} /> <MDNavTab md={md} mdr={mdr} />
)} )}
<PassProp md={md}>{detail.internal}</PassProp> {/* <PassProp md={md}>{detail.internal}</PassProp> */}
</div> </div>
</> </>
); );

View File

@ -1,12 +1,11 @@
import { getPathname } from "lib/utils/pathname";
import { useLocal } from "lib/utils/use-local";
import get from "lodash.get"; import get from "lodash.get";
import { ChevronDown, ChevronRight } from "lucide-react"; import { FC } from "react";
import { FC, ReactNode, useEffect } from "react"; import { IMenu, MenuProp } from "../../preset/menu/utils/type-menu";
import { MenuProp } from "../../preset/menu/utils/type-menu";
export const Menu: FC<MenuProp> = (props) => { export const Menu: FC<MenuProp> = (props) => {
const imenu = props.menu; const imenu = props.menu[0];
console.log(imenu)
let role = props.role; let role = props.role;
role = props.on_init() as string; role = props.on_init() as string;
@ -55,147 +54,147 @@ export const SideBar: FC<{
value: item[2], value: item[2],
}; };
return <div key={item[0]}>asdas {typeof menu.icon}</div>; return <div key={item[0]}>asdas {typeof menu.icon}</div>;
const find_child = findChild(item, (e: any) => local.open.includes(e)); // const find_child = findChild(item, (e: any) => local.open.includes(e));
let expand = find_child; // let expand = find_child;
if (find_child && !local.open.includes(item)) local.open.push(item); // if (find_child && !local.open.includes(item)) local.open.push(item);
return ( // return (
<div className="w-full c-flex c-flex-col"> // <div className="w-full c-flex c-flex-col">
<div // <div
onClick={() => { // onClick={() => {
const childs = getChilds(item) || []; // const childs = getChilds(item) || [];
if (local.open.includes(item)) { // if (local.open.includes(item)) {
local.open = local.open.filter( // local.open = local.open.filter(
(e: any) => e !== item && !childs.includes(e) // (e: any) => e !== item && !childs.includes(e)
); // );
} else { // } else {
local.open.push(item); // local.open.push(item);
} // }
local.active = item; // local.active = item;
local.render(); // local.render();
}} // }}
> // >
<PassProp // <PassProp
item={menu} // item={menu}
dept={dept || 0} // dept={dept || 0}
hasChild={Array.isArray(menu.value)} // hasChild={Array.isArray(menu.value)}
selected={local.active === item} // selected={local.active === item}
expand={expand} // expand={expand}
mode={pm.mode} // mode={pm.mode}
> // >
{pm.child} // {pm.child}
</PassProp> // </PassProp>
</div> // </div>
<div className="c-flex c-flex-col"> // <div className="c-flex c-flex-col">
{Array.isArray(menu.value) && expand ? ( // {Array.isArray(menu.value) && expand ? (
<> // <>
<SideBar // <SideBar
data={menu.value} // data={menu.value}
local={local} // local={local}
dept={(dept || 0) + 1} // dept={(dept || 0) + 1}
pm={pm} // pm={pm}
/> // />
</> // </>
) : ( // ) : (
<></> // <></>
)} // )}
</div> // </div>
</div> // </div>
); // );
})} })}
</div> </div>
); );
return ( // return (
<div className="c-flex c-flex-col c-gap-2 c-flex-grow"> // <div className="c-flex c-flex-col c-gap-2 c-flex-grow">
{data.map((e) => { // {data.map((e) => {
const label: string = e[0]; // const label: string = e[0];
const child: any = e[2]; // const child: any = e[2];
const hasChildren = Array.isArray(child); // const hasChildren = Array.isArray(child);
const predicate = (item: MenuActive) => { // const predicate = (item: MenuActive) => {
if (hasChildren) { // if (hasChildren) {
return item.label === e[0] && item.path === ""; // return item.label === e[0] && item.path === "";
} else { // } else {
return item.label === e[0] && item.path === child; // return item.label === e[0] && item.path === child;
} // }
}; // };
const found_local = local.open.find(predicate); // const found_local = local.open.find(predicate);
let expand = get(found_local, "expand") ? true : false; // let expand = get(found_local, "expand") ? true : false;
const selected = found(e, (menu: any) => // const selected = found(e, (menu: any) =>
local.open.some( // local.open.some(
(item: MenuActive) => // (item: MenuActive) =>
item.label === menu[0] || item.path === menu[2] // item.label === menu[0] || item.path === menu[2]
) // )
); // );
if (selected && !found_local) { // if (selected && !found_local) {
local.open.push({ // local.open.push({
label: e[0], // label: e[0],
path: hasChildren ? "" : e[2], // path: hasChildren ? "" : e[2],
expand: hasChildren, // expand: hasChildren,
}); // });
expand = true; // expand = true;
} // }
return ( // return (
<div // <div
className={cx( // className={cx(
"c-flex c-flex-col c-w-full c-gap-1 c-items-center c-rounded c-pb-0" // "c-flex c-flex-col c-w-full c-gap-1 c-items-center c-rounded c-pb-0"
)} // )}
> // >
<div // <div
className={cx( // className={cx(
"c-flex c-w-full c-gap-1 c-flex-grow c-items-center c-rounded c-p-2 sidebar-row" // "c-flex c-w-full c-gap-1 c-flex-grow c-items-center c-rounded c-p-2 sidebar-row"
)} // )}
onClick={() => { // onClick={() => {
const found_local = local.open.find(predicate); // const found_local = local.open.find(predicate);
console.log(found_local); // console.log(found_local);
if (found_local) { // if (found_local) {
found_local.expand = !found_local.expand; // found_local.expand = !found_local.expand;
// local.open = local.open.filter((item: MenuActive) => { // // local.open = local.open.filter((item: MenuActive) => {
// if (hasChildren) { // // if (hasChildren) {
// return item.label !== e[0] && item.path === ""; // // return item.label !== e[0] && item.path === "";
// } else { // // } else {
// return item.label !== e[0] && item.path !== child; // // return item.label !== e[0] && item.path !== child;
// } // // }
// }); // // });
local.render(); // local.render();
} else { // } else {
local.open = [ // local.open = [
{ // {
label: e[0], // label: e[0],
path: hasChildren ? "" : e[2], // path: hasChildren ? "" : e[2],
expand: hasChildren, // expand: hasChildren,
}, // },
]; // ];
} // }
local.render(); // local.render();
console.log(local.open); // console.log(local.open);
}} // }}
> // >
<PassProp // <PassProp
item={e} // item={e}
dept={dept || 0} // dept={dept || 0}
hasChild={hasChildren} // hasChild={hasChildren}
selected={selected} // selected={selected}
> // >
{pm.child} // {pm.child}
</PassProp> // </PassProp>
</div> // </div>
{hasChildren && selected && expand ? ( // {hasChildren && selected && expand ? (
<div className="sidebar-child c-flex c-w-full c-pb-0 c-gap-1 c-pl-2 c-flex-grow c-items-center c-rounded c-py-2"> // <div className="sidebar-child c-flex c-w-full c-pb-0 c-gap-1 c-pl-2 c-flex-grow c-items-center c-rounded c-py-2">
<SideBar // <SideBar
data={child} // data={child}
local={local} // local={local}
dept={(dept || 0) + 1} // dept={(dept || 0) + 1}
pm={pm} // pm={pm}
/> // />
</div> // </div>
) : ( // ) : (
<></> // <></>
)} // )}
</div> // </div>
); // );
})} // })}
</div> // </div>
); // );
}; };
const getChilds = (data: Array<any>) => { const getChilds = (data: Array<any>) => {

View File

@ -4,7 +4,7 @@ import { createPortal } from "react-dom";
type PopupProp = { type PopupProp = {
on_close: (value: boolean) => void; on_close: (value: boolean) => void;
open: boolean | () => boolean; open: boolean | (() => boolean);
child: ReactNode; child: ReactNode;
}; };
export const Popup: FC<PopupProp> = ({ on_close, open, child }) => { export const Popup: FC<PopupProp> = ({ on_close, open, child }) => {
@ -13,11 +13,11 @@ export const Popup: FC<PopupProp> = ({ on_close, open, child }) => {
open: false, open: false,
}); });
useEffect(() => { useEffect(() => {
console.log(open) console.log(open);
const open_props = typeof open === "function" ? open() : open const open_props = typeof open === "function" ? open() : open;
local.open = open_props; local.open = open_props;
local.render(); local.render();
console.log(local.open) console.log(local.open);
}, [open]); }, [open]);
if (document.getElementsByClassName("prasi-popup").length === 0) { if (document.getElementsByClassName("prasi-popup").length === 0) {

View File

@ -33,8 +33,8 @@ const single = {} as Record<
const load_single = async (table: string) => { const load_single = async (table: string) => {
if (!single[table]) { if (!single[table]) {
single[table] = { single[table] = {
cols: await db._schema.columns(table), cols: await db._schema.columns(table as any),
rels: await db._schema.rels(table), rels: await db._schema.rels(table as any),
}; };
} }
return single[table]; return single[table];

View File

@ -1,5 +1,4 @@
import get from "lodash.get"; import get from "lodash.get";
import { select } from "./select";
type typeFieldLogin = { type typeFieldLogin = {
username: string; username: string;
@ -16,10 +15,12 @@ export const generateLogin = async (
"edit.childs[0].edit.childs[0].edit.props.body.value" "edit.childs[0].edit.childs[0].edit.props.body.value"
); );
const form: PrasiItem = item_form; const form: PrasiItem = item_form;
const filterField = form.edit.childs.filter((e: any) => get(e, "component.id") !== "32550d01-42a3-4b15-a04a-2c2d5c3c8e67") const filterField = form.edit.childs.filter(
console.log({filterField}) (e: any) =>
form.edit.setChilds(filterField) get(e, "component.id") !== "32550d01-42a3-4b15-a04a-2c2d5c3c8e67"
);
form.edit.setChilds(filterField);
// form.edit.childs[0].edit.setProp("name", field.username) // form.edit.childs[0].edit.setProp("name", field.username)
// // form.edit.childs[1].edit.setProp("name", field.password) // // form.edit.childs[1].edit.setProp("name", field.password)
// let rels = { ...rel }; // let rels = { ...rel };
@ -60,13 +61,13 @@ export const generateLogin = async (
// }else{ // }else{
// alert("password salah"); // alert("password salah");
// } // }
// }else{ // }else{
// alert("user belum terdaftar") // alert("user belum terdaftar")
// } // }
// }; // };
// type IForm = { form: any; error: Record<string, string> } // type IForm = { form: any; error: Record<string, string> }
// `, // `,
// }); // });