- Merge client update into test-beta
Signed-off-by: Dave Richer <dave@imexsystems.ca>
This commit is contained in:
Dave Richer
@@ -1,142 +1,131 @@
|
||||
import { DownOutlined } from "@ant-design/icons";
|
||||
import {
|
||||
Button,
|
||||
Checkbox,
|
||||
Col,
|
||||
Form,
|
||||
InputNumber,
|
||||
Popover,
|
||||
Radio,
|
||||
Row,
|
||||
Space,
|
||||
Spin,
|
||||
} from "antd";
|
||||
import React, { useState } from "react";
|
||||
import { GET_JOB_INFO_DRAW_CALCULATIONS } from "../../graphql/jobs-lines.queries";
|
||||
import { useQuery } from "@apollo/client";
|
||||
import {DownOutlined} from "@ant-design/icons";
|
||||
import {Button, Checkbox, Col, Form, InputNumber, Popover, Radio, Row, Space, Spin,} from "antd";
|
||||
import React, {useState} from "react";
|
||||
import {GET_JOB_INFO_DRAW_CALCULATIONS} from "../../graphql/jobs-lines.queries";
|
||||
import {useQuery} from "@apollo/client";
|
||||
|
||||
export default function TimeTicketCalculatorComponent({
|
||||
setProductiveHours,
|
||||
setProductiveHours,
|
||||
|
||||
jobid,
|
||||
}) {
|
||||
const { loading, data: lineTicketData } = useQuery(GET_JOB_INFO_DRAW_CALCULATIONS, {
|
||||
variables: { id: jobid },
|
||||
skip: !jobid,
|
||||
fetchPolicy: "network-only",
|
||||
nextFetchPolicy: "network-only",
|
||||
});
|
||||
jobid,
|
||||
}) {
|
||||
const {loading, data: lineTicketData} = useQuery(GET_JOB_INFO_DRAW_CALCULATIONS, {
|
||||
variables: {id: jobid},
|
||||
skip: !jobid,
|
||||
fetchPolicy: "network-only",
|
||||
nextFetchPolicy: "network-only",
|
||||
});
|
||||
|
||||
const [visible, setVisible] = useState(false);
|
||||
const handleOpenChange = (flag) => setVisible(flag);
|
||||
const handleFinish = ({ type, hourstype, percent }) => {
|
||||
//setProductiveHours(values);
|
||||
//setVisible(false);
|
||||
const eligibleHours = Array.isArray(hourstype)
|
||||
? lineTicketData.joblines.reduce(
|
||||
(acc, val) =>
|
||||
acc + (hourstype.includes(val.mod_lbr_ty) ? val.mod_lb_hrs : 0),
|
||||
0
|
||||
)
|
||||
: lineTicketData.joblines.reduce(
|
||||
(acc, val) =>
|
||||
acc + (hourstype === val.mod_lbr_ty ? val.mod_lb_hrs : 0),
|
||||
0
|
||||
);
|
||||
if (type === "draw") {
|
||||
setProductiveHours(eligibleHours * (percent / 100));
|
||||
} else if (type === "cut") {
|
||||
setProductiveHours(eligibleHours * (percent / 100));
|
||||
console.log(
|
||||
"Cut selected, rate set to: ",
|
||||
lineTicketData.jobs_by_pk[`rate_${hourstype.toLowerCase()}`]
|
||||
);
|
||||
}
|
||||
};
|
||||
const [visible, setVisible] = useState(false);
|
||||
const handleOpenChange = (flag) => setVisible(flag);
|
||||
const handleFinish = ({type, hourstype, percent}) => {
|
||||
//setProductiveHours(values);
|
||||
//setVisible(false);
|
||||
const eligibleHours = Array.isArray(hourstype)
|
||||
? lineTicketData.joblines.reduce(
|
||||
(acc, val) =>
|
||||
acc + (hourstype.includes(val.mod_lbr_ty) ? val.mod_lb_hrs : 0),
|
||||
0
|
||||
)
|
||||
: lineTicketData.joblines.reduce(
|
||||
(acc, val) =>
|
||||
acc + (hourstype === val.mod_lbr_ty ? val.mod_lb_hrs : 0),
|
||||
0
|
||||
);
|
||||
if (type === "draw") {
|
||||
setProductiveHours(eligibleHours * (percent / 100));
|
||||
} else if (type === "cut") {
|
||||
setProductiveHours(eligibleHours * (percent / 100));
|
||||
console.log(
|
||||
"Cut selected, rate set to: ",
|
||||
lineTicketData.jobs_by_pk[`rate_${hourstype.toLowerCase()}`]
|
||||
);
|
||||
}
|
||||
};
|
||||
|
||||
const popContent = (
|
||||
<Spin spinning={loading}>
|
||||
<Form onFinish={handleFinish}>
|
||||
<Form.Item name="type">
|
||||
<Radio.Group>
|
||||
<Radio.Button value="draw">Draw</Radio.Button>
|
||||
<Radio.Button value="cut">Cut of Sale</Radio.Button>
|
||||
</Radio.Group>
|
||||
</Form.Item>
|
||||
const popContent = (
|
||||
<Spin spinning={loading}>
|
||||
<Form onFinish={handleFinish}>
|
||||
<Form.Item name="type">
|
||||
<Radio.Group>
|
||||
<Radio.Button value="draw">Draw</Radio.Button>
|
||||
<Radio.Button value="cut">Cut of Sale</Radio.Button>
|
||||
</Radio.Group>
|
||||
</Form.Item>
|
||||
|
||||
<Form.Item noStyle shouldUpdate>
|
||||
{({ getFieldValue }) => (
|
||||
<Form.Item name="hourstype">
|
||||
{getFieldValue("type") === "draw" ? (
|
||||
<Checkbox.Group>
|
||||
<Row>
|
||||
<Col span={8}>
|
||||
<Checkbox value="LAB" style={{ lineHeight: "32px" }}>
|
||||
Body
|
||||
</Checkbox>
|
||||
</Col>
|
||||
<Col span={8}>
|
||||
<Checkbox value="LAR" style={{ lineHeight: "32px" }}>
|
||||
Refinish
|
||||
</Checkbox>
|
||||
</Col>
|
||||
<Col span={8}>
|
||||
<Checkbox value="LAM" style={{ lineHeight: "32px" }}>
|
||||
Mechanical
|
||||
</Checkbox>
|
||||
</Col>
|
||||
<Col span={8}>
|
||||
<Checkbox value="LAF" style={{ lineHeight: "32px" }}>
|
||||
Frame
|
||||
</Checkbox>
|
||||
</Col>
|
||||
<Col span={8}>
|
||||
<Checkbox value="LAG" style={{ lineHeight: "32px" }}>
|
||||
Glass
|
||||
</Checkbox>
|
||||
</Col>
|
||||
</Row>
|
||||
</Checkbox.Group>
|
||||
) : (
|
||||
<Radio.Group>
|
||||
<Radio value="LAB">Body</Radio>
|
||||
<Form.Item noStyle shouldUpdate>
|
||||
{({getFieldValue}) => (
|
||||
<Form.Item name="hourstype">
|
||||
{getFieldValue("type") === "draw" ? (
|
||||
<Checkbox.Group>
|
||||
<Row>
|
||||
<Col span={8}>
|
||||
<Checkbox value="LAB" style={{lineHeight: "32px"}}>
|
||||
Body
|
||||
</Checkbox>
|
||||
</Col>
|
||||
<Col span={8}>
|
||||
<Checkbox value="LAR" style={{lineHeight: "32px"}}>
|
||||
Refinish
|
||||
</Checkbox>
|
||||
</Col>
|
||||
<Col span={8}>
|
||||
<Checkbox value="LAM" style={{lineHeight: "32px"}}>
|
||||
Mechanical
|
||||
</Checkbox>
|
||||
</Col>
|
||||
<Col span={8}>
|
||||
<Checkbox value="LAF" style={{lineHeight: "32px"}}>
|
||||
Frame
|
||||
</Checkbox>
|
||||
</Col>
|
||||
<Col span={8}>
|
||||
<Checkbox value="LAG" style={{lineHeight: "32px"}}>
|
||||
Glass
|
||||
</Checkbox>
|
||||
</Col>
|
||||
</Row>
|
||||
</Checkbox.Group>
|
||||
) : (
|
||||
<Radio.Group>
|
||||
<Radio value="LAB">Body</Radio>
|
||||
|
||||
<Radio value="LAR">Refinish</Radio>
|
||||
<Radio value="LAR">Refinish</Radio>
|
||||
|
||||
<Radio value="LAM">Mechanical</Radio>
|
||||
<Radio value="LAM">Mechanical</Radio>
|
||||
|
||||
<Radio value="LAF">Frame</Radio>
|
||||
<Radio value="LAF">Frame</Radio>
|
||||
|
||||
<Radio value="LAG">Glass</Radio>
|
||||
</Radio.Group>
|
||||
)}
|
||||
</Form.Item>
|
||||
)}
|
||||
</Form.Item>
|
||||
<Radio value="LAG">Glass</Radio>
|
||||
</Radio.Group>
|
||||
)}
|
||||
</Form.Item>
|
||||
)}
|
||||
</Form.Item>
|
||||
|
||||
<Form.Item name="percent">
|
||||
<InputNumber min={0} max={100} precision={1} addonAfter="%" />
|
||||
</Form.Item>
|
||||
<Button htmlType="submit">Calculate</Button>
|
||||
</Form>
|
||||
</Spin>
|
||||
);
|
||||
<Form.Item name="percent">
|
||||
<InputNumber min={0} max={100} precision={1} addonAfter="%"/>
|
||||
</Form.Item>
|
||||
<Button htmlType="submit">Calculate</Button>
|
||||
</Form>
|
||||
</Spin>
|
||||
);
|
||||
|
||||
return (
|
||||
<Popover
|
||||
content={popContent}
|
||||
trigger={["click"]}
|
||||
open={visible}
|
||||
onOpenChange={handleOpenChange}
|
||||
placement="right"
|
||||
destroyTooltipOnHide
|
||||
>
|
||||
<Button onClick={(e) => e.preventDefault()}>
|
||||
<Space>
|
||||
Draw Calculator
|
||||
<DownOutlined />
|
||||
</Space>
|
||||
</Button>
|
||||
</Popover>
|
||||
);
|
||||
return (
|
||||
<Popover
|
||||
content={popContent}
|
||||
trigger={["click"]}
|
||||
open={visible}
|
||||
onOpenChange={handleOpenChange}
|
||||
placement="right"
|
||||
destroyTooltipOnHide
|
||||
>
|
||||
<Button onClick={(e) => e.preventDefault()}>
|
||||
<Space>
|
||||
Draw Calculator
|
||||
<DownOutlined/>
|
||||
</Space>
|
||||
</Button>
|
||||
</Popover>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user