---
license: apache-2.0
language:
- fa
base_model:
- deepseek-ai/DeepSeek-V3-0324
---
import React, { useState } from 'react';

const ProposalApp = () => {
  // مراحل اصلی تدوین پروپوزال
  const stages = [
    {
      id: 1,
      title: "انتخاب عنوان و موضوع تحقیق",
      description: "در این مرحله عنوان مناسب و موضوع تحقیق خود را انتخاب می‌کنید",
      form: "titleForm"
    },
    {
      id: 2,
      title: "بیان مسأله",
      description: "توضیح مشکل یا سؤالی که تحقیق به دنبال پاسخگویی به آن است",
      form: "problemForm"
    },
    {
      id: 3,
      title: "پیشینه تحقیق",
      description: "مرور پژوهش‌های قبلی در این حوزه",
      form: "literatureForm"
    },
    {
      id: 4,
      title: "اهداف و سؤالات پژوهش",
      description: "تعیین اهداف کلی، اهداف جزئی و سؤالات یا فرضیه‌های تحقیق",
      form: "objectivesForm"
    },
    {
      id: 5,
      title: "روش‌شناسی تحقیق",
      description: "توضیح روش‌های جمع‌آوری و تحلیل داده‌ها",
      form: "methodologyForm"
    },
    {
      id: 6,
      title: "تدوین ابزار تحقیق",
      description: "طراحی یا انتخاب ابزارهای مناسب برای جمع‌آوری داده‌ها",
      form: "toolsForm"
    },
    {
      id: 7,
      title: "روش تحلیل داده‌ها",
      description: "توضیح روش‌های آماری یا کیفی تحلیل داده‌ها",
      form: "analysisForm"
    },
    {
      id: 8,
      title: "زمان‌بندی و منابع",
      description: "تعیین جدول زمانی انجام پژوهش و فهرست منابع",
      form: "resourcesForm"
    }
  ];

  // متغیرهای وضعیت
  const [currentStage, setCurrentStage] = useState(1);
  const [proposalData, setProposalData] = useState({
    title: "",
    problem: "",
    literature: "",
    objectives: "",
    questions: [],
    methodology: "",
    tools: "",
    analysis: "",
    timeline: "",
    references: ""
  });
  const [showPreview, setShowPreview] = useState(false);

  // مدیریت تغییر فیلدها
  const handleChange = (field, value) => {
    setProposalData({
      ...proposalData,
      [field]: value
    });
  };

  // رفتن به مرحله بعد
  const goToNextStage = () => {
    if (currentStage < stages.length) {
      setCurrentStage(currentStage + 1);
    } else {
      setShowPreview(true);
    }
  };

  // رفتن به مرحله قبل
  const goToPreviousStage = () => {
    if (currentStage > 1) {
      setCurrentStage(currentStage - 1);
    }
  };

  // فرم مرحله اول: انتخاب عنوان
  const TitleForm = () => (
    <div className="bg-white p-6 rounded-lg shadow-md">
      <h3 className="text-lg font-bold mb-4">انتخاب عنوان تحقیق</h3>
      <div className="mb-6">
        <label className="block text-gray-700 mb-2">عنوان پروپوزال:</label>
        <input
          type="text"
          value={proposalData.title}
          onChange={(e) => handleChange("title", e.target.value)}
          className="w-full border rounded p-2 text-right"
          placeholder="عنوان پروپوزال خود را وارد کنید"
          dir="rtl"
        />
      </div>

      <div className="bg-blue-50 p-4 rounded-md mb-4">
        <h4 className="font-bold text-blue-800 mb-2">نکات برای انتخاب عنوان مناسب:</h4>
        <ul className="list-disc pr-5 text-blue-700">
          <li>عنوان باید مختصر، دقیق و گویا باشد (معمولاً زیر 20 کلمه)</li>
          <li>متغیرهای اصلی تحقیق باید در عنوان مشخص باشند</li>
          <li>جامعه آماری یا گروه هدف در عنوان مشخص شود</li>
          <li>از کلمات مبهم و کلی اجتناب کنید</li>
        </ul>
      </div>

      <div className="bg-green-50 p-4 rounded-md mb-4">
        <h4 className="font-bold text-green-800 mb-2">نمونه‌های عنوان مناسب:</h4>
        <ul className="list-disc pr-5 text-green-700">
          <li>بررسی رابطه هوش هیجانی و موفقیت تحصیلی در دانشجویان روانشناسی دانشگاه تهران</li>
          <li>تأثیر آموزش مهارت‌های مدیریت استرس بر کاهش اضطراب امتحان در دانش‌آموزان دبیرستانی</li>
          <li>مقایسه اثربخشی درمان شناختی-رفتاری و دارودرمانی در کاهش علائم افسردگی بیماران مبتلا به افسردگی اساسی</li>
        </ul>
      </div>
    </div>
  );

  // فرم مرحله دوم: بیان مسأله
  const ProblemForm = () => (
    <div className="bg-white p-6 rounded-lg shadow-md">
      <h3 className="text-lg font-bold mb-4">بیان مسأله</h3>
      <div className="mb-6">
        <label className="block text-gray-700 mb-2">مسأله تحقیق:</label>
        <textarea
          value={proposalData.problem}
          onChange={(e) => handleChange("problem", e.target.value)}
          className="w-full border rounded p-2 h-32 text-right"
          placeholder="مسأله تحقیق خود را توضیح دهید"
          dir="rtl"
        />
      </div>

      <div className="bg-blue-50 p-4 rounded-md mb-4">
        <h4 className="font-bold text-blue-800 mb-2">راهنمای نوشتن بیان مسأله:</h4>
        <ul className="list-disc pr-5 text-blue-700">
          <li>مسأله را به روشنی تعریف کنید و اهمیت آن را توضیح دهید</li>
          <li>خلأهای موجود در دانش فعلی را بیان کنید</li>
          <li>به آمار و ارقام مرتبط با مسأله اشاره کنید</li>
          <li>ضرورت و فواید انجام این تحقیق را توضیح دهید</li>
        </ul>
      </div>

      <div className="bg-green-50 p-4 rounded-md mb-4">
        <h4 className="font-bold text-green-800 mb-2">نمونه بیان مسأله:</h4>
        <p className="text-green-700 text-right pr-5">
          اضطراب امتحان یکی از مشکلات شایع در بین دانش‌آموزان است که طبق مطالعات، حدود 30 درصد دانش‌آموزان به آن مبتلا هستند. 
          این اختلال می‌تواند به افت عملکرد تحصیلی، کاهش اعتماد به نفس و ایجاد مشکلات روانی دیگر منجر شود. 
          با وجود مطالعات متعدد در این زمینه، هنوز روش مؤثر و کاربردی برای مدیریت اضطراب امتحان در بافت مدارس ایران به‌طور 
          کامل بررسی نشده است. این تحقیق قصد دارد تا اثربخشی روش‌های مختلف مدیریت استرس را بر کاهش اضطراب امتحان 
          دانش‌آموزان بررسی کند.
        </p>
      </div>
    </div>
  );

  // فرم‌های سایر مراحل به طور مشابه ایجاد می‌شوند...

  // نمایش پیش‌نمایش پروپوزال
  const ProposalPreview = () => (
    <div className="bg-white p-6 rounded-lg shadow-md text-right" dir="rtl">
      <h2 className="text-xl font-bold mb-6 text-center">پیش‌نمایش پروپوزال</h2>
      
      <h3 className="text-lg font-bold mb-2">عنوان تحقیق:</h3>
      <p className="mb-4 p-2 bg-gray-50 rounded">{proposalData.title || "عنوان وارد نشده است"}</p>
      
      <h3 className="text-lg font-bold mb-2">بیان مسأله:</h3>
      <p className="mb-4 p-2 bg-gray-50 rounded">{proposalData.problem || "بیان مسأله وارد نشده است"}</p>
      
      <h3 className="text-lg font-bold mb-2">پیشینه تحقیق:</h3>
      <p className="mb-4 p-2 bg-gray-50 rounded">{proposalData.literature || "پیشینه تحقیق وارد نشده است"}</p>
      
      <h3 className="text-lg font-bold mb-2">اهداف تحقیق:</h3>
      <p className="mb-4 p-2 bg-gray-50 rounded">{proposalData.objectives || "اهداف تحقیق وارد نشده است"}</p>
      
      <button 
        onClick={() => setShowPreview(false)}
        className="bg-blue-500 text-white px-4 py-2 rounded hover:bg-blue-600 mt-4"
      >
        بازگشت به ویرایش
      </button>
    </div>
  );

  // انتخاب فرم مناسب برای مرحله فعلی
  const renderCurrentForm = () => {
    switch(currentStage) {
      case 1:
        return <TitleForm />;
      case 2:
        return <ProblemForm />;
      // سایر حالت‌ها بر اساس مراحل اضافه می‌شوند
      default:
        return <div>در حال آماده‌سازی...</div>;
    }
  };

  return (
    <div className="mx-auto max-w-4xl p-4 bg-gray-50 min-h-screen">
      <h1 className="text-2xl font-bold text-center mb-6">راهنمای نوشتن پروپوزال تحقیق روانشناسی</h1>
      
      {!showPreview ? (
        <>
          {/* نمایش مراحل */}
          <div className="flex justify-center mb-8 overflow-x-auto py-2">
            {stages.map((stage) => (
              <div 
                key={stage.id}
                className={`px-3 py-1 mx-1 rounded-full text-sm cursor-pointer ${
                  currentStage === stage.id 
                    ? "bg-blue-600 text-white" 
                    : currentStage > stage.id 
                      ? "bg-green-100 text-green-800" 
                      : "bg-gray-200 text-gray-600"
                }`}
                onClick={() => setCurrentStage(stage.id)}
              >
                {stage.id}. {stage.title}
              </div>
            ))}
          </div>
          
          {/* توضیحات مرحله فعلی */}
          <div className="bg-blue-100 p-4 rounded-md mb-6 text-right" dir="rtl">
            <h2 className="font-bold text-lg mb-2">{stages[currentStage-1].title}</h2>
            <p>{stages[currentStage-1].description}</p>
          </div>
          
          {/* فرم مرحله فعلی */}
          {renderCurrentForm()}
          
          {/* دکمه‌های ناوبری */}
          <div className="flex justify-between mt-6">
            <button 
              onClick={goToPreviousStage}
              disabled={currentStage === 1}
              className={`px-4 py-2 rounded ${
                currentStage === 1 
                  ? "bg-gray-300 text-gray-500 cursor-not-allowed" 
                  : "bg-gray-500 text-white hover:bg-gray-600"
              }`}
            >
              مرحله قبل
            </button>
            
            <button 
              onClick={goToNextStage}
              className="bg-blue-500 text-white px-4 py-2 rounded hover:bg-blue-600"
            >
              {currentStage < stages.length ? "مرحله بعد" : "پیش‌نمایش پروپوزال"}
            </button>
          </div>
        </>
      ) : (
        <ProposalPreview />
      )}
    </div>
  );
};

export default ProposalApp;