This commit is contained in:
rizrmd 2024-06-03 12:37:43 +07:00
parent 30446a29ce
commit cb0a9b5360
1 changed files with 190 additions and 171 deletions

View File

@ -32,8 +32,7 @@ export const EdPropInstanceOptions: FC<{
const prop = mprop.toJSON() as FNCompDef; const prop = mprop.toJSON() as FNCompDef;
const local = useLocal({ const local = useLocal({
codeEditing: false, codeEditing: false,
loading: false, loading: true,
loaded: false as any,
isOpen: false, isOpen: false,
val: "", val: "",
metaFn: null as null | (() => Promise<MetaOption[]>), metaFn: null as null | (() => Promise<MetaOption[]>),
@ -47,13 +46,12 @@ export const EdPropInstanceOptions: FC<{
config.opt[name] = () => { config.opt[name] = () => {
local.metaFn = null; local.metaFn = null;
local.loaded = null;
local.loading = false; local.loading = false;
local.render(); local.render();
}; };
if (cprop.meta?.options || cprop.meta?.optionsBuilt) { if (cprop.meta?.options || cprop.meta?.optionsBuilt) {
if (!local.loaded || !local.metaFn) { if (!local.metaFn || local.optDeps.length > 0) {
let fn = "" as any; let fn = "" as any;
let arg = {}; let arg = {};
try { try {
@ -132,8 +130,6 @@ export const EdPropInstanceOptions: FC<{
console.error(e); console.error(e);
console.warn(fn.toString(), arg); console.warn(fn.toString(), arg);
} }
} else {
local.options = local.loaded;
} }
} }
@ -144,7 +140,7 @@ export const EdPropInstanceOptions: FC<{
const res = local.metaFn(); const res = local.metaFn();
const callback = (e: any) => { const callback = (e: any) => {
local.loading = false; local.loading = false;
local.loaded = e; local.options = e;
local.render(); local.render();
}; };
if (res instanceof Promise) { if (res instanceof Promise) {
@ -155,6 +151,9 @@ export const EdPropInstanceOptions: FC<{
} catch (e) { } catch (e) {
console.error(e); console.error(e);
} }
} else {
local.loading = false;
local.render();
} }
}, local.optDeps); }, local.optDeps);
@ -205,6 +204,12 @@ export const EdPropInstanceOptions: FC<{
<div className="flex items-stretch min-h-[28px]"> <div className="flex items-stretch min-h-[28px]">
<EdPropLabel name={label || name} labelClick={labelClick} /> <EdPropLabel name={label || name} labelClick={labelClick} />
<div className="flex flex-1 justify-end items-stretch"> <div className="flex flex-1 justify-end items-stretch">
{local.loading ? (
<div className="flex flex-1 justify-center items-center">
Loading...
</div>
) : (
<>
{mode === "dropdown" && ( {mode === "dropdown" && (
<select <select
value={evalue} value={evalue}
@ -212,7 +217,9 @@ export const EdPropInstanceOptions: FC<{
onChange={(ev) => { onChange={(ev) => {
onChange( onChange(
`"${ev.currentTarget.value}"`, `"${ev.currentTarget.value}"`,
local.options.find((e) => e.value === ev.currentTarget.value) local.options.find(
(e) => e.value === ev.currentTarget.value
)
); );
}} }}
> >
@ -269,12 +276,17 @@ export const EdPropInstanceOptions: FC<{
<div className={cx("flex flex-col bg-white")}> <div className={cx("flex flex-col bg-white")}>
{Array.isArray(local.options) && {Array.isArray(local.options) &&
local.options.map((item, idx) => { local.options.map((item, idx) => {
const val: any[] = Array.isArray(evalue) ? evalue : []; const val: any[] = Array.isArray(evalue)
? evalue
: [];
const found = val.find((e) => { const found = val.find((e) => {
if (!item.options) { if (!item.options) {
return e === item.value; return e === item.value;
} else { } else {
if (typeof e === "object" && e.value === item.value) { if (
typeof e === "object" &&
e.value === item.value
) {
return true; return true;
} }
return false; return false;
@ -295,7 +307,8 @@ export const EdPropInstanceOptions: FC<{
{item.options && {item.options &&
found && found &&
item.options.map((child, idx) => { item.options.map((child, idx) => {
const sub_found = found.checked.find((e: any) => { const sub_found = found.checked.find(
(e: any) => {
if (!item.options) { if (!item.options) {
return e === child.value; return e === child.value;
} else { } else {
@ -307,7 +320,8 @@ export const EdPropInstanceOptions: FC<{
} }
return false; return false;
} }
}); }
);
return ( return (
<Fragment key={idx}> <Fragment key={idx}>
<SingleCheckbox <SingleCheckbox
@ -332,7 +346,10 @@ export const EdPropInstanceOptions: FC<{
depth={2} depth={2}
val={sub_found.checked} val={sub_found.checked}
onChange={(newval) => { onChange={(newval) => {
onChange(JSON.stringify(val), item); onChange(
JSON.stringify(val),
item
);
local.render(); local.render();
}} }}
/> />
@ -375,6 +392,8 @@ export const EdPropInstanceOptions: FC<{
</div> </div>
</Popover> </Popover>
)} )}
</>
)}
</div> </div>
</div> </div>
); );