added surveys

This commit is contained in:
Dobromir Popov
2024-06-17 15:18:28 +03:00
parent 4da00d4ec3
commit 94597e2440
6 changed files with 453 additions and 310 deletions

View File

@ -13,39 +13,60 @@ const SurveyPage = ({ serverSurveys }) => {
return (
<Layout>
<div className="view-location-page max-w-4xl mx-auto my-8">
<h1>Survey Page</h1>
</div>
<div className="max-w-4xl mx-auto my-8 p-4 bg-white shadow-md rounded">
<h1 className="text-2xl font-bold mb-4">Анкети</h1>
<div className="flex flex-row justify-between">
<div className="w-1/2">
<h2>Surveys</h2>
<ul>
{serverSurveys.map((survey) => (
<li key={survey.id}>
{survey.id}: {survey.context}: <br />
{Object.entries(_.groupBy(survey.messages, 'answer')).map(([key, items]) => (
<div key={key}>
{key}: {items.length}
<div className="flex flex-row justify-between">
<div className="w-1/2 pr-4">
<h2 className="text-xl font-semibold mb-4">Списък</h2>
<ul className="space-y-4">
{serverSurveys.map((survey) => (
<li key={survey.id} className="p-4 border rounded bg-gray-50 shadow-sm">
<p className="font-medium">{survey.id}: {survey.content}</p>
{/* <p className="text-gray-700">{survey.publicFrom} - {survey.publicUntil}</p> */}
<p className="mt-2"> [{survey.answers}] </p>
<div className="mt-2">
{Object.entries(_.groupBy(survey.messages, message => message.answer || "Без отговор")).map(([key, items]) => (
<div key={key} className="text-sm text-gray-700">
{key}: {items.length}
</div>
))}
</div>
))}
<button className='btn' onClick={() => setSelectedSurvey(survey)}>Edit</button>
</li>
))}
</ul>
<button className='btn' onClick={() => setSelectedSurvey(null)}>New Survey</button>
<button
className="btn mt-2 bg-blue-500 hover:bg-blue-700 text-white font-bold py-1 px-2 rounded"
onClick={() => setSelectedSurvey(survey)}
>
Зареди детайли
</button>
</li>
))}
</ul>
<button
className="btn mt-4 bg-green-500 hover:bg-green-700 text-white font-bold py-2 px-4 rounded"
onClick={() => setSelectedSurvey(null)}
>
Нова анкета
</button>
</div>
<div className="w-1/2 pl-4">
<h2 className="text-xl font-semibold mb-4">Детайли</h2>
<SurveyForm existingItem={selectedSurvey} />
</div>
{/* <div className="w-1/2 pl-4">
<h2 className="text-xl font-semibold mb-4">Selected Survey</h2>
{selectedSurvey ? (
<div className="p-4 border rounded bg-gray-50 shadow-sm">
<h3 className="text-lg font-bold">{selectedSurvey.title}</h3>
<p className="text-gray-700 mt-2">{selectedSurvey.description}</p>
</div>
) : (
<p className="text-gray-700">No survey selected.</p>
)}
</div> */}
</div>
<div className="w-1/2">
<h2>Selected Survey</h2>
{selectedSurvey && (
<div>
<h3>{selectedSurvey.title}</h3>
<p>{selectedSurvey.description}</p>
</div>
)}
<div className="mt-8">
</div>
</div>
<SurveyForm existingItem={selectedSurvey} />
</Layout>
);
};