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 {
local.open.push(item);
}
local.active = item;
local.render();
}}
>
<PassProp
item={menu}
dept={dept || 0}
hasChild={Array.isArray(menu.value)}
selected={local.active === item}
expand={expand}
mode={pm.mode}
>
{pm.child}
</PassProp>
</div>
<div className="c-flex c-flex-col">
{Array.isArray(menu.value) && expand ? (
<>
<SideBar
data={menu.value}
local={local}
dept={(dept || 0) + 1}
pm={pm}
/>
</>
) : (
<></>
)}
</div>
</div>
);
})}
</div>
);
return (
<div className="c-flex c-flex-col c-gap-2 c-flex-grow">
{data.map((e) => {
const label: string = e[0];
const child: any = e[2];
const hasChildren = Array.isArray(child);
const predicate = (item: MenuActive) => {
if (hasChildren) {
return item.label === e[0] && item.path === "";
} else {
return item.label === e[0] && item.path === child;
}
};
const found_local = local.open.find(predicate);
let expand = get(found_local, "expand") ? true : false;
const selected = found(e, (menu: any) =>
local.open.some(
(item: MenuActive) =>
item.label === menu[0] || item.path === menu[2]
)
);
if (selected && !found_local) {
local.open.push({
label: e[0],
path: hasChildren ? "" : e[2],
expand: hasChildren,
});
expand = true;
}
return (
<div
className={cx(
"c-flex c-flex-col c-w-full c-gap-1 c-items-center c-rounded c-pb-0"
)}
>
<div
className={cx(
"c-flex c-w-full c-gap-1 c-flex-grow c-items-center c-rounded c-p-2 sidebar-row"
)}
onClick={() => {
const found_local = local.open.find(predicate);
console.log(found_local);
if (found_local) {
found_local.expand = !found_local.expand;
// local.open = local.open.filter((item: MenuActive) => {
// if (hasChildren) {
// return item.label !== e[0] && item.path === "";
// } else { // } else {
// return item.label !== e[0] && item.path !== child; // local.open.push(item);
// } // }
// }); // local.active = item;
local.render(); // local.render();
} else { // }}
local.open = [ // >
{ // <PassProp
label: e[0], // item={menu}
path: hasChildren ? "" : e[2], // dept={dept || 0}
expand: hasChildren, // hasChild={Array.isArray(menu.value)}
}, // selected={local.active === item}
]; // expand={expand}
} // mode={pm.mode}
local.render(); // >
console.log(local.open); // {pm.child}
}} // </PassProp>
> // </div>
<PassProp // <div className="c-flex c-flex-col">
item={e} // {Array.isArray(menu.value) && expand ? (
dept={dept || 0} // <>
hasChild={hasChildren} // <SideBar
selected={selected} // data={menu.value}
> // local={local}
{pm.child} // dept={(dept || 0) + 1}
</PassProp> // pm={pm}
</div> // />
{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"> // ) : (
<SideBar // <></>
data={child} // )}
local={local} // </div>
dept={(dept || 0) + 1} // </div>
pm={pm} // );
/>
</div>
) : (
<></>
)}
</div>
);
})} })}
</div> </div>
); );
// return (
// <div className="c-flex c-flex-col c-gap-2 c-flex-grow">
// {data.map((e) => {
// const label: string = e[0];
// const child: any = e[2];
// const hasChildren = Array.isArray(child);
// const predicate = (item: MenuActive) => {
// if (hasChildren) {
// return item.label === e[0] && item.path === "";
// } else {
// return item.label === e[0] && item.path === child;
// }
// };
// const found_local = local.open.find(predicate);
// let expand = get(found_local, "expand") ? true : false;
// const selected = found(e, (menu: any) =>
// local.open.some(
// (item: MenuActive) =>
// item.label === menu[0] || item.path === menu[2]
// )
// );
// if (selected && !found_local) {
// local.open.push({
// label: e[0],
// path: hasChildren ? "" : e[2],
// expand: hasChildren,
// });
// expand = true;
// }
// return (
// <div
// className={cx(
// "c-flex c-flex-col c-w-full c-gap-1 c-items-center c-rounded c-pb-0"
// )}
// >
// <div
// className={cx(
// "c-flex c-w-full c-gap-1 c-flex-grow c-items-center c-rounded c-p-2 sidebar-row"
// )}
// onClick={() => {
// const found_local = local.open.find(predicate);
// console.log(found_local);
// if (found_local) {
// found_local.expand = !found_local.expand;
// // local.open = local.open.filter((item: MenuActive) => {
// // if (hasChildren) {
// // return item.label !== e[0] && item.path === "";
// // } else {
// // return item.label !== e[0] && item.path !== child;
// // }
// // });
// local.render();
// } else {
// local.open = [
// {
// label: e[0],
// path: hasChildren ? "" : e[2],
// expand: hasChildren,
// },
// ];
// }
// local.render();
// console.log(local.open);
// }}
// >
// <PassProp
// item={e}
// dept={dept || 0}
// hasChild={hasChildren}
// selected={selected}
// >
// {pm.child}
// </PassProp>
// </div>
// {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">
// <SideBar
// data={child}
// local={local}
// dept={(dept || 0) + 1}
// pm={pm}
// />
// </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,9 +15,11 @@ 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)