This commit is contained in:
rizrmd 2024-06-18 01:05:34 -07:00
parent 46aeccc7f9
commit 287786e548
11 changed files with 203 additions and 118 deletions

View File

@ -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 <div>Loading...</div>;
@ -88,6 +89,11 @@ export const FilterField: FC<{
onBlur(e) {
filter.form?.submit();
},
onChange(val) {
if (!val) {
filter.form?.submit();
}
},
}}
/>
</div>

View File

@ -83,7 +83,6 @@ export const TableEdit: FC<{
<TableList
row_height={(row) => {
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;

View File

@ -29,6 +29,7 @@ export type PropTypeInput = {
placeholder?: string;
onFocus?: (e: FocusEvent<HTMLDivElement>) => void;
onBlur?: (e: FocusEvent<HTMLDivElement>) => 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}

View File

@ -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}: {

View File

@ -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<TableListProp> = ({
},
});
}
if (mode === "list") {
if (columns.length > 1) columns = columns.slice(0, 0 + 1);
}
@ -457,6 +458,7 @@ export const TableList: FC<TableListProp> = ({
}
}
}
if (typeof value !== "undefined") {
local.data = value;
local.status = "ready" as any;
@ -484,6 +486,7 @@ export const TableList: FC<TableListProp> = ({
if (id_parent && local.pk && local.sort.columns.length === 0) {
data = sortTree(local.data, id_parent, local.pk.name);
}
if (mode === "table") {
return (
<div

View File

@ -64,7 +64,7 @@ export const generateTableList = 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) {
@ -91,7 +91,11 @@ export const generateTableList = async (
adv: {
js: `\
<div {...props} className={cx(props.className, "")}>
${arg.mode === "list" ? "{JSON.stringify(row)}" : `<FormatValue value={col.value} name={col.name} gen_fields={gen__fields} ${tree_depth} />`}
${
arg.mode === "list"
? "{JSON.stringify(row)}"
: `<FormatValue value={col.value} name={col.name} gen_fields={gen__fields} ${tree_depth} />`
}
</div>`,
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} })));

View File

@ -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", {

View File

@ -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";

View File

@ -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) {

View File

@ -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" });
}
}
};

View File

@ -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<string, any> = {};