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

IO-946 Adjust bill lines form layout.

Browse Source
This commit is contained in:
Patrick Fic
2021-05-03 13:25:34 -07:00
parent e285cfa2b0
commit 49603e5951
3 changed files with 20 additions and 57 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
client/src/components/bill-detail-edit/bill-detail-edit.container.jsx
View File

@@ -59,9 +59,9 @@ export function BillDetailEditcontainer({ setPartsOrderContext }) {
xs: "100%",
sm: "100%",
md: "100%",
lg: "80%",
lg: "100%",
xl: "80%",
xxl: "70%",
xxl: "80%",
};
const drawerPercentage = selectedBreakpoint
? bpoints[selectedBreakpoint[0]]

21
client/src/components/bill-form/bill-form.lines.component.jsx
View File

@@ -42,7 +42,7 @@ export function BillEnterModalLinesComponent({
title: t("billlines.fields.jobline"),
dataIndex: "joblineid",
editable: true,
width: "25%",
formItemProps: (field) => {
return {
key: `${field.index}joblinename`,
@@ -59,6 +59,7 @@ export function BillEnterModalLinesComponent({
<BillLineSearchSelect
disabled={disabled}
options={lineData}
style={{ width: "100%", minWidth: "10rem" }}
onSelect={(value, opt) => {
setFieldsValue({
billlines: getFieldsValue(["billlines"]).billlines.map(
@@ -88,7 +89,7 @@ export function BillEnterModalLinesComponent({
title: t("billlines.fields.line_desc"),
dataIndex: "line_desc",
editable: true,
width: "12%",
formItemProps: (field) => {
return {
key: `${field.index}line_desc`,
@@ -107,7 +108,7 @@ export function BillEnterModalLinesComponent({
title: t("billlines.fields.quantity"),
dataIndex: "quantity",
editable: true,
width: "5rem",
width: "4rem",
formItemProps: (field) => {
return {
key: `${field.index}quantity`,
@@ -127,7 +128,7 @@ export function BillEnterModalLinesComponent({
{
title: t("billlines.fields.actual_price"),
dataIndex: "actual_price",
width: "6rem",
width: "8rem",
editable: true,
formItemProps: (field) => {
return {
@@ -184,7 +185,7 @@ export function BillEnterModalLinesComponent({
title: t("billlines.fields.actual_cost"),
dataIndex: "actual_cost",
editable: true,
width: "7rem",
width: "8rem",
formItemProps: (field) => {
return {
key: `${field.index}actual_cost`,
@@ -233,7 +234,7 @@ export function BillEnterModalLinesComponent({
};
},
formInput: (record, index) => (
<Select style={{ width: "150px" }} disabled={disabled}>
<Select style={{ minWidth: "3rem" }} disabled={disabled}>
{responsibilityCenters.costs.map((item) => (
<Select.Option key={item.name}>{item.name}</Select.Option>
))}
@@ -252,7 +253,7 @@ export function BillEnterModalLinesComponent({
};
},
formInput: (record, index) => (
<Select style={{ width: "150px" }} disabled={disabled}>
<Select disabled={disabled}>
{bodyshop.md_parts_locations.map((loc, idx) => (
<Select.Option key={idx} value={loc}>
{loc}
@@ -359,7 +360,7 @@ export function BillEnterModalLinesComponent({
title: t("billlines.fields.federal_tax_applicable"),
dataIndex: "applicable_taxes.federal",
editable: true,
width: "3rem",
formItemProps: (field) => {
return {
key: `${field.index}fedtax`,
@@ -374,7 +375,7 @@ export function BillEnterModalLinesComponent({
title: t("billlines.fields.state_tax_applicable"),
dataIndex: "applicable_taxes.state",
editable: true,
width: "3rem",
formItemProps: (field) => {
return {
key: `${field.index}statetax`,
@@ -388,7 +389,7 @@ export function BillEnterModalLinesComponent({
title: t("billlines.fields.local_tax_applicable"),
dataIndex: "applicable_taxes.local",
editable: true,
width: "3rem",
formItemProps: (field) => {
return {
key: `${field.index}localtax`,

52
client/src/components/bill-line-search-select/bill-line-search-select.component.jsx
View File

@@ -1,37 +1,19 @@
import { Select, Tag } from "antd";
import React, { forwardRef, useEffect, useState } from "react";
import { Select } from "antd";
import React, { forwardRef } from "react";
import { useTranslation } from "react-i18next";
import CurrencyFormatter from "../../utils/CurrencyFormatter";
//To be used as a form element only.
const { Option } = Select;
const BillLineSearchSelect = (
{ value, onChange, options, onBlur, onSelect, disabled },
ref
) => {
const [option, setOption] = useState(value);
const BillLineSearchSelect = ({ options, disabled, ...restProps }, ref) => {
const { t } = useTranslation();
useEffect(() => {
if (value !== option && onChange) {
onChange(option);
}
}, [value, option, onChange]);
return (
<Select
disabled={disabled}
ref={ref}
showSearch
autoFocus
value={option}
style={{
width: "100%",
}}
onChange={setOption}
optionFilterProp="line_desc"
onBlur={onBlur}
onSelect={onSelect}
{...restProps}
>
<Select.Option key={null} value={"noline"} cost={0} line_desc={""}>
{t("billlines.labels.other")}
@@ -46,29 +28,9 @@ const BillLineSearchSelect = (
line_desc={item.line_desc}
part_qty={item.part_qty}
>
<div
className="imex-flex-row"
style={{ flexWrap: "nowrap", width: "100%" }}
>
<div
style={{
flex: 1,
whiteSpace: "nowrap",
overflow: "hidden",
textOverflow: "ellipsis",
}}
>
{item.line_desc}
</div>
{item.oem_partno ? (
<Tag color="blue">{item.oem_partno}</Tag>
) : null}
{item.act_price ? (
<Tag color="green">
<CurrencyFormatter>{item.act_price || 0}</CurrencyFormatter>
</Tag>
) : null}
</div>
{`${item.line_desc}${
item.oem_partno ? ` - ${item.oem_partno}` : ""
}`}
</Option>
))
: null}