function MainComponent() { const [productList, setProductList] = React.useState([]); const [question, setQuestion] = React.useState(''); const [loading, setLoading] = React.useState(false); const [chatResponse, setChatResponse] = React.useState(''); const [manufacturer, setManufacturer] = React.useState(''); const [productName, setProductName] = React.useState(''); const [modelNumber, setModelNumber] = React.useState(''); const [pdfFile, setPdfFile] = React.useState(null); const [pdfPreviews, setPdfPreviews] = React.useState({}); const handleChatGPTQuestion = ()=>{ setLoading(true); fetch('/integrations/chat-gpt/conversationgpt4', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ messages: [ { role: 'user', content: question } ], system_prompt: '電化製品に関する質問' }) }).then((response)=>response.json()).then((data)=>{ setChatResponse(data.choices[0].message.content); setLoading(false); }); }; const handleAddProduct = ()=>{ const newProduct = { manufacturer, productName, modelNumber, manuals: [] }; setProductList([ ...productList, newProduct ]); setQuestion(`${manufacturer} ${productName} ${modelNumber}の取扱説明書について教えてください`); setLoading(true); fetch('/integrations/chat-gpt/conversationgpt4', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ messages: [ { role: 'user', content: `${manufacturer} ${productName} ${modelNumber}の取扱説明書について教えてください` } ], system_prompt: '電化製品に関する質問' }) }).then((response)=>response.json()).then((data)=>{ const newManual = data.choices[0].message.content; setProductList((prevList)=>{ const updatedList = [ ...prevList ]; updatedList[updatedList.length - 1].manuals.push(newManual); return updatedList; }); setLoading(false); }); setManufacturer(''); setProductName(''); setModelNumber(''); setPdfFile(null); }; const handleDeleteProduct = (index)=>{ const newList = productList.filter((_, i)=>i !== index); setProductList(newList); }; const handleFileUpload = (event)=>{ setPdfFile(event.target.files[0]); }; const handleSubmitPdf = (index)=>{ setLoading(true); const formData = new FormData(); formData.append('file', pdfFile); formData.append('productInfo', JSON.stringify(productList[index])); fetch('/integrations/chat-gpt/conversationgpt4', { method: 'POST', body: formData }).then((response)=>response.json()).then((data)=>{ const newManual = data.choices[0].message.content; setProductList((prevList)=>{ const newList = [ ...prevList ]; newList[index].manuals.push(newManual); return newList; }); setPdfPreviews((prevPreviews)=>({ ...prevPreviews, [index]: URL.createObjectURL(pdfFile) })); setLoading(false); alert(`PDFアップロード成功: ${URL.createObjectURL(pdfFile)}`); }); }; return /*#__PURE__*/ React.createElement("div", { className: "p-4", __source: { fileName: "", lineNumber: 101, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-2xl font-bold font-roboto mb-4", __source: { fileName: "", lineNumber: 102, columnNumber: 7 }, __self: this }, "電化製品情報管理アプリ"), /*#__PURE__*/ React.createElement("div", { className: "mb-6", __source: { fileName: "", lineNumber: 103, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl font-semibold font-roboto", __source: { fileName: "", lineNumber: 104, columnNumber: 9 }, __self: this }, "電化製品リスト"), /*#__PURE__*/ React.createElement("ul", { className: "list-disc list-inside", __source: { fileName: "", lineNumber: 105, columnNumber: 9 }, __self: this }, productList.map((item, index)=>/*#__PURE__*/ React.createElement("li", { key: index, __source: { fileName: "", lineNumber: 107, columnNumber: 13 }, __self: this }, item.manufacturer, " ", item.productName, " ", item.modelNumber, /*#__PURE__*/ React.createElement("button", { className: "ml-2 text-red-500", onClick: ()=>handleDeleteProduct(index), disabled: loading, __source: { fileName: "", lineNumber: 109, columnNumber: 15 }, __self: this }, "削除"), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 112, columnNumber: 15 }, __self: this }, "取扱説明書リスト:", /*#__PURE__*/ React.createElement("ul", { className: "list-disc list-inside", __source: { fileName: "", lineNumber: 114, columnNumber: 17 }, __self: this }, item.manuals.map((manual, i)=>/*#__PURE__*/ React.createElement("li", { key: i, className: "text-blue-500", __source: { fileName: "", lineNumber: 116, columnNumber: 21 }, __self: this }, manual))), /*#__PURE__*/ React.createElement("h2", { className: "text-lg font-semibold font-roboto", __source: { fileName: "", lineNumber: 121, columnNumber: 17 }, __self: this }, "取扱説明書PDFアップロード"), /*#__PURE__*/ React.createElement("input", { className: "border rounded p-2 w-full", type: "file", name: "pdfFile", onChange: handleFileUpload, __source: { fileName: "", lineNumber: 122, columnNumber: 17 }, __self: this }), /*#__PURE__*/ React.createElement("button", { className: "mt-2 p-2 bg-purple-500 text-white rounded", onClick: ()=>handleSubmitPdf(index), disabled: loading, __source: { fileName: "", lineNumber: 123, columnNumber: 17 }, __self: this }, "アップロード"), pdfPreviews[index] && /*#__PURE__*/ React.createElement("a", { href: pdfPreviews[index], className: "mt-2 p-2 bg-gray-200 text-black rounded inline-block", target: "_blank", rel: "noopener noreferrer", __source: { fileName: "", lineNumber: 127, columnNumber: 19 }, __self: this }, "PDF閲覧")))))), /*#__PURE__*/ React.createElement("div", { className: "mb-6", __source: { fileName: "", lineNumber: 136, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl font-semibold font-roboto", __source: { fileName: "", lineNumber: 137, columnNumber: 9 }, __self: this }, "商品登録"), /*#__PURE__*/ React.createElement("input", { className: "border rounded p-2 w-full mb-2", type: "text", name: "manufacturer", value: manufacturer, onChange: (e)=>setManufacturer(e.target.value), placeholder: "メーカー名", __source: { fileName: "", lineNumber: 138, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("input", { className: "border rounded p-2 w-full mb-2", type: "text", name: "productName", value: productName, onChange: (e)=>setProductName(e.target.value), placeholder: "商品名", __source: { fileName: "", lineNumber: 146, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("input", { className: "border rounded p-2 w-full mb-2", type: "text", name: "modelNumber", value: modelNumber, onChange: (e)=>setModelNumber(e.target.value), placeholder: "型番", __source: { fileName: "", lineNumber: 154, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("input", { className: "border rounded p-2 w-full mb-2", type: "file", name: "pdfFile", onChange: handleFileUpload, __source: { fileName: "", lineNumber: 162, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("button", { className: "p-2 bg-blue-500 text-white rounded", onClick: handleAddProduct, disabled: loading, __source: { fileName: "", lineNumber: 168, columnNumber: 9 }, __self: this }, "登録")), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 172, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl font-semibold font-roboto", __source: { fileName: "", lineNumber: 173, columnNumber: 9 }, __self: this }, "ChatGPTに質問"), /*#__PURE__*/ React.createElement("textarea", { className: "border rounded p-2 w-full", name: "question", value: question, onChange: (e)=>setQuestion(e.target.value), rows: "4", placeholder: "質問を入力", __source: { fileName: "", lineNumber: 174, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("button", { className: "mt-2 p-2 bg-green-500 text-white rounded", onClick: handleChatGPTQuestion, disabled: loading, __source: { fileName: "", lineNumber: 182, columnNumber: 9 }, __self: this }, "送信"), loading && /*#__PURE__*/ React.createElement("div", { className: "mt-4 p-2 text-blue-500", __source: { fileName: "", lineNumber: 185, columnNumber: 21 }, __self: this }, "ロード中..."), chatResponse && /*#__PURE__*/ React.createElement("div", { className: "mt-4 p-2 border rounded bg-gray-100", __source: { fileName: "", lineNumber: 186, columnNumber: 26 }, __self: this }, chatResponse))); }