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

Fix for IO-2534

Browse Source 
Signed-off-by: Dave Richer <dave@imexsystems.ca>
This commit is contained in:
Dave Richer
2024-01-08 17:03:24 -05:00
parent 2e589c44a6
commit 7589f78fe1
2 changed files with 84 additions and 77 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -16,6 +16,7 @@ const BillLineSearchSelect = (
ref={ref} ref={ref}
showSearch showSearch
popupMatchSelectWidth={false} popupMatchSelectWidth={false}
optionLabelProp={"name"}
// optionFilterProp="line_desc" // optionFilterProp="line_desc"
filterOption={(inputValue, option) => { filterOption={(inputValue, option) => {
return ( return (
@@ -57,6 +58,9 @@ const BillLineSearchSelect = (
style={{ style={{
...(item.removed ? { textDecoration: "line-through" } : {}), ...(item.removed ? { textDecoration: "line-through" } : {}),
}} }}
name={`${item.removed ? `(REMOVED) ` : ""}${item.line_desc}${
item.oem_partno ? ` - ${item.oem_partno}` : ""
}${item.alt_partno ? ` (${item.alt_partno})` : ""}`.trim()}
> >
<span> <span>
{`${item.removed ? `(REMOVED) ` : ""}${item.line_desc}${ {`${item.removed ? `(REMOVED) ` : ""}${item.line_desc}${

157
client/src/components/vendor-search-select/vendor-search-select.component.jsx
View File

@@ -1,89 +1,92 @@
import { HeartOutlined } from "@ant-design/icons"; import {HeartOutlined} from "@ant-design/icons";
import { Select, Space, Tag } from "antd"; import {Select, Space, Tag} from "antd";
import React, { forwardRef, useEffect, useState } from "react"; import React, {forwardRef, useEffect, useState} from "react";
import PhoneNumberFormatter from "../../utils/PhoneFormatter"; import PhoneNumberFormatter from "../../utils/PhoneFormatter";
const { Option } = Select;
const {Option} = Select;
//To be used as a form element only. //To be used as a form element only.
const VendorSearchSelect = ( const VendorSearchSelect = (
{ value, onChange, options, onSelect, disabled, preferredMake, showPhone }, {value, onChange, options, onSelect, disabled, preferredMake, showPhone},
ref ref
) => { ) => {
const [option, setOption] = useState(value); const [option, setOption] = useState(value);
useEffect(() => { useEffect(() => {
if (value !== option && onChange) { if (value !== option && onChange) {
onChange(option); onChange(option);
} }
}, [value, option, onChange]); }, [value, option, onChange]);
const favorites = const favorites =
preferredMake && options preferredMake && options
? options.filter( ? options.filter(
(o) => (o) =>
o.favorite.filter( o.favorite.filter(
(f) => f.toLowerCase() === preferredMake.toLowerCase() (f) => f.toLowerCase() === preferredMake.toLowerCase()
).length > 0 ).length > 0
) )
: []; : [];
return ( return (
<Select <Select
ref={ref} ref={ref}
showSearch showSearch
value={option} value={option}
style={{ style={{
width: "100%", width: "100%",
}} }}
popupMatchSelectWidth={false} popupMatchSelectWidth={false}
onChange={setOption} onChange={setOption}
optionFilterProp="name" optionFilterProp="name"
onSelect={onSelect} onSelect={onSelect}
disabled={disabled || false} disabled={disabled || false}
> optionLabelProp={"name"}
{favorites >
? favorites.map((o) => ( {favorites
<Option ? favorites.map((o) => (
key={`favorite-${o.id}`} <Option
value={o.id} key={`favorite-${o.id}`}
name={o.name} value={o.id}
discount={o.discount} name={o.name}
> discount={o.discount}
<div className="imex-flex-row"> >
<div style={{ flex: 1 }}>{o.name}</div> <div className="imex-flex-row">
<Space style={{ marginLeft: "1rem" }}> <div style={{flex: 1}}>{o.name}</div>
<HeartOutlined style={{ color: "red" }} /> <Space style={{marginLeft: "1rem"}}>
{o.phone && showPhone && ( <HeartOutlined style={{color: "red"}}/>
<PhoneNumberFormatter>{o.phone}</PhoneNumberFormatter> {o.phone && showPhone && (
)} <PhoneNumberFormatter>{o.phone}</PhoneNumberFormatter>
{o.discount && o.discount !== 0 ? ( )}
<Tag color="green">{`${o.discount * 100}%`}</Tag> {o.discount && o.discount !== 0 ? (
) : null} <Tag color="green">{`${o.discount * 100}%`}</Tag>
</Space> ) : null}
</div> </Space>
</Option> </div>
)) </Option>
: null} ))
{options : null}
? options.map((o) => ( {options
<Option key={o.id} value={o.id} name={o.name} discount={o.discount}> ? options.map((o) => (
<div className="imex-flex-row" style={{ width: "100%" }}> <Option key={o.id} value={o.id} name={o.name} discount={o.discount}>
<div style={{ flex: 1 }}>{o.name}</div> <div className="imex-flex-row" style={{width: "100%"}}>
<div style={{flex: 1}}>{o.name}</div>
<Space style={{ marginLeft: "1rem" }}> <Space style={{marginLeft: "1rem"}}>
{o.phone && showPhone && ( {o.phone && showPhone && (
<PhoneNumberFormatter>{o.phone}</PhoneNumberFormatter> <PhoneNumberFormatter>{o.phone}</PhoneNumberFormatter>
)} )}
{o.discount && o.discount !== 0 ? ( {o.discount && o.discount !== 0 ? (
<Tag color="green">{`${o.discount * 100}%`}</Tag> <Tag color="green">{`${o.discount * 100}%`}</Tag>
) : null} ) : null}
</Space> </Space>
</div> </div>
</Option> </Option>
))
: null} ))
</Select> : null}
); </Select>
);
}; };
export default forwardRef(VendorSearchSelect); export default forwardRef(VendorSearchSelect);