Added parts marking BOD-102

client/src/components/job-detail-lines/job-lines.component.jsx

@@ -1,4 +1,4 @@
-import { Button, Input, Table } from "antd";
+import { Button, Input, Table, Dropdown, Menu } from "antd";
 import React, { useState } from "react";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
@@ -96,6 +96,16 @@ export function JobLinesComponent({
       sorter: (a, b) => alphaSort(a.part_type, b.part_type),
       sortOrder:
         state.sortedInfo.columnKey === "part_type" && state.sortedInfo.order,
+      filters: [
+        {
+          text: t("jobs.labels.partsfilter"),
+          value: "parts",
+        },
+      ],
+      // specify the condition of filtering result
+      // here is that finding the name started with `value`
+      onFilter: (value, record) =>
+        ["PAN", "PAL", "PAA", "PAS", "PASL"].includes(record.part_type),
       ellipsis: true,
       editable: true,
     },
@@ -217,6 +227,18 @@ export function JobLinesComponent({
     setState({ ...state, filteredInfo: filters, sortedInfo: sorter });
   };
 
+  const handleMark = (e) => {
+    setSelectedLines(jobLines.filter((item) => item.part_type === e.key));
+  };
+
+  const markMenu = (
+    <Menu onClick={handleMark}>
+      <Menu.Item key='PAA'>PAA</Menu.Item>
+      <Menu.Item key='PAN'>PAN</Menu.Item>
+      <Menu.Item key='PAL'>PAL</Menu.Item>
+    </Menu>
+  );
+
   return (
     <div>
       <PartsOrderModalContainer />
@@ -244,6 +266,9 @@ export function JobLinesComponent({
                 }}>
                 {t("parts.actions.order")}
               </Button>
+              <Dropdown overlay={markMenu} trigger={["click"]}>
+                <Button>{t("jobs.actions.mark")}</Button>
+              </Dropdown>
               <AllocationsBulkAssignmentContainer
                 jobLines={selectedLines}
                 refetch={refetch}
@@ -278,14 +303,14 @@ export function JobLinesComponent({
         )}
         pagination={{ position: "top", defaultPageSize: 25 }}
         rowSelection={{
-          // selectedRowKeys: selectedLines,
+          selectedRowKeys: selectedLines.map((item) => item.id),
           onSelectAll: (selected, selectedRows, changeRows) => {
             setSelectedLines(selectedRows);
           },
           onSelect: (record, selected, selectedRows, nativeEvent) =>
             setSelectedLines(selectedRows),
         }}
-        columns={columns.map((item) => ({ ...item }))}
+        columns={columns}
         rowKey='id'
         dataSource={jobLines}
         onChange={handleTableChange}