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);
};
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">
{t("general.actions.save")}
</Button>
<Button onClick={() => setOpen(false)}>
{t("general.actions.cancel")}
</Button>
</Form>
</Card>
);
const menu = {
items: [
{
key: '1',
label: (
<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>
// 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 (
<div>
<Dropdown open={open} overlay={popContent}>
<Dropdown open={open} menu={menu}>
<Button
onClick={(e) => {
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 { Button, Card, Input, Modal, Space, Table, Typography } from "antd";
import React, { useState } from "react";
import { useTranslation } from "react-i18next";
import { Link } from "react-router-dom";
import { QUERY_SCOREBOARD_PAGINATED } from "../../graphql/scoreboard.queries";
import { DateFormatter } from "../../utils/DateFormatter";
import {useQuery} from "@apollo/client";
import {Button, Card, Input, Modal, Space, Table, Typography} from "antd";
import React, {useState} from "react";
import {useTranslation} from "react-i18next";
import {Link} from "react-router-dom";
import {QUERY_SCOREBOARD_PAGINATED} from "../../graphql/scoreboard.queries";
import {DateFormatter} from "../../utils/DateFormatter";
import AlertComponent from "../alert/alert.component";
import OwnerNameDisplay from "../owner-name-display/owner-name-display.component";
import ScoreboardEntryEdit from "../scoreboard-entry-edit/scoreboard-entry-edit.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";
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(
QUERY_SCOREBOARD_PAGINATED,
{
fetchPolicy: "network-only",
nextFetchPolicy: "network-only",
skip: !state.open,
variables: {
search: state.search !== "" ? `%${state.search}%` : null,
offset: state.current ? (state.current - 1) * state.pageSize : 0,
limit: state.pageSize,
order: [
{
date: "desc",
},
],
},
}
);
export default function ScoreboardJobsList({scoreBoardlist}) {
const {t} = useTranslation();
const [state, setState] = useState({
open: false,
search: "",
current: 1,
pageSize: pageLimit,
});
const columns = [
{
title: t("jobs.fields.ro_number"),
dataIndex: "ro_number",
key: "ro_number",
render: (text, record) => (
<Link to={"/manage/jobs/" + record.job.id}>
{record.job.ro_number || t("general.labels.na")}
</Link>
),
},
{
title: t("jobs.fields.owner"),
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: "",
}))
const {loading, error, data, refetch} = useQuery(
QUERY_SCOREBOARD_PAGINATED,
{
fetchPolicy: "network-only",
nextFetchPolicy: "network-only",
skip: !state.open,
variables: {
search: state.search !== "" ? `%${state.search}%` : null,
offset: state.current ? (state.current - 1) * state.pageSize : 0,
limit: state.pageSize,
order: [
{
date: "desc",
},
],
},
}
>
{error && (
<AlertComponent type="error" message={JSON.stringify(error)} />
)}
<Card
extra={
<Space align="middle" wrap>
<Button onClick={() => refetch()}>
<SyncOutlined />
</Button>
<Typography.Title level={4}>
{t("general.labels.searchresults", { search: state.search })}
</Typography.Title>
<Input.Search
placeholder={t("jobs.fields.ro_number")}
allowClear
onSearch={(value) => {
setState((state) => ({ ...state, search: value }));
);
const columns = [
{
title: t("jobs.fields.ro_number"),
dataIndex: "ro_number",
key: "ro_number",
render: (text, record) => (
<Link to={"/manage/jobs/" + record.job.id}>
{record.job.ro_number || t("general.labels.na")}
</Link>
),
},
{
title: t("jobs.fields.owner"),
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"}}}
onOk={() => {
setState((state) => ({ ...state, open: false }));
}}
//value={state.search}
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>
</>
);
onCancel={() =>
setState((state) => ({
...state,
open: false,
current: 1,
search: "",
}))
}
>
{error && (
<AlertComponent type="error" message={JSON.stringify(error)}/>
)}
<Card
extra={
<Space align="middle" wrap>
<Button onClick={() => refetch()}>
<SyncOutlined/>
</Button>
<Typography.Title level={4}>
{t("general.labels.searchresults", {search: state.search})}
</Typography.Title>
<Input.Search
placeholder={t("jobs.fields.ro_number")}
allowClear
onSearch={(value) => {
setState((state) => ({...state, search: value}));
}}
//value={state.search}
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>
</>
);
}