function MainComponent() { const [platform, setPlatform] = React.useState(''); const [dateFrom, setDateFrom] = React.useState(''); const [dateTo, setDateTo] = React.useState(''); const handleSubmit = (event)=>{ event.preventDefault(); console.log({ platform, dateFrom, dateTo }); }; return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center justify-center min-h-screen p-5 bg-[#F4F6F8]", __source: { fileName: "", lineNumber: 12, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-2xl font-bold text-[#333] mb-5", __source: { fileName: "", lineNumber: 13, columnNumber: 7 }, __self: this }, "広告プラットフォームレポート作成ツール"), /*#__PURE__*/ React.createElement("div", { className: "w-full max-w-4xl bg-white shadow-md rounded-lg p-6", __source: { fileName: "", lineNumber: 14, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("form", { onSubmit: handleSubmit, __source: { fileName: "", lineNumber: 15, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 16, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-gray-700 text-sm font-bold mb-2", htmlFor: "platform", __source: { fileName: "", lineNumber: 17, columnNumber: 13 }, __self: this }, "プラットフォーム選択"), /*#__PURE__*/ React.createElement("select", { name: "platform", className: "block appearance-none w-full bg-gray-200 border border-gray-200 text-gray-700 py-3 px-4 pr-8 rounded leading-tight focus:outline-none focus:bg-white focus:border-gray-500", value: platform, onChange: (e)=>setPlatform(e.target.value), __source: { fileName: "", lineNumber: 20, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: "", __source: { fileName: "", lineNumber: 21, columnNumber: 15 }, __self: this }, "選択してください"), /*#__PURE__*/ React.createElement("option", { value: "googleAds", __source: { fileName: "", lineNumber: 22, columnNumber: 15 }, __self: this }, "Google Ads"), /*#__PURE__*/ React.createElement("option", { value: "facebookAds", __source: { fileName: "", lineNumber: 23, columnNumber: 15 }, __self: this }, "Facebook Ads"), /*#__PURE__*/ React.createElement("option", { value: "twitterAds", __source: { fileName: "", lineNumber: 24, columnNumber: 15 }, __self: this }, "Twitter Ads"), /*#__PURE__*/ React.createElement("option", { value: "instagramAds", __source: { fileName: "", lineNumber: 25, columnNumber: 15 }, __self: this }, "Instagram Ads"))), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 28, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-gray-700 text-sm font-bold mb-2", htmlFor: "date-range", __source: { fileName: "", lineNumber: 29, columnNumber: 13 }, __self: this }, "期間"), /*#__PURE__*/ React.createElement("input", { className: "appearance-none block w-full bg-gray-200 text-gray-700 border border-gray-200 rounded py-3 px-4 leading-tight focus:outline-none focus:bg-white focus:border-gray-500", type: "date", name: "date-from", value: dateFrom, onChange: (e)=>setDateFrom(e.target.value), __source: { fileName: "", lineNumber: 32, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "mx-2 text-gray-700", __source: { fileName: "", lineNumber: 33, columnNumber: 13 }, __self: this }, "〜"), /*#__PURE__*/ React.createElement("input", { className: "appearance-none block w-full bg-gray-200 text-gray-700 border border-gray-200 rounded py-3 px-4 leading-tight focus:outline-none focus:bg-white focus:border-gray-500", type: "date", name: "date-to", value: dateTo, onChange: (e)=>setDateTo(e.target.value), __source: { fileName: "", lineNumber: 34, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between", __source: { fileName: "", lineNumber: 36, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("button", { className: "bg-[#007BFF] hover:bg-[#0069D9] text-white font-bold py-2 px-4 rounded focus:outline-none focus:shadow-outline", type: "submit", __source: { fileName: "", lineNumber: 37, columnNumber: 13 }, __self: this }, "レポート生成"))))); }

広告プラットフォーム レポート作成ツール

広告プラットフォームレポート作成ツール