function MainComponent() { const orders = [ { id: 12345, customer: "山田太郎", date: "2023-10-05", status: "処理中", total: "¥10,000" }, { id: 12346, customer: "鈴木花子", date: "2023-10-06", status: "完了", total: "¥5,000" } ]; const handleEdit = (orderId)=>{}; const handleDelete = (orderId)=>{}; return /*#__PURE__*/ React.createElement("div", { className: "container mx-auto p-4", __source: { fileName: "", lineNumber: 12, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("header", { className: "flex justify-between items-center mb-4", __source: { fileName: "", lineNumber: 13, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-3xl font-crimson-text", __source: { fileName: "", lineNumber: 14, columnNumber: 9 }, __self: this }, "管理システム"), /*#__PURE__*/ React.createElement("nav", { className: "space-x-4", __source: { fileName: "", lineNumber: 15, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "#", className: "text-lg text-blue-600", __source: { fileName: "", lineNumber: 16, columnNumber: 11 }, __self: this }, "注文管理"), /*#__PURE__*/ React.createElement("a", { href: "#", className: "text-lg text-gray-600", __source: { fileName: "", lineNumber: 17, columnNumber: 11 }, __self: this }, "商品管理"), /*#__PURE__*/ React.createElement("a", { href: "#", className: "text-lg text-gray-600", __source: { fileName: "", lineNumber: 18, columnNumber: 11 }, __self: this }, "顧客管理"))), /*#__PURE__*/ React.createElement("div", { className: "bg-gradient-to-r from-blue-500 to-purple-500 text-white p-6 mb-4 rounded-md", __source: { fileName: "", lineNumber: 21, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-semibold", __source: { fileName: "", lineNumber: 22, columnNumber: 9 }, __self: this }, "注文一覧")), /*#__PURE__*/ React.createElement("table", { className: "min-w-full bg-white border border-gray-200 rounded-lg", __source: { fileName: "", lineNumber: 24, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("thead", { __source: { fileName: "", lineNumber: 25, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("tr", { __source: { fileName: "", lineNumber: 26, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("th", { className: "py-2 px-4 bg-gray-100 border-b", __source: { fileName: "", lineNumber: 27, columnNumber: 13 }, __self: this }, "注文ID"), /*#__PURE__*/ React.createElement("th", { className: "py-2 px-4 bg-gray-100 border-b", __source: { fileName: "", lineNumber: 28, columnNumber: 13 }, __self: this }, "顧客名"), /*#__PURE__*/ React.createElement("th", { className: "py-2 px-4 bg-gray-100 border-b", __source: { fileName: "", lineNumber: 29, columnNumber: 13 }, __self: this }, "注文日"), /*#__PURE__*/ React.createElement("th", { className: "py-2 px-4 bg-gray-100 border-b", __source: { fileName: "", lineNumber: 30, columnNumber: 13 }, __self: this }, "状態"), /*#__PURE__*/ React.createElement("th", { className: "py-2 px-4 bg-gray-100 border-b", __source: { fileName: "", lineNumber: 31, columnNumber: 13 }, __self: this }, "合計金額"), /*#__PURE__*/ React.createElement("th", { className: "py-2 px-4 bg-gray-100 border-b", __source: { fileName: "", lineNumber: 32, columnNumber: 13 }, __self: this }, "アクション"))), /*#__PURE__*/ React.createElement("tbody", { __source: { fileName: "", lineNumber: 35, columnNumber: 9 }, __self: this }, orders.map((order)=>/*#__PURE__*/ React.createElement("tr", { key: order.id, __source: { fileName: "", lineNumber: 37, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("td", { className: "py-2 px-4 border-b", __source: { fileName: "", lineNumber: 38, columnNumber: 15 }, __self: this }, order.id), /*#__PURE__*/ React.createElement("td", { className: "py-2 px-4 border-b", __source: { fileName: "", lineNumber: 39, columnNumber: 15 }, __self: this }, order.customer), /*#__PURE__*/ React.createElement("td", { className: "py-2 px-4 border-b", __source: { fileName: "", lineNumber: 40, columnNumber: 15 }, __self: this }, order.date), /*#__PURE__*/ React.createElement("td", { className: "py-2 px-4 border-b", __source: { fileName: "", lineNumber: 41, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: `inline-block px-2 py-1 rounded-full text-xs ${order.status === "完了" ? "bg-green-200 text-green-800" : "bg-orange-200 text-orange-800"}`, __source: { fileName: "", lineNumber: 42, columnNumber: 17 }, __self: this }, order.status)), /*#__PURE__*/ React.createElement("td", { className: "py-2 px-4 border-b", __source: { fileName: "", lineNumber: 50, columnNumber: 15 }, __self: this }, order.total), /*#__PURE__*/ React.createElement("td", { className: "py-2 px-4 border-b flex space-x-2", __source: { fileName: "", lineNumber: 51, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("button", { className: "bg-blue-500 text-white p-1 rounded", onClick: ()=>handleEdit(order.id), __source: { fileName: "", lineNumber: 52, columnNumber: 17 }, __self: this }, "✎"), /*#__PURE__*/ React.createElement("button", { className: "bg-red-500 text-white p-1 rounded", onClick: ()=>handleDelete(order.id), __source: { fileName: "", lineNumber: 58, columnNumber: 17 }, __self: this }, "🗑️"))))))); }

注文ID	顧客名	注文日	状態	合計金額	アクション
12345	山田太郎	2023-10-05	処理中	¥10,000
12346	鈴木花子	2023-10-06	完了	¥5,000