This commit is contained in:
rizrmd 2024-05-28 00:31:07 -07:00
parent aa1a2225f5
commit 730fba3210
17 changed files with 580 additions and 112 deletions

View File

@ -75,6 +75,7 @@ export const TypeDropdown: FC<{
if (item[input.pk] === val) { if (item[input.pk] === val) {
fm.data[field.name] = val; fm.data[field.name] = val;
fm.render(); fm.render();
arg.on_change({value: item})
break; break;
} }
} }

View File

@ -0,0 +1,10 @@
import type * as exceljs from "exceljs";
export type ExcelJS = typeof exceljs;
const w = window as unknown as {
_exceljs: any;
};
export const importExcelJs = async (): Promise<ExcelJS> => {
if (w._exceljs) return w._exceljs;
w._exceljs = await import("exceljs");
return w._exceljs;
};

View File

@ -1,4 +1,26 @@
export const generateMasterDetail = async (item: PrasiItem) => { import { GenFn } from "lib/gen/utils";
import { generateList } from "./md-list";
const w = window as unknown as {
generating_prasi_md: Record<string, true>;
};
export const generateMasterDetail: GenFn<{ item: PrasiItem, table: string, fields: any }> = async (
modify,
data,
arg
) => {
const {item} = arg;
// loading generate MD
w.generating_prasi_md = {
master_detail: true,
};
await generateList(arg, data);
// const result: any = {};
// modify(result);
const childs = item.edit.childs[0].edit.childs; const childs = item.edit.childs[0].edit.childs;
const master = childs.find( const master = childs.find(
@ -9,7 +31,6 @@ export const generateMasterDetail = async (item: PrasiItem) => {
master.edit.setProp("on_init", { master.edit.setProp("on_init", {
mode: "raw", mode: "raw",
value: `async (text: string) => { value: `async (text: string) => {
alert("ASdas");
}`, }`,
}); });

283
comps/md/gen/md-list.ts Executable file
View File

@ -0,0 +1,283 @@
import { createItem } from "lib/gen/utils";
import get from "lodash.get";
export const generateList = async (
arg: { item: PrasiItem; table: string; fields: any },
data: any
) => {
console.log({ item: arg.item });
const item = arg.item;
const tab_master = item.edit.childs[0].edit.childs.find(
(e) => get(e, "component.id") === "c68415ca-dac5-44fe-aeb6-936caf8cc491"
);
const childs = get(tab_master, "edit.props.child.value") as PrasiItem;
console.log({ tab_master });
const new_item = createItem({
name: "halo item",
});
console.log({ item });
const md = createItem({
component: {
id: "567d5362-2cc8-4ca5-a531-f771a5c866c2",
props: {
name: arg.table,
gen_table: arg.table,
generate: "y",
on_load: "",
row_click: "",
selected: "",
gen_fields: [JSON.stringify(arg.fields)],
child: {
childs: [],
},
},
},
});
console.log({ md });
console.log({ new_item });
// tab_master?.edit.setProp("child", {
// type: "jsx",
// value: new_item
// })
// console.log({new_item})
// childs.edit.childs.push(new_item);
console.log(`\
[${JSON.stringify(arg.fields)}]
`)
childs.edit.setChilds([{
type: "item",
name: "item",
component: {
id: "567d5362-2cc8-4ca5-a531-f771a5c866c2",
props: {
name: {
mode: "string",
value: arg.table
},
generate:{
mode: "string",
value: "y"
},
on_load: {
mode: "string",
value: ""
},
row_click: {
mode: "raw",
value:`\
({ row, rows, idx, event }: OnRowClick) => {
md.selected = row;
md.internal.action_should_refresh = true;
md.params.apply();
md.render();
};
type OnRowClick = {
row: any;
rows: any[];
idx: any;
event: React.MouseEvent<HTMLDivElement, MouseEvent>;
}
`
},
selected: {
mode: "raw",
value: `\
({ row, rows, idx }: SelectedRow) => {
try {
if (typeof md === "object") {
if (Array.isArray(md.selected)) {
if (md.selected.length) {
let select = md.selected.find((e) => e === row)
if(select) return true
}
} else {
if (md.selected === row) {
return true;
}
}
}
} catch (e) {
}
return false;
};
type SelectedRow = {
row: any;
rows: any[];
idx: any;
}`
},
},
}
}]);
await item.edit.commit();
// childs.edit.childs[0].edit.setProp("selected", {
// mode: "raw",
// value: `\
// ({ row, rows, idx }: SelectedRow) => {
// try {
// if (typeof md === "object") {
// if (Array.isArray(md.selected)) {
// if (md.selected.length) {
// let select = md.selected.find((e) => e === row)
// if(select) return true
// }
// } else {
// if (md.selected === row) {
// return true;
// }
// }
// }
// } catch (e) {
// }
// return false;
// };
// type SelectedRow = {
// row: any;
// rows: any[];
// idx: any;
// }`,
// });
// childs.edit.childs[0].edit.setProp("row_click", {
// mode: "raw",
// value: `\
// ({ row, rows, idx, event }: OnRowClick) => {
// md.selected = row;
// md.internal.action_should_refresh = true;
// md.params.apply();
// md.render();
// };
// type OnRowClick = {
// row: any;
// rows: any[];
// idx: any;
// event: React.MouseEvent<HTMLDivElement, MouseEvent>;
// }
// `,
// });
// await item.edit.commit();
// console.log("halo");
// console.log({tab_master})
// // 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) => {
// md.selected = row;
// md.internal.action_should_refresh = true;
// md.params.apply();
// md.render();
// };
// type OnRowClick = {
// row: any;
// rows: any[];
// idx: any;
// event: React.MouseEvent<HTMLDivElement, MouseEvent>;
// }
// `,
// selected: `\
// ({ row, rows, idx }: SelectedRow) => {
// try {
// if (typeof md === "object") {
// if (Array.isArray(md.selected)) {
// if (md.selected.length) {
// let select = md.selected.find((e) => e === row)
// if(select) return true
// }
// } else {
// if (md.selected === row) {
// return true;
// }
// }
// }
// } catch (e) {
// }
// return false;
// };
// type SelectedRow = {
// row: any;
// rows: any[];
// idx: any;
// }`,
// breadcrumb: `\
// async () => {
// return [{ label: "List ${formatName(arg.gen_table)}" }] as BreadItem[];
// };
// type BreadItem = {
// label: React.ReactNode;
// url?: string;
// onClick?: () => void;
// }`,
// actions: `\
// async () => {
// return [
// {
// label: "Add ${formatName(arg.gen_table)}",
// onClick: async () => {
// md.selected = {};
// md.render();
// },
// },
// ] as ActionItem[];
// };
// type ActionItem =
// | {
// action?: string;
// label: React.ReactNode;
// onClick?: (e: any) => Promise<void>;
// }
// | React.ReactNode`,
// });
// const comp = createItem({
// component: {
// id: "c68415ca-dac5-44fe-aeb6-936caf8cc491",
// props: {
// breadcrumb: res.breadcrumb,
// actions: res.actions,
// },
// },
// });
// for (const [k, v] of Object.entries(comp.component.props)) {
// c.component.props[k] = v;
// }
// const childs = get(c, "component.props.child.content.childs") || [];
// childs.length = 0;
// childs.push(
// createItem({
// component: {
// id: "567d5362-2cc8-4ca5-a531-f771a5c866c2",
// props: {
// name: arg.gen_table,
// gen_table: arg.gen_table,
// generate: "y",
// on_load: "",
// row_click: res.row_click,
// selected: res.selected,
// gen_fields: [JSON.stringify(arg.gen_fields)],
// child: {
// childs: [],
// },
// },
// },
// })
// );
// const data = childs[0].component.props;
// const modify = async (props: any) => {};
// gen_table_list(modify, data, { mode: "table" });
// }
// }
};

11
comps/md/utils/md-typings.ts Executable file
View File

@ -0,0 +1,11 @@
import { PropOptRaw } from "lib/gen/utils";
export type GenMasterDetailArg = {
mode: "full" | "h-split" | "v-split";
show_head: "always" | "only-master" | "only-child" | "hidden";
tab_mode: "h-tab" | "v-tab" | "hidden";
gen_feature: PropOptRaw;
gen_table: string;
gen_fields: PropOptRaw;
child:any
};

View File

@ -4,7 +4,6 @@ import { lazify } from "./utils/lazify";
export const MasterDetail = lazify( export const MasterDetail = lazify(
async () => (await import("@/comps/md/MasterDetail")).MasterDetail async () => (await import("@/comps/md/MasterDetail")).MasterDetail
); );
export const MDRenderMaster = lazify( export const MDRenderMaster = lazify(
async () => (await import("@/comps/md/parts/MDMaster")).MDRenderMaster async () => (await import("@/comps/md/parts/MDMaster")).MDRenderMaster
); );

View File

@ -1,13 +0,0 @@
// export { Card } from "@/comps/custom/Card";
// export { Detail } from "@/comps/custom/Detail";
// export { Tab } from "@/comps/custom/Tab";
// export { icon } from "@/comps/icon";
// export { Slider } from "@/comps/ui/slider";
// export * from "@/utils/date";
// export { Button, FloatButton } from "@/comps/ui/button";
// export { getPathname } from "@/utils/pathname";
// export { Breadcrumb } from "./comps/custom/Breadcrumb";
// export { Header } from "./comps/custom/Header";
// export { Carousel } from "./comps/custom/Carousel";
// export { Tree } from "./comps/list/Tree";
// export { MasterFilter } from "./comps/filter/Filter"

View File

@ -0,0 +1,176 @@
import capitalize from "lodash.capitalize";
import { GFCol, createItem, parseGenField } from "../utils";
import { on_load } from "./on_load";
import { codeBuild } from "../master_detail/utils";
export const generateTableList = async (
modify: (data: any) => void,
data: any,
item: PrasiItem,
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 (
| string
| { value: string; checked: string[] }
)[];
const select = {} as any;
let pk = "";
let pks: Record<string, string> = {};
const fields = parseGenField(raw_fields);
const result = {} as any;
for (const f of fields) {
select[f.name] = true;
if (f.relation) {
select[f.name] = {
select: {},
};
for (const r of f.relation.fields) {
select[f.name].select[r.name] = true;
}
}
if (f.is_pk) {
pk = f.name;
}
}
if (arg.id_parent) {
select[arg.id_parent] = true;
}
if (!pk) {
alert("Failed to generate! Primary Key not found. ");
return;
}
if (pk) {
const code = {} as any;
if (data["on_load"]) {
result["on_load"] = data["on_load"];
result["on_load"].value = on_load({ pk, table, select, pks });
delete result["on_load"].valueBuilt;
code.on_load = result["on_load"].value;
}
if (data["child"]) {
result["child"] = data["child"];
let sub_name = "fields";
switch (arg.mode) {
case "table":
sub_name = "tbl-col";
break;
case "list":
sub_name = "md-list";
break;
}
result["child"].content.childs = result["child"].content.childs.filter(
(e: any) => {
return e.name !== sub_name;
}
);
let first = true;
const child = createItem({
name: sub_name,
childs: fields
.map((e, idx) => {
if (idx >= 1 && arg.mode === "list") {
return;
}
if (e.is_pk && arg.mode === "table") return;
let tree_depth = "";
let tree_depth_built = "";
if (first) {
tree_depth = `tree_depth={col.depth}`;
tree_depth_built = `tree_depth:col.depth`;
first = false;
}
return {
component: {
id: "297023a4-d552-464a-971d-f40dcd940b77",
props: {
name: e.name,
title: formatName(e.name),
child: createItem({
childs: [
createItem({
name: "cell",
padding: {
l: 8,
b: 0,
t: 0,
r: 8,
},
adv: {
js: `\
<div {...props} className={cx(props.className, "")}>
<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} })));
`,
},
}),
],
}),
},
},
};
})
.filter((e) => e) as any,
});
result["child"].content.childs = [
child,
...result["child"].content.childs,
];
}
// detect row yang aktif
if (data["selected"]) {
result["selected"] = data["selected"];
result["selected"].value = `\
({ row, rows, idx }: SelectedRow) => {
try {
if (typeof md === "object") {
if (Array.isArray(md.selected)) {
if (md.selected.length) {
let select = md.selected.find((e) => e === row)
if(select) return true
}
} else {
if (md.selected === row) {
return true;
}
}
}
} catch (e) {
}
return false;
};
type SelectedRow = {
row: any;
rows: any[];
idx: any;
}`;
delete result["selected"].valueBuilt;
code.selected = result["selected"].value;
}
const res = await codeBuild(code);
for (const [k, v] of Object.entries(res)) {
result[k].valueBuilt = v[1];
}
}
modify(result);
};
const formatName = (name: string) => {
return name
.split("_")
.filter((e) => e.length > 1)
.map((e) => capitalize(e))
.join(" ");
};

View File

@ -35,5 +35,4 @@ export const gen_master_detail: GenFn<GenMasterDetailArg> = async (
delete w.generating_prasi_md["master_detail"]; delete w.generating_prasi_md["master_detail"];
modify(result); modify(result);
}; };

View File

@ -2,7 +2,6 @@ import { gen_action } from "./gen_action/gen_action";
import { gen_form } from "./gen_form/gen_form"; import { gen_form } from "./gen_form/gen_form";
import { gen_relation } from "./gen_relation/gen_relation"; import { gen_relation } from "./gen_relation/gen_relation";
import { gen_table_list } from "./gen_table_list/gen_table_list"; import { gen_table_list } from "./gen_table_list/gen_table_list";
import { gen_export } from "./gen_table_list/gen_export";
import { gen_master_detail } from "./master_detail/gen"; import { gen_master_detail } from "./master_detail/gen";
import { gen_prop_fields } from "./prop/gen_prop_fields"; import { gen_prop_fields } from "./prop/gen_prop_fields";
import { gen_props_table } from "./prop/gen_prop_table"; import { gen_props_table } from "./prop/gen_prop_table";
@ -12,7 +11,6 @@ export const prasi_gen = {
actions_tab: gen_action, actions_tab: gen_action,
master_detail: gen_master_detail, master_detail: gen_master_detail,
table_list: gen_table_list, table_list: gen_table_list,
export_excel: gen_export,
form: gen_form, form: gen_form,
relation: gen_relation, relation: gen_relation,
prop: { prop: {

View File

@ -1,4 +1,5 @@
import get from "lodash.get"; import get from "lodash.get";
import { select } from "./select";
type typeFieldLogin = { type typeFieldLogin = {
username: string; username: string;
@ -19,57 +20,55 @@ export const generateLogin = async (
(e: any) => (e: any) =>
get(e, "component.id") !== "32550d01-42a3-4b15-a04a-2c2d5c3c8e67" 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[1].edit.setProp("name", field.password)
let rels = { ...rel };
try {
delete rels[field.password];
} catch (e) {}
const field_select = select(rels);
item.edit.childs[0].edit.childs[0].edit.setProp("on_submit", {
mode: "raw",
value: `\
async ({ form, error }: IForm) => {
const user = await db.m_user.findFirst({
where: {
username: form.${field.username},
},
select: {
id: true,
${field.username}: true,
${field.password}: true
}
});
if(user){
const same = await password.match(form.${field.password}, user.${
field.password
});
if(same){
const data_user = await db.m_user.findFirst({
where: {
${field.username}: form.${field.username}
},
select: ${JSON.stringify(field_select)}
});
if (data_user) {
registerSession({ data: data_user, expired: null });
const home = prasi_user.prasi_home[prasi_user.user.m_role.name];
navigate(home);
}
}else{
alert("password salah");
}
// form.edit.childs[0].edit.setProp("name", field.username) }else{
// // form.edit.childs[1].edit.setProp("name", field.password) alert("user belum terdaftar")
// let rels = { ...rel }; }
// try {
// delete rels[field.password];
// } catch (e) {}
// const field_select = select(rels);
// item.edit.childs[0].edit.childs[0].edit.setProp("on_submit", {
// mode: "raw",
// value: `\
// async ({ form, error }: IForm) => {
// const user = await db.m_user.findFirst({
// where: {
// username: form.${field.username},
// },
// select: {
// id: true,
// ${field.username}: true,
// ${field.password}: true
// }
// });
// if(user){
// const same = await password.match(form.${field.password}, user.${
// field.password
// });
// if(same){
// const data_user = await db.m_user.findFirst({
// where: {
// ${field.username}: form.${field.username}
// },
// select: ${JSON.stringify(field_select)}
// });
// if (data_user) {
// registerSession({ data: data_user, expired: null });
// const home = prasi_user.prasi_home[prasi_user.user.m_role.name];
// navigate(home);
// }
// }else{
// alert("password salah");
// }
// }else{ };
// alert("user belum terdaftar")
// }
// }; type IForm = { form: any; error: Record<string, string> }
`,
// type IForm = { form: any; error: Record<string, string> } });
// `,
// });
await item.edit.commit(); await item.edit.commit();
}; };

View File

@ -6,7 +6,6 @@ const parse = parser.exportAsFunctionAny("en-US");
export const loadSession = (url_login?: string) => { export const loadSession = (url_login?: string) => {
try { try {
const user = localStorage.getItem("user"); const user = localStorage.getItem("user");
console.log({user})
if (user) { if (user) {
const raw = JSON.parse(user); const raw = JSON.parse(user);
w.user = raw.data; w.user = raw.data;

View File

@ -1,3 +1,4 @@
import { getPathname } from "lib/utils/pathname";
import get from "lodash.get"; import get from "lodash.get";
const w = window as any; const w = window as any;
@ -7,11 +8,14 @@ export type RGSession = {
}; };
export const logout = (url_login?: string) => { export const logout = (url_login?: string) => {
if(typeof get(w, "user") === "object"){ console.log("halo")
if (typeof get(w, "user") === "object") {
w.user = null; w.user = null;
} }
if(localStorage.getItem("user")){ if (localStorage.getItem("user")) {
localStorage.removeItem("user"); localStorage.removeItem("user");
} }
if(url_login) navigate(url_login); if (!getPathname().startsWith("/dev")) {
}; if (url_login) navigate(url_login);
}
};

View File

@ -62,8 +62,6 @@ export const Layout: FC<LYTChild> = (props) => {
fn(); fn();
const path = getPathname(); const path = getPathname();
const no_layout = props.exception; const no_layout = props.exception;
console.log({no_layout})
console.log(props.defaultLayout)
if (Array.isArray(no_layout)) if (Array.isArray(no_layout))
if (no_layout.length) { if (no_layout.length) {
if (no_layout.includes(path)) { if (no_layout.includes(path)) {

View File

@ -16,11 +16,12 @@ export const Menu: FC<MenuProp> = (props) => {
cache: false, cache: false,
active: null as any, active: null as any,
mode: "full" as "full" | "mini", mode: "full" as "full" | "mini",
}); });
useEffect(() => { useEffect(( )=>{
local.mode = props.mode; local.mode = props.mode;
local.render(); local.render();
}, [props.mode]); }, [props.mode])
if (!local.open.length && !local.cache) { if (!local.open.length && !local.cache) {
const result = findChildMenu(menu, (e: any) => e[2] === pathname); const result = findChildMenu(menu, (e: any) => e[2] === pathname);
if (Array.isArray(result)) { if (Array.isArray(result)) {
@ -30,6 +31,9 @@ export const Menu: FC<MenuProp> = (props) => {
local.render(); local.render();
} }
} }
const styles = props.style;
const PassProp = props.PassProp;
return ( return (
<div <div
className={cx( className={cx(
@ -37,25 +41,16 @@ export const Menu: FC<MenuProp> = (props) => {
"c-h-full c-w-full c-flex c-flex-col c-flex-grow c-px-3 c-py-4 c-overflow-y-auto c-rounded " "c-h-full c-w-full c-flex c-flex-col c-flex-grow c-px-3 c-py-4 c-overflow-y-auto c-rounded "
)} )}
> >
<div <div className="c-px-2 c-py-2" onClick={async () => {
className="c-px-2 c-py-2" const item = props.item;
onClick={async () => { // item.edit.setProp("mode", props.mode === "mini" ? "full": "mini");
const item = props.item; // await item.edit.commit();
// item.edit.setProp("mode", props.mode === "mini" ? "full": "mini"); local.mode = local.mode === "mini" ? "full": "mini";
// await item.edit.commit(); local.render();
local.mode = local.mode === "mini" ? "full" : "mini"; }}>
local.render();
}}
>
{/* {icon.hamburger} */} {/* {icon.hamburger} */}
</div> </div>
<SideBar <SideBar data={menu} local={local} pm={props} depth={0} mode={local.mode}/>
data={menu}
local={local}
pm={props}
depth={0}
mode={local.mode}
/>
</div> </div>
); );
}; };

View File

@ -8,7 +8,8 @@ export type MenuProp = {
PassProp: any; PassProp: any;
child: ReactNode; child: ReactNode;
mode: "full" | "mini"; mode: "full" | "mini";
item: PrasiItem item: PrasiItem;
style: "navbar" | "sidebar"
}; };
export type MenuActive = { export type MenuActive = {
data: any; data: any;

View File

@ -1,6 +1,9 @@
import { FC, lazy } from "react"; import { FC, lazy } from "react";
export const lazify = <T extends FC<any>>(fn: () => Promise<T>): T => { export const lazify = <T extends FC<any>>(
fn: () => Promise<T>,
note?: string
): T => {
return lazy(async () => { return lazy(async () => {
const result = await fn(); const result = await fn();
return { return {
@ -8,19 +11,3 @@ export const lazify = <T extends FC<any>>(fn: () => Promise<T>): T => {
}; };
}) as any; }) as any;
}; };
// export const lazify = <
// MAPS extends {
// [NAME in string]: () => Promise<FC<any>>;
// }
// >(
// maps: MAPS
// ) => {
// type KEYS = keyof MAPS;
// const result: any = {};
// for (const [k, v] of Object.entries(maps)) {
// result[k] = single_lazy(v);
// }
// return result as { [K in KEYS]: Awaited<ReturnType<MAPS[K]>> };
// };