function MainComponent() { const [activePhase, setActivePhase] = useState(null); const [progress, setProgress] = useState({ development: 0, preProduction: 0, production: 0, postProduction: 0, distribution: 0 }); const phases = [ { id: 'development', name: 'التطوير', icon: 'fa-lightbulb', tasks: [ 'تصميم التجربة الافتراضية', 'تطوير السيناريو التفاعلي', 'تحديد المتطلبات التقنية', 'دراسة الجدوى' ] }, { id: 'preProduction', name: 'ما قبل الإنتاج', icon: 'fa-tasks', tasks: [ 'تصميم النماذج الأولية', 'اختيار المنصة والتقنيات', 'تجهيز فريق العمل', 'وضع خطة التطوير' ] }, { id: 'production', icon: 'fa-vr-cardboard', name: 'الإنتاج', tasks: [ 'تطوير الأصول الرقمية', 'برمجة التفاعلات', 'تطوير الواجهات', 'اختبارات الأداء' ] }, { id: 'postProduction', name: 'ما بعد الإنتاج', icon: 'fa-sliders-h', tasks: [ 'ضبط الجودة', 'تحسين الأداء', 'اختبارات المستخدمين', 'التوثيق الفني' ] }, { id: 'distribution', name: 'التوزيع', icon: 'fa-share-alt', tasks: [ 'خطة النشر', 'إعداد المتجر الافتراضي', 'تجهيز الدعم الفني', 'خطة التحديثات' ] } ]; useEffect(()=>{ const loadProgress = async ()=>{ try { const response = await fetch('/api/film-plan', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ action: 'get', type: 'virtual' }) }); if (!response.ok) { throw new Error('فشل تحميل البيانات'); } const data = await response.json(); if (data.progress) { setProgress(data.progress); } } catch (error) { console.error('Error loading progress:', error); } }; loadProgress(); }, []); const calculateTotalProgress = ()=>{ const values = Object.values(progress); return Math.round(values.reduce((a, b)=>a + b, 0) / values.length); }; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-gray-50 p-6", dir: "rtl", __source: { fileName: "", lineNumber: 103, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mx-auto max-w-7xl", __source: { fileName: "", lineNumber: 104, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-8 flex items-center justify-between", __source: { fileName: "", lineNumber: 105, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 106, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-3xl font-bold text-gray-900", __source: { fileName: "", lineNumber: 107, columnNumber: 13 }, __self: this }, "خطة إنتاج الفيلم الافتراضي"), /*#__PURE__*/ React.createElement("p", { className: "mt-2 text-gray-600", __source: { fileName: "", lineNumber: 110, columnNumber: 13 }, __self: this }, "نسبة الإنجاز الكلية: ", calculateTotalProgress(), "%"))), /*#__PURE__*/ React.createElement("div", { className: "mb-12 grid gap-8 md:grid-cols-5", __source: { fileName: "", lineNumber: 116, columnNumber: 9 }, __self: this }, phases.map((phase, index)=>/*#__PURE__*/ React.createElement("div", { key: phase.id, className: `relative ${index !== phases.length - 1 ? 'after:absolute after:top-1/2 after:h-0.5 after:w-full after:bg-gray-200 after:content-[""] md:after:right-full' : ''}`, __source: { fileName: "", lineNumber: 118, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "relative z-10 rounded-lg bg-white p-6 shadow transition-all hover:shadow-lg", __source: { fileName: "", lineNumber: 126, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-4 flex items-center justify-center", __source: { fileName: "", lineNumber: 127, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: `flex h-16 w-16 items-center justify-center rounded-full ${progress[phase.id] >= 100 ? 'bg-green-100 text-green-600' : 'bg-blue-100 text-blue-600'}`, __source: { fileName: "", lineNumber: 128, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: `fas ${phase.icon} text-2xl`, __source: { fileName: "", lineNumber: 135, columnNumber: 21 }, __self: this }))), /*#__PURE__*/ React.createElement("h3", { className: "mb-2 text-center text-lg font-medium text-gray-900", __source: { fileName: "", lineNumber: 138, columnNumber: 17 }, __self: this }, phase.name), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 141, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "h-2 rounded-full bg-gray-200", __source: { fileName: "", lineNumber: 142, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "h-2 rounded-full bg-blue-600 transition-all", style: { width: `${progress[phase.id]}%` }, __source: { fileName: "", lineNumber: 143, columnNumber: 21 }, __self: this })), /*#__PURE__*/ React.createElement("p", { className: "mt-2 text-center text-sm text-gray-600", __source: { fileName: "", lineNumber: 148, columnNumber: 19 }, __self: this }, progress[phase.id], "% مكتمل")), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setActivePhase(phase), className: "w-full rounded-md bg-blue-600 px-4 py-2 text-sm font-medium text-white hover:bg-blue-700", __source: { fileName: "", lineNumber: 152, columnNumber: 17 }, __self: this }, "عرض التفاصيل"))))), activePhase && /*#__PURE__*/ React.createElement("div", { className: "rounded-lg bg-white p-6 shadow", __source: { fileName: "", lineNumber: 164, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-6 flex items-center justify-between", __source: { fileName: "", lineNumber: 165, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-bold text-gray-900", __source: { fileName: "", lineNumber: 166, columnNumber: 15 }, __self: this }, activePhase.name), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setActivePhase(null), className: "text-gray-400 hover:text-gray-500", __source: { fileName: "", lineNumber: 169, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-times", __source: { fileName: "", lineNumber: 173, columnNumber: 17 }, __self: this }))), /*#__PURE__*/ React.createElement("div", { className: "space-y-4", __source: { fileName: "", lineNumber: 176, columnNumber: 13 }, __self: this }, activePhase.tasks.map((task, index)=>/*#__PURE__*/ React.createElement("div", { key: index, className: "flex items-center rounded-lg border border-gray-200 p-4", __source: { fileName: "", lineNumber: 178, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "mr-4 flex h-8 w-8 items-center justify-center rounded-full bg-blue-100 text-sm text-blue-600", __source: { fileName: "", lineNumber: 182, columnNumber: 19 }, __self: this }, index + 1), /*#__PURE__*/ React.createElement("span", { className: "text-gray-700", __source: { fileName: "", lineNumber: 185, columnNumber: 19 }, __self: this }, task))))))); }