function MainComponent() { const weekDays = [ "月曜日", "火曜日", "水曜日", "木曜日", "金曜日", "土曜日", "日曜日" ]; const [entries, setEntries] = React.useState({}); const handleSubmit = (e)=>{ e.preventDefault(); const formData = new FormData(e.target); const newEntries = { ...entries }; for (let [key, value] of formData.entries()){ const [day, type, id] = key.split('-'); if (!newEntries[day]) { newEntries[day] = []; } const entryIndex = newEntries[day].findIndex((entry)=>entry.id === id); if (entryIndex !== -1) { newEntries[day][entryIndex][type] = value; } else { if (!newEntries[day].length || type !== 'task') { const newEntry = { id: id || new Date().toISOString(), [type]: value }; newEntries[day].push(newEntry); } } } setEntries(newEntries); }; const generateGraph = ()=>{ const colors = [ "bg-[#FF6384]", "bg-[#FFCD56]", "bg-[#36A2EB]", "bg-[#4BC0C0]", "bg-[#9966FF]", "bg-[#FF9F40]" ]; const graph = []; for (const day of Object.keys(entries)){ for (const task of entries[day]){ const color = colors[Math.floor(Math.random() * colors.length)]; const style = `flex-1 ${color} text-xs`; graph.push(/*#__PURE__*/ React.createElement("div", { key: `${day}-${task.id}`, title: `${task.task} から ${task.start} まで ${task.end}`, className: style, __source: { fileName: "", lineNumber: 34, columnNumber: 20 }, __self: this })); } } return graph; }; return /*#__PURE__*/ React.createElement("div", { className: "max-w-4xl mx-auto py-8 px-4", __source: { fileName: "", lineNumber: 41, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-center font-roboto text-2xl mb-6", __source: { fileName: "", lineNumber: 42, columnNumber: 7 }, __self: this }, "週間作業スケジュール"), /*#__PURE__*/ React.createElement("form", { onSubmit: handleSubmit, __source: { fileName: "", lineNumber: 43, columnNumber: 7 }, __self: this }, weekDays.map((day, index)=>/*#__PURE__*/ React.createElement("div", { key: day, className: "mb-4", __source: { fileName: "", lineNumber: 45, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "font-roboto text-xl mb-2", __source: { fileName: "", lineNumber: 46, columnNumber: 13 }, __self: this }, day), /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-roboto", __source: { fileName: "", lineNumber: 47, columnNumber: 13 }, __self: this }, "開始時刻", /*#__PURE__*/ React.createElement("input", { type: "time", name: `${day}-start-${index}`, className: "block w-full mt-1 p-2 border rounded", __source: { fileName: "", lineNumber: 48, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-roboto mt-2", __source: { fileName: "", lineNumber: 50, columnNumber: 13 }, __self: this }, "終了時刻", /*#__PURE__*/ React.createElement("input", { type: "time", name: `${day}-end-${index}`, className: "block w-full mt-1 p-2 border rounded", __source: { fileName: "", lineNumber: 51, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-roboto mt-2", __source: { fileName: "", lineNumber: 53, columnNumber: 13 }, __self: this }, "作業内容", /*#__PURE__*/ React.createElement("input", { type: "text", name: `${day}-task-${index}`, placeholder: "作業を記述...", className: "block w-full mt-1 p-2 border rounded", __source: { fileName: "", lineNumber: 54, columnNumber: 15 }, __self: this })))), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "w-full py-2 px-4 bg-[#4B5563] text-white font-roboto mt-4 rounded", __source: { fileName: "", lineNumber: 58, columnNumber: 9 }, __self: this }, "送信")), /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-center mt-8 gap-2 flex-wrap", __source: { fileName: "", lineNumber: 60, columnNumber: 7 }, __self: this }, generateGraph())); }