feat: image

This commit is contained in:
2024-09-02 15:13:19 +03:00
parent 3eb940d452
commit 51635c1dc0
2 changed files with 18 additions and 6 deletions

View File

@@ -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>}

View File

@@ -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