47 lines
1012 B
JavaScript
47 lines
1012 B
JavaScript
import { Select, Tag } from "antd";
|
|
import React, { useEffect, useState } from "react";
|
|
const { Option } = Select;
|
|
|
|
//To be used as a form element only.
|
|
|
|
const VendorSearchSelect = ({
|
|
value,
|
|
onChange,
|
|
options,
|
|
onSelect,
|
|
disabled,
|
|
}) => {
|
|
const [option, setOption] = useState(value);
|
|
|
|
useEffect(() => {
|
|
if (onChange) {
|
|
onChange(option);
|
|
}
|
|
}, [option, onChange]);
|
|
|
|
return (
|
|
<Select
|
|
showSearch
|
|
value={option}
|
|
style={{
|
|
width: 300,
|
|
}}
|
|
onChange={setOption}
|
|
optionFilterProp='name'
|
|
onSelect={onSelect}
|
|
disabled={disabled || false}>
|
|
{options
|
|
? options.map((o) => (
|
|
<Option key={o.id} value={o.id} name={o.name} discount={o.discount}>
|
|
<div style={{ display: "flex" }}>
|
|
{o.name}
|
|
<Tag color='green'>{`${o.discount * 100}%`}</Tag>
|
|
</div>
|
|
</Option>
|
|
))
|
|
: null}
|
|
</Select>
|
|
);
|
|
};
|
|
export default VendorSearchSelect;
|