From ad94d3afac8d5e9ee63505b923bec3ad674d1ee6 Mon Sep 17 00:00:00 2001 From: rizrmd Date: Sun, 19 May 2024 05:32:04 -0700 Subject: [PATCH] wip fix --- comps/md/MasterDetail.tsx | 32 +++++-------- comps/md/parts/MDHeader.tsx | 3 +- comps/md/utils/editor-init.ts | 24 ---------- comps/md/utils/editor-init.tsx | 58 ++++++++++++++++++++++++ comps/md/utils/md-init.ts | 75 ------------------------------- comps/md/utils/md-render-loop.tsx | 13 ++++++ comps/md/utils/typings.ts | 4 +- 7 files changed, 85 insertions(+), 124 deletions(-) delete mode 100755 comps/md/utils/editor-init.ts create mode 100755 comps/md/utils/editor-init.tsx delete mode 100755 comps/md/utils/md-init.ts create mode 100755 comps/md/utils/md-render-loop.tsx diff --git a/comps/md/MasterDetail.tsx b/comps/md/MasterDetail.tsx index 5925417..f6fe272 100755 --- a/comps/md/MasterDetail.tsx +++ b/comps/md/MasterDetail.tsx @@ -1,5 +1,5 @@ import { useLocal } from "@/utils/use-local"; -import { FC, useEffect, useRef } from "react"; +import { FC, useRef } from "react"; import { ModeFull } from "./mode/full"; import { ModeHSplit } from "./mode/h-split"; import { ModeVSplit } from "./mode/v-split"; @@ -9,13 +9,12 @@ import { masterDetailApplyParams, masterDetailParseHash as masterDetailParseParams, } from "./utils/md-hash"; -import { masterDetailInit, masterDetailSelected } from "./utils/md-init"; import { MDLocalInternal, MDProps } from "./utils/typings"; +import { mdRenderLoop } from "./utils/md-render-loop"; export const MasterDetail: FC = (arg) => { const { PassProp, - child, name, mode, show_head, @@ -26,10 +25,11 @@ export const MasterDetail: FC = (arg) => { on_init, _item, } = arg; - const _ref = useRef({ PassProp, child, item: _item }); + const _ref = useRef({ PassProp, item: _item }); const mdr = _ref.current; const md = useLocal({ name, + status: "init", actions: [], breadcrumb: [], selected: null, @@ -65,26 +65,14 @@ export const MasterDetail: FC = (arg) => { }, }); - const local = useLocal({ init: false }); - if (isEditor) { - editorMDInit(md, arg); - } - mdr.PassProp = PassProp; - mdr.child = child; mdr.item = _item; - - useEffect(() => { - local.init = false; - local.render(); - }, [editor_tab]); - - if (!local.init || isEditor) { - local.init = true; - masterDetailInit(md, child, editor_tab); - masterDetailSelected(md); + if (isEditor && md.status === "init") { + editorMDInit(md, mdr, arg); } + mdRenderLoop(md, mdr, arg); + return (
= (arg) => { )} > {md.props.show_head === "always" && } - {md.props.mode === "full" && } + {/* {md.props.mode === "full" && } {md.props.mode === "v-split" && } - {md.props.mode === "h-split" && } + {md.props.mode === "h-split" && } */}
); }; diff --git a/comps/md/parts/MDHeader.tsx b/comps/md/parts/MDHeader.tsx index b493d02..6ab804e 100755 --- a/comps/md/parts/MDHeader.tsx +++ b/comps/md/parts/MDHeader.tsx @@ -1,9 +1,8 @@ -import get from "lodash.get"; import { FC } from "react"; import { MDLocal, MDRef } from "../utils/typings"; export const MDHeader: FC<{ md: MDLocal; mdr: MDRef }> = ({ md, mdr }) => { - const head = get(mdr.child, "props.meta.item.component.props.header.content"); + const head = mdr.item.edit.props?.header.value; const PassProp = mdr.PassProp; return {head}; }; diff --git a/comps/md/utils/editor-init.ts b/comps/md/utils/editor-init.ts deleted file mode 100755 index 16e15d0..0000000 --- a/comps/md/utils/editor-init.ts +++ /dev/null @@ -1,24 +0,0 @@ -import { MDLocal, MDProps } from "./typings"; - -export const editorMDInit = (md: MDLocal, arg: MDProps) => { - const { - PassProp, - child, - name, - _item, - mode, - show_head, - tab_mode, - editor_tab, - gen_fields, - gen_table, - on_init, - } = arg; - md.props.mode = mode; - md.props.show_head = show_head; - md.props.tab_mode = tab_mode; - md.props.editor_tab = editor_tab; - md.props.gen_fields = gen_fields; - md.props.gen_table = gen_table; - md.props.on_init = on_init; -}; diff --git a/comps/md/utils/editor-init.tsx b/comps/md/utils/editor-init.tsx new file mode 100755 index 0000000..7c3339c --- /dev/null +++ b/comps/md/utils/editor-init.tsx @@ -0,0 +1,58 @@ +import { MDLocal, MDProps, MDRef } from "./typings"; + +export const editorMDInit = (md: MDLocal, mdr: MDRef, arg: MDProps) => { + const { + mode, + show_head, + tab_mode, + editor_tab, + gen_fields, + gen_table, + on_init, + } = arg; + md.props.mode = mode; + md.props.show_head = show_head; + md.props.tab_mode = tab_mode; + md.props.editor_tab = editor_tab; + md.props.gen_fields = gen_fields; + md.props.gen_table = gen_table; + md.props.on_init = on_init; + + const props = mdr.item.edit.props; + if (props) { + const child = props.child.value as PrasiItem; + let master = child.edit.childs.find( + (e) => e.component?.id === "c68415ca-dac5-44fe-aeb6-936caf8cc491" + ); + let details = child.edit.childs.filter( + (e) => e.component?.id === "cb52075a-14ab-455a-9847-6f1d929a2a73" + ); + + if (master?.childs.length === 0 && md.breadcrumb.length === 0) { + md.breadcrumb = [ + { + label: ( + <> + ⚠️ Master Detail is not ready +
+
+ Please generate master detail props first +
+ + ), + }, + ]; + md.status = "unready"; + } + + if (master && details.length > 0) { + md.breadcrumb = []; + md.status = "ready"; + } + } +}; diff --git a/comps/md/utils/md-init.ts b/comps/md/utils/md-init.ts deleted file mode 100755 index d5fbba9..0000000 --- a/comps/md/utils/md-init.ts +++ /dev/null @@ -1,75 +0,0 @@ -import { MDLocal, w } from "./typings"; -import get from "lodash.get"; -import { parseGenField } from "@/gen/utils"; - -export const masterDetailInit = ( - md: MDLocal, - child: any, - editor_tab: string -) => { - const childs = get( - child, - "props.meta.item.component.props.child.content.childs" - ); - - if (Array.isArray(childs)) { - md.master.internal = null; - md.childs = {}; - md.tab.list = []; - if (isEditor && editor_tab === "master") { - if (md.tab.active) { - md.tab.active = ""; - setTimeout(md.render); - } - } - - for (const child of childs) { - const cid = child?.component?.id; - if (cid) { - if (cid === "c68415ca-dac5-44fe-aeb6-936caf8cc491") { - md.master.internal = child; - const pk = parseGenField(md.props.gen_fields).find((e) => e.is_pk); - if (pk) { - md.pk = pk; - } - } - if (cid === "cb52075a-14ab-455a-9847-6f1d929a2a73") { - // const name = getProp(child, "name", { md }); - // const label = getProp(child, "label", { md }); - // if (typeof name === "string") { - // if (isEditor && editor_tab !== "master") { - // if (name === editor_tab && md.tab.active !== name) { - // md.tab.active = name; - // setTimeout(md.render); - // } - // } - // md.tab.list.push(name); - // md.childs[name] = { - // internal: child, - // label, - // name, - // hide() {}, - // show() {}, - // render() {}, - // }; - // } - } - } - } - } -}; - -export const masterDetailSelected = (md: MDLocal) => { - md.params.parse(); - const pk = md.pk; - if (pk) { - const value = md.params.hash[md.name]; - if (value) { - md.selected = { [pk.name]: value }; - const tab = md.params.tabs[md.name]; - if (tab && md.tab.list.includes(tab)) { - md.tab.active = tab; - } - } - } -}; diff --git a/comps/md/utils/md-render-loop.tsx b/comps/md/utils/md-render-loop.tsx new file mode 100755 index 0000000..8cba694 --- /dev/null +++ b/comps/md/utils/md-render-loop.tsx @@ -0,0 +1,13 @@ +import { MDLocal, MDProps, MDRef } from "./typings"; + +export const mdRenderLoop = (md: MDLocal, mdr: MDRef, props: MDProps) => { + console.log(mdr.item.childs); + const childs = mdr.item.edit.childs.filter( + (e) => e?.component?.id === "cb52075a-14ab-455a-9847-6f1d929a2a73" + ); + + console.log(mdr.item.edit.childs); + for (const c of childs) { + console.log(c); + } +}; diff --git a/comps/md/utils/typings.ts b/comps/md/utils/typings.ts index a32745c..aef5095 100755 --- a/comps/md/utils/typings.ts +++ b/comps/md/utils/typings.ts @@ -33,6 +33,7 @@ export type MDActions = { export type MDLocalInternal = { name: string; + status: "init" | "unready" | "ready"; breadcrumb: BreadItem[]; actions: MDActions; selected: any; @@ -77,11 +78,12 @@ export type MDLocalInternal = { min_size: number; }; }; -export type MDRef = { PassProp: any; child: any }; +export type MDRef = { PassProp: any; item: PrasiItem }; export type MDLocal = MDLocalInternal & { render: (force?: boolean) => void }; export const MasterDetailType = `const md = { name: string; + status: "init" | "unready" | "ready"; breadcrumb: { label: React.ReactNode; url?: string;