function SiteRegistrationButton({ navigateTo, label }) { return /*#__PURE__*/ React.createElement("button", { onClick: ()=>navigateTo('registerSite'), className: "bg-green-500 hover:bg-green-700 text-white p-2 rounded", __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }, label); } function SiteRegistrationButtonStory() { return /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 13, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(SiteRegistrationButton, { navigateTo: ()=>console.log("Navigating to site registration..."), label: "現場登録", __source: { fileName: "", lineNumber: 14, columnNumber: 7 }, __self: this })); } function SiteEquipmentTaskManager({ currentPage, navigateTo, registerSite, registerEquipment, registerTask, sites, equipment, selectedSite, handleSiteSelection, selectedEquipment, handleEquipmentSelection, taskDetails }) { let content; switch(currentPage){ case 'registerSite': content = /*#__PURE__*/ React.createElement("form", { onSubmit: registerSite, __source: { fileName: "", lineNumber: 6, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "siteName", className: "block mb-2 text-sm", __source: { fileName: "", lineNumber: 7, columnNumber: 11 }, __self: this }, "Site Name:"), /*#__PURE__*/ React.createElement("input", { type: "text", id: "siteName", name: "siteName", className: "w-full p-2 border border-gray-200 rounded", __source: { fileName: "", lineNumber: 8, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "mt-4 bg-blue-500 hover:bg-blue-700 text-white p-2 rounded", __source: { fileName: "", lineNumber: 9, columnNumber: 11 }, __self: this }, "Submit")); break; case 'registerEquipment': content = /*#__PURE__*/ React.createElement("form", { onSubmit: registerEquipment, __source: { fileName: "", lineNumber: 15, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "equipmentName", className: "block mb-2 text-sm", __source: { fileName: "", lineNumber: 16, columnNumber: 11 }, __self: this }, "Equipment Name:"), /*#__PURE__*/ React.createElement("input", { type: "text", id: "equipmentName", name: "equipmentName", className: "w-full p-2 border border-gray-200 rounded", __source: { fileName: "", lineNumber: 17, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("label", { htmlFor: "siteSelect", className: "block mb-2 text-sm mt-4", __source: { fileName: "", lineNumber: 18, columnNumber: 11 }, __self: this }, "Select Site:"), /*#__PURE__*/ React.createElement("select", { id: "siteSelect", name: "siteSelect", className: "w-full p-2 border border-gray-200 rounded", onChange: handleSiteSelection, value: selectedSite, __source: { fileName: "", lineNumber: 19, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: "", __source: { fileName: "", lineNumber: 20, columnNumber: 13 }, __self: this }, "Select a site"), sites.map((site, index)=>/*#__PURE__*/ React.createElement("option", { key: index, value: site, __source: { fileName: "", lineNumber: 22, columnNumber: 15 }, __self: this }, site))), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "mt-4 bg-blue-500 hover:bg-blue-700 text-white p-2 rounded", __source: { fileName: "", lineNumber: 25, columnNumber: 11 }, __self: this }, "Submit")); break; case 'registerTask': content = /*#__PURE__*/ React.createElement("form", { onSubmit: registerTask, __source: { fileName: "", lineNumber: 31, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "taskName", className: "block mb-2 text-sm", __source: { fileName: "", lineNumber: 32, columnNumber: 11 }, __self: this }, "Task Name:"), /*#__PURE__*/ React.createElement("input", { type: "text", id: "taskName", name: "taskName", className: "w-full p-2 border border-gray-200 rounded", __source: { fileName: "", lineNumber: 33, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("label", { htmlFor: "equipmentSelect", className: "block mb-2 text-sm mt-4", __source: { fileName: "", lineNumber: 34, columnNumber: 11 }, __self: this }, "Select Equipment:"), /*#__PURE__*/ React.createElement("select", { id: "equipmentSelect", name: "equipmentSelect", className: "w-full p-2 border border-gray-200 rounded", onChange: handleEquipmentSelection, value: selectedEquipment, __source: { fileName: "", lineNumber: 35, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: "", __source: { fileName: "", lineNumber: 36, columnNumber: 13 }, __self: this }, "Select equipment"), equipment.filter((eq)=>eq.site === selectedSite).map((eq, index)=>/*#__PURE__*/ React.createElement("option", { key: index, value: eq.name, __source: { fileName: "", lineNumber: 38, columnNumber: 15 }, __self: this }, eq.name))), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "mt-4 bg-blue-500 hover:bg-blue-700 text-white p-2 rounded", __source: { fileName: "", lineNumber: 41, columnNumber: 11 }, __self: this }, "Submit")); break; case 'taskDetails': content = /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 47, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-lg font-bold mb-4", __source: { fileName: "", lineNumber: 48, columnNumber: 11 }, __self: this }, "Task Details"), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 49, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("strong", { __source: { fileName: "", lineNumber: 49, columnNumber: 14 }, __self: this }, "Name:"), " ", taskDetails.name), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 50, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("strong", { __source: { fileName: "", lineNumber: 50, columnNumber: 14 }, __self: this }, "Equipment:"), " ", taskDetails.equipment), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 51, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("strong", { __source: { fileName: "", lineNumber: 51, columnNumber: 14 }, __self: this }, "Site:"), " ", taskDetails.site), /*#__PURE__*/ React.createElement("button", { onClick: ()=>navigateTo('home'), className: "mt-4 bg-gray-500 hover:bg-gray-700 text-white p-2 rounded", __source: { fileName: "", lineNumber: 52, columnNumber: 11 }, __self: this }, "Back to Home")); break; default: content = /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 58, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>navigateTo('registerSite'), className: "bg-green-500 hover:bg-green-700 text-white p-2 rounded", __source: { fileName: "", lineNumber: 59, columnNumber: 11 }, __self: this }, "Register Site"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>navigateTo('registerEquipment'), className: "bg-orange-500 hover:bg-orange-700 text-white p-2 rounded ml-4", __source: { fileName: "", lineNumber: 60, columnNumber: 11 }, __self: this }, "Register Equipment"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>navigateTo('registerTask'), className: "bg-red-500 hover:bg-red-700 text-white p-2 rounded ml-4", __source: { fileName: "", lineNumber: 61, columnNumber: 11 }, __self: this }, "Register Task"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>navigateTo('taskDetails'), className: "bg-purple-500 hover:bg-purple-700 text-white p-2 rounded ml-4", __source: { fileName: "", lineNumber: 62, columnNumber: 11 }, __self: this }, "View Task Details")); } return /*#__PURE__*/ React.createElement("div", { className: "font-roboto flex flex-col gap-8 p-4", __source: { fileName: "", lineNumber: 68, columnNumber: 5 }, __self: this }, content); } function SiteEquipmentTaskManagerStory() { const [currentPage, setCurrentPage] = React.useState('home'); const [sites, setSites] = React.useState([]); const [equipment, setEquipment] = React.useState([]); const [tasks, setTasks] = React.useState([]); const [selectedSite, setSelectedSite] = React.useState(''); const [selectedEquipment, setSelectedEquipment] = React.useState(''); const [taskDetails, setTaskDetails] = React.useState({ name: '', equipment: '', site: '' }); const navigateTo = (page)=>{ setCurrentPage(page); }; const registerSite = (e)=>{ e.preventDefault(); const siteName = e.target.siteName.value; if (siteName) { setSites([ ...sites, siteName ]); e.target.reset(); setCurrentPage('home'); } }; const registerEquipment = (e)=>{ e.preventDefault(); const equipmentName = e.target.equipmentName.value; if (equipmentName && selectedSite) { setEquipment([ ...equipment, { name: equipmentName, site: selectedSite } ]); e.target.reset(); setCurrentPage('home'); } }; const registerTask = (e)=>{ e.preventDefault(); const taskName = e.target.taskName.value; if (taskName && selectedEquipment) { setTasks([ ...tasks, { name: taskName, equipment: selectedEquipment } ]); e.target.reset(); setCurrentPage('home'); } }; const handleSiteSelection = (e)=>{ setSelectedSite(e.target.value); }; const handleEquipmentSelection = (e)=>{ setSelectedEquipment(e.target.value); }; return /*#__PURE__*/ React.createElement(SiteEquipmentTaskManager, { currentPage: currentPage, navigateTo: navigateTo, registerSite: registerSite, registerEquipment: registerEquipment, registerTask: registerTask, sites: sites, equipment: equipment, selectedSite: selectedSite, handleSiteSelection: handleSiteSelection, selectedEquipment: selectedEquipment, handleEquipmentSelection: handleEquipmentSelection, taskDetails: taskDetails, __source: { fileName: "", lineNumber: 126, columnNumber: 5 }, __self: this }); } function MainComponent() { const [currentPage, setCurrentPage] = React.useState('home'); const [sites, setSites] = React.useState([]); const [equipment, setEquipment] = React.useState([]); const [tasks, setTasks] = React.useState([]); const [selectedSite, setSelectedSite] = React.useState(''); const [selectedEquipment, setSelectedEquipment] = React.useState(''); const [taskDetails, setTaskDetails] = React.useState({ name: '', equipment: '', site: '' }); const navigateTo = (page)=>{ setCurrentPage(page); }; const registerSite = (e)=>{ e.preventDefault(); const siteName = e.target.siteName.value; if (siteName) { setSites([ ...sites, siteName ]); e.target.reset(); navigateTo('home'); } }; const registerEquipment = (e)=>{ e.preventDefault(); const equipmentName = e.target.equipmentName.value; if (equipmentName && selectedSite) { setEquipment([ ...equipment, { name: equipmentName, site: selectedSite } ]); e.target.reset(); navigateTo('home'); } }; const registerTask = (e)=>{ e.preventDefault(); const taskDetails = { name: e.target.taskName.value, equipment: selectedEquipment, site: sites.find((site)=>equipment.find((eq)=>eq.name === selectedEquipment)?.site === site) || '' }; if (taskDetails.name && taskDetails.equipment) { setTasks([ ...tasks, taskDetails ]); e.target.reset(); navigateTo('home'); } }; const handleSiteSelection = (e)=>{ setSelectedSite(e.target.value); }; const handleEquipmentSelection = (e)=>{ setSelectedEquipment(e.target.value); }; let content; if (currentPage === 'home') { content = /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 59, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement(SiteRegistrationButton, { navigateTo: ()=>navigateTo('registerSite'), label: "現場登録", __source: { fileName: "", lineNumber: 60, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement(SiteRegistrationButton, { navigateTo: ()=>navigateTo('registerEquipment'), label: "設備登録", __source: { fileName: "", lineNumber: 61, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement(SiteRegistrationButton, { navigateTo: ()=>navigateTo('registerTask'), label: "タスク登録", __source: { fileName: "", lineNumber: 62, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement(SiteRegistrationButton, { navigateTo: ()=>navigateTo('taskDetails'), label: "タスク詳細を見る", __source: { fileName: "", lineNumber: 63, columnNumber: 9 }, __self: this })); } else { content = /*#__PURE__*/ React.createElement(SiteEquipmentTaskManager, { currentPage: currentPage, navigateTo: navigateTo, registerSite: registerSite, registerEquipment: registerEquipment, registerTask: registerTask, sites: sites, equipment: equipment, selectedSite: selectedSite, handleSiteSelection: handleSiteSelection, selectedEquipment: selectedEquipment, handleEquipmentSelection: handleEquipmentSelection, taskDetails: tasks.find((task)=>task.name === taskDetails.name) || { name: '', equipment: '', site: '' }, __source: { fileName: "", lineNumber: 68, columnNumber: 7 }, __self: this }); } return /*#__PURE__*/ React.createElement("div", { className: "font-roboto flex flex-col gap-8 p-4", __source: { fileName: "", lineNumber: 86, columnNumber: 5 }, __self: this }, content); }