diff --git a/client/src/components/vendor-search-select/vendor-search-select.component.jsx b/client/src/components/vendor-search-select/vendor-search-select.component.jsx index 465007841..7f3c67729 100644 --- a/client/src/components/vendor-search-select/vendor-search-select.component.jsx +++ b/client/src/components/vendor-search-select/vendor-search-select.component.jsx @@ -1,6 +1,7 @@ import { HeartOutlined } from "@ant-design/icons"; -import { Select, Tag } from "antd"; +import { Select, Space, Tag } from "antd"; import React, { forwardRef, useEffect, useState } from "react"; +import PhoneNumberFormatter from "../../utils/PhoneFormatter"; const { Option } = Select; //To be used as a form element only. @@ -35,6 +36,7 @@ const VendorSearchSelect = ( style={{ width: "100%", }} + dropdownMatchSelectWidth={false} onChange={setOption} optionFilterProp="name" onSelect={onSelect} @@ -50,10 +52,15 @@ const VendorSearchSelect = ( >
{o.name}
- - {o.discount && o.discount !== 0 ? ( - {`${o.discount * 100}%`} - ) : null} + + + {o.phone && ( + {o.phone} + )} + {o.discount && o.discount !== 0 ? ( + {`${o.discount * 100}%`} + ) : null} +
)) @@ -64,9 +71,14 @@ const VendorSearchSelect = (
{o.name}
- {o.discount && o.discount !== 0 ? ( - {`${o.discount * 100}%`} - ) : null} + + {o.phone && ( + {o.phone} + )} + {o.discount && o.discount !== 0 ? ( + {`${o.discount * 100}%`} + ) : null} +
)) diff --git a/client/src/graphql/vendors.queries.js b/client/src/graphql/vendors.queries.js index d4a3986cf..f18b124ff 100644 --- a/client/src/graphql/vendors.queries.js +++ b/client/src/graphql/vendors.queries.js @@ -87,6 +87,7 @@ export const QUERY_ALL_VENDORS_FOR_ORDER = gql` discount email active + phone } jobs(where: { id: { _eq: $jobId } }) { v_make_desc