fix

comps/form/field/type/TypeDropdown.tsx

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

comps/list/utils/import-exceljs.ts

@@ -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;
+};

comps/md/gen/md-gen.ts

@@ -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 master = childs.find(
@@ -9,7 +31,6 @@ export const generateMasterDetail = async (item: PrasiItem) => {
     master.edit.setProp("on_init", {
       mode: "raw",
       value: `async (text: string) => {
-        alert("ASdas");
       }`,
     });
 

comps/md/gen/md-list.ts

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

comps/md/utils/md-typings.ts

@@ -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
+};

exports.ts

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

exports.tsx

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

gen/gen_table_list/generateTableList.tsx

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

gen/master_detail/gen.ts

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

gen/prasi_gen.ts

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

preset/login/utils/generate.ts

@@ -1,4 +1,5 @@
 import get from "lodash.get";
+import { select } from "./select";
 
 type typeFieldLogin = {
   username: string;
@@ -19,57 +20,55 @@ export const generateLogin = async (
     (e: any) =>
       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();
 };

preset/login/utils/load.ts

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

preset/login/utils/logout.ts

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

preset/menu/Layout.tsx

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

preset/menu/Menu.tsx

@@ -16,11 +16,12 @@ export const Menu: FC<MenuProp> = (props) => {
     cache: false,
     active: null as any,
     mode: "full" as "full" | "mini",
+    
   });
-  useEffect(() => {
+  useEffect(( )=>{
     local.mode = props.mode;
     local.render();
-  }, [props.mode]);
+  }, [props.mode])
   if (!local.open.length && !local.cache) {
     const result = findChildMenu(menu, (e: any) => e[2] === pathname);
     if (Array.isArray(result)) {
@@ -30,6 +31,9 @@ export const Menu: FC<MenuProp> = (props) => {
       local.render();
     }
   }
+
+  const styles = props.style;
+  const PassProp = props.PassProp;
   return (
     <div
       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 "
       )}
     >
-      <div
+      <div className="c-px-2 c-py-2" onClick={async () => {
-        className="c-px-2 c-py-2"
-        onClick={async () => {
         const item = props.item;
         // item.edit.setProp("mode", props.mode === "mini" ? "full": "mini");
         // await item.edit.commit();
-          local.mode = local.mode === "mini" ? "full" : "mini";
+        local.mode = local.mode === "mini" ? "full": "mini";
         local.render();
-        }}
+      }}>
-      >
         {/* {icon.hamburger} */}
       </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>
   );
 };

preset/menu/utils/type-menu.ts

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

utils/lazify.tsx

@@ -1,6 +1,9 @@
 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 () => {
     const result = await fn();
     return {
@@ -8,19 +11,3 @@ export const lazify = <T extends FC<any>>(fn: () => Promise<T>): T => {
     };
   }) 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]>> };
-// };