function MainComponent() { const [selectedPart, setSelectedPart] = React.useState(null); const [parts, setParts] = React.useState([]); const [searchTerm, setSearchTerm] = React.useState(''); const handlePartClick = (partType)=>{ setSelectedPart({ name: 'サンプルパーツ', partType, parameters: { length: '100cm', weight: '5kg', material: 'スチール' }, description: 'これはサンプルの部品情報です。', images: [ '/images/sample_part_image.jpg' ], documents: [ '/documents/sample_document.pdf' ] }); }; React.useEffect(()=>{ setParts([ { id: 1, name: "フロントサスペンション", partType: "フロントサスペンション" }, { id: 2, name: "リアサスペンション", partType: "リアサスペンション" }, { id: 3, name: "ダンパー", partType: "ダンパー" }, { id: 4, name: "スプリング", partType: "スプリング" } ]); }, []); return /*#__PURE__*/ React.createElement("div", { className: "font-sans", __source: { fileName: "", lineNumber: 27, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-gray-100 min-h-screen flex items-center justify-center", __source: { fileName: "", lineNumber: 28, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white p-8 rounded shadow-md w-[400px]", __source: { fileName: "", lineNumber: 29, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-semibold mb-4", __source: { fileName: "", lineNumber: 30, columnNumber: 11 }, __self: this }, "ログイン"), /*#__PURE__*/ React.createElement("form", { __source: { fileName: "", lineNumber: 31, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 32, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-gray-700", __source: { fileName: "", lineNumber: 33, columnNumber: 15 }, __self: this }, "ユーザー名"), /*#__PURE__*/ React.createElement("input", { type: "text", name: "username", className: "w-full px-3 py-2 border rounded", __source: { fileName: "", lineNumber: 34, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 40, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-gray-700", __source: { fileName: "", lineNumber: 41, columnNumber: 15 }, __self: this }, "パスワード"), /*#__PURE__*/ React.createElement("input", { type: "password", name: "password", className: "w-full px-3 py-2 border rounded", __source: { fileName: "", lineNumber: 42, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "flex justify-between", __source: { fileName: "", lineNumber: 48, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("button", { type: "submit", className: "bg-blue-500 text-white px-4 py-2 rounded", __source: { fileName: "", lineNumber: 49, columnNumber: 15 }, __self: this }, "ログイン"), /*#__PURE__*/ React.createElement("button", { type: "button", className: "bg-gray-500 text-white px-4 py-2 rounded", __source: { fileName: "", lineNumber: 52, columnNumber: 15 }, __self: this }, "新規登録"))))), /*#__PURE__*/ React.createElement("div", { className: "bg-gray-100 min-h-screen p-8", __source: { fileName: "", lineNumber: 59, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white p-8 rounded shadow-md w-full", __source: { fileName: "", lineNumber: 60, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-semibold mb-4", __source: { fileName: "", lineNumber: 61, columnNumber: 11 }, __self: this }, "サスペンション管理"), /*#__PURE__*/ React.createElement("div", { className: "flex justify-center", __source: { fileName: "", lineNumber: 62, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: "/images/suspension.png", useMap: "#suspension-map", alt: "サスペンション", className: "w-full max-w-[600px]", __source: { fileName: "", lineNumber: 63, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("map", { name: "suspension-map", __source: { fileName: "", lineNumber: 69, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("area", { shape: "rect", coords: "34,44,270,350", alt: "フロントサスペンション", onClick: ()=>handlePartClick('フロントサスペンション'), __source: { fileName: "", lineNumber: 70, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("area", { shape: "rect", coords: "290,172,333,250", alt: "リアサスペンション", onClick: ()=>handlePartClick('リアサスペンション'), __source: { fileName: "", lineNumber: 76, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("area", { shape: "rect", coords: "337,300,480,320", alt: "ダンパー", onClick: ()=>handlePartClick('ダンパー'), __source: { fileName: "", lineNumber: 82, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("area", { shape: "rect", coords: "480,350,620,400", alt: "スプリング", onClick: ()=>handlePartClick('スプリング'), __source: { fileName: "", lineNumber: 88, columnNumber: 15 }, __self: this }))), selectedPart && /*#__PURE__*/ React.createElement("div", { className: "mt-4 p-4 bg-gray-200 rounded", __source: { fileName: "", lineNumber: 97, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-xl font-semibold", __source: { fileName: "", lineNumber: 98, columnNumber: 15 }, __self: this }, selectedPart.name), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 99, columnNumber: 15 }, __self: this }, "部位: ", selectedPart.partType), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 100, columnNumber: 15 }, __self: this }, "パラメータ: 長さ - ", selectedPart.parameters.length, ", 重量 - ", selectedPart.parameters.weight, ", 材質 - ", selectedPart.parameters.material), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 101, columnNumber: 15 }, __self: this }, "説明: ", selectedPart.description), /*#__PURE__*/ React.createElement("img", { src: selectedPart.images[0], alt: `${selectedPart.partType}の画像`, className: "w-[200px] mt-2", __source: { fileName: "", lineNumber: 102, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("a", { href: selectedPart.documents[0], download: true, className: "text-blue-500 underline mt-2 block", __source: { fileName: "", lineNumber: 107, columnNumber: 15 }, __self: this }, "ドキュメントをダウンロード")))), /*#__PURE__*/ React.createElement("div", { className: "bg-gray-100 min-h-screen p-8", __source: { fileName: "", lineNumber: 118, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white p-8 rounded shadow-md w-full", __source: { fileName: "", lineNumber: 119, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-semibold mb-4", __source: { fileName: "", lineNumber: 120, columnNumber: 11 }, __self: this }, "パーツ管理ダッシュボード"), /*#__PURE__*/ React.createElement("input", { type: "text", placeholder: "パーツ名で検索", onChange: (e)=>setSearchTerm(e.target.value), className: "mb-4 p-2 border rounded w-full", __source: { fileName: "", lineNumber: 121, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("ul", { __source: { fileName: "", lineNumber: 127, columnNumber: 11 }, __self: this }, parts.filter((part)=>part.name.includes(searchTerm)).map((filteredPart)=>/*#__PURE__*/ React.createElement("li", { key: filteredPart.id, className: "flex justify-between items-center border-b py-2", __source: { fileName: "", lineNumber: 131, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 135, columnNumber: 19 }, __self: this }, filteredPart.name, " - ", filteredPart.partType), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 136, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("button", { className: "bg-yellow-500 text-white px-2 py-1 rounded mr-2", __source: { fileName: "", lineNumber: 137, columnNumber: 21 }, __self: this }, "編集"), /*#__PURE__*/ React.createElement("button", { className: "bg-red-500 text-white px-2 py-1 rounded", __source: { fileName: "", lineNumber: 140, columnNumber: 21 }, __self: this }, "削除"))))))), /*#__PURE__*/ React.createElement("div", { className: "bg-gray-100 min-h-screen p-8", __source: { fileName: "", lineNumber: 149, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white p-8 rounded shadow-md w-full", __source: { fileName: "", lineNumber: 150, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-semibold mb-4", __source: { fileName: "", lineNumber: 151, columnNumber: 11 }, __self: this }, "パーツ追加・編集ページ"), /*#__PURE__*/ React.createElement("form", { __source: { fileName: "", lineNumber: 152, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 153, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-gray-700", __source: { fileName: "", lineNumber: 154, columnNumber: 15 }, __self: this }, "パーツ名"), /*#__PURE__*/ React.createElement("input", { type: "text", name: "partName", className: "w-full px-3 py-2 border rounded", __source: { fileName: "", lineNumber: 155, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 161, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-gray-700", __source: { fileName: "", lineNumber: 162, columnNumber: 15 }, __self: this }, "部位"), /*#__PURE__*/ React.createElement("input", { type: "text", name: "partType", value: selectedPart ? selectedPart.partType : '', className: "w-full px-3 py-2 border rounded", readOnly: true, __source: { fileName: "", lineNumber: 163, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 171, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-gray-700", __source: { fileName: "", lineNumber: 172, columnNumber: 15 }, __self: this }, "パラメータ1 (例: 長さ)"), /*#__PURE__*/ React.createElement("input", { type: "text", name: "parameter1", className: "w-full px-3 py-2 border rounded", __source: { fileName: "", lineNumber: 173, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 179, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-gray-700", __source: { fileName: "", lineNumber: 180, columnNumber: 15 }, __self: this }, "パラメータ2 (例: 重量)"), /*#__PURE__*/ React.createElement("input", { type: "text", name: "parameter2", className: "w-full px-3 py-2 border rounded", __source: { fileName: "", lineNumber: 181, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 187, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-gray-700", __source: { fileName: "", lineNumber: 188, columnNumber: 15 }, __self: this }, "パラメータ3 (例: 材質)"), /*#__PURE__*/ React.createElement("input", { type: "text", name: "parameter3", className: "w-full px-3 py-2 border rounded", __source: { fileName: "", lineNumber: 189, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 195, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-gray-700", __source: { fileName: "", lineNumber: 196, columnNumber: 15 }, __self: this }, "説明"), /*#__PURE__*/ React.createElement("textarea", { name: "description", className: "w-full px-3 py-2 border rounded", __source: { fileName: "", lineNumber: 197, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 202, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-gray-700", __source: { fileName: "", lineNumber: 203, columnNumber: 15 }, __self: this }, "画像アップロード"), /*#__PURE__*/ React.createElement("input", { type: "file", name: "imageUpload", className: "w-full px-3 py-2 border rounded", __source: { fileName: "", lineNumber: 204, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 210, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-gray-700", __source: { fileName: "", lineNumber: 211, columnNumber: 15 }, __self: this }, "ドキュメントアップロード (PDF, DOCX等)"), /*#__PURE__*/ React.createElement("input", { type: "file", name: "documentUpload", className: "w-full px-3 py-2 border rounded", __source: { fileName: "", lineNumber: 212, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "flex justify-between", __source: { fileName: "", lineNumber: 218, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("button", { type: "submit", className: "bg-blue-500 text-white px-4 py-2 rounded", __source: { fileName: "", lineNumber: 219, columnNumber: 15 }, __self: this }, "保存"), /*#__PURE__*/ React.createElement("button", { type: "button", className: "bg-gray-500 text-white px-4 py-2 rounded", __source: { fileName: "", lineNumber: 222, columnNumber: 15 }, __self: this }, "キャンセル")))))); }