@@ -2,40 +2,25 @@ import { LoadingOutlined } from "@ant-design/icons";
|
||||
import { useLazyQuery } from "@apollo/client";
|
||||
import { Select, Space, Spin, Tag } from "antd";
|
||||
import _ from "lodash";
|
||||
import React, {forwardRef, useEffect, useState} from "react";
|
||||
import {useTranslation} from "react-i18next";
|
||||
import {
|
||||
SEARCH_JOBS_BY_ID_FOR_AUTOCOMPLETE,
|
||||
SEARCH_JOBS_FOR_AUTOCOMPLETE
|
||||
} from "../../graphql/jobs.queries";
|
||||
import React, { forwardRef, useEffect, useState } from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { SEARCH_JOBS_BY_ID_FOR_AUTOCOMPLETE, SEARCH_JOBS_FOR_AUTOCOMPLETE } from "../../graphql/jobs.queries";
|
||||
import AlertComponent from "../alert/alert.component";
|
||||
import { OwnerNameDisplayFunction } from "../owner-name-display/owner-name-display.component";
|
||||
|
||||
const {Option} = Select;
|
||||
const { Option } = Select;
|
||||
|
||||
const JobSearchSelect = (
|
||||
{
|
||||
disabled,
|
||||
convertedOnly = false,
|
||||
notInvoiced = false,
|
||||
notExported = true,
|
||||
clm_no = false,
|
||||
...restProps
|
||||
},
|
||||
{ disabled, convertedOnly = false, notInvoiced = false, notExported = true, clm_no = false, ...restProps },
|
||||
ref
|
||||
) => {
|
||||
const {t} = useTranslation();
|
||||
const { t } = useTranslation();
|
||||
const [theOptions, setTheOptions] = useState([]);
|
||||
const [callSearch, {loading, error, data}] = useLazyQuery(SEARCH_JOBS_FOR_AUTOCOMPLETE, {});
|
||||
const [callSearch, { loading, error, data }] = useLazyQuery(SEARCH_JOBS_FOR_AUTOCOMPLETE, {});
|
||||
|
||||
const [
|
||||
callIdSearch,
|
||||
{
|
||||
loading: idLoading,
|
||||
error: idError,
|
||||
data: idData
|
||||
}
|
||||
] = useLazyQuery(SEARCH_JOBS_BY_ID_FOR_AUTOCOMPLETE);
|
||||
const [callIdSearch, { loading: idLoading, error: idError, data: idData }] = useLazyQuery(
|
||||
SEARCH_JOBS_BY_ID_FOR_AUTOCOMPLETE
|
||||
);
|
||||
|
||||
const executeSearch = (v) => {
|
||||
if (v && v.variables?.search !== "" && v.variables.search.length >= 2) callSearch(v);
|
||||
@@ -48,10 +33,10 @@ const JobSearchSelect = (
|
||||
search: value,
|
||||
...(convertedOnly || notExported
|
||||
? {
|
||||
...(convertedOnly ? {isConverted: true} : {}),
|
||||
...(notExported ? {notExported: true} : {}),
|
||||
...(notInvoiced ? {notInvoiced: true} : {})
|
||||
}
|
||||
...(convertedOnly ? { isConverted: true } : {}),
|
||||
...(notExported ? { notExported: true } : {}),
|
||||
...(notInvoiced ? { notInvoiced: true } : {})
|
||||
}
|
||||
: {})
|
||||
}
|
||||
});
|
||||
@@ -59,7 +44,7 @@ const JobSearchSelect = (
|
||||
|
||||
useEffect(() => {
|
||||
if (restProps.value) {
|
||||
callIdSearch({variables: {id: restProps.value}}); // Sometimes results in a no-op. Not sure how to fix.
|
||||
callIdSearch({ variables: { id: restProps.value } }); // Sometimes results in a no-op. Not sure how to fix.
|
||||
}
|
||||
}, [restProps.value, callIdSearch]);
|
||||
|
||||
@@ -89,14 +74,14 @@ const JobSearchSelect = (
|
||||
filterOption={false}
|
||||
onSearch={handleSearch}
|
||||
//loading={loading || idLoading}
|
||||
suffixIcon={(loading || idLoading) && <Spin/>}
|
||||
notFoundContent={loading ? <LoadingOutlined/> : null}
|
||||
suffixIcon={(loading || idLoading) && <Spin />}
|
||||
notFoundContent={loading ? <LoadingOutlined /> : null}
|
||||
{...restProps}
|
||||
>
|
||||
{theOptions
|
||||
? theOptions.map((o) => (
|
||||
<Option key={o.id} value={o.id} status={o.status}>
|
||||
<Space align="center">
|
||||
<Option key={o.id} value={o.id} status={o.status}>
|
||||
<Space align="center">
|
||||
<span>
|
||||
{`${clm_no && o.clm_no ? `${o.clm_no} | ` : ""}${
|
||||
o.ro_number || t("general.labels.na")
|
||||
@@ -104,17 +89,17 @@ const JobSearchSelect = (
|
||||
o.v_model_desc || ""
|
||||
}`}
|
||||
</span>
|
||||
<Tag>
|
||||
<strong>{o.status}</strong>
|
||||
</Tag>
|
||||
</Space>
|
||||
</Option>
|
||||
))
|
||||
<Tag>
|
||||
<strong>{o.status}</strong>
|
||||
</Tag>
|
||||
</Space>
|
||||
</Option>
|
||||
))
|
||||
: null}
|
||||
</Select>
|
||||
|
||||
{error ? <AlertComponent message={error.message} type="error"/> : null}
|
||||
{idError ? <AlertComponent message={idError.message} type="error"/> : null}
|
||||
{error ? <AlertComponent message={error.message} type="error" /> : null}
|
||||
{idError ? <AlertComponent message={idError.message} type="error" /> : null}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user