From 287786e5484b6714c4ed8c654d4d0f96d3495c14 Mon Sep 17 00:00:00 2001 From: rizrmd Date: Tue, 18 Jun 2024 01:05:34 -0700 Subject: [PATCH] fix --- comps/filter/FilterField.tsx | 8 +- comps/form/field/table-edit/TableEdit.tsx | 1 - comps/form/field/type/TypeInput.tsx | 5 + comps/form/gen/gen-field.ts | 20 +- comps/list/TableList.tsx | 5 +- comps/md/gen/gen-table-list.ts | 10 +- comps/md/gen/md-list.ts | 8 +- comps/md/gen/mode-table-list.ts | 2 +- gen/gen_table_list/gen_table_list.tsx | 10 +- gen/master_detail/gen-list.ts | 4 +- gen/prop/gen_prop_fields.ts | 248 ++++++++++++++-------- 11 files changed, 203 insertions(+), 118 deletions(-) diff --git a/comps/filter/FilterField.tsx b/comps/filter/FilterField.tsx index ea41c28..335c06a 100755 --- a/comps/filter/FilterField.tsx +++ b/comps/filter/FilterField.tsx @@ -13,7 +13,8 @@ export const FilterField: FC<{ name?: string; label?: string; type: FilterFieldType; -}> = ({ filter, name, label, type }) => { + modifiers?: any[] +}> = ({ filter, name, label, type,modifiers }) => { const internal = useLocal({ render_timeout: null as any }); if (!name) return <>No Name; if (!filter.form) return
Loading...
; @@ -88,6 +89,11 @@ export const FilterField: FC<{ onBlur(e) { filter.form?.submit(); }, + onChange(val) { + if (!val) { + filter.form?.submit(); + } + }, }} /> diff --git a/comps/form/field/table-edit/TableEdit.tsx b/comps/form/field/table-edit/TableEdit.tsx index 45aa33a..651743a 100755 --- a/comps/form/field/table-edit/TableEdit.tsx +++ b/comps/form/field/table-edit/TableEdit.tsx @@ -83,7 +83,6 @@ export const TableEdit: FC<{ { const rh = local.rowHeight.get(row); - console.log(rh); if (rh) { for (const div of Object.values(rh)) { if (div.offsetHeight > 50) return div.offsetHeight + 6; diff --git a/comps/form/field/type/TypeInput.tsx b/comps/form/field/type/TypeInput.tsx index 3340d2d..99f57cc 100755 --- a/comps/form/field/type/TypeInput.tsx +++ b/comps/form/field/type/TypeInput.tsx @@ -29,6 +29,7 @@ export type PropTypeInput = { placeholder?: string; onFocus?: (e: FocusEvent) => void; onBlur?: (e: FocusEvent) => void; + onChange?: (val: string) => void; }; const parse = parser.exportAsFunctionAny("en-US"); @@ -153,6 +154,10 @@ export const FieldTypeInput: FC<{ fm.data[field.name] = ev.currentTarget.value; } renderOnChange(); + + if (prop.onChange) { + prop.onChange(fm.data[field.name]); + } }} placeholder={prop.placeholder || arg.placeholder || ""} value={value} diff --git a/comps/form/gen/gen-field.ts b/comps/form/gen/gen-field.ts index 6ee77eb..8b1e3d7 100755 --- a/comps/form/gen/gen-field.ts +++ b/comps/form/gen/gen-field.ts @@ -15,7 +15,7 @@ export const generateField = async ( | string | { value: string; checked: string[] } )[]; - if (["checkbox", "button"].includes(fieldType)) { + if (["checkbox", "button", "typeahead"].includes(fieldType)) { const fields = parseGenField(raw_fields); const res = generateSelect(fields); const master = fields.find( @@ -102,15 +102,15 @@ export const generateField = async ( let parent = {} as any; const fields = parseGenField(fm.props.gen_fields); const res = generateSelect(fields); - try { - parent = { - [fm.props.gen_table]: { - connect: { - [res.pk]: fm.data.id || null, - }, - }, - }; - } catch (e) {} + // try { + // parent = { + // [fm.props.gen_table]: { + // connect: { + // [res.pk]: fm.data.id || null, + // }, + // }, + // }; + // } catch (e) {} fm.data[name] = selected.map((e) => { return { ${master.name}: { diff --git a/comps/list/TableList.tsx b/comps/list/TableList.tsx index ada4c8e..8eeb3cc 100755 --- a/comps/list/TableList.tsx +++ b/comps/list/TableList.tsx @@ -49,7 +49,7 @@ type TableListProp = { on_init: (arg?: any) => any; mode: "table" | "list" | "grid" | "auto"; _item: PrasiItem; - __props: any; + __props?: any; gen_fields: string[]; row_click: OnRowClick; selected: SelectedRow; @@ -416,6 +416,7 @@ export const TableList: FC = ({ }, }); } + if (mode === "list") { if (columns.length > 1) columns = columns.slice(0, 0 + 1); } @@ -457,6 +458,7 @@ export const TableList: FC = ({ } } } + if (typeof value !== "undefined") { local.data = value; local.status = "ready" as any; @@ -484,6 +486,7 @@ export const TableList: FC = ({ if (id_parent && local.pk && local.sort.columns.length === 0) { data = sortTree(local.data, id_parent, local.pk.name); } + if (mode === "table") { return (
= 1 && arg.mode === "list") { return; } - if (e.is_pk && arg.mode === "table") return; + if (e.is_pk && (arg.mode === "table" || arg.mode === "auto")) return; let tree_depth = ""; let tree_depth_built = ""; if (first) { @@ -91,7 +91,11 @@ export const generateTableList = async ( adv: { js: `\
-${arg.mode === "list" ? "{JSON.stringify(row)}" : ``} +${ + arg.mode === "list" + ? "{JSON.stringify(row)}" + : `` +}
`, jsBuilt: `\ render(React.createElement("div", Object.assign({}, props, { className: cx(props.className, "") }),React.createElement(FormatValue, { value: col.value, name: col.name, gen_fields: gen__fields, ${tree_depth_built} }))); diff --git a/comps/md/gen/md-list.ts b/comps/md/gen/md-list.ts index f140744..464f3cd 100755 --- a/comps/md/gen/md-list.ts +++ b/comps/md/gen/md-list.ts @@ -29,6 +29,10 @@ export const generateList = async ( mode: "string", value: "", }, + mode: { + mode: "string", + value: "auto", + }, opt__row_click: { mode: "raw", value: `\ @@ -101,7 +105,7 @@ idx: any; async (props: any) => {}, props, tablelist, - { mode: "table" }, + { mode: "auto" }, false ); tab_master?.edit.setProp("breadcrumb", { @@ -119,7 +123,7 @@ idx: any; } `, }); - + tab_master?.edit.setChilds([ { type: "item", diff --git a/comps/md/gen/mode-table-list.ts b/comps/md/gen/mode-table-list.ts index f434a00..7e1dd7e 100755 --- a/comps/md/gen/mode-table-list.ts +++ b/comps/md/gen/mode-table-list.ts @@ -1,5 +1,5 @@ export const modeTableList = (mode: string) => { - let sub_name = "fields"; + let sub_name = "tbl-col"; switch (mode) { case "table": sub_name = "tbl-col"; diff --git a/gen/gen_table_list/gen_table_list.tsx b/gen/gen_table_list/gen_table_list.tsx index 927115d..8376f3d 100755 --- a/gen/gen_table_list/gen_table_list.tsx +++ b/gen/gen_table_list/gen_table_list.tsx @@ -4,9 +4,9 @@ import { on_load } from "./on_load"; import { codeBuild } from "../master_detail/utils"; export const gen_table_list = async ( - modify: (data: any) => void, + modify: (data: any) => void, data: any, - arg: { mode: "table" | "list" | "grid" | "auto"; id_parent?: string} + arg: { mode: "table" | "list" | "grid" | "auto"; id_parent?: string } ) => { const table = JSON.parse(data.gen_table.value) as string; const raw_fields = JSON.parse(data.gen_fields.value) as ( @@ -16,7 +16,7 @@ export const gen_table_list = async ( const select = {} as any; let pk = ""; let pks: Record = {}; - + const fields = parseGenField(raw_fields); const result = {} as any; for (const f of fields) { @@ -56,6 +56,7 @@ export const gen_table_list = async ( let sub_name = "fields"; switch (arg.mode) { case "table": + case "auto": sub_name = "tbl-col"; break; case "list": @@ -77,7 +78,8 @@ export const gen_table_list = async ( if (idx >= 1 && arg.mode === "list") { return; } - if (e.is_pk && arg.mode === "table") return; + if (e.is_pk && (arg.mode === "table" || arg.mode === "auto")) + return; let tree_depth = ""; let tree_depth_built = ""; if (first) { diff --git a/gen/master_detail/gen-list.ts b/gen/master_detail/gen-list.ts index dc7df5e..ac26b64 100755 --- a/gen/master_detail/gen-list.ts +++ b/gen/master_detail/gen-list.ts @@ -5,7 +5,6 @@ import { gen_table_list } from "../gen_table_list/gen_table_list"; export const genList = async (arg: GenMasterDetailArg, data: any) => { for (const c of get(data, "child.content.childs") || []) { if (c.component?.id === "c68415ca-dac5-44fe-aeb6-936caf8cc491") { - const res = await codeBuild({ row_click: `\ ({ row, rows, idx, event }: OnRowClick) => { @@ -113,9 +112,10 @@ type ActionItem = }, }) ); + const data = childs[0].component.props; const modify = async (props: any) => {}; - gen_table_list(modify, data, { mode: "table" }); + gen_table_list(modify, data, { mode: "auto" }); } } }; diff --git a/gen/prop/gen_prop_fields.ts b/gen/prop/gen_prop_fields.ts index c257033..7201d02 100755 --- a/gen/prop/gen_prop_fields.ts +++ b/gen/prop/gen_prop_fields.ts @@ -39,7 +39,7 @@ const load_single = async (table: string) => { } return single[table]; }; -export const gen_prop_fields = async (gen_table: string) => { +export const gen_prop_fields = async (gen_table: string, depth?: number) => { if (typeof db === "undefined") return ["- No Database -"]; const path = window.location.pathname; @@ -51,98 +51,103 @@ export const gen_prop_fields = async (gen_table: string) => { } const schema = getSchemaOnStorage(id_site, gen_table); if (!schema) { - const result: { - label: string; - value: string; - options?: any[]; - checked?: boolean; - }[] = []; - const { cols, rels } = await load_single(gen_table); - if (cols) { - for (const [k, v] of Object.entries(cols) as any) { - result.push({ - value: JSON.stringify({ - name: k, - is_pk: v.is_pk, - type: v.db_type || v.type, - optional: v.optional, - }), - label: k, - checked: v.is_pk, - }); - } - } - if (rels) { - for (const [k, v] of Object.entries(rels)) { - let options = []; - const to = v.to; - const from = v.from; - const parent_name = k; - const parent_rel = v; - if (to) { - const { cols, rels } = await load_single(to.table); - if (cols) { - for (const [k, v] of Object.entries(cols)) { - options.push({ - value: JSON.stringify({ - name: k, - is_pk: v.is_pk, - type: v.db_type || v.type, - optional: v.optional, - }), - label: k, - checked: v.is_pk, - }); - } - } - if (rels) { - for (const [k, v] of Object.entries(rels)) { - let sub_opt = []; - const to = v.to; - const from = v.from; - const { cols } = await load_single(v.to.table); - for (const [k, v] of Object.entries(cols)) { - sub_opt.push({ - value: JSON.stringify({ - name: k, - is_pk: v.is_pk, - type: v.db_type || v.type, - optional: v.optional, - }), - label: k, - checked: v.is_pk, - }); - } - options.push({ - value: JSON.stringify({ - name: k, - is_pk: false, - type: v.type, - optional: true, - relation: { from, to }, - }), - label: k, - options: sub_opt, - checked: - parent_rel.type === "has-many" && - parent_rel.from.table === v.to.table, - }); - } - } - } - result.push({ - value: JSON.stringify({ - name: k, - is_pk: false, - type: v.type, - optional: true, - relation: { from, to }, - }), - label: k, - options, - }); - } - } + // const result: { + // label: string; + // value: string; + // options?: any[]; + // checked?: boolean; + // }[] = []; + const result = await load_layer_schema( + typeof depth === "undefined" ? 3 : depth, + {}, + gen_table + ); + // const { cols, rels } = await load_single(gen_table); + // if (cols) { + // for (const [k, v] of Object.entries(cols) as any) { + // result.push({ + // value: JSON.stringify({ + // name: k, + // is_pk: v.is_pk, + // type: v.db_type || v.type, + // optional: v.optional, + // }), + // label: k, + // checked: v.is_pk, + // }); + // } + // } + // if (rels) { + // for (const [k, v] of Object.entries(rels)) { + // let options = [] as any; + // const to = v.to; + // const from = v.from; + // const parent_name = k; + // const parent_rel = v; + // if (to) { + // const { cols, rels } = await load_single(to.table); + // // if (cols) { + // // for (const [k, v] of Object.entries(cols)) { + // // options.push({ + // // value: JSON.stringify({ + // // name: k, + // // is_pk: v.is_pk, + // // type: v.db_type || v.type, + // // optional: v.optional, + // // }), + // // label: k, + // // checked: v.is_pk, + // // }); + // // } + // // } + // // if (rels) { + // // for (const [k, v] of Object.entries(rels)) { + // // let sub_opt = []; + // // const to = v.to; + // // const from = v.from; + // // const { cols } = await load_single(v.to.table); + // // for (const [k, v] of Object.entries(cols)) { + // // sub_opt.push({ + // // value: JSON.stringify({ + // // name: k, + // // is_pk: v.is_pk, + // // type: v.db_type || v.type, + // // optional: v.optional, + // // }), + // // label: k, + // // checked: v.is_pk, + // // }); + // // } + // // options.push({ + // // value: JSON.stringify({ + // // name: k, + // // is_pk: false, + // // type: v.type, + // // optional: true, + // // relation: { from, to }, + // // }), + // // label: k, + // // options: sub_opt, + // // checked: + // // parent_rel.type === "has-many" && + // // parent_rel.from.table === v.to.table, + // // }); + // // } + // // } + // } + // result.push({ + // value: JSON.stringify({ + // name: k, + // is_pk: false, + // type: v.type, + // optional: true, + // relation: { from, to }, + // }), + // label: k, + // options, + // }); + // } + // } try { saveSchemaOnStorage(result, id_site, gen_table); } catch (e: any) { @@ -153,7 +158,64 @@ export const gen_prop_fields = async (gen_table: string) => { return schema; } }; +const load_layer_schema = async (depth: number, arg: any, table: string) => { + let current_depth = 1; + console.log({ depth, current_depth, arg, table }); + const result = await get_layer(depth, current_depth, arg, table); + console.log({ result }); + return result; +}; +const get_layer = async ( + depth: number, + current: number, + arg: any, + table: string +) => { + const { cols, rels } = await load_single(table); + const options = []; + if (cols) { + for (const [k, v] of Object.entries(cols)) { + options.push({ + value: JSON.stringify({ + name: k, + is_pk: v.is_pk, + type: v.db_type || v.type, + optional: v.optional, + }), + label: k, + checked: v.is_pk, + }); + } + } + if (current < depth) { + if (rels) { + for (const [k, v] of Object.entries(rels)) { + const to = v.to; + const from = v.from; + const r_rels = (await get_layer( + depth, + current + 1, + arg, + v.to.table + )) as any; + options.push({ + value: JSON.stringify({ + name: k, + is_pk: false, + type: v.type, + optional: true, + relation: { from, to }, + }), + label: k, + options: r_rels, + checked: false, + }); + } + } + } + return options; +}; const saveSchemaOnStorage = (res: any, id_site: string, table: string) => { let schemaSite = null; let schema_master_detail: Record = {};