Files
bodyshop/admin/src/components/jobs/jobs.list.jsx

63 lines
1.6 KiB
JavaScript

import { useQuery } from "@apollo/client";
import CircularProgress from "@material-ui/core/CircularProgress";
import React from "react";
import {
Datagrid,
Filter,
List,
ReferenceField,
SelectInput,
TextField,
TextInput
} from "react-admin";
import { QUERY_ALL_SHOPS } from "../../graphql/admin.shop.queries";
const JobsList = (props) => (
<List filters={<JobsFilter />} {...props}>
<Datagrid rowClick="edit">
<TextField source="id" />
<ReferenceField source="shopid" reference="bodyshops">
<TextField source="shopname" />
</ReferenceField>
<TextField source="ro_number" />
<TextField source="ownr_fn" />
<TextField source="ownr_ln" />
<TextField source="ownr_co_nm" />
<ReferenceField source="ownerid" reference="owners">
<TextField source="id" />
</ReferenceField>
<TextField source="v_model_yr" />
<TextField source="v_make_desc" />
<TextField source="v_model_desc" />
<ReferenceField source="vehicleid" reference="vehicles">
<TextField source="id" />
</ReferenceField>
</Datagrid>
</List>
);
const JobsFilter = (props) => {
const { loading, error, data } = useQuery(QUERY_ALL_SHOPS);
if (loading) return <CircularProgress />;
if (error) return JSON.stringify(error);
return (
<Filter {...props}>
<TextInput label="RO Number" source="ro_number" />
<SelectInput
source="shopid"
choices={data.bodyshops.map((b) => {
return { id: b.id, name: b.shopname };
})}
alwaysOn
allowEmpty={false}
/>
</Filter>
);
};
export default JobsList;