84 lines
2.9 KiB
TypeScript
84 lines
2.9 KiB
TypeScript
import { DealProductSchema } from "../../../client";
|
||
import { ContextModalProps } from "@mantine/modals";
|
||
import { Button, Flex, rem } from "@mantine/core";
|
||
import { useState } from "react";
|
||
import ObjectMultiSelect from "../../../components/ObjectMultiSelect/ObjectMultiSelect.tsx";
|
||
import { notifications } from "../../../shared/lib/notifications.ts";
|
||
|
||
type Props = {
|
||
dealProducts: DealProductSchema[];
|
||
dealProduct: DealProductSchema;
|
||
onSelect: (
|
||
sourceProduct: DealProductSchema,
|
||
destinationProducts: DealProductSchema[]
|
||
) => void;
|
||
};
|
||
|
||
const SelectDealProductsModal = ({
|
||
context,
|
||
id,
|
||
innerProps,
|
||
}: ContextModalProps<Props>) => {
|
||
const [dealProducts, setDealProducts] = useState<DealProductSchema[]>([]);
|
||
const onSelectClick = () => {
|
||
if (!dealProducts) {
|
||
notifications.error({
|
||
message:
|
||
"Выберите товары на которые необходимо продублировать услуги",
|
||
});
|
||
return;
|
||
}
|
||
innerProps.onSelect(innerProps.dealProduct, dealProducts);
|
||
context.closeContextModal(id);
|
||
};
|
||
const onDuplicateAllClick = () => {
|
||
innerProps.onSelect(
|
||
innerProps.dealProduct,
|
||
innerProps.dealProducts.filter(
|
||
item => item !== innerProps.dealProduct
|
||
)
|
||
);
|
||
context.closeContextModal(id);
|
||
};
|
||
return (
|
||
<Flex
|
||
direction={"column"}
|
||
gap={rem(10)}>
|
||
<Flex>
|
||
<ObjectMultiSelect<DealProductSchema>
|
||
w={"100%"}
|
||
label={"Товары"}
|
||
placeholder={
|
||
"Выберите товары на которые нужно продублировать услуги"
|
||
}
|
||
onChange={setDealProducts}
|
||
value={dealProducts}
|
||
data={innerProps.dealProducts}
|
||
getLabelFn={item => item.product.name}
|
||
getValueFn={item => item.product.id.toString()}
|
||
filterBy={item => item !== innerProps.dealProduct}
|
||
/>
|
||
</Flex>
|
||
<Flex
|
||
gap={rem(10)}
|
||
justify={"flex-end"}>
|
||
<Button
|
||
variant={"subtle"}
|
||
onClick={() => context.closeContextModal(id)}>
|
||
Отменить
|
||
</Button>
|
||
<Button onClick={onDuplicateAllClick}>
|
||
Продублировать на все товары
|
||
</Button>
|
||
<Button
|
||
onClick={onSelectClick}
|
||
variant={"default"}>
|
||
Продублировать
|
||
</Button>
|
||
</Flex>
|
||
</Flex>
|
||
);
|
||
};
|
||
|
||
export default SelectDealProductsModal;
|