Removed enter to submit detail page. Added filtering for jobs lines.

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

@@ -1,15 +1,18 @@
-import { Button, Table, Form, Input, Alert } from "antd";
-import React, { useState, useContext } from "react";
+import { Input, Table } from "antd";
+import React, { useState } from "react";
 import { useTranslation } from "react-i18next";
 import CurrencyFormatter from "../../utils/CurrencyFormatter";
 import { alphaSort } from "../../utils/sorters";
 //import EditableCell from "./job-lines-cell.component";
 
-export default function JobLinesComponent({ jobLines, form, handleSubmit }) {
-  const { getFieldDecorator, isFieldsTouched, resetFields } = form;
+export default function JobLinesComponent({
+  jobLines,
+  form,
+  handleSubmit,
+  setSearchText
+}) {
   const [state, setState] = useState({
-    sortedInfo: {},
-    filteredInfo: { text: "" }
+    sortedInfo: {}
   });
 
   const { t } = useTranslation();
@@ -51,6 +54,7 @@ export default function JobLinesComponent({ jobLines, form, handleSubmit }) {
         state.sortedInfo.columnKey === "oem_partno" && state.sortedInfo.order,
       ellipsis: true,
       editable: true,
+      width: "20%",
       render: (text, record) => (
         <span>
           {record.oem_partno ? record.oem_partno : record.op_code_desc}
@@ -65,7 +69,8 @@ export default function JobLinesComponent({ jobLines, form, handleSubmit }) {
       sortOrder:
         state.sortedInfo.columnKey === "part_type" && state.sortedInfo.order,
       ellipsis: true,
-      editable: true
+      editable: true,
+      width: "10%"
     },
     {
       title: t("joblines.fields.db_price"),
@@ -75,6 +80,7 @@ export default function JobLinesComponent({ jobLines, form, handleSubmit }) {
       sortOrder:
         state.sortedInfo.columnKey === "db_price" && state.sortedInfo.order,
       ellipsis: true,
+      width: "10%",
       render: (text, record) => (
         <CurrencyFormatter>{record.db_price}</CurrencyFormatter>
       )
@@ -87,6 +93,7 @@ export default function JobLinesComponent({ jobLines, form, handleSubmit }) {
       sortOrder:
         state.sortedInfo.columnKey === "act_price" && state.sortedInfo.order,
       ellipsis: true,
+      width: "10%",
       render: (text, record) => (
         <CurrencyFormatter>{record.act_price}</CurrencyFormatter>
       )
@@ -113,31 +120,24 @@ export default function JobLinesComponent({ jobLines, form, handleSubmit }) {
   };
 
   return (
-    <Form onSubmit={handleSubmit} {...formItemLayout}>
-      <div>Testing Place</div>
-
-      {isFieldsTouched() ? (
-        <Alert
-          message={
-            <div>
-              {t("general.messages.unsavedchanges")}
-              <Button onClick={() => resetFields()}>
-                {t("general.actions.reset")}
-              </Button>
-            </div>
-          }
-          closable
-        />
-      ) : null}
-
-      <Table
-        size="small"
-        pagination={{ position: "bottom", defaultPageSize: 50 }}
-        columns={columns.map(item => ({ ...item }))}
-        rowKey="id"
-        dataSource={jobLines}
-        onChange={handleTableChange}
-      />
-    </Form>
+    <Table
+      title={() => {
+        return (
+          <Input.Search
+            placeholder="Search..."
+            onChange={e => {
+              e.preventDefault();
+              setSearchText(e.target.value);
+            }}
+          />
+        );
+      }}
+      size="small"
+      pagination={{ position: "bottom", defaultPageSize: 50 }}
+      columns={columns.map(item => ({ ...item }))}
+      rowKey="id"
+      dataSource={jobLines}
+      onChange={handleTableChange}
+    />
   );
 }