admin/bodyshop
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

- Progress check

Browse Source 
Signed-off-by: Dave Richer <dave@imexsystems.ca>
This commit is contained in:
Dave Richer
2024-02-09 10:59:04 -05:00
parent 351e46ad6b
commit 3fbd1b2ee0
2 changed files with 218 additions and 214 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
client/src/components/report-center-modal/report-center-modal.component.jsx
View File

@@ -150,7 +150,7 @@ export function ReportCenterModalComponent({reportCenterModal}) {
<Typography.Title level={4}> <Typography.Title level={4}>
{t(`reportcenter.labels.groups.${key}`)} {t(`reportcenter.labels.groups.${key}`)}
</Typography.Title> </Typography.Title>
<ul style={{columns: "2 auto"}}> <ul style={{ listStyleType: 'none', columns: "2 auto"}}>
{grouped[key].map((item) => ( {grouped[key].map((item) => (
<li key={item.key}> <li key={item.key}>
<Radio key={item.key} value={item.key}> <Radio key={item.key} value={item.key}>

430
client/src/components/report-center-modal/test.jsx
View File

@@ -1,220 +1,224 @@
import { Button, Col, Form, Input, Row, Select } from "antd"; import {Button, Col, Form, Input, Row, Select} from "antd";
import React, { useEffect, useState } from "react"; import React, {useEffect, useState} from "react";
import { fetchFilterData } from "../../utils/RenderTemplate"; import {fetchFilterData} from "../../utils/RenderTemplate";
import { DeleteFilled } from "@ant-design/icons"; import {DeleteFilled} from "@ant-design/icons";
import { useTranslation } from "react-i18next"; import {useTranslation} from "react-i18next";
export default function Test({ form }) { export default function Test({form}) {
return ( return (
<Form.Item style={{ margin: 0, padding: 0 }} dependencies={["key"]}> <Form.Item style={{margin: 0, padding: 0}} dependencies={["key"]}>
{() => { {() => {
const key = form.getFieldValue("key"); const key = form.getFieldValue("key");
return <RenderFilters templateId={key} />; return <RenderFilters templateId={key}/>;
}} }}
</Form.Item> </Form.Item>
); );
} }
function RenderFilters({ templateId }) { function RenderFilters({templateId}) {
const [state, setState] = useState(null); const [state, setState] = useState(null);
console.log("state", state); console.log("state", state);
const { t } = useTranslation(); const {t} = useTranslation();
useEffect(() => { useEffect(() => {
const fetch = async () => { const fetch = async () => {
const data = await fetchFilterData({ name: templateId }); const data = await fetchFilterData({name: templateId});
console.log("🚀 ~ fetch ~ data:", data); console.log("🚀 ~ fetch ~ data:", data);
setState(data.data); setState(data.data);
}; };
console.log("🚀 ~ useEffect ~ templateId:", templateId); console.log("🚀 ~ useEffect ~ templateId:", templateId);
if (templateId) { if (templateId) {
fetch(); fetch();
} }
}, [templateId]); }, [templateId]);
if (!templateId || !state) return null; if (!templateId || !state) return null;
return ( return (
<div> <div>
<Form.List name={["filters"]}> <Form.List name={["filters"]}>
{(fields, { add, remove, move }) => { {(fields, {add, remove, move}) => {
return ( return (
<div> <div>
Filters Filters
{fields.map((field, index) => ( {fields.map((field, index) => (
<Form.Item key={field.key}> <Form.Item key={field.key}>
<Row gutter={[16, 16]}> <Row gutter={[16, 16]}>
<Col span={10}> <Col span={10}>
<Form.Item <Form.Item
key={`${index}field`} key={`${index}field`}
label="field" label="field"
name={[field.name, "field"]} name={[field.name, "field"]}
rules={[ rules={[
{ {
required: true, required: true,
//message: t("general.validation.required"), //message: t("general.validation.required"),
}, },
]} ]}
> >
<Select <Select
options={ options={
state.filters state.filters
? state.filters.map((f) => ({ ? state.filters.map((f) => {
value: f.name, console.log('filter added');
label: t(f.translation), console.dir(f);
})) return {
: [] value: f.name,
} label: f?.translation ? t(f.translation) : f.label,
/> }
</Form.Item> })
</Col> : []
<Col span={6}> }
<Form.Item />
key={`${index}operator`} </Form.Item>
label="operator" </Col>
name={[field.name, "operator"]} <Col span={6}>
rules={[ <Form.Item
{ key={`${index}operator`}
required: true, label="operator"
//message: t("general.validation.required"), name={[field.name, "operator"]}
}, rules={[
]} {
> required: true,
<Select //message: t("general.validation.required"),
options={[ },
{ value: "_eq", label: "Equals" }, ]}
{ value: "_ne", label: "Not Equals" }, >
{ value: "_gt", label: "Greater Than" }, <Select
{ value: "_lt", label: "Less Than" }, options={[
{ value: "_gte", label: "Greater Than or Equal To" }, {value: "_eq", label: "Equals"},
{ value: "_lte", label: "Less Than or Equal To" }, {value: "_ne", label: "Not Equals"},
{ value: "_in", label: "In" }, {value: "_gt", label: "Greater Than"},
{ value: "_nin", label: "Not In" }, {value: "_lt", label: "Less Than"},
{ value: "_contains", label: "Contains" }, {value: "_gte", label: "Greater Than or Equal To"},
{ value: "_ncontains", label: "Does Not Contain" }, {value: "_lte", label: "Less Than or Equal To"},
]} {value: "_in", label: "In"},
/> {value: "_nin", label: "Not In"},
</Form.Item> {value: "_contains", label: "Contains"},
</Col> {value: "_ncontains", label: "Does Not Contain"},
<Col span={6}> ]}
<Form.Item />
key={`${index}value`} </Form.Item>
label="value" </Col>
name={[field.name, "value"]} <Col span={6}>
rules={[ <Form.Item
{ key={`${index}value`}
required: true, label="value"
//message: t("general.validation.required"), name={[field.name, "value"]}
}, rules={[
]} {
> required: true,
<Input /> //message: t("general.validation.required"),
</Form.Item> },
</Col> ]}
<Col span={2}> >
<DeleteFilled <Input/>
style={{ margin: "1rem" }} </Form.Item>
onClick={() => { </Col>
remove(field.name); <Col span={2}>
}} <DeleteFilled
/> style={{margin: "1rem"}}
</Col> onClick={() => {
</Row> remove(field.name);
</Form.Item> }}
))} />
<Form.Item> </Col>
<Button </Row>
type="dashed" </Form.Item>
onClick={() => { ))}
add(); <Form.Item>
}} <Button
style={{ width: "100%" }} type="dashed"
> onClick={() => {
{t("general.actions.add")} add();
</Button> }}
</Form.Item> style={{width: "100%"}}
</div> >
); {t("general.actions.add")}
}} </Button>
</Form.List> </Form.Item>
<Form.List name={["sorters"]}> </div>
{(fields, { add, remove, move }) => { );
return ( }}
<div> </Form.List>
Sorters <Form.List name={["sorters"]}>
{fields.map((field, index) => ( {(fields, {add, remove, move}) => {
<Form.Item key={field.key}> return (
<Row gutter={[16, 16]}> <div>
<Col span={11}> Sorters
<Form.Item {fields.map((field, index) => (
key={`${index}field`} <Form.Item key={field.key}>
label="field" <Row gutter={[16, 16]}>
name={[field.name, "field"]} <Col span={11}>
rules={[ <Form.Item
{ key={`${index}field`}
required: true, label="field"
//message: t("general.validation.required"), name={[field.name, "field"]}
}, rules={[
]} {
> required: true,
<Select //message: t("general.validation.required"),
options={ },
state.sorters ]}
? state.sorters.map((f) => ({ >
value: f.name, <Select
label: t(f.name), options={
})) state.sorters
: [] ? state.sorters.map((f) => ({
} value: f.name,
/> label: t(f.translation),
</Form.Item> }))
</Col> : []
<Col span={11}> }
<Form.Item />
key={`${index}direction`} </Form.Item>
label="direction" </Col>
name={[field.name, "direction"]} <Col span={11}>
rules={[ <Form.Item
{ key={`${index}direction`}
required: true, label="direction"
//message: t("general.validation.required"), name={[field.name, "direction"]}
}, rules={[
]} {
> required: true,
<Select //message: t("general.validation.required"),
options={[ },
{ value: "desc", label: "Descending" }, ]}
{ value: "asc", label: "Ascending" }, >
]} <Select
/> options={[
</Form.Item> {value: "desc", label: "Descending"},
</Col> {value: "asc", label: "Ascending"},
]}
/>
</Form.Item>
</Col>
<Col span={2}> <Col span={2}>
<DeleteFilled <DeleteFilled
style={{ margin: "1rem" }} style={{margin: "1rem"}}
onClick={() => { onClick={() => {
remove(field.name); remove(field.name);
}} }}
/> />
</Col> </Col>
</Row> </Row>
</Form.Item> </Form.Item>
))} ))}
<Form.Item> <Form.Item>
<Button <Button
type="dashed" type="dashed"
onClick={() => { onClick={() => {
add(); add();
}} }}
style={{ width: "100%" }} style={{width: "100%"}}
> >
{t("general.actions.add")} {t("general.actions.add")}
</Button> </Button>
</Form.Item> </Form.Item>
</div> </div>
); );
}} }}
</Form.List> </Form.List>
</div> </div>
); );
} }