feat: İhaleist - Akıllı İhale Takip ve Analiz Platformu (Full PRD + 7 Enterprise Modül)
This commit is contained in:
@@ -0,0 +1,203 @@
|
||||
import React, { useState } from 'react';
|
||||
import { useApp } from '../context/AppContext';
|
||||
import { Globe, Bot, Sparkles, CheckCircle2, ShieldCheck, Tag, X, Loader2, Database, ArrowRight } from 'lucide-react';
|
||||
import confetti from 'canvas-confetti';
|
||||
|
||||
export const CompanyScannerModal = () => {
|
||||
const { isCompanyScannerOpen, setIsCompanyScannerOpen, userProfile, scanCompanyWebsite } = useApp();
|
||||
|
||||
const [urlInput, setUrlInput] = useState(userProfile.website || 'https://www.tanriverdimedikal.com.tr');
|
||||
const [isScanning, setIsScanning] = useState(false);
|
||||
const [scanStep, setScanStep] = useState(0);
|
||||
const [scanSuccess, setScanSuccess] = useState(false);
|
||||
|
||||
if (!isCompanyScannerOpen) return null;
|
||||
|
||||
const handleStartScan = async (e) => {
|
||||
e.preventDefault();
|
||||
if (!urlInput.trim()) return;
|
||||
|
||||
setIsScanning(true);
|
||||
setScanSuccess(false);
|
||||
setScanStep(1);
|
||||
|
||||
setTimeout(() => setScanStep(2), 800);
|
||||
setTimeout(() => setScanStep(3), 1600);
|
||||
|
||||
const capabilities = await scanCompanyWebsite(urlInput);
|
||||
setIsScanning(false);
|
||||
setScanSuccess(true);
|
||||
confetti({ particleCount: 70, spread: 60 });
|
||||
};
|
||||
|
||||
const caps = userProfile.scrapedCapabilities;
|
||||
|
||||
return (
|
||||
<div className="fixed inset-0 z-50 flex items-center justify-center p-4 bg-slate-900/70 backdrop-blur-xs animate-fade-in">
|
||||
<div className="bg-white rounded-2xl border border-slate-200 shadow-2xl w-full max-w-3xl overflow-hidden my-auto flex flex-col max-h-[92vh]">
|
||||
|
||||
{/* Header */}
|
||||
<div className="bg-linear-to-r from-blue-900 via-slate-900 to-indigo-900 text-white px-6 py-4 flex items-center justify-between">
|
||||
<div className="flex items-center gap-3">
|
||||
<div className="w-10 h-10 rounded-xl bg-blue-600 flex items-center justify-center text-white shadow-md">
|
||||
<Globe className="w-6 h-6" />
|
||||
</div>
|
||||
<div>
|
||||
<h2 className="font-extrabold text-base flex items-center gap-2">
|
||||
Firma Web Sitesi Tarama & AI Profilleme Motoru
|
||||
</h2>
|
||||
<p className="text-xs text-blue-200">Web sitenizi tarayarak ürettiğiniz ürün ve hizmetleri otomatik ihale veritabanına işleyin.</p>
|
||||
</div>
|
||||
</div>
|
||||
<button
|
||||
onClick={() => setIsCompanyScannerOpen(false)}
|
||||
className="text-slate-400 hover:text-white p-1 rounded-lg transition-colors"
|
||||
>
|
||||
<X className="w-6 h-6" />
|
||||
</button>
|
||||
</div>
|
||||
|
||||
{/* Modal Body */}
|
||||
<div className="p-6 space-y-6 overflow-y-auto">
|
||||
|
||||
{/* URL Form */}
|
||||
<form onSubmit={handleStartScan} className="bg-slate-50 p-4 rounded-xl border border-slate-200 space-y-3">
|
||||
<label className="block text-xs font-bold text-slate-800 uppercase tracking-wider">
|
||||
FİRMANIZA AİT WEB SİTESİ ADRESİ
|
||||
</label>
|
||||
<div className="flex gap-2">
|
||||
<div className="relative flex-1">
|
||||
<Globe className="w-4 h-4 text-slate-400 absolute left-3 top-1/2 -translate-y-1/2" />
|
||||
<input
|
||||
type="url"
|
||||
required
|
||||
value={urlInput}
|
||||
onChange={(e) => setUrlInput(e.target.value)}
|
||||
placeholder="https://www.firmaniz.com.tr"
|
||||
className="w-full bg-white border border-slate-300 rounded-lg pl-9 pr-4 py-2.5 text-xs text-slate-900 font-semibold focus:ring-2 focus:ring-blue-500"
|
||||
/>
|
||||
</div>
|
||||
<button
|
||||
type="submit"
|
||||
disabled={isScanning}
|
||||
className="bg-blue-600 hover:bg-blue-500 text-white font-extrabold px-5 py-2.5 rounded-lg text-xs flex items-center gap-2 transition-colors shadow-md disabled:opacity-50 shrink-0"
|
||||
>
|
||||
{isScanning ? <Loader2 className="w-4 h-4 animate-spin" /> : <Sparkles className="w-4 h-4 text-amber-300" />}
|
||||
<span>{isScanning ? 'Tarama Sürüyor...' : 'Web Sitemi Tara & Profili İşle'}</span>
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
{/* Scanning Live Indicator */}
|
||||
{isScanning && (
|
||||
<div className="bg-blue-50 border border-blue-200 p-5 rounded-xl space-y-3 animate-fade-in">
|
||||
<div className="flex items-center justify-between text-xs font-extrabold text-blue-900">
|
||||
<span className="flex items-center gap-2">
|
||||
<Loader2 className="w-4 h-4 text-blue-600 animate-spin" />
|
||||
Yapay Zeka Taraması ve Otomatik Veri Çıkarımı Sürüyor...
|
||||
</span>
|
||||
<span>%{(scanStep * 33).toFixed(0)}</span>
|
||||
</div>
|
||||
|
||||
<div className="w-full bg-blue-200 rounded-full h-2 overflow-hidden">
|
||||
<div
|
||||
className="bg-blue-600 h-2 rounded-full transition-all duration-500"
|
||||
style={{ width: `${scanStep * 33}%` }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="space-y-1 text-xs text-slate-600 font-medium">
|
||||
<p className={scanStep >= 1 ? 'text-blue-900 font-bold' : 'text-slate-400'}>
|
||||
1. 🌐 {urlInput} alan adına bağlanıldı ve HTML sayfaları alındı.
|
||||
</p>
|
||||
<p className={scanStep >= 2 ? 'text-blue-900 font-bold' : 'text-slate-400'}>
|
||||
2. 📄 "Hakkımızda", "Ürünler" ve "Belgelerimiz" sayfaları metin analizine tabi tutuldu.
|
||||
</p>
|
||||
<p className={scanStep >= 3 ? 'text-blue-900 font-bold' : 'text-slate-400'}>
|
||||
3. 💾 Faaliyet alanları ve sertifikalar çıkartılarak İhaleist veritabanına işlendi.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{scanSuccess && (
|
||||
<div className="bg-emerald-50 border border-emerald-200 text-emerald-900 p-4 rounded-xl text-xs font-bold flex items-center gap-2 animate-fade-in shadow-xs">
|
||||
<CheckCircle2 className="w-5 h-5 text-emerald-600 shrink-0" />
|
||||
<span>Web siteniz başarıyla tarandı ve firma yetkinlikleriniz veritabanına kaydedildi! İhale uyum skorunuz güncellendi.</span>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* Current Extracted Capabilities Database View */}
|
||||
{caps && (
|
||||
<div className="space-y-4">
|
||||
<div className="flex items-center justify-between border-b border-slate-200 pb-2">
|
||||
<h3 className="font-extrabold text-sm text-slate-900 flex items-center gap-2">
|
||||
<Database className="w-4 h-4 text-blue-600" /> Veritabanındaki Kayıtlı Firma Profili
|
||||
</h3>
|
||||
<span className="text-[10px] text-slate-400 font-semibold">Son Tarama: {caps.scrapedAt}</span>
|
||||
</div>
|
||||
|
||||
<div className="grid grid-cols-1 md:grid-cols-3 gap-4">
|
||||
|
||||
{/* Sectors */}
|
||||
<div className="bg-slate-50 p-4 rounded-xl border border-slate-200 space-y-2">
|
||||
<span className="font-bold text-xs text-slate-800 uppercase tracking-wider flex items-center gap-1.5">
|
||||
<Tag className="w-3.5 h-3.5 text-blue-600" /> Algılanan Sektörler
|
||||
</span>
|
||||
<div className="space-y-1">
|
||||
{caps.extractedSectors?.map((s, i) => (
|
||||
<span key={i} className="block text-xs font-semibold text-slate-700 bg-white border border-slate-200 p-1.5 rounded-lg">
|
||||
{s}
|
||||
</span>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Products */}
|
||||
<div className="bg-slate-50 p-4 rounded-xl border border-slate-200 space-y-2">
|
||||
<span className="font-bold text-xs text-slate-800 uppercase tracking-wider flex items-center gap-1.5">
|
||||
<Bot className="w-3.5 h-3.5 text-emerald-600" /> Ürün & Hizmet Kataloğu
|
||||
</span>
|
||||
<div className="space-y-1">
|
||||
{caps.extractedProducts?.map((p, i) => (
|
||||
<span key={i} className="block text-xs font-semibold text-slate-700 bg-white border border-slate-200 p-1.5 rounded-lg">
|
||||
📦 {p}
|
||||
</span>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Certifications */}
|
||||
<div className="bg-slate-50 p-4 rounded-xl border border-slate-200 space-y-2">
|
||||
<span className="font-bold text-xs text-slate-800 uppercase tracking-wider flex items-center gap-1.5">
|
||||
<ShieldCheck className="w-3.5 h-3.5 text-purple-600" /> Yetkinlik Belgeleri & ÜTS
|
||||
</span>
|
||||
<div className="space-y-1">
|
||||
{caps.extractedCertifications?.map((c, i) => (
|
||||
<span key={i} className="block text-xs font-semibold text-slate-700 bg-white border border-slate-200 p-1.5 rounded-lg">
|
||||
📜 {c}
|
||||
</span>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
</div>
|
||||
|
||||
{/* Footer */}
|
||||
<div className="bg-slate-50 p-4 border-t border-slate-200 flex justify-end">
|
||||
<button
|
||||
onClick={() => setIsCompanyScannerOpen(false)}
|
||||
className="bg-slate-800 hover:bg-slate-700 text-white font-bold text-xs px-6 py-2 rounded-lg transition-colors"
|
||||
>
|
||||
Tamam
|
||||
</button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
Reference in New Issue
Block a user