This commit is contained in:
rizrmd 2024-06-02 22:27:01 -07:00
parent 3d470e3f3e
commit 0e1fa9f6f4
10 changed files with 109 additions and 97 deletions

View File

@ -4,7 +4,7 @@ import { FilterFieldType, FilterLocal, filter_window } from "./utils/types";
import { FieldTypeText } from "../form/field/type/TypeText";
import { FieldModifier } from "./FieldModifier";
import { useLocal } from "lib/utils/use-local";
import { FieldToggle } from "../form/field/type/TypeToggle";
import { FieldCheckbox } from "../form/field/type/TypeCheckbox";
export const FilterField: FC<{
filter: FilterLocal;
@ -42,6 +42,7 @@ export const FilterField: FC<{
type={type}
/>
),
opt_get_value: () => { }
})}
>
{(field) => (
@ -79,7 +80,7 @@ export const FilterField: FC<{
suffix: "",
}}
/>
{filter.modifiers[name] === 'Between' && (
{filter.modifiers[name] === 'between' && (
<FieldTypeText
{...field}
prop={{
@ -93,10 +94,10 @@ export const FilterField: FC<{
</>
)}
{type === "boolean" && (
<FieldToggle {...field} />
<FieldCheckbox arg={field.arg} field={field.field} fm={field.fm} />
)}
</>
)}
</BaseField>
</BaseField >
);
};

View File

@ -5,7 +5,6 @@ export const filterWhere = (filter_name: string) => {
const pf = filter_window.prasi_filter?.[getPathname()]?.[filter_name];
const where: any = {};
const AND: any[] = [];
if (pf) {
for (const [k, filter] of Object.entries(pf)) {
for (const [name, value] of Object.entries(filter.data)) {
@ -82,6 +81,19 @@ export const filterWhere = (filter_name: string) => {
}
}
break;
case "options":
{
if (modifier === "equal") {
AND.push({ [name]: { value } });
} else if (modifier === "not_equal") {
AND.push({ [name]: { NOT: value } });
} else if (modifier === "includes") {
AND.push({ [name]: { hasEvery: value } });
} else if (modifier === "excludes") {
AND.push({ [name]: { notIn: value } });
}
}
break;
}
}
}

View File

@ -1,7 +1,7 @@
import { BaseFormLocal } from "../../form/base/types";
import { GenField } from "../../form/typings";
export type FilterFieldType = "text" | "number" | "boolean" | "date";
export type FilterFieldType = "text" | "number" | "boolean" | "date" | "options";
export const default_filter_local = {
data: {} as any,
columns: [] as string[],
@ -29,8 +29,14 @@ export const modifiers = {
date: {
between: "Between",
greater_than: "Greater Than",
less_than: "Less Than"
less_than: "Less Than",
},
options: {
equal: "Equal",
not_equal: "Not Equal",
includes: "Includes",
excludes: "Excludes"
}
};
export type FilterModifier = typeof modifiers;

View File

@ -12,6 +12,7 @@ type CreateFieldArg = {
prefix?: ReactNode | (() => ReactNode);
onChange?: (value: any) => void;
render?: () => void;
opt_get_value?: (value: any) => any
};
export type BaseFormLocal<T> = Omit<typeof default_base_form_local, "data"> & {

View File

@ -21,6 +21,8 @@ export const FieldCheckbox: FC<{
else callback(res);
}, []);
console.log('arg', arg);
let value = arg.opt_get_value({
fm,
name: field.name,
@ -36,15 +38,15 @@ export const FieldCheckbox: FC<{
let isChecked = false;
try {
isChecked = value.some((e: any) => e === item[arg.pk]);
} catch (ex) {}
} catch (ex) { }
return (
<div
onClick={() => {
let selected = Array.isArray(value)
? value.map((row) => {
return local.list.find((e) => e.value === row);
})
return local.list.find((e) => e.value === row);
})
: [];
if (isChecked) {
selected = selected.filter(

View File

@ -19,15 +19,14 @@ export const TypeDropdown: FC<{
options: local.options,
type: field.type,
});
console.log({ value });
useEffect(() => {
if (typeof arg.on_load === "function") {
const options = arg.on_load({ mode: "query" });
console.log("Masuk");
// console.log(options)
console.log("masuk")
const options = arg.on_load();
console.log({options})
if (options instanceof Promise) {
options.then((res) => {
console.log({ res });
console.log({res})
local.options = res;
local.loaded = true;
local.render();
@ -70,28 +69,30 @@ export const TypeDropdown: FC<{
);
return (
<Typeahead
value={value}
onSelect={({ search, item }) => {
return item?.value || search;
}}
onChange={(values) => {
arg.opt_set_value({
fm,
name: field.name,
type: field.type,
options: local.options,
selected: values,
});
}}
allowNew={false}
autoPopupWidth={true}
focusOpen={true}
mode={"multi"}
placeholder={arg.placeholder}
options={() => {
return local.options;
}}
/>
<>
<Typeahead
value={value}
onSelect={({ search, item }) => {
return item?.value || search;
}}
onChange={(values) => {
arg.opt_set_value({
fm,
name: field.name,
type: field.type,
options: local.options,
selected: values,
});
}}
allowNew={false}
autoPopupWidth={true}
focusOpen={true}
mode={"multi"}
placeholder={arg.placeholder}
options={() => {
return local.options;
}}
/>
</>
);
};

View File

@ -4,6 +4,7 @@ import { createItem, parseGenField } from "lib/gen/utils";
import capitalize from "lodash.capitalize";
import { ArrowBigDown } from "lucide-react";
import { on_load_rel } from "./on_load_rel";
import { createId } from "@paralleldrive/cuid2";
export type GFCol = {
name: string;
type: string;
@ -68,9 +69,7 @@ export const newField = (
},
});
} else if (["has-many", "has-one"].includes(arg.type) && arg.relation) {
if (["has-one"].includes(arg.type)) {
console.log(opt.value);
const fields = parseGenField(opt.value);
const fields = parseGenField(opt.value);
const res = generateSelect(fields);
const load = on_load_rel({
pk: res.pk,
@ -78,6 +77,7 @@ export const newField = (
select: res.select,
pks: {},
});
if (["has-one"].includes(arg.type)) {
return createItem({
component: {
id: "32550d01-42a3-4b15-a04a-2c2d5c3c8e67",
@ -87,63 +87,48 @@ export const newField = (
type: "single-option",
sub_type: "dropdown",
rel__gen_table: arg.name,
// rel__gen_fields: [`[${opt.value.join(",")}]`],
opt__on_load: [
`\
${load}
`,
],
opt__on_load: [load],
child: {
childs: [],
},
},
},
});
// return {
// name: "item",
// type: "item",
// component: {
// id: "32550d01-42a3-4b15-a04a-2c2d5c3c8e67",
// props: {
// name: {
// mode: "string",
// value: arg.name
// },
// label: {
// mode: "string",
// value: formatName(arg.name)
// },
// type: {
// mode: "string",
// value: "single-option"
// },
// sub_type: {
// mode: "string",
// value: "dropdown"
// },
// rel__gen_table: {
// mode: "string",
// value: arg.name
// },
// rel__gen_fields: {
// mode: "raw",
// value: `${JSON.stringify(opt.val)}`
// }
// },
// },
// };
} else {
const fields = parseGenField(opt.value);
const res = generateSelect(fields);
const load = on_load_rel({
pk: res.pk,
table: arg.name,
select: res.select,
pks: {},
});
console.log(load)
return {
id: createId(),
name: "item",
type: "item",
childs: [],
edit: null as any,
component: {
id: "32550d01-42a3-4b15-a04a-2c2d5c3c8e67",
props: {
name: {
type: "string",
value: arg.name,
},
label: {
type: "string",
value: formatName(arg.name),
},
sub_type: {
type: "string",
value: "single-option",
},
rel__gen_table: {
type: "string",
value: arg.name,
},
opt__on_load: {
type: "raw",
value: `\
${load}
`,
},
},
},
};
return createItem({
component: {
id: "32550d01-42a3-4b15-a04a-2c2d5c3c8e67",

View File

@ -4,6 +4,7 @@ import { newField } from "./fields";
import { generateSelect } from "../../md/gen/md-select";
import { on_load } from "../../md/gen/tbl-list/on_load";
import { on_submit } from "../../md/gen/tbl-list/on_submit";
import { createId } from "@paralleldrive/cuid2";
export const generateForm = async (
modify: (data: any) => void,
@ -59,12 +60,17 @@ export const generateForm = async (
const field = newField(item, { parent_table: table, value });
childs.push(field);
}
console.log(childs)
if (commit) {
item.edit.setProp("body", {
mode: "jsx",
value: createItem({
value: {
id: createId(),
name: "item",
type: "item",
childs: childs,
}),
edit: null as any,
},
});
await item.edit.commit();
} else {

View File

@ -27,7 +27,6 @@ export const on_load_rel = ({
sample[k] = "sample";
}
}
console.log({cols})
return `\
(arg: {

View File

@ -80,7 +80,7 @@ type SimplifiedItem = {
export const createItem = (arg: SimplifiedItem): any => {
let component = undefined;
if (arg.component && arg.component.id) {
component = { id: arg.component.id, props: {} as any };
@ -91,9 +91,8 @@ export const createItem = (arg: SimplifiedItem): any => {
if (Array.isArray(v) && v.length === 1) {
component.props[k] = {
meta: { type: "text" },
type: "string",
type: "string",
value: v[0],
valueBuilt: v[0],
};
} else if (Array.isArray(v) && v.length === 2) {
component.props[k] = {