71 lines
2.2 KiB
TypeScript
71 lines
2.2 KiB
TypeScript
import React, { useState } from 'react';
|
||
import { Lead } from '../../../entities/crm/lead';
|
||
import { Modal } from '../../../shared/ui/Modal';
|
||
import { Button } from '../../../shared/ui/Button';
|
||
|
||
export interface LeadConversionModalProps {
|
||
isOpen: boolean;
|
||
lead: Lead | null;
|
||
onClose: () => void;
|
||
onConvert: (leadId: string, dealTitle: string) => Promise<void> | void;
|
||
}
|
||
|
||
export const LeadConversionModal: React.FC<LeadConversionModalProps> = ({
|
||
isOpen,
|
||
lead,
|
||
onClose,
|
||
onConvert,
|
||
}) => {
|
||
const [prevLead, setPrevLead] = useState<Lead | null>(null);
|
||
const [dealTitle, setDealTitle] = useState('');
|
||
|
||
if (lead !== prevLead) {
|
||
setPrevLead(lead);
|
||
setDealTitle(lead ? `Сделка: ${lead.title}` : '');
|
||
}
|
||
|
||
const handleConfirm = async () => {
|
||
if (!lead) return;
|
||
await onConvert(lead.id, dealTitle || lead.title);
|
||
};
|
||
|
||
return (
|
||
<Modal
|
||
isOpen={isOpen}
|
||
onClose={onClose}
|
||
title="Конвертация лида в сделку и контакт"
|
||
size="md"
|
||
>
|
||
<div className="space-y-4 text-xs">
|
||
<p className="text-krona-secondary">
|
||
При конвертации будет автоматически создан Контакт клиента и новая Сделка на этапе «Предложение».
|
||
</p>
|
||
<div>
|
||
<label className="block font-semibold text-krona-primary mb-1">
|
||
Название новой сделки:
|
||
</label>
|
||
<input
|
||
type="text"
|
||
value={dealTitle}
|
||
onChange={(e) => setDealTitle(e.target.value)}
|
||
className="w-full px-3 py-1.5 bg-krona-workspace border border-krona-border rounded-lg text-krona-primary focus:outline-none focus:border-krona-green"
|
||
/>
|
||
</div>
|
||
|
||
<div className="flex justify-end gap-2 pt-2 border-t border-krona-border">
|
||
<Button variant="secondary" size="sm" onClick={onClose}>
|
||
Отмена
|
||
</Button>
|
||
<Button
|
||
variant="primary"
|
||
size="sm"
|
||
data-testid="confirm-convert-lead-btn"
|
||
onClick={handleConfirm}
|
||
>
|
||
Подтвердить конвертацию
|
||
</Button>
|
||
</div>
|
||
</div>
|
||
</Modal>
|
||
);
|
||
};
|