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

Merged in feature/IO-1828-Front-End-Package-Updates (pull request #1163)

Browse Source 
- Scoreboard fixes
This commit is contained in:
Dave Richer
2024-01-15 23:24:10 +00:00
parent b09a1701cd 0d0f24802f
commit c10a136110
2 changed files with 223 additions and 211 deletions
Download Patch File Download Diff File Expand all files Collapse all files

116
client/src/components/scoreboard-entry-edit/scoreboard-entry-edit.component.jsx
View File

@@ -33,66 +33,72 @@ export default function ScoreboardEntryEdit({ entry }) {
setLoading(false); setLoading(false);
}; };
const popContent = (
<Card style={{ padding: "1rem" }}>
<Form
layout="vertical"
initialValues={entry}
onFinish={handleFinish}
onClick={(e) => e.stopPropagation()}
>
<Form.Item
label={t("scoreboard.fields.date")}
name="date"
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
>
<FormDatePicker />
</Form.Item>
<Form.Item
label={t("scoreboard.fields.bodyhrs")}
name="bodyhrs"
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
>
<InputNumber precision={1} />
</Form.Item>
<Form.Item
label={t("scoreboard.fields.painthrs")}
name="painthrs"
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
>
<InputNumber precision={1} />
</Form.Item>
<Button type="primary" loading={loading} htmlType="submit"> const menu = {
{t("general.actions.save")} items: [
</Button> {
<Button onClick={() => setOpen(false)}> key: '1',
{t("general.actions.cancel")} label: (
</Button> <Card style={{ padding: "1rem" }}>
</Form> <Form
</Card> layout="vertical"
); initialValues={entry}
onFinish={handleFinish}
onClick={(e) => e.stopPropagation()}
>
<Form.Item
label={t("scoreboard.fields.date")}
name="date"
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
>
<FormDatePicker />
</Form.Item>
<Form.Item
label={t("scoreboard.fields.bodyhrs")}
name="bodyhrs"
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
>
<InputNumber precision={1} />
</Form.Item>
<Form.Item
label={t("scoreboard.fields.painthrs")}
name="painthrs"
rules={[
{
required: true,
//message: t("general.validation.required"),
},
]}
>
<InputNumber precision={1} />
</Form.Item>
// TODO Client Update, why is this a card <Button type="primary" loading={loading} htmlType="submit">
{t("general.actions.save")}
</Button>
<Button onClick={() => setOpen(false)}>
{t("general.actions.cancel")}
</Button>
</Form>
</Card>
)
}
]
}
return ( return (
<div> <div>
<Dropdown open={open} overlay={popContent}> <Dropdown open={open} menu={menu}>
<Button <Button
onClick={(e) => { onClick={(e) => {
e.stopPropagation(); e.stopPropagation();

318
client/src/components/scoreboard-jobs-list/scoreboard-jobs-list.component.jsx
View File

@@ -1,166 +1,172 @@
import { useQuery } from "@apollo/client"; import {useQuery} from "@apollo/client";
import { Button, Card, Input, Modal, Space, Table, Typography } from "antd"; import {Button, Card, Input, Modal, Space, Table, Typography} from "antd";
import React, { useState } from "react"; import React, {useState} from "react";
import { useTranslation } from "react-i18next"; import {useTranslation} from "react-i18next";
import { Link } from "react-router-dom"; import {Link} from "react-router-dom";
import { QUERY_SCOREBOARD_PAGINATED } from "../../graphql/scoreboard.queries"; import {QUERY_SCOREBOARD_PAGINATED} from "../../graphql/scoreboard.queries";
import { DateFormatter } from "../../utils/DateFormatter"; import {DateFormatter} from "../../utils/DateFormatter";
import AlertComponent from "../alert/alert.component"; import AlertComponent from "../alert/alert.component";
import OwnerNameDisplay from "../owner-name-display/owner-name-display.component"; import OwnerNameDisplay from "../owner-name-display/owner-name-display.component";
import ScoreboardEntryEdit from "../scoreboard-entry-edit/scoreboard-entry-edit.component"; import ScoreboardEntryEdit from "../scoreboard-entry-edit/scoreboard-entry-edit.component";
import ScoreboardRemoveButton from "../scoreboard-remove-button/scorebard-remove-button.component"; import ScoreboardRemoveButton from "../scoreboard-remove-button/scorebard-remove-button.component";
import { SyncOutlined } from "@ant-design/icons"; import {SyncOutlined} from "@ant-design/icons";
import {pageLimit} from "../../utils/config"; import {pageLimit} from "../../utils/config";
export default function ScoreboardJobsList({ scoreBoardlist }) {
const { t } = useTranslation();
const [state, setState] = useState({
open: false,
search: "",
current: 1,
pageSize: pageLimit,
});
const { loading, error, data, refetch } = useQuery( export default function ScoreboardJobsList({scoreBoardlist}) {
QUERY_SCOREBOARD_PAGINATED, const {t} = useTranslation();
{ const [state, setState] = useState({
fetchPolicy: "network-only", open: false,
nextFetchPolicy: "network-only", search: "",
skip: !state.open, current: 1,
variables: { pageSize: pageLimit,
search: state.search !== "" ? `%${state.search}%` : null, });
offset: state.current ? (state.current - 1) * state.pageSize : 0,
limit: state.pageSize,
order: [
{
date: "desc",
},
],
},
}
);
const columns = [ const {loading, error, data, refetch} = useQuery(
{ QUERY_SCOREBOARD_PAGINATED,
title: t("jobs.fields.ro_number"), {
dataIndex: "ro_number", fetchPolicy: "network-only",
key: "ro_number", nextFetchPolicy: "network-only",
render: (text, record) => ( skip: !state.open,
<Link to={"/manage/jobs/" + record.job.id}> variables: {
{record.job.ro_number || t("general.labels.na")} search: state.search !== "" ? `%${state.search}%` : null,
</Link> offset: state.current ? (state.current - 1) * state.pageSize : 0,
), limit: state.pageSize,
}, order: [
{ {
title: t("jobs.fields.owner"), date: "desc",
dataIndex: "owner", },
key: "owner", ],
ellipsis: true, },
render: (text, record) => <OwnerNameDisplay ownerObject={record.job} />,
},
{
title: t("jobs.fields.vehicle"),
dataIndex: "vehicle",
key: "vehicle",
ellipsis: true,
render: (text, record) => (
<span>{`${record.job.v_model_yr || ""} ${
record.job.v_make_desc || ""
} ${record.job.v_model_desc || ""}`}</span>
),
},
{
title: t("scoreboard.fields.date"),
dataIndex: "date",
key: "date",
render: (text, record) => <DateFormatter>{record.date}</DateFormatter>,
},
{
title: t("scoreboard.fields.painthrs"),
dataIndex: "painthrs",
key: "painthrs",
},
{
title: t("scoreboard.fields.bodyhrs"),
dataIndex: "bodyhrs",
key: "bodyhrs",
},
{
title: t("general.labels.actions"),
dataIndex: "actions",
key: "actions",
render: (text, record) => (
<Space>
<ScoreboardEntryEdit entry={record} style={{ zIndex: 15 }} />
<ScoreboardRemoveButton scoreboardId={record.id} />
</Space>
),
},
];
return (
<>
<Modal
open={state.open}
destroyOnClose
width="80%"
cancelButtonProps={{ style: { display: "none" } }}
onCancel={() =>
setState((state) => ({
...state,
open: false,
current: 1,
search: "",
}))
} }
> );
{error && (
<AlertComponent type="error" message={JSON.stringify(error)} /> const columns = [
)} {
<Card title: t("jobs.fields.ro_number"),
extra={ dataIndex: "ro_number",
<Space align="middle" wrap> key: "ro_number",
<Button onClick={() => refetch()}> render: (text, record) => (
<SyncOutlined /> <Link to={"/manage/jobs/" + record.job.id}>
</Button> {record.job.ro_number || t("general.labels.na")}
<Typography.Title level={4}> </Link>
{t("general.labels.searchresults", { search: state.search })} ),
</Typography.Title> },
<Input.Search {
placeholder={t("jobs.fields.ro_number")} title: t("jobs.fields.owner"),
allowClear dataIndex: "owner",
onSearch={(value) => { key: "owner",
setState((state) => ({ ...state, search: value })); ellipsis: true,
render: (text, record) => <OwnerNameDisplay ownerObject={record.job}/>,
},
{
title: t("jobs.fields.vehicle"),
dataIndex: "vehicle",
key: "vehicle",
ellipsis: true,
render: (text, record) => (
<span>{`${record.job.v_model_yr || ""} ${
record.job.v_make_desc || ""
} ${record.job.v_model_desc || ""}`}</span>
),
},
{
title: t("scoreboard.fields.date"),
dataIndex: "date",
key: "date",
render: (text, record) => <DateFormatter>{record.date}</DateFormatter>,
},
{
title: t("scoreboard.fields.painthrs"),
dataIndex: "painthrs",
key: "painthrs",
},
{
title: t("scoreboard.fields.bodyhrs"),
dataIndex: "bodyhrs",
key: "bodyhrs",
},
{
title: t("general.labels.actions"),
dataIndex: "actions",
key: "actions",
render: (text, record) => (
<Space>
<ScoreboardEntryEdit entry={record} style={{zIndex: 15}}/>
<ScoreboardRemoveButton scoreboardId={record.id}/>
</Space>
),
},
];
return (
<>
<Modal
open={state.open}
destroyOnClose
width="80%"
cancelButtonProps={{style: {display: "none"}}}
onOk={() => {
setState((state) => ({ ...state, open: false }));
}} }}
//value={state.search} onCancel={() =>
enterButton setState((state) => ({
/> ...state,
</Space> open: false,
} current: 1,
> search: "",
<Table }))
columns={columns} }
rowKey="id" >
dataSource={data ? data.scoreboard : []} {error && (
loading={loading} <AlertComponent type="error" message={JSON.stringify(error)}/>
onClick={(e) => e.stopPropagation()} )}
onChange={(tableArgs) => <Card
setState((state) => ({ ...state, ...tableArgs })) extra={
} <Space align="middle" wrap>
pagination={{ <Button onClick={() => refetch()}>
position: "top", <SyncOutlined/>
pageSize: state.pageSize || pageLimit, </Button>
current: state.current || 1, <Typography.Title level={4}>
total: data ? data.scoreboard_aggregate.aggregate.count : 0, {t("general.labels.searchresults", {search: state.search})}
}} </Typography.Title>
/> <Input.Search
</Card> placeholder={t("jobs.fields.ro_number")}
</Modal> allowClear
<Button onSearch={(value) => {
onClick={() => setState((state) => ({ ...state, open: true }))} setState((state) => ({...state, search: value}));
> }}
{t("scoreboard.labels.entries")} //value={state.search}
</Button> enterButton
</> />
); </Space>
}
>
<Table
columns={columns}
rowKey="id"
dataSource={data ? data.scoreboard : []}
loading={loading}
onClick={(e) => e.stopPropagation()}
onChange={(tableArgs) =>
setState((state) => ({...state, ...tableArgs}))
}
pagination={{
position: "top",
pageSize: state.pageSize || pageLimit,
current: state.current || 1,
total: data ? data.scoreboard_aggregate.aggregate.count : 0,
}}
/>
</Card>
</Modal>
<Button
onClick={() => {
setState((state) => ({...state, open: true}))
}}
>
{t("scoreboard.labels.entries")}
</Button>
</>
);
} }