function MainComponent() { const [queueNumber, setQueueNumber] = React.useState(null); const handleSubmit = (e)=>{ e.preventDefault(); const currentQueueNumber = Math.floor(Math.random() * 100) + 1; setQueueNumber(currentQueueNumber); }; return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center justify-center min-h-screen bg-[#F9F7F7]", __source: { fileName: "", lineNumber: 11, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-3xl font-bold text-[#112D4E] mb-8", __source: { fileName: "", lineNumber: 12, columnNumber: 7 }, __self: this }, "飲食店順番待ち番号発行"), queueNumber === null ? /*#__PURE__*/ React.createElement("form", { onSubmit: handleSubmit, className: "flex flex-col items-center space-y-4", __source: { fileName: "", lineNumber: 14, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "text", name: "customerName", placeholder: "お名前", className: "px-4 py-2 w-[300px] border border-[#3F72AF] rounded-md", __source: { fileName: "", lineNumber: 15, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("input", { type: "number", name: "partySize", placeholder: "人数", className: "px-4 py-2 w-[300px] border border-[#3F72AF] rounded-md", __source: { fileName: "", lineNumber: 21, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "px-6 py-2 bg-[#3F72AF] text-white font-bold rounded-md hover:bg-[#112D4E]", __source: { fileName: "", lineNumber: 27, columnNumber: 11 }, __self: this }, "番号を発行する")) : /*#__PURE__*/ React.createElement("div", { className: "text-center", __source: { fileName: "", lineNumber: 30, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "text-lg text-[#112D4E] font-medium", __source: { fileName: "", lineNumber: 31, columnNumber: 11 }, __self: this }, "順番待ち番号:"), /*#__PURE__*/ React.createElement("p", { className: "text-xl text-[#3F72AF] font-bold", __source: { fileName: "", lineNumber: 32, columnNumber: 11 }, __self: this }, queueNumber), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setQueueNumber(null), className: "mt-4 px-6 py-2 bg-[#3F72AF] text-white font-bold rounded-md hover:bg-[#112D4E]", __source: { fileName: "", lineNumber: 33, columnNumber: 11 }, __self: this }, "新しい番号を発行する"))); }

飲食店 順番待ち番号発行

飲食店順番待ち番号発行