IO-841 Missed in commit.
This commit is contained in:
@@ -1,21 +1,8 @@
|
|||||||
import { EyeFilled, SyncOutlined } from "@ant-design/icons";
|
import { EyeFilled, SyncOutlined } from "@ant-design/icons";
|
||||||
import {
|
import { Button, Card, Checkbox, Input, Space, Table } from "antd";
|
||||||
Button,
|
|
||||||
Card,
|
|
||||||
Checkbox,
|
|
||||||
Descriptions,
|
|
||||||
Drawer,
|
|
||||||
Grid,
|
|
||||||
Input,
|
|
||||||
PageHeader,
|
|
||||||
Space,
|
|
||||||
Table,
|
|
||||||
} from "antd";
|
|
||||||
import queryString from "query-string";
|
|
||||||
import React, { useState } from "react";
|
import React, { useState } from "react";
|
||||||
import { useTranslation } from "react-i18next";
|
import { useTranslation } from "react-i18next";
|
||||||
import { connect } from "react-redux";
|
import { connect } from "react-redux";
|
||||||
import { Link, useLocation } from "react-router-dom";
|
|
||||||
import { createStructuredSelector } from "reselect";
|
import { createStructuredSelector } from "reselect";
|
||||||
import { setModalContext } from "../../redux/modals/modals.actions";
|
import { setModalContext } from "../../redux/modals/modals.actions";
|
||||||
import CurrencyFormatter from "../../utils/CurrencyFormatter";
|
import CurrencyFormatter from "../../utils/CurrencyFormatter";
|
||||||
@@ -47,27 +34,12 @@ export function BillsListTableComponent({
|
|||||||
setReconciliationContext,
|
setReconciliationContext,
|
||||||
}) {
|
}) {
|
||||||
const { t } = useTranslation();
|
const { t } = useTranslation();
|
||||||
const [selectedBillLinesByBill, setSelectedBillLinesByBill] = useState({});
|
|
||||||
const selectedBreakpoint = Object.entries(Grid.useBreakpoint())
|
|
||||||
.filter((screen) => !!screen[1])
|
|
||||||
.slice(-1)[0];
|
|
||||||
|
|
||||||
const bpoints = {
|
|
||||||
xs: "100%",
|
|
||||||
sm: "100%",
|
|
||||||
md: "100%",
|
|
||||||
lg: "75%",
|
|
||||||
xl: "75%",
|
|
||||||
xxl: "65%",
|
|
||||||
};
|
|
||||||
const drawerPercentage = selectedBreakpoint
|
|
||||||
? bpoints[selectedBreakpoint[0]]
|
|
||||||
: "100%";
|
|
||||||
const [state, setState] = useState({
|
const [state, setState] = useState({
|
||||||
sortedInfo: {},
|
sortedInfo: {},
|
||||||
});
|
});
|
||||||
const search = queryString.parse(useLocation().search);
|
// const search = queryString.parse(useLocation().search);
|
||||||
const selectedBill = search.billid;
|
// const selectedBill = search.billid;
|
||||||
const Templates = TemplateList("bill");
|
const Templates = TemplateList("bill");
|
||||||
const bills = billsQuery.data ? billsQuery.data.bills : [];
|
const bills = billsQuery.data ? billsQuery.data.bills : [];
|
||||||
const { refetch } = billsQuery;
|
const { refetch } = billsQuery;
|
||||||
@@ -78,15 +50,6 @@ export function BillsListTableComponent({
|
|||||||
<EyeFilled />
|
<EyeFilled />
|
||||||
</Button>
|
</Button>
|
||||||
)}
|
)}
|
||||||
{record.exported ? (
|
|
||||||
<Button disabled>{t("bills.actions.edit")}</Button>
|
|
||||||
) : (
|
|
||||||
<Link
|
|
||||||
to={`/manage/bills?billid=${record.id}&vendorid=${record.vendorid}`}
|
|
||||||
>
|
|
||||||
<Button>{t("bills.actions.edit")}</Button>
|
|
||||||
</Link>
|
|
||||||
)}
|
|
||||||
<BillDeleteButton bill={record} />
|
<BillDeleteButton bill={record} />
|
||||||
{record.isinhouse && (
|
{record.isinhouse && (
|
||||||
<PrintWrapperComponent
|
<PrintWrapperComponent
|
||||||
@@ -164,189 +127,11 @@ export function BillsListTableComponent({
|
|||||||
render: (text, record) => recordActions(record, true),
|
render: (text, record) => recordActions(record, true),
|
||||||
},
|
},
|
||||||
];
|
];
|
||||||
const selectedBillRecord = bills.find((r) => r.id === selectedBill);
|
|
||||||
|
|
||||||
const handleTableChange = (pagination, filters, sorter) => {
|
const handleTableChange = (pagination, filters, sorter) => {
|
||||||
setState({ ...state, filteredInfo: filters, sortedInfo: sorter });
|
setState({ ...state, filteredInfo: filters, sortedInfo: sorter });
|
||||||
};
|
};
|
||||||
|
|
||||||
const rowExpander = (record) => {
|
|
||||||
const columns = [
|
|
||||||
{
|
|
||||||
title: t("billlines.fields.line_desc"),
|
|
||||||
dataIndex: "line_desc",
|
|
||||||
key: "line_desc",
|
|
||||||
sorter: (a, b) => alphaSort(a.line_desc, b.line_desc),
|
|
||||||
sortOrder:
|
|
||||||
state.sortedInfo.columnKey === "line_desc" && state.sortedInfo.order,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: t("billlines.fields.actual_price"),
|
|
||||||
dataIndex: "actual_price",
|
|
||||||
key: "actual_price",
|
|
||||||
sorter: (a, b) => a.actual_price - b.actual_price,
|
|
||||||
sortOrder:
|
|
||||||
state.sortedInfo.columnKey === "actual_price" &&
|
|
||||||
state.sortedInfo.order,
|
|
||||||
render: (text, record) => (
|
|
||||||
<CurrencyFormatter>{record.actual_price}</CurrencyFormatter>
|
|
||||||
),
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: t("billlines.fields.actual_cost"),
|
|
||||||
dataIndex: "actual_cost",
|
|
||||||
key: "actual_cost",
|
|
||||||
sorter: (a, b) => a.actual_cost - b.actual_cost,
|
|
||||||
sortOrder:
|
|
||||||
state.sortedInfo.columnKey === "actual_cost" &&
|
|
||||||
state.sortedInfo.order,
|
|
||||||
render: (text, record) => (
|
|
||||||
<CurrencyFormatter>{record.actual_cost}</CurrencyFormatter>
|
|
||||||
),
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: t("billlines.fields.quantity"),
|
|
||||||
dataIndex: "quantity",
|
|
||||||
key: "quantity",
|
|
||||||
sorter: (a, b) => a.quantity - b.quantity,
|
|
||||||
sortOrder:
|
|
||||||
state.sortedInfo.columnKey === "quantity" && state.sortedInfo.order,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: t("billlines.fields.cost_center"),
|
|
||||||
dataIndex: "cost_center",
|
|
||||||
key: "cost_center",
|
|
||||||
sorter: (a, b) => alphaSort(a.cost_center, b.cost_center),
|
|
||||||
sortOrder:
|
|
||||||
state.sortedInfo.columnKey === "cost_center" &&
|
|
||||||
state.sortedInfo.order,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: t("billlines.fields.federal_tax_applicable"),
|
|
||||||
dataIndex: "applicable_taxes.federal",
|
|
||||||
key: "applicable_taxes.federal",
|
|
||||||
render: (text, record) => (
|
|
||||||
<Checkbox
|
|
||||||
disabled
|
|
||||||
checked={
|
|
||||||
(record.applicable_taxes && record.applicable_taxes.federal) ||
|
|
||||||
false
|
|
||||||
}
|
|
||||||
/>
|
|
||||||
),
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: t("billlines.fields.state_tax_applicable"),
|
|
||||||
dataIndex: "applicable_taxes.state",
|
|
||||||
key: "applicable_taxes.state",
|
|
||||||
render: (text, record) => (
|
|
||||||
<Checkbox
|
|
||||||
disabled
|
|
||||||
checked={
|
|
||||||
(record.applicable_taxes && record.applicable_taxes.state) ||
|
|
||||||
false
|
|
||||||
}
|
|
||||||
/>
|
|
||||||
),
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: t("billlines.fields.local_tax_applicable"),
|
|
||||||
dataIndex: "applicable_taxes.local",
|
|
||||||
key: "applicable_taxes.local",
|
|
||||||
render: (text, record) => (
|
|
||||||
<Checkbox
|
|
||||||
disabled
|
|
||||||
checked={
|
|
||||||
(record.applicable_taxes && record.applicable_taxes.local) ||
|
|
||||||
false
|
|
||||||
}
|
|
||||||
/>
|
|
||||||
),
|
|
||||||
},
|
|
||||||
];
|
|
||||||
const handleOnBillrowclick = (selectedRows) => {
|
|
||||||
setSelectedBillLinesByBill({
|
|
||||||
...selectedBillLinesByBill,
|
|
||||||
[record.id]: selectedRows.map((r) => r.id),
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
return (
|
|
||||||
<>
|
|
||||||
<PageHeader
|
|
||||||
title={
|
|
||||||
record &&
|
|
||||||
`${t("bills.fields.invoice_number")} ${record.invoice_number}`
|
|
||||||
}
|
|
||||||
extra={recordActions(record)}
|
|
||||||
/>
|
|
||||||
<Descriptions>
|
|
||||||
<Descriptions.Item label={t("bills.fields.federal_tax_rate")}>
|
|
||||||
{`${record.federal_tax_rate}%` || ""}
|
|
||||||
</Descriptions.Item>
|
|
||||||
<Descriptions.Item label={t("bills.fields.state_tax_rate")}>
|
|
||||||
{`${record.state_tax_rate}%` || ""}
|
|
||||||
</Descriptions.Item>
|
|
||||||
<Descriptions.Item label={t("bills.fields.local_tax_rate")}>
|
|
||||||
{`${record.local_tax_rate}%` || ""}
|
|
||||||
</Descriptions.Item>
|
|
||||||
</Descriptions>
|
|
||||||
<Button
|
|
||||||
disabled={
|
|
||||||
!selectedBillLinesByBill[record.id] ||
|
|
||||||
(selectedBillLinesByBill[record.id] &&
|
|
||||||
selectedBillLinesByBill[record.id].length === 0) ||
|
|
||||||
record.is_credit_memo
|
|
||||||
}
|
|
||||||
onClick={() =>
|
|
||||||
setPartsOrderContext({
|
|
||||||
actions: {},
|
|
||||||
context: {
|
|
||||||
jobId: job.id,
|
|
||||||
vendorId: record.vendorid,
|
|
||||||
returnFromBill: record.id,
|
|
||||||
invoiceNumber: record.invoice_number,
|
|
||||||
linesToOrder: record.billlines
|
|
||||||
.filter((il) =>
|
|
||||||
selectedBillLinesByBill[record.id].includes(il.id)
|
|
||||||
)
|
|
||||||
.map((i) => {
|
|
||||||
return {
|
|
||||||
line_desc: i.line_desc,
|
|
||||||
// db_price: i.actual_price,
|
|
||||||
act_price: i.actual_price,
|
|
||||||
cost: i.actual_cost,
|
|
||||||
quantity: i.quantity,
|
|
||||||
joblineid: i.joblineid,
|
|
||||||
};
|
|
||||||
}),
|
|
||||||
isReturn: true,
|
|
||||||
},
|
|
||||||
})
|
|
||||||
}
|
|
||||||
>
|
|
||||||
{t("bills.actions.return")}
|
|
||||||
</Button>
|
|
||||||
<Table
|
|
||||||
scroll={{ x: "50%", y: "40rem" }}
|
|
||||||
columns={columns}
|
|
||||||
rowKey="id"
|
|
||||||
dataSource={record.billlines}
|
|
||||||
rowSelection={{
|
|
||||||
onSelect: (record, selected, selectedRows) => {
|
|
||||||
handleOnBillrowclick(selectedRows);
|
|
||||||
},
|
|
||||||
onSelectAll: (selected, selectedRows, changeRows) => {
|
|
||||||
handleOnBillrowclick(selectedRows);
|
|
||||||
},
|
|
||||||
selectedRowKeys: selectedBillLinesByBill[record.id],
|
|
||||||
type: "checkbox",
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
</>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Card
|
<Card
|
||||||
title={t("bills.labels.bills")}
|
title={t("bills.labels.bills")}
|
||||||
@@ -394,17 +179,6 @@ export function BillsListTableComponent({
|
|||||||
</Space>
|
</Space>
|
||||||
}
|
}
|
||||||
>
|
>
|
||||||
<Drawer
|
|
||||||
placement="right"
|
|
||||||
onClose={() => handleOnRowClick(null)}
|
|
||||||
visible={selectedBill}
|
|
||||||
//getContainer={false}
|
|
||||||
style={{ position: "absolute" }}
|
|
||||||
closable
|
|
||||||
width={drawerPercentage}
|
|
||||||
>
|
|
||||||
{selectedBillRecord && rowExpander(selectedBillRecord)}
|
|
||||||
</Drawer>
|
|
||||||
<Table
|
<Table
|
||||||
loading={billsQuery.loading}
|
loading={billsQuery.loading}
|
||||||
scroll={{ x: true, y: "50rem" }}
|
scroll={{ x: true, y: "50rem" }}
|
||||||
|
|||||||
@@ -1,6 +1,7 @@
|
|||||||
import { Col, Row } from "antd";
|
import { Col, Row } from "antd";
|
||||||
import React from "react";
|
import React from "react";
|
||||||
import AlertComponent from "../alert/alert.component";
|
import AlertComponent from "../alert/alert.component";
|
||||||
|
import BillDetailEditcontainer from "../bill-detail-edit/bill-detail-edit.container";
|
||||||
import BillsListTable from "../bills-list-table/bills-list-table.component";
|
import BillsListTable from "../bills-list-table/bills-list-table.component";
|
||||||
import JobBillsTotal from "../job-bills-total/job-bills-total.component";
|
import JobBillsTotal from "../job-bills-total/job-bills-total.component";
|
||||||
import PartsOrderListTableComponent from "../parts-order-list-table/parts-order-list-table.component";
|
import PartsOrderListTableComponent from "../parts-order-list-table/parts-order-list-table.component";
|
||||||
@@ -18,7 +19,7 @@ export default function JobsDetailPliComponent({
|
|||||||
{billsQuery.error ? (
|
{billsQuery.error ? (
|
||||||
<AlertComponent message={billsQuery.error.message} type="error" />
|
<AlertComponent message={billsQuery.error.message} type="error" />
|
||||||
) : null}
|
) : null}
|
||||||
|
<BillDetailEditcontainer />
|
||||||
<Row gutter={[16, 16]}>
|
<Row gutter={[16, 16]}>
|
||||||
<Col span={24}>
|
<Col span={24}>
|
||||||
<JobBillsTotal
|
<JobBillsTotal
|
||||||
|
|||||||
@@ -1,7 +1,6 @@
|
|||||||
import { Button, Table } from "antd";
|
import { Button, Table } from "antd";
|
||||||
import React from "react";
|
import React from "react";
|
||||||
import { useTranslation } from "react-i18next";
|
import { useTranslation } from "react-i18next";
|
||||||
import CurrencyFormatter from "../../utils/CurrencyFormatter";
|
|
||||||
export default function ShopEmployeesListComponent({
|
export default function ShopEmployeesListComponent({
|
||||||
loading,
|
loading,
|
||||||
employees,
|
employees,
|
||||||
|
|||||||
Reference in New Issue
Block a user