Fixed production list sider shwoing on click by adding new component

This commit is contained in:
Patrick Fic
2020-07-24 13:54:13 -07:00
parent 66229b5d19
commit 1e00b376ea
9 changed files with 62 additions and 44 deletions

View File

@@ -11,9 +11,9 @@ export default function ProductionListColumnAlert({ record }) {
const [updateAlert] = useMutation(UPDATE_JOB);
const handleAlertToggle = () => {
const handleAlertToggle = (e) => {
logImEXEvent("production_toggle_alert");
e.stopPropagation();
updateAlert({
variables: {
jobId: record.id,

View File

@@ -12,7 +12,7 @@ export default function ProductionListColumnBodyPriority({ record }) {
const handleSetBodyPriority = (e) => {
logImEXEvent("production_set_body_priority");
e.stopPropagation();
const { key } = e;
updateAlert({
variables: {
@@ -33,19 +33,21 @@ export default function ProductionListColumnBodyPriority({ record }) {
<Dropdown
overlay={
<Menu onClick={handleSetBodyPriority}>
<Menu.Item key='clearBodyPriority'>
<Menu.Item key="clearBodyPriority">
{t("production.actions.bodypriority-clear")}
</Menu.Item>
<Menu.SubMenu
key='set'
title={t("production.actions.bodypriority-set")}>
key="set"
title={t("production.actions.bodypriority-set")}
>
{new Array(9).fill().map((value, index) => (
<Menu.Item key={index + 1}>{index + 1}</Menu.Item>
))}
</Menu.SubMenu>
</Menu>
}
trigger={["contextMenu"]}>
trigger={["contextMenu"]}
>
<div style={{ width: "100%", height: "19px" }}>
{record.production_vars && record.production_vars.bodypriority}
</div>

View File

@@ -11,7 +11,17 @@ import ProductionListColumnPaintPriority from "./production-list-columns.paintpr
import ProductionListColumnStatus from "./production-list-columns.status.component";
import ProductionListColumnNote from "./production-list-columns.productionnote.component";
export default [
{
title: i18n.t("jobs.actions.viewdetail"),
dataIndex: "viewdetail",
key: "viewdetail",
ellipsis: true,
render: (text, record) => (
<Link to={{search:`?selected=${record.id}`}} >{i18n.t("general.labels.view")}</Link>
),
},
{
title: i18n.t("jobs.fields.ro_number"),
dataIndex: "ro_number",

View File

@@ -12,7 +12,7 @@ export default function ProductionListColumnPaintPriority({ record }) {
const handleSetPaintPriority = (e) => {
logImEXEvent("production_set_paint_priority");
e.stopPropagation();
const { key } = e;
updateAlert({
variables: {

View File

@@ -18,7 +18,7 @@ export default function ProductionListColumnProductionNote({ record }) {
const handleSaveNote = (e) => {
logImEXEvent("production_add_note");
e.stopPropagation();
setVisible(false);
updateAlert({
variables: {
@@ -36,10 +36,12 @@ export default function ProductionListColumnProductionNote({ record }) {
};
const handleChange = (e) => {
e.stopPropagation();
setNote(e.target.value);
};
const handleVisibleChange = (flag) => {
setVisible(flag);
if (flag)
setNote((record.production_vars && record.production_vars.note) || "");

View File

@@ -16,7 +16,7 @@ export function ProductionListColumnStatus({ record, bodyshop }) {
const handleSetStatus = (e) => {
logImEXEvent("production_change_status");
e.stopPropagation();
const { key } = e;
updateJob({
variables: {

View File

@@ -6,27 +6,39 @@ import { DateFormatter } from "../../utils/DateFormatter";
import PartsPieGraph from "../parts-status-pie/parts-status-pie.component";
import Barcode from "react-barcode";
import ProductionRemoveButton from "../production-remove-button/production-remove-button.component";
import queryString from "query-string";
import { useHistory, useLocation } from "react-router-dom";
export default function ProductionListDetail({ jobs }) {
const search = queryString.parse(useLocation().search);
const history = useHistory();
const { selected } = search;
export default function ProductionListDetail({ selected, setSelected, jobs }) {
const { t } = useTranslation();
const theJob = jobs.find((j) => j.id === selected) || {};
const handleClose = () => {
delete search.selected;
history.push({ search: queryString.stringify(search) });
};
return (
<Drawer
title={t("production.labels.jobdetail")}
placement='right'
placement="right"
width={"33%"}
onClose={() => setSelected(null)}
visible={!!selected}>
onClose={handleClose}
visible={!!selected}
>
<div>
<Barcode
value={theJob.id || ""}
background='transparent'
background="transparent"
displayValue={false}
width={1}
height={15}
/>
<Descriptions bordered size='small' column={1}>
<Descriptions bordered size="small" column={1}>
<Descriptions.Item label={t("jobs.fields.ro_number")}>
{theJob.ro_number || ""}
</Descriptions.Item>

View File

@@ -33,7 +33,6 @@ export function ProductionListTable({
filteredInfo: { text: "" },
}
);
const [selected, setSelected] = useState(null);
const { t } = useTranslation();
const Now = new Date();
const handleTableChange = (pagination, filters, sorter) => {
@@ -67,7 +66,7 @@ export function ProductionListTable({
const headerItem = (col) => (
<Dropdown
className='prod-header-dropdown'
className="prod-header-dropdown"
overlay={
<Menu onClick={removeColumn}>
<Menu.Item key={col.key}>
@@ -75,7 +74,8 @@ export function ProductionListTable({
</Menu.Item>
</Menu>
}
trigger={["contextMenu"]}>
trigger={["contextMenu"]}
>
<span>{col.title}</span>
</Dropdown>
);
@@ -115,7 +115,8 @@ export function ProductionListTable({
<Button
onClick={() => {
if (refetch) refetch();
}}>
}}
>
<SyncOutlined />
</Button>
<Input
@@ -126,29 +127,26 @@ export function ProductionListTable({
</div>
);
const handleSelectRecord = (record) => {
if (selected !== record.id) {
setSelected(record.id);
} else {
setSelected(null);
}
};
// const handleSelectRecord = (record) => {
// if (selected !== record.id) {
// setSelected(record.id);
// } else {
// setSelected(null);
// }
// };
if (!!!columns) return <div>No columns found.</div>;
return (
<div>
<ProductionListDetail
selected={selected}
setSelected={setSelected}
jobs={dataSource}
/>
<ProductionListDetail jobs={dataSource} />
<ReactDragListView.DragColumn
onDragEnd={onDragEnd}
nodeSelector='th'
handleSelector='.prod-header-dropdown'>
nodeSelector="th"
handleSelector=".prod-header-dropdown"
>
<Table
size='small'
size="small"
pagination={false}
components={{
header: {
@@ -168,15 +166,8 @@ export function ProductionListTable({
}),
};
})}
rowKey='id'
rowKey="id"
loading={loading}
onRow={(record, rowIndex) => {
return {
onClick: (event) => {
handleSelectRecord(record);
},
};
}}
dataSource={dataSource}
onChange={handleTableChange}
rowClassName={(record, index) => {

View File

@@ -94,12 +94,13 @@ app.post("/utils/time", utils.servertime);
//Serve React App if in Production
if (process.env.NODE_ENV === "production") {
app.use(express.static(path.join(__dirname, "client/build")));
app.use(express.static(path.join(__dirname, "admin/build")));
app.get("/service-worker.js", (req, res) => {
res.sendFile(path.resolve(__dirname, "..", "build", "service-worker.js"));
});
app.get("/admin/*", function (req, res) {
app.get("/admin*", function (req, res) {
res.sendFile(path.join(__dirname, "admin/build", "index.html"));
});