function MainComponent() { const factoryNames = [ "茨城" ]; const [efficiencies, setEfficiencies] = React.useState({}); const [weeklyEfficiencies, setWeeklyEfficiencies] = React.useState({}); const handleSubmit = (e, factory)=>{ e.preventDefault(); const weight = parseFloat(e.target.weight.value); const hours = parseFloat(e.target.hours.value); if (!isNaN(weight) && !isNaN(hours) && hours > 0) { const efficiency = weight / hours; setEfficiencies((prev)=>({ ...prev, [factory]: efficiency })); setWeeklyEfficiencies((prev)=>{ const weekData = prev[factory] ? [ ...prev[factory], efficiency ] : [ efficiency ]; return { ...prev, [factory]: weekData.slice(-7) }; }); } }; return /*#__PURE__*/ React.createElement("div", { className: "w-full p-4", __source: { fileName: "", lineNumber: 22, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-2xl font-bold mb-4", __source: { fileName: "", lineNumber: 23, columnNumber: 7 }, __self: this }, "工場毎の業務効率"), factoryNames.map((factory)=>/*#__PURE__*/ React.createElement("div", { key: factory, className: "mb-8 p-4 border rounded shadow-sm", __source: { fileName: "", lineNumber: 25, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl font-semibold mb-2", __source: { fileName: "", lineNumber: 26, columnNumber: 11 }, __self: this }, factory), /*#__PURE__*/ React.createElement("form", { className: "space-y-4", onSubmit: (e)=>handleSubmit(e, factory), __source: { fileName: "", lineNumber: 27, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 28, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium mb-1", __source: { fileName: "", lineNumber: 29, columnNumber: 15 }, __self: this }, "製作重量 (kg)"), /*#__PURE__*/ React.createElement("input", { type: "number", name: "weight", className: "w-full p-2 border rounded", required: true, __source: { fileName: "", lineNumber: 30, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 32, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium mb-1", __source: { fileName: "", lineNumber: 33, columnNumber: 15 }, __self: this }, "労働時間 (hours)"), /*#__PURE__*/ React.createElement("input", { type: "number", name: "hours", className: "w-full p-2 border rounded", required: true, __source: { fileName: "", lineNumber: 34, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "w-full py-2 px-4 bg-blue-500 text-white rounded", __source: { fileName: "", lineNumber: 36, columnNumber: 13 }, __self: this }, "計算する")), /*#__PURE__*/ React.createElement("div", { id: `efficiency-result-${factory}`, className: "mt-4 text-lg", __source: { fileName: "", lineNumber: 38, columnNumber: 11 }, __self: this }, efficiencies[factory] !== undefined && `業務効率: ${efficiencies[factory].toFixed(2)} (kg/h)`), /*#__PURE__*/ React.createElement("div", { id: `efficiency-chart-${factory}`, className: "mt-4 w-full h-[400px]", __source: { fileName: "", lineNumber: 41, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement(WeeklyEfficiencyChart, { data: weeklyEfficiencies[factory], __source: { fileName: "", lineNumber: 42, columnNumber: 13 }, __self: this }))))); } function WeeklyEfficiencyChart({ data }) { const chartRef = React.useRef(null); React.useEffect(()=>{ if (chartRef.current && data) { const ctx = chartRef.current.getContext('2d'); import('chart.js').then(({ default: Chart })=>{ new Chart(ctx, { type: 'line', data: { labels: Array(data.length).fill().map((_, i)=>`Day ${i + 1}`), datasets: [ { label: '業務効率 (kg/h)', data: data, borderColor: 'rgb(75, 192, 192)', tension: 0.1 } ] }, options: { responsive: true, scales: { x: { beginAtZero: true, title: { display: true, text: 'Days' } }, y: { beginAtZero: true, title: { display: true, text: 'Efficiency' } } } } }); }); } }, [ data ]); return /*#__PURE__*/ React.createElement("canvas", { ref: chartRef, __source: { fileName: "", lineNumber: 92, columnNumber: 10 }, __self: this }); }