function MainComponent() { const now = new Date(); const currentTimeMarker = now.getHours() + now.getMinutes() / 60; const days = Array.from({ length: 7 }, (_, i)=>new Date(now.getFullYear(), now.getMonth(), now.getDate() + i)); const teamEvents = [ { days: [ { day: 0, events: [ { startTime: '10:00', endTime: '11:00', label: '会議', title: 'プロジェクト計画会議', details: { participants: '全メンバー', location: 'オンライン', attachments: '計画書.pdf', chat: 'プロジェクトチャット', videoUrl: 'https://example.com/meet' }, bgColor: 'bg-blue-200', textColor: 'text-black' } ] }, { day: 2, events: [ { startTime: '14:00', endTime: '15:30', label: 'レビュー', title: 'デザインレビュー', details: { participants: 'デザインチーム', location: 'オンライン', attachments: 'デザイン案.png', chat: 'デザインチャット', videoUrl: 'https://example.com/meet/design' }, bgColor: 'bg-yellow-200', textColor: 'text-black' } ] }, { day: 4, events: [ { startTime: '09:00', endTime: '10:00', label: '会議', title: '週次報告会', details: { participants: '管理職', location: '本社 3階会議室', attachments: '週報.ppt', chat: '管理職チャット', videoUrl: 'https://example.com/meet/weekly' }, bgColor: 'bg-green-200', textColor: 'text-black' } ] } ] } ]; const hours = Array.from({ length: 24 }, (_, i)=>`${i}:00`); const weekDays = [ '日', '月', '火', '水', '木', '金', '土' ]; const handleEventClick = (event)=>{ alert(`参加者: ${event.details.participants}\n場所: ${event.details.location}\n添付ファイル: ${event.details.attachments}\n関連チャット: ${event.details.chat}\nビデオ会議用のURL: ${event.details.videoUrl}`); }; return /*#__PURE__*/ React.createElement("div", { className: "h-full bg-white px-2 py-4 font-roboto", __source: { fileName: "", lineNumber: 22, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-center text-xl font-bold text-black mb-4", __source: { fileName: "", lineNumber: 23, columnNumber: 7 }, __self: this }, "チームカレンダー - モバイル版"), /*#__PURE__*/ React.createElement("div", { className: "flex flex-col space-y-2", __source: { fileName: "", lineNumber: 24, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-8 gap-1 border-b border-gray-100", __source: { fileName: "", lineNumber: 25, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "col-span-1", __source: { fileName: "", lineNumber: 26, columnNumber: 11 }, __self: this }), days.map((day, index)=>/*#__PURE__*/ React.createElement("h3", { key: index, className: "col-span-1 text-sm text-black mb-1", __source: { fileName: "", lineNumber: 28, columnNumber: 13 }, __self: this }, `${day.getMonth() + 1}/${day.getDate()} (${weekDays[day.getDay()]})`))), /*#__PURE__*/ React.createElement("div", { className: "relative", __source: { fileName: "", lineNumber: 31, columnNumber: 9 }, __self: this }, hours.map((hour, index)=>/*#__PURE__*/ React.createElement("div", { key: index, className: "grid grid-cols-8 gap-1 border-b border-gray-100", __source: { fileName: "", lineNumber: 33, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "col-span-1 text-xs text-black py-2", __source: { fileName: "", lineNumber: 34, columnNumber: 15 }, __self: this }, hour), days.map((day, dayIdx)=>/*#__PURE__*/ React.createElement("div", { key: dayIdx, className: "col-span-1 py-2 relative", __source: { fileName: "", lineNumber: 36, columnNumber: 17 }, __self: this }, index === Math.floor(currentTimeMarker) && dayIdx === now.getDay() && /*#__PURE__*/ React.createElement("div", { style: { top: `${currentTimeMarker % 1 * 100}%` }, className: "absolute left-0 w-full h-0.5 bg-red-500", __source: { fileName: "", lineNumber: 38, columnNumber: 21 }, __self: this }), teamEvents.flatMap((member)=>member.days.find((d)=>new Date(now.getFullYear(), now.getMonth(), now.getDate() + d.day).toDateString() === day.toDateString())?.events || []).filter((event)=>{ const startHour = parseInt(event.startTime.split(':')[0], 10); const endHour = parseInt(event.endTime.split(':')[0], 10); return index >= startHour && index < endHour; }).map((event, eventIndex)=>/*#__PURE__*/ React.createElement("button", { key: eventIndex, onClick: ()=>handleEventClick(event), className: `${event.bgColor} ${event.textColor} p-1 rounded text-xs block w-full`, style: { minHeight: '1.5rem', color: '#000000', backgroundColor: '#F3F4F6', contrast: '4.5:1' }, __source: { fileName: "", lineNumber: 47, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("strong", { __source: { fileName: "", lineNumber: 48, columnNumber: 23 }, __self: this }, event.label), /*#__PURE__*/ React.createElement("br", { __source: { fileName: "", lineNumber: 48, columnNumber: 53 }, __self: this }), event.title))))))))); }

チームカレンダー - モバイル版

11/17 (月)

11/18 (火)

11/19 (水)

11/20 (木)

11/21 (金)

11/22 (土)

11/23 (日)