Fixed production list sider shwoing on click by adding new component
This commit is contained in:
@@ -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,
|
||||
|
||||
@@ -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>
|
||||
|
||||
@@ -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",
|
||||
|
||||
@@ -12,7 +12,7 @@ export default function ProductionListColumnPaintPriority({ record }) {
|
||||
|
||||
const handleSetPaintPriority = (e) => {
|
||||
logImEXEvent("production_set_paint_priority");
|
||||
|
||||
e.stopPropagation();
|
||||
const { key } = e;
|
||||
updateAlert({
|
||||
variables: {
|
||||
|
||||
@@ -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) || "");
|
||||
|
||||
@@ -16,7 +16,7 @@ export function ProductionListColumnStatus({ record, bodyshop }) {
|
||||
|
||||
const handleSetStatus = (e) => {
|
||||
logImEXEvent("production_change_status");
|
||||
|
||||
e.stopPropagation();
|
||||
const { key } = e;
|
||||
updateJob({
|
||||
variables: {
|
||||
|
||||
@@ -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>
|
||||
|
||||
@@ -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) => {
|
||||
|
||||
@@ -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"));
|
||||
});
|
||||
|
||||
|
||||
Reference in New Issue
Block a user