feat: image
This commit is contained in:
@@ -3,7 +3,7 @@ import {FC} from "react";
|
||||
import useProductsList from "../../pages/ProductsPage/hooks/useProductsList.tsx";
|
||||
import {omit} from "lodash";
|
||||
import ObjectSelect, {ObjectSelectProps} from "../ObjectSelect/ObjectSelect.tsx";
|
||||
import {ComboboxItem, OptionsFilter, SelectProps, Text, Tooltip} from "@mantine/core";
|
||||
import {ComboboxItem, OptionsFilter, SelectProps, Text, Tooltip, Image, rem} from "@mantine/core";
|
||||
import {getProductFields} from "../../types/utils.ts";
|
||||
|
||||
type RestProps = {
|
||||
@@ -20,14 +20,28 @@ const ProductSelect: FC<Props> = (props: Props) => {
|
||||
const product = products.find(product => product.id == parseInt(item.option.value));
|
||||
if (!product) return item.option.label;
|
||||
const productFields = getProductFields(product);
|
||||
const imageUrl = product.images && product.images[0] ? product.images[0].imageUrl : undefined;
|
||||
|
||||
return (
|
||||
<Tooltip
|
||||
style={{whiteSpace: "pre-line"}}
|
||||
multiline
|
||||
disabled={productFields.length === 0}
|
||||
label={productFields.map(([key, value]) => {
|
||||
return `${key.toString()}: ${value.toString()}`;
|
||||
}).join('\n')}>
|
||||
label={
|
||||
<>
|
||||
{productFields.map(([key, value]) => {
|
||||
return `${key.toString()}: ${value.toString()}`;
|
||||
}).join('\n')}
|
||||
{imageUrl && <Image
|
||||
src={imageUrl}
|
||||
alt={product.name}
|
||||
maw={rem(250)}
|
||||
/>}
|
||||
|
||||
</>
|
||||
|
||||
|
||||
}>
|
||||
<div>
|
||||
{product.name}<br/>
|
||||
{product.barcodes && <Text size={"xs"}>{product.barcodes[0]}</Text>}
|
||||
|
||||
@@ -23,8 +23,6 @@ const MarketplaceAuthDataInput: FC<Props> = (props: Props) => {
|
||||
|
||||
}
|
||||
const getOzonInputs = () => {
|
||||
// return input that sets record "Client-Id" and "Api-Key" to value
|
||||
|
||||
return (
|
||||
<>
|
||||
<TextInput
|
||||
|
||||
Reference in New Issue
Block a user