This commit is contained in:
Rizky 2024-07-12 09:05:54 -07:00
parent a8a82d33b2
commit 14436ead89
16 changed files with 120 additions and 60 deletions

View File

@ -285,11 +285,13 @@ const Input: React.FC<Props> = (e: Props) => {
return (
<>
{disabled ? (
<div className={getClassName()}>{inputText}</div>
) : (
<input
ref={inputRef}
type="text"
className={getClassName()}
disabled={disabled}
readOnly={readOnly}
placeholder={
placeholder
@ -306,7 +308,9 @@ const Input: React.FC<Props> = (e: Props) => {
onChange={handleInputChange}
onKeyDown={handleInputKeyDown}
/>
)}
{!disabled && (
<button
type="button"
ref={buttonRef}
@ -315,6 +319,7 @@ const Input: React.FC<Props> = (e: Props) => {
>
{renderToggleIcon(inputText == null || !inputText?.length)}
</button>
)}
</>
);
};

View File

@ -146,13 +146,11 @@ export const Form: FC<FMProps> = (props) => {
if (fm.status === "resizing") {
fm.status = "ready";
}
return (
<form
onSubmit={(e) => {
e.preventDefault();
e.stopPropagation();
console.log("HALOO");
fm.submit();
}}
ref={(el) => {

View File

@ -8,7 +8,6 @@ import { validate } from "../utils/validate";
export const Field: FC<FieldProp> = (arg) => {
const showlabel = arg.show_label || "y";
let sub_type: any = arg.sub_type; // tipe field
const { fm } = arg;

View File

@ -17,7 +17,7 @@ export const Label: FC<{ field: FieldLocal; fm: FMLocal }> = ({
<span className={cx(errors.length > 0 && `c-text-red-600`)}>
{field.label}
</span>
{field.required && (
{field.required && !field.disabled && (
<span className="c-text-red-600 c-mb-2 c-ml-1">
<svg
xmlns="http://www.w3.org/2000/svg"

View File

@ -27,7 +27,8 @@ export type PropTypeInput = {
| "upload"
| "file"
| "search"
| "password";
| "password"
| "import";
placeholder?: string;
onFocus?: (e: FocusEvent<HTMLDivElement>) => void;
onBlur?: (e: FocusEvent<HTMLDivElement>) => void;
@ -102,7 +103,6 @@ export const FieldTypeInput: FC<{
const disabled =
typeof field.disabled === "function" ? field.disabled() : field.disabled;
switch (type_field) {
case "toggle":
return (
@ -174,6 +174,15 @@ export const FieldTypeInput: FC<{
on_change={arg.on_change}
/>
);
case "import":
return (
<FieldUpload
field={field}
fm={fm}
prop={prop}
on_change={arg.on_change}
/>
);
case "money":
return (
<>
@ -182,7 +191,7 @@ export const FieldTypeInput: FC<{
);
case "rich-text":
return <FieldRichText field={field} fm={fm} prop={prop} />;
case "date":
case "date": {
return (
<Datepicker
value={{ startDate: value, endDate: value }}
@ -201,6 +210,7 @@ export const FieldTypeInput: FC<{
/>
);
}
}
return (
<div className="c-flex c-relative c-flex-1">
<input

View File

@ -10,7 +10,17 @@ export const FieldSingleCheckbox: FC<{
}> = ({ field, fm, arg }) => {
const local = useLocal({
list: [] as any[],
change_timeout: null as any,
});
const renderOnChange = () => {
local.render();
if (field.on_change) {
field.on_change({ value: fm.data[field.name], name: field.name, fm });
}
clearTimeout(local.change_timeout);
local.change_timeout = setTimeout(fm.render, 300);
};
useEffect(() => {
const callback = (res: any[]) => {
if (Array.isArray(res)) {
@ -39,6 +49,13 @@ export const FieldSingleCheckbox: FC<{
onClick={() => {
fm.data[field.name] = !value;
fm.render();
if (field.on_change) {
field.on_change({
value: !value,
name: field.name,
fm,
});
}
}}
className="c-flex c-flex-row c-space-x-1 cursor-pointer c-items-center rounded-full p-0.5"
>

View File

@ -74,7 +74,7 @@ export const FieldUpload: FC<{
try {
file = event.target.files[0];
} catch (ex) {}
if (prop.model_upload === "import") {
if (type_field === "import") {
const reader = new FileReader();
reader.onload = (e: any) => {

View File

@ -713,14 +713,14 @@ export const TableList: FC<TableListProp> = ({
) : (
<>
<div
className="w-full h-full overflow-y-auto"
className="w-full h-full overflow-y-auto c-flex-col"
onScroll={local.paging.scroll}
>
{Array.isArray(data) ? (
data.map((e, idx) => {
return (
<div
className="flex-grow"
className="c-flex-grow"
onClick={(ev) => {
if (!isEditor && typeof row_click === "function") {
row_click({

View File

@ -74,7 +74,7 @@ export const Popup: FC<PopupProp> = ({
createPortal(
<div
ref={(e) => (local.ref = e)}
className="c-w-screen c-h-screen relative c-bg-[#00000017] c-flex c-flex-row c-items-center c-justify-center"
className="c-w-screen c-h-screen relative c-flex c-flex-row c-items-center c-justify-center"
onClick={(e) => {
if (local.ref) {
if (e.target === local.ref) {

View File

@ -4,16 +4,15 @@ import { FC, ReactNode, useEffect } from "react";
import { PTLocalInternal, PTProp } from "./utils/typings";
export const PanelTab: FC<PTProp> = ({ header, body, tab, PassProp, item }) => {
const local = useLocal<PTLocalInternal>({
mode: "",
mode: "" as any,
});
useEffect(() => {
local.mode = tab;
local.render();
console.log({local})
}, [tab])
const header_list = get(item, "component.props.header.content.childs") || [];
return (
<div className="c-flex c-flex-col c-flex-grow c-h-full">
<div className="c-flex c-flex-col c-flex-grow c-h-full c-w-full">
<PassProp panel_tab={local}>{header}</PassProp>
<PassProp panel_tab={local}>{body}</PassProp>
</div>

View File

@ -9,7 +9,7 @@ export type PTProp = {
tab: "string";
PassProp: any;
item: PrasiItem;
pt: PTLocalInternal
pt: PTLocalInternal;
};
export type PTLocalInternal = {

View File

@ -325,17 +325,16 @@ export const Typeahead: FC<{
if (!local.open && local.mode === "single" && local.value?.length > 0) {
const found = options.find((e) => e.value === local.value[0]);
if (found) {
inputval = found.label;
inputval = found.tag || found.label;
} else {
inputval = local.value[0];
}
}
return (
<div
className={cx(
local.mode === "single" ? "c-cursor-pointer" : "c-cursor-text",
"c-flex c-relative c-space-x-2 c-flex-wrap c-px-2 c-pb-0 c-items-center c-w-full c-h-full c-flex-1",
"c-flex c-relative c-flex-wrap c-px-2 c-pb-0 c-items-center c-w-full c-h-full c-flex-1",
css`
padding-top: 0.35rem;
`,
@ -352,8 +351,12 @@ export const Typeahead: FC<{
<Badge
key={idx}
variant={"outline"}
className="c-space-x-1 c-mb-2 c-cursor-pointer hover:c-bg-red-100"
className={cx(
"c-space-x-1 c-mr-2 c-mb-2 c-bg-white",
!disabled && " c-cursor-pointer hover:c-bg-red-100"
)}
onClick={(ev) => {
if (!disabled) {
ev.stopPropagation();
ev.preventDefault();
local.value = local.value.filter((val) => e?.value !== val);
@ -363,10 +366,11 @@ export const Typeahead: FC<{
if (typeof onChange === "function") {
onChange(local.value);
}
}
}}
>
<div>{e?.tag || e?.label || <>&nbsp;</>}</div>
<X size={12} />
{!disabled && <X size={12} />}
</Badge>
);
})}

View File

@ -116,6 +116,7 @@ export { Menu, MenuIcon } from "@/preset/menu/Menu";
export { ShowHidePanel } from "@/comps/custom/ShowHidePanel";
export { PanelBody } from "@/comps/tab/parts/PanelBody";
export { PanelHeader } from "@/comps/tab/parts/PanelHead";
export { PanelTab } from "@/comps/tab/Tab";
/*Popup*/
export { Popup } from "@/comps/popup/PopUp";

View File

@ -147,6 +147,7 @@ export const SideBar: FC<{
});
}
}
local.loading = true;
if (typeof menu.value === "string") {
local.active = menu.hash;
@ -156,8 +157,10 @@ export const SideBar: FC<{
typeof menu.value === "string" &&
getPathname() !== menu.value
) {
if (!pm.on_load) {
navigate(menu.value);
}
}
}, 500);
}
local.render();
@ -166,6 +169,28 @@ export const SideBar: FC<{
!Array.isArray(menu.value) &&
typeof menu.value === "string"
) {
if (pm.on_load) {
let done = { exec: () => {} };
console.log(preloaded(menu.value));
if (preloaded(menu.value)) {
pm.on_load((exec) => {
if (typeof menu.value === "string")
navigate(menu.value);
exec();
});
} else {
pm.on_load((exec) => {
done.exec = exec;
});
await preload(menu.value);
setTimeout(() => {
done.exec();
if (typeof menu.value === "string")
navigate(menu.value);
}, 500);
}
return;
}
await preload(menu.value);
navigate(menu.value);
}

View File

@ -9,7 +9,8 @@ export type MenuProp = {
child: ReactNode;
mode: "full" | "mini";
item: PrasiItem;
style: "navbar" | "sidebar"
style: "navbar" | "sidebar";
on_load?: (on_done: (exec: () => void) => void) => void;
};
export type MenuActive = {
data: any;
@ -21,5 +22,5 @@ export type MenuActive = {
export type IMenuItem = {
data: IMenu[];
child: ReactNode
}
child: ReactNode;
};

1
utils/globals.d.ts vendored
View File

@ -5,5 +5,6 @@ declare var css: any;
declare var params: any;
declare var cx: any;
declare var preload: (urls: string[] | string) => any;
declare var preloaded: (url: string) => boolean;
declare var navigate: (link: string) => void;
declare var siteurl: (path: string) => string;