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

In Progress work for Jobs Form.

Browse Source
This commit is contained in:
Patrick Fic
2019-12-12 15:43:03 -08:00
parent bca375251e
commit d0244e0767
16 changed files with 553 additions and 257 deletions
Download Patch File Download Diff File Expand all files Collapse all files

97
client/src/pages/jobs/jobs.page.jsx
View File

@@ -1,106 +1,17 @@
import React, { useState } from "react";
import React from "react";
import { useSubscription } from "@apollo/react-hooks";
import AlertComponent from "../../components/alert/alert.component";
//import { GET_ALL_OPEN_JOBS } from "../../graphql/jobs.queries";
import { Table, Divider, Icon } from "antd";
import { alphaSort } from "../../utils/sorters";
import { SUBSCRIPTION_ALL_OPEN_JOBS } from "../../graphql/jobs.queries";
//import { columns } from "./jobs.page.metadata";
import JobsList from "../../components/jobs-list/jobs-list.component";
export default function JobsPage() {
const [sortedInfo, setSortedInfo] = useState({});
const { loading, error, data } = useSubscription(SUBSCRIPTION_ALL_OPEN_JOBS, {
fetchPolicy: "network-only"
});
const columns = [
{
title: "RO #",
dataIndex: "ro_number",
key: "ro_number",
sorter: (a, b) => alphaSort(a, b),
sortOrder: sortedInfo.columnKey === "ro_number" && sortedInfo.order,
ellipsis: true
},
{
title: "Est. #",
dataIndex: "est_number",
key: "est_number"
},
{
title: "Status",
dataIndex: "status",
key: "status",
sorter: (a, b) => alphaSort(a, b),
sortOrder: sortedInfo.columnKey === "status" && sortedInfo.order,
ellipsis: true
},
{
title: "Customer",
dataIndex: "customer",
key: "customer",
render: (text, record) => {
return record.owner ? (
<div>
{record.owner.first_name} {record.owner.last_name}
</div>
) : (
"No Customer"
);
}
},
{
title: "Vehicle",
dataIndex: "vehicle",
key: "vehicle",
render: (text, record) => {
return record.vehicle ? (
<div>
{record.vehicle.v_model_yr} {record.vehicle.v_make_desc}{" "}
{record.vehicle.v_model_desc}
</div>
) : (
"No Vehicle"
);
}
},
{
title: "Action",
key: "action",
render: (text, record) => (
<span>
Action 一 {record.ro_number}
<Divider type="vertical" />
<Divider type="vertical" />
More actions <Icon type="down" />
</span>
)
}
];
const handleChange = (pagination, filters, sorter) => {
console.log("Various parameters", pagination, filters, sorter);
// this.setState({
// filteredInfo: filters,
// sortedInfo: sorter,
// });
setSortedInfo(sorter);
};
if (error) return <AlertComponent message={error.message} />;
return (
<div>
<Table
loading={loading}
pagination={{ position: "bottom" }}
columns={columns.map(item => ({ ...item }))}
rowKey="id"
dataSource={data ? data.jobs : null}
onChange={handleChange}
/>
</div>
);
return <JobsList loading={loading} jobs={data ? data.jobs : null} />;
}

64
client/src/pages/jobs/jobs.page.metadata.jsx
View File

@@ -1,64 +0,0 @@
import React from "react";
import { Divider, Icon } from "antd";
export const columns = [
{
title: "RO #",
dataIndex: "ro_number",
key: "ro_number",
sorter: (a, b) => a.ro_number > b.ro_number,
sortOrder: sortedInfo.columnKey === "ro_number" && sortedInfo.order,
ellipsis: true
},
{
title: "Est. #",
dataIndex: "est_number",
key: "est_number"
},
{
title: "Status",
dataIndex: "status",
key: "status"
},
{
title: "Customer",
dataIndex: "customer",
key: "customer",
render: (text, record) => {
return record.owner ? (
<div>
{record.owner.first_name} {record.owner.last_name}
</div>
) : (
"No Customer"
);
}
},
{
title: "Vehicle",
dataIndex: "vehicle",
key: "vehicle",
render: (text, record) => {
return record.vehicle ? (
<div>
{record.vehicle.v_model_yr} {record.vehicle.v_make_desc}{" "}
{record.vehicle.v_model_desc}
</div>
) : (
"No Vehicle"
);
}
},
{
title: "Action",
key: "action",
render: (text, record) => (
<span>
Action 一 {record.ro_number}
<Divider type="vertical" />
<Divider type="vertical" />
More actions <Icon type="down" />
</span>
)
}
];