fix
This commit is contained in:
parent
a8a82d33b2
commit
14436ead89
|
|
@ -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>
|
||||
)}
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
|
|
|||
|
|
@ -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) => {
|
||||
|
|
|
|||
|
|
@ -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;
|
||||
|
|
|
|||
|
|
@ -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"
|
||||
|
|
|
|||
|
|
@ -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
|
||||
|
|
|
|||
|
|
@ -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"
|
||||
>
|
||||
|
|
|
|||
|
|
@ -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) => {
|
||||
|
|
|
|||
|
|
@ -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({
|
||||
|
|
|
|||
|
|
@ -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) {
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
|
|
|
|||
|
|
@ -9,7 +9,7 @@ export type PTProp = {
|
|||
tab: "string";
|
||||
PassProp: any;
|
||||
item: PrasiItem;
|
||||
pt: PTLocalInternal
|
||||
pt: PTLocalInternal;
|
||||
};
|
||||
|
||||
export type PTLocalInternal = {
|
||||
|
|
|
|||
|
|
@ -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 || <> </>}</div>
|
||||
<X size={12} />
|
||||
{!disabled && <X size={12} />}
|
||||
</Badge>
|
||||
);
|
||||
})}
|
||||
|
|
|
|||
|
|
@ -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";
|
||||
|
|
|
|||
|
|
@ -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);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -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;
|
||||
};
|
||||
|
|
|
|||
|
|
@ -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;
|
||||
|
|
|
|||
Loading…
Reference in New Issue