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

IO-1533 Kanban Customizations

Browse Source
This commit is contained in:
Patrick Fic
2021-11-17 21:47:05 -08:00
parent 5540872f62
commit 696781c857
3 changed files with 177 additions and 254 deletions
Download Patch File Download Diff File Expand all files Collapse all files

89
client/src/components/production-board-kanban/production-board-kanban.card-settings.component.jsx
View File

@@ -63,85 +63,74 @@ export default function ProductionBoardKanbanCardSettings({
>
<Switch />
</Form.Item>
<Form.Item label={t("production.labels.clm_no")} name="clm_no">
<Radio.Group>
<Radio value="front">Front</Radio>
<Radio value="back">Back</Radio>
<Radio value="off">Off</Radio>
</Radio.Group>
<Form.Item
valuePropName="checked"
label={t("production.labels.ownr_nm")}
name="ownr_nm"
>
<Switch />
</Form.Item>
<Form.Item
valuePropName="checked"
label={t("production.labels.clm_no")}
name="clm_no"
>
<Switch />
</Form.Item>
<Form.Item
valuePropName="checked"
label={t("production.labels.ins_co_nm")}
name="ins_co_nm"
>
<Radio.Group>
<Radio value="front">Front</Radio>
<Radio value="back">Back</Radio>
<Radio value="off">Off</Radio>
</Radio.Group>
<Switch />
</Form.Item>
<Form.Item
valuePropName="checked"
label={t("production.labels.laborhrs")}
name="laborhrs"
>
<Radio.Group>
<Radio value="front">Front</Radio>
<Radio value="back">Back</Radio>
<Radio value="off">Off</Radio>
</Radio.Group>
<Switch />
</Form.Item>
<Form.Item
valuePropName="checked"
label={t("production.labels.employeeassignments")}
name="employeeassignments"
>
<Radio.Group>
<Radio value="front">Front</Radio>
<Radio value="back">Back</Radio>
<Radio value="off">Off</Radio>
</Radio.Group>
<Switch />
</Form.Item>
<Form.Item
valuePropName="checked"
label={t("production.labels.scheduled_completion")}
name="scheduled_completion"
>
<Radio.Group>
<Radio value="front">Front</Radio>
<Radio value="back">Back</Radio>
<Radio value="off">Off</Radio>
</Radio.Group>
<Switch />
</Form.Item>{" "}
</Col>
<Col span={12}>
<Form.Item label={t("production.labels.ats")} name="ats">
<Radio.Group>
<Radio value="front">Front</Radio>
<Radio value="back">Back</Radio>
<Radio value="off">Off</Radio>
</Radio.Group>
<Form.Item
valuePropName="checked"
label={t("production.labels.ats")}
name="ats"
>
<Switch />
</Form.Item>
<Form.Item
valuePropName="checked"
label={t("production.labels.production_note")}
name="production_note"
>
<Radio.Group>
<Radio value="front">Front</Radio>
<Radio value="back">Back</Radio>
<Radio value="off">Off</Radio>
</Radio.Group>
<Switch />
</Form.Item>
<Form.Item label={t("production.labels.alert")} name="alert">
<Radio.Group>
<Radio value="front">Front</Radio>
<Radio value="back">Back</Radio>
<Radio value="off">Off</Radio>
</Radio.Group>
</Form.Item>
<Form.Item label={t("production.labels.sublets")} name="sublets">
<Radio.Group>
<Radio value="front">Front</Radio>
<Radio value="back">Back</Radio>
<Radio value="off">Off</Radio>
</Radio.Group>
{/* <Form.Item
valuePropName='checked' label={t("production.labels.alert")} name="alert">
<Switch/>
</Form.Item> */}
<Form.Item
valuePropName="checked"
label={t("production.labels.sublets")}
name="sublets"
>
<Switch />
</Form.Item>
</Col>
</Row>

42
client/src/components/production-board-kanban/production-board-kanban.component.jsx
View File

@@ -2,7 +2,7 @@ import { useApolloClient } from "@apollo/client";
import Board, { moveCard } from "@asseinfo/react-kanban";
//import "@asseinfo/react-kanban/dist/styles.css";
import "./production-board-kanban.styles.scss";
import { notification, PageHeader, Space, Statistic } from "antd";
import { Grid, notification, PageHeader, Space, Statistic } from "antd";
import React, { useEffect, useState } from "react";
import { useTranslation } from "react-i18next";
import { connect } from "react-redux";
@@ -145,22 +145,42 @@ export function ProductionBoardKanbanComponent({
0
)
.toFixed(1);
const selectedBreakpoint = Object.entries(Grid.useBreakpoint())
.filter((screen) => !!screen[1])
.slice(-1)[0];
const standardSizes = {
xs: "250",
sm: "250",
md: "250",
lg: "250",
xl: "250",
xxl: "250",
};
const compactSizes = {
xs: "150",
sm: "150",
md: "150",
lg: "150",
xl: "155",
xxl: "155",
};
const width = selectedBreakpoint
? associationSettings &&
associationSettings.kanban_settings &&
associationSettings.kanban_settings.compact
? compactSizes[selectedBreakpoint[0]]
: standardSizes[selectedBreakpoint[0]]
: "250";
const Container = styled.div`
.react-kanban-card-skeleton,
.react-kanban-card,
.react-kanban-card-adder-form {
box-sizing: border-box;
max-width: ${associationSettings &&
associationSettings.kanban_settings &&
associationSettings.kanban_settings.compact
? "145"
: "250"}px;
min-width: ${associationSettings &&
associationSettings.kanban_settings &&
associationSettings.kanban_settings.compact
? "145"
: "250"}px;
max-width: ${width}px;
min-width: ${width}px;
}
`;