/* ============================================================ カレンダー（月 / 週 / 日、担当者別の色分け） ============================================================ */ function buildEvents(cases, meetings, sources = window.APP_DATA) { const D = window.APP_DATA; const evs = []; // 担当未設定は「担当なし」のまま表示する＝先頭ユーザーの仮表示(旧ow0)は誤解を生むため廃止（2026-07-10） const seen = new Set(); const dayOf = (dt) => (dt || '').slice(0, 10); cases.forEach(c => { if (c.archived) return; // アーカイブ案件（成件後の継続会議など）はカレンダーに出さない const owner = c.ownerId ? D.user(c.ownerId) : null; const subs = (c.subIds || []).map(id => D.user(id)).filter(u => u && (!owner || u.id !== owner.id)); // 次回商談とRC商談日が両方未来のときは casePlanPick が正を一つに絞る（二重表示防止） const planPick = casePlanPick(c); // 次回商談（予定）※電話予定はカレンダーに出さない（電話はToDo＝次の一手で管理する方針・2026-07-08） if (c.nextMeeting && planPick.nm && caseNextMethod(c) !== 'phone') { evs.push({ id: 'ev-' + c.id, caseId: c.id, datetime: c.nextMeeting, title: c.title, customer: D.customer(c.customerId), owner, subs, status: c.status, kind: 'next', method: caseNextMethod(c) }); seen.add(c.id + dayOf(c.nextMeeting)); } // 会議記録（1回目・2回目…の商談）— 二次会議が漏れないように。同日の商談予定より優先（動画・出席者つき） (c.meetingDocs || []).forEach(doc => { if (!doc.datetime || seen.has(c.id + dayOf(doc.datetime))) return; evs.push({ id: 'md-' + doc.id, caseId: c.id, datetime: doc.datetime, title: c.title, customer: D.customer(c.customerId), owner, subs, status: c.status, kind: 'doc', doc }); seen.add(c.id + dayOf(doc.datetime)); }); // ReadyCrew の商談日（appointAt）— 過去分は履歴として表示、未来分は casePlanPick の正のときだけ ※電話予定は出さない if (c.appointAt && planPick.ap && caseNextMethod(c) !== 'phone' && !seen.has(c.id + dayOf(c.appointAt))) { evs.push({ id: 'ap-' + c.id, caseId: c.id, datetime: c.appointAt, title: c.title, customer: D.customer(c.customerId), owner, subs, status: c.status, kind: 'appoint', method: caseNextMethod(c) }); seen.add(c.id + dayOf(c.appointAt)); } }); // 商談記録（実施済み）も日付に表示。 // ただし電話・メールのメモは対象外：記入時刻がそのまま datetime になる「架電/連絡ログ」であり、 // 商談予定と誤読される＋同一担当の重複警告の誤報源になる（履歴は案件詳細の商談履歴で見られる） (meetings || []).forEach(m => { if (m.method === 'phone' || m.method === 'email') return; const c = D.caseById(m.caseId); if (!c || c.archived || !m.datetime) return; if (seen.has(c.id + dayOf(m.datetime))) return; // 重複回避 seen.add(c.id + dayOf(m.datetime)); evs.push({ id: 'mev-' + m.id, caseId: m.caseId, datetime: m.datetime, title: c.title, customer: D.customer(c.customerId), owner: m.authorId ? D.user(m.authorId) : null, status: c.status, kind: 'done' }); }); // Google カレンダー（ICS同期）— 参加者・出欠・Meetリンク付き。会社名が一致すれば案件に紐づけ const normG = (s) => (s || '').replace(/株式会社|（株）|\(株\)|・(レディクル|発注ナビ).*$|[（(].*$|\s+/g, ''); const gcalDayTitles = new Set(); // 同日・同社の Fireflies 標準イベントとの重複を避ける // 明らかな社内ノイズ（社内◯◯・リマインダー等）は案件カレンダーに一切出さない（未紐付けとしても出さない）。 // 「社内」を含むタイトルが顧客名にファジー一致→実在メンバーが担当として誤表示される事故もここで根治（2026-07-08） const gNoise = (t) => /社内|\[提醒\]|【提醒】|リマインダ|リマインド|reminder/i.test(t || ''); (sources.gcalEvents || []).forEach(g => { if (!g.datetime) return; if (gNoise(g.title)) return; let matched = cases.find(c => c.id === g.caseId) || null; for (const c of cases) { if (matched) break; const cust = D.customer(c.customerId); if (!cust) continue; const core = normG(cust.company).toLowerCase(); // 大文字小文字を無視（例: JPASS定例会 → JPass 案件） const gt = normG(g.title).toLowerCase(); if ((core.length >= 3 && gt.includes(core)) || (core.length >= 2 && gt === core)) { matched = c; break; } } // 案件に紐づかないGoogle予定も「未紐付け」として表示（カレンダーにはあるのに案件に無い＝取りこぼしを見える化。 // 2026-07-07：以前は完全に非表示だったが、ポップアップから「案件を作成/紐付け」できる導線とセットで表示に変更。 // ノイズが気になる場合はツールバーの「未紐付け」トグルで非表示にできる） if (matched && matched.archived) return; // アーカイブ案件の予定（継続会議など）はカレンダーに出さない const key = (matched ? matched.id : 'gc' + g.id) + dayOf(g.datetime); if (seen.has(key)) { // 同日の案件イベントが既にある → Google の参加者・出欠・Meetリンクをマージ const ex = evs.find(e => e.caseId === (matched && matched.id) && dayOf(e.datetime) === dayOf(g.datetime)); if (ex && !ex.gcal) ex.gcal = g; return; } seen.add(key); gcalDayTitles.add(normG(g.title).slice(0, 4) + dayOf(g.datetime)); // 未紐付けは担当を付けない（以前は先頭ユーザーを仮表示→「担当が間違っている」誤解の元だった） const owner = matched ? (matched.ownerId ? D.user(matched.ownerId) : null) : null; evs.push({ id: g.id, caseId: matched ? matched.id : null, unlinked: !matched, datetime: g.datetime, title: matched ? matched.title : g.title, customer: matched ? D.customer(matched.customerId) : { shortName: (g.title || t('calendar.fallback.event')).slice(0, 6), company: g.title }, owner, status: matched ? matched.status : null, kind: 'gcal', gcal: g }); }); // Fireflies の通話：レディクル・発注ナビ・案件名（会社名）一致をすべて表示 const importedFf = new Set(); cases.forEach(c => (c.meetingDocs || []).forEach(d => importedFf.add(d.ffId))); const norm = (s) => (s || '').replace(/株式会社|（株）|\(株\)|\s+/g, ''); (sources.firefliesMeetings || []).forEach(f => { if (!f.datetime || importedFf.has(f.id)) return; // 取り込み済みは meetingDocs 側で表示 if (gNoise(f.title)) return; // 社内定例・リマインダー等のノイズは出さない let matched = cases.find(c => c.id === f.caseId) || null; for (const c of cases) { if (matched) break; const cust = D.customer(c.customerId); if (!cust) continue; const core = norm(cust.company).toLowerCase(); // 大文字小文字を無視 const ft = norm(f.title).toLowerCase(); if ((core.length >= 3 && ft.includes(core)) || (core.length >= 2 && ft === core)) { matched = c; break; } } // 未紐付けの通話も表示（レディクル/発注ナビ以外も）＝ポップアップから案件作成/取込できる if (matched && matched.archived) return; // アーカイブ案件の通話はカレンダーに出さない if (gcalDayTitles.has(normG(f.title).slice(0, 4) + dayOf(f.datetime))) return; // Google 予定と重複 const key = (matched ? matched.id : 'ff') + dayOf(f.datetime); if (seen.has(key)) return; seen.add(key); const owner = matched ? (matched.ownerId ? D.user(matched.ownerId) : null) : null; evs.push({ id: 'ff-' + f.id, caseId: matched ? matched.id : null, unlinked: !matched, datetime: f.datetime, title: matched ? matched.title : f.title, customer: matched ? D.customer(matched.customerId) : { shortName: (f.title || t('calendar.fallback.call')).replace(/・(レディクル|MTG|商談).*/g, '').replace(/株式会社/g, '').slice(0, 6), company: f.title }, owner, status: matched ? matched.status : null, kind: 'ff', ff: f }); }); return evs; } function dateKey(d) { return `${d.getFullYear()}-${String(d.getMonth() + 1).padStart(2, '0')}-${String(d.getDate()).padStart(2, '0')}`; } function addDays(d, n) { const x = new Date(d); x.setDate(x.getDate() + n); return x; } /* 同時刻に複数の予定がある場合の横並びレイアウト（Googleカレンダー方式）。 各予定は1時間ブロックとして衝突グループを作り、列番号と列数を割り当てる */ function overlapLayout(evs) { const startMin = (e) => { const d = parseDT(e.datetime); return d ? d.getHours() * 60 + d.getMinutes() : 0; }; const sorted = [...evs].sort((a, b) => (a.datetime || '').localeCompare(b.datetime || '')); const out = new Map(); let cluster = [], clusterEnd = -1; const flush = () => { if (!cluster.length) return; const colEnd = []; cluster.forEach(e => { const s = startMin(e); let c = colEnd.findIndex(t => t <= s); if (c < 0) { c = colEnd.length; colEnd.push(0); } colEnd[c] = s + 60; out.set(e.id, { col: c }); }); cluster.forEach(e => { out.get(e.id).cols = colEnd.length; }); cluster = []; }; sorted.forEach(e => { const s = startMin(e); if (s >= clusterEnd) { flush(); clusterEnd = s + 60; } else { clusterEnd = Math.max(clusterEnd, s + 60); } cluster.push(e); }); flush(); return out; } /* イベントの表示色：担当者(owner) or ステータス(status) で切替 */ function evColor(e, colorBy) { const D = window.APP_DATA; if (colorBy === 'status' && e.status && D.STATUS && D.STATUS[e.status]) return D.STATUS[e.status].color; return (e.owner && e.owner.color) || '#4a5af0'; } /* ダブルブッキング検出：同じ担当者・同日で時間帯(60分想定)が重なる予定の id 集合 */ function conflictIds(events) { const out = new Set(); const groups = {}; events.forEach(e => { if (!e.datetime || !e.owner) return; const k = e.owner.id + '|' + e.datetime.slice(0, 10); (groups[k] = groups[k] || []).push(e); }); Object.values(groups).forEach(list => { if (list.length < 2) return; const arr = list.map(e => { const d = parseDT(e.datetime); return { e, s: d ? d.getHours() * 60 + d.getMinutes() : 0 }; }).sort((a, b) => a.s - b.s); for (let i = 1; i < arr.length; i++) if (arr[i].s < arr[i - 1].s + 60) { out.add(arr[i].e.id); out.add(arr[i - 1].e.id); } }); return out; } /* 予定の新規追加・編集モーダル（案件の商談予定 = nextMeeting を更新） */ function EventFormModal({ initial, onClose }) { const { cases, scheduleMeeting } = useStore(); const D = window.APP_DATA; const isEdit = !!initial.caseId; // 担当が割り当て済みで、クローズしていない案件のみ選択可能 const selectable = cases.filter(c => c.ownerId && !c.archived && !['won', 'lost', 'done'].includes(c.status)); const dt = initial.datetime ? parseDT(initial.datetime) : null; const [caseId, setCaseId] = React.useState(initial.caseId || ''); const [date, setDate] = React.useState(dt ? dateKey(dt) : (initial.date || today())); const [time, setTime] = React.useState(dt ? fmtTime(initial.datetime) : (initial.time || '10:00')); const c = cases.find(k => k.id === caseId); // 予定の手段（電話/オンライン/訪問）＝タイムライン・カレンダーの表示が変わる（電話予定に会議URLを出さない等） const [method, setMethod] = React.useState(initial.method || (c && c.nextMeetingMethod) || 'online'); const owner = c && c.ownerId ? D.user(c.ownerId) : null; const submit = () => { if (!caseId || !date || !time) return; scheduleMeeting(caseId, `${date}T${time}`, method); onClose(); }; const cancelMeeting = () => { scheduleMeeting(caseId, null); onClose(); }; return ( {isEdit && <>
} }>
setDate(e.target.value)} /> setTime(e.target.value)} />
{[['online', 'video', t('cd.methodOnline')], ['phone', 'phone', (D.METHODS.phone || {}).label || '電話'], ['visit', 'mapPin', (D.METHODS.visit || {}).label || '訪問']].map(([v, ic, lb]) => ( ))}
{method === 'phone' && (
{t('calendar.eventModal.phoneHint')}
)} {owner && (
{t('calendar.eventModal.ownerInfo', { name: owner.name })}
)} ); } function Calendar() { const { cases, navigate, meetings, scheduleMeeting, patchCase, showToast, gcalEvents, firefliesMeetings } = useStore(); const D = window.APP_DATA; const [view, setView] = React.useState('month'); const [ownerFilter, setOwnerFilter] = React.useState('all'); const [statusFilter, setStatusFilter] = React.useState('all'); const [colorBy, setColorBy] = React.useState('owner'); // 初期表示：今日以降で最も近い商談予定の月へ（過去↔未来は月送りで閲覧可）。なければ今日 const initialAnchor = React.useMemo(() => { const future = buildEvents(cases, meetings, {gcalEvents,firefliesMeetings}).map(e => e.datetime).filter(dt => dt >= today()).sort(); return new Date((future[0] ? future[0].slice(0, 10) : today()) + 'T00:00'); }, []); const [anchor, setAnchor] = React.useState(initialAnchor); const [popup, setPopup] = React.useState(null); const [form, setForm] = React.useState(null); // {caseId?, datetime?, date?, time?} const [gcalOpen, setGcalOpen] = React.useState(false); // Google カレンダー取込モーダル // ダブルブッキング警告の閉じる：今出ている重複の組み合わせ(署名)を記憶。同じ重複の間は閉じたまま、新しい重複が出たら再表示 const [dismissedConf, setDismissedConf] = React.useState(() => { try { return localStorage.getItem('anken_cal_conf_dismiss') || ''; } catch (_) { return ''; } }); // 未紐付け（案件に無い予定/通話）の表示トグル＋作成/紐付け導線 // 既定は非表示（社内ノイズ・私的予定の混入防止＝元設計の意図を尊重）。件数チップを押した時だけ表示 const [showUnlinked, setShowUnlinked] = React.useState(() => { try { return localStorage.getItem('anken_cal_unlinked') === '1'; } catch (_) { return false; } }); const toggleUnlinked = () => setShowUnlinked(v => { const nx = !v; try { localStorage.setItem('anken_cal_unlinked', nx ? '1' : '0'); } catch (_) {} return nx; }); const [createFrom, setCreateFrom] = React.useState(null); // 未紐付けイベント → 案件作成モーダル const [linkFf, setLinkFf] = React.useState(null); // 未紐付けFireflies → 既存案件へ取込ピッカー const [ffBusy, setFfBusy] = React.useState(false); // Fireflies通話を案件の会議記録として取込（AI要約つき・既存の詳細タブと同じAPI） const importFfToCase = async (caseId, ff) => { if (ffBusy) return; setFfBusy(true); try { const k = cases.find(c => c.id === caseId); if (k && (k.meetingDocs || []).some(d => d.ffId === ff.id)) { showToast(t('case-detail.meetingDocAlreadyAdded'), 'x'); setFfBusy(false); return; } const r = await API.aiMeetingDoc(ff.id); patchCase(caseId, { meetingDocs: [r.doc, ...((k && k.meetingDocs) || [])] }); showToast(t('calendar.unlinked.ffImported')); } catch (e2) { showToast(e2.message || t('cd.toast.analysisFailed'), 'x'); } setFfBusy(false); setLinkFf(null); setPopup(null); }; const allEvents = buildEvents(cases, meetings, {gcalEvents,firefliesMeetings}).sort((a, b) => (a.datetime || '').localeCompare(b.datetime || '')); // 日内も時刻順 const unlinkedCount = allEvents.filter(e => e.unlinked).length; let events = showUnlinked ? allEvents : allEvents.filter(e => !e.unlinked); if (ownerFilter !== 'all') events = events.filter(e => e.unlinked || e.owner.id === ownerFilter); if (statusFilter !== 'all') events = events.filter(e => e.unlinked || e.status === statusFilter); const conflicts = conflictIds(events); const confKey = [...conflicts].sort().join(','); const ownerOpts = [{ value: 'all', label: t('calendar.owner.all') }, ...D.users.map(u => ({ value: u.id, label: u.short }))]; const statusOpts = [{ value: 'all', label: t('calendar.status.all') }, ...Object.entries(D.STATUS || {}).map(([k, v]) => ({ value: k, label: v.label }))]; const colorOpts = [{ value: 'owner', label: t('calendar.colorBy.owner') }, { value: 'status', label: t('calendar.colorBy.status') }]; const HOURS = []; for (let h = 8; h <= 19; h++) HOURS.push(h); const HOUR_H = 52, START = 8; // 週の起点（日曜） const weekStart = addDays(anchor, -anchor.getDay()); const weekDays = Array.from({ length: 7 }, (_, i) => addDays(weekStart, i)); const rangeLabel = view === 'week' ? `${weekStart.getFullYear()}年 ${weekStart.getMonth() + 1}/${weekStart.getDate()} 〜 ${addDays(weekStart, 6).getMonth() + 1}/${addDays(weekStart, 6).getDate()}` : view === 'day' ? `${anchor.getFullYear()}年 ${anchor.getMonth() + 1}月${anchor.getDate()}日(${wd(anchor.getDay())})` : view === 'list' ? t('calendar.list.title') : `${anchor.getFullYear()}年 ${anchor.getMonth() + 1}月`; const move = (dir) => setAnchor(a => addDays(a, view === 'week' ? dir * 7 : view === 'day' ? dir : dir * 30)); const evStyle = (e) => { const d = parseDT(e.datetime); const top = (d.getHours() - START) * HOUR_H + (d.getMinutes() / 60) * HOUR_H; return { top, color: evColor(e, colorBy) }; }; const methodOf = (e) => 'visit'; const right = ( <>
{[['month', t('calendar.view.month')], ['week', t('calendar.view.week')], ['day', t('calendar.view.day')], ['list', t('calendar.view.list')]].map(([v, l]) => ( ))}
); return ( {/* ツールバー */}
{view !== 'list' &&
move(-1)} /> move(1)} />
}
{rangeLabel}
{colorBy === 'owner' ? D.users.filter(u => events.some(e => e.owner && e.owner.id === u.id)).map(u => ( {u.short} )) : Object.entries(D.STATUS || {}).filter(([k]) => events.some(e => e.status === k)).map(([k, v]) => ( {v.label} ))} {unlinkedCount > 0 && ( )}
{conflicts.size > 0 && confKey !== dismissedConf && (() => { const dupEvents = events.filter(e => conflicts.has(e.id)).sort((a, b) => (a.datetime || '').localeCompare(b.datetime || '')); return (
{t('calendar.conflict.title', { n: conflicts.size })} {t('calendar.conflict.warn')} {dupEvents.map(e => ( ))}
); })()} {view === 'week' && (
{/* 曜日ヘッダ */}
{weekDays.map((d, i) => { const isToday = dateKey(d) === today(); return (
{wd(d.getDay())}
{d.getDate()}
); })}
{/* タイムグリッド */}
{HOURS.map(h =>
{String(h).padStart(2, '0')}:00
)}
{weekDays.map((d, di) => { const dayEvents = events.filter(e => dateKey(parseDT(e.datetime)) === dateKey(d)); const lay = overlapLayout(dayEvents); // 同時刻は横並びに分割 return (
{HOURS.map(h =>
setForm({ date: dateKey(d), time: String(h).padStart(2, '0') + ':00' })} style={{ height: HOUR_H, borderBottom: '1px solid #f6f7fa', cursor: 'pointer' }} title={t('calendar.hint.addEvent')} />)} {dayEvents.map(e => { const st = evStyle(e); const L = lay.get(e.id) || { col: 0, cols: 1 }; return (
setPopup(e)} style={{ position: 'absolute', top: st.top, height: HOUR_H - 6, borderRadius: 7, left: `calc(${(L.col / L.cols) * 100}% + 3px)`, width: `calc(${100 / L.cols}% - 6px)`, background: st.color + '18', borderLeft: '3px solid ' + st.color, padding: '4px 7px', cursor: 'pointer', overflow: 'hidden', transition: 'transform .1s' }} onMouseEnter={(ev) => ev.currentTarget.style.transform = 'scale(1.02)'} onMouseLeave={(ev) => ev.currentTarget.style.transform = 'scale(1)'}>
{fmtTime(e.datetime)} {conflicts.has(e.id) && }
{e.customer.shortName} {e.title}
); })}
); })}
)} {view === 'day' && (
{HOURS.map(h =>
{String(h).padStart(2, '0')}:00
)}
{HOURS.map(h =>
setForm({ date: dateKey(anchor), time: String(h).padStart(2, '0') + ':00' })} style={{ height: HOUR_H, borderBottom: '1px solid #f6f7fa', cursor: 'pointer' }} title={t('calendar.hint.addEvent')} />)} {(() => { const dayEvs = events.filter(e => dateKey(parseDT(e.datetime)) === dateKey(anchor)); const lay = overlapLayout(dayEvs); return dayEvs.map(e => { const st = evStyle(e); const L = lay.get(e.id) || { col: 0, cols: 1 }; return (
setPopup(e)} style={{ position: 'absolute', top: st.top, height: HOUR_H - 6, borderRadius: 8, left: `calc(${(L.col / L.cols) * 100}% + 8px)`, width: `calc(${100 / L.cols}% - 16px)`, background: st.color + '18', borderLeft: '3px solid ' + st.color, padding: '6px 11px', cursor: 'pointer', overflow: 'hidden' }}>
{fmtTime(e.datetime)} {conflicts.has(e.id) && }
{e.customer.company} · {e.title}
); }); })()} {events.filter(e => dateKey(parseDT(e.datetime)) === dateKey(anchor)).length === 0 &&
{t('calendar.empty.noMeetings')}
}
)} {view === 'month' && { setAnchor(d); setView('day'); }} colorBy={colorBy} conflicts={conflicts} />} {view === 'list' && } {/* 日程未定の進行中案件（ReadyCrew側でも商談日が未定＝リスケ中など）を明示 */} {(() => { const undated = cases.filter(c => !c.archived && !['won', 'lost', 'done'].includes(c.status) && !caseMeetingAt(c) && !(c.meetingDocs || []).length && !meetings.some(m => m.caseId === c.id)); if (!undated.length) return null; return (
{t('calendar.undated.count', { n: undated.length })} {t('calendar.undated.hint')} {undated.map(c => { const cust = D.customer(c.customerId); return ( ); })}
); })()} {popup && setPopup(null)} onOpen={() => { navigate('case', popup.caseId); }} onEdit={() => { setForm({ caseId: popup.caseId, datetime: popup.datetime, method: popup.method }); setPopup(null); }} colorBy={colorBy} conflict={conflicts.has(popup.id)} onCreateCase={() => { setCreateFrom(popup); setPopup(null); }} onLinkCase={() => { if (popup.kind === 'ff') { setLinkFf(popup); } else { setForm({ datetime: popup.datetime }); } setPopup(null); }} />} {form && setForm(null)} />} {/* 未紐付けイベント → 新規案件を作成（保存後：Google予定は商談日をセット／Fireflies通話は会議記録として取込） */} {createFrom && setCreateFrom(null)} onSaved={(id) => { if (createFrom.kind === 'gcal') scheduleMeeting(id, createFrom.datetime); else if (createFrom.kind === 'ff' && createFrom.ff) importFfToCase(id, createFrom.ff); setCreateFrom(null); }} />} {/* 未紐付けFireflies通話 → 既存案件へ会議記録として取込 */} {linkFf && ( setLinkFf(null)} title={t('calendar.unlinked.ffLinkTitle')} subtitle={(linkFf.ff && linkFf.ff.title) || ''} width={480} footer={}>
{cases.filter(c => !c.archived && !['won', 'lost', 'done'].includes(c.status)).slice(0, 80).map(c => ( ))}
{ffBusy &&
{t('calendar.unlinked.ffImporting')}
} )} {gcalOpen && setGcalOpen(false)} />} ); } function MonthView({ anchor, events, onPick, onDay, colorBy, conflicts }) { const first = new Date(anchor.getFullYear(), anchor.getMonth(), 1); const start = addDays(first, -first.getDay()); const cells = Array.from({ length: 42 }, (_, i) => addDays(start, i)); return (
{wdAll().map((w, i) =>
{w}
)}
{cells.map((d, i) => { const inMonth = d.getMonth() === anchor.getMonth(); const dayEv = events.filter(e => dateKey(parseDT(e.datetime)) === dateKey(d)); const isToday = dateKey(d) === today(); return (
onDay(d)} style={{ minHeight: 92, borderLeft: i % 7 === 0 ? 'none' : '1px solid #f4f5f7', borderTop: i >= 7 ? '1px solid #f4f5f7' : 'none', padding: 7, cursor: 'pointer', background: inMonth ? '#fff' : '#fbfbfc' }}>
{d.getDate()}
{dayEv.slice(0, 3).map(e => (
{ ev.stopPropagation(); onPick(e); }} style={{ display: 'flex', alignItems: 'center', gap: 5, fontSize: 12, color: '#3b414b', background: evColor(e, colorBy) + '14', borderRadius: 4, padding: '2px 5px' }}> {fmtTime(e.datetime)} {e.customer.shortName} {conflicts && conflicts.has(e.id) && } {/* 担当者名を常に表示（誰の商談か一目で分かるように）＋副担当も表示 */}
))} {dayEv.length > 3 &&
{t('calendar.more', { n: dayEv.length - 3 })}
}
); })}
); } /* イベント詳細 — Google カレンダー風（参加者・参加可否・備考・会議リンク） */ const eventKindLabel = (kind, method) => { // 予定（次回商談・ReadyCrew商談日）は手段があればそれを優先表示（「電話の予定は電話予定として」） if ((kind === 'next' || kind === 'appoint') && method === 'phone') return t('cd.phonePlanned'); if ((kind === 'next' || kind === 'appoint') && method === 'visit') return t('cd.visitPlanned'); return { next: t('calendar.kind.next'), appoint: t('calendar.kind.appoint'), done: t('calendar.kind.done'), doc: t('calendar.kind.doc'), ff: t('calendar.kind.ff'), gcal: t('calendar.kind.gcal') }[kind]; }; const gcalStatus = () => ({ yes: { label: t('calendar.rsvp.yes'), color: '#16a34a', icon: '✓' }, no: { label: t('calendar.rsvp.no'), color: '#dc2626', icon: '✕' }, maybe: { label: t('calendar.rsvp.maybe'), color: '#d97706', icon: '?' }, pending: { label: t('calendar.rsvp.pending'), color: '#9aa1ab', icon: '·' } }); const rsvpOpts = () => [['yes', t('calendar.rsvp.yes'), '#16a34a'], ['maybe', t('calendar.rsvp.maybe'), '#d97706'], ['no', t('calendar.rsvp.no'), '#dc2626']]; /* リスト（アジェンダ）ビュー：本日以降の予定を日付ごとに時系列で。日時・担当・顧客・準備状況・リンクを一覧 */ function ListView({ events, onPick, colorBy, conflicts }) { const D = window.APP_DATA; const upcoming = events.filter(e => e.datetime && e.datetime.slice(0, 10) >= today()).sort((a, b) => (a.datetime || '').localeCompare(b.datetime || '')); const groups = []; upcoming.forEach(e => { const day = e.datetime.slice(0, 10); let g = groups.find(x => x.day === day); if (!g) { g = { day, items: [] }; groups.push(g); } g.items.push(e); }); if (!groups.length) return (
{t('calendar.list.empty')}
); return (
{groups.map(g => { const d = new Date(g.day + 'T00:00'); const isToday = g.day === today(); return (
{d.getMonth() + 1}/{d.getDate()} ({wd(d.getDay())}) {isToday && {t('calendar.list.today')}} {t('calendar.list.count', { n: g.items.length })}
{g.items.map(e => { const c = e.caseId ? D.caseById(e.caseId) : null; const hasLink = !!((e.gcal && e.gcal.meetUrl) || (e.doc && (e.doc.videoUrl || e.doc.url)) || (e.ff && e.ff.url) || casePlaceUrl(c) || (c && c.meetingLinks && c.meetingLinks.length)); return (
onPick(e)} className="row-hover" style={{ display: 'flex', alignItems: 'center', gap: 11, padding: '11px 16px', borderBottom: '1px solid #f6f7fa', cursor: 'pointer' }}> {fmtTime(e.datetime)} {(e.kind === 'next' || e.kind === 'appoint') && e.method === 'phone' && } {(e.kind === 'next' || e.kind === 'appoint') && e.method === 'visit' && } {conflicts && conflicts.has(e.id) && } {e.customer.shortName} {e.title} {e.unlinked && {t('calendar.unlinked.badge')}} {c && {[['cd.tab.proposal', c.proposalStatus], ['cd.tab.quote', c.quoteStatus], ['cd.tab.prototype', c.prototypeStatus]].map(([k, sv]) => { const s = PROPOSAL_STATUSES[sv || 'none'] || PROPOSAL_STATUSES.none; return ; })} } {hasLink && } {e.status && } {eventKindLabel(e.kind, e.method) || t('calendar.label.event')}
); })}
); })}
); } function EventPopup({ e, onClose, onOpen, onEdit, colorBy, conflict, onCreateCase, onLinkCase }) { const { cases, patchCase, currentUser, showToast, navigate } = useStore(); const D = window.APP_DATA; const GCAL_ST = gcalStatus(); const RSVP_OPTS = rsvpOpts(); const c = e.caseId ? cases.find(k => k.id === e.caseId) : null; // 参加者のメールが社内メンバーなら、生メールでなく氏名＋本人カラーのアバターで表示する const userByEmail = (em) => em && D.users && D.users.find(u => u.email && String(u.email).toLowerCase() === String(em).toLowerCase()); // 参加者：Google カレンダー（出欠つき）＞ Fireflies の出席者 ＞ 担当者＋顧客窓口 const gcal = e.gcal || null; const ffRow = e.ff || (e.doc ? D.firefliesMeetings.find(f => f.id === e.doc.ffId) : null); const attendees = (gcal && gcal.attendees && gcal.attendees.length) ? gcal.attendees // [{name,email,status}] : ((ffRow && ffRow.attendees && ffRow.attendees.length) ? ffRow.attendees : [e.owner && e.owner.name, e.customer && e.customer.contact ? `${e.customer.contact}（${e.customer.shortName}）` : null].filter(Boolean)); const gStats = gcal ? ['yes', 'maybe', 'pending', 'no'].map(k => [k, attendees.filter(a => a.status === k).length]).filter(([, n]) => n > 0) : []; // 参加可否：案件行（eventRsvp）に保存して全員に共有。案件が無い通話は localStorage const rsvpMap = (c && c.eventRsvp && c.eventRsvp[e.id]) || {}; const [inviteBusy, setInviteBusy] = React.useState(false); // 担当者のGoogleカレンダー招待 const [localRsvp, setLocalRsvp] = React.useState(() => { try { return localStorage.getItem('anken_rsvp_' + e.id); } catch (_) { return null; } }); const myRsvp = c ? (rsvpMap[currentUser.id] || null) : localRsvp; const setRsvp = (v) => { const next = myRsvp === v ? null : v; if (c) { const m = { ...rsvpMap }; if (next) m[currentUser.id] = next; else delete m[currentUser.id]; patchCase(c.id, { eventRsvp: { ...(c.eventRsvp || {}), [e.id]: m } }); } else { try { next ? localStorage.setItem('anken_rsvp_' + e.id, next) : localStorage.removeItem('anken_rsvp_' + e.id); } catch (_) {} setLocalRsvp(next); } }; // 備考：案件行（eventNotes）に保存 const [note, setNote] = React.useState((c && c.eventNotes && c.eventNotes[e.id]) || ''); const savedNote = (c && c.eventNotes && c.eventNotes[e.id]) || ''; const saveNote = () => { if (!c) return; patchCase(c.id, { eventNotes: { ...(c.eventNotes || {}), [e.id]: note.trim() } }); showToast(t('calendar.toast.noteSaved')); }; // 会議リンク：Google Meet・録画・文字起こし・案件の会議リンク // 電話予定は会議リンクを出さない（時間になったら架電するだけ。URLが並ぶと紛らわしい） const isPhonePlan = (e.kind === 'next' || e.kind === 'appoint') && e.method === 'phone'; /* 予定（未来）のリンクはタイムライン・商談タブと同じ単一真実（casePlanLinkList＝カレンダー予定のURLが正）。 以前はGoogle予定のURLと案件の登録リンクを全部並べており、カレンダー=Zoom・案件=Meetの食い違い時に 古い方を押して入室できない事故が同一担当で2回発生（2026-08-12 改善）。過去回は従来表示（履歴用）。 */ const isPlanKind = (e.kind === 'next' || e.kind === 'appoint' || e.kind === 'gcal'); const urlWarn = (!isPhonePlan && isPlanKind && c && !casePlaceUrl(c)) ? planUrlConflict(c, gcal) : null; const fixCaseUrl = () => { if (!urlWarn || !c) return; const link = { id: 'ml' + Date.now(), label: t('calendar.linkFromCal', { kind: urlWarn.gcalKind }), url: urlWarn.gcalUrl }; patchCase(c.id, { meetingLinks: [link, ...(c.meetingLinks || [])] }); // 先頭に置く＝以後の全画面でこのURLが主になる showToast(t('calendar.linkConflictFixed', { kind: urlWarn.gcalKind })); }; const markUrlOk = () => { if (urlWarn && c) patchCase(c.id, { meetUrlConflictOk: urlWarn.key }); }; const links = []; if (!isPhonePlan) { // 手入力の「今回の会議URL」（casePlaceUrl・main側 2026-08-12 改修）は常に最優先で先頭に出す const placeUrl = casePlaceUrl(c); if (placeUrl) links.push({ label: t('ui.meetingLink.thisTime'), url: placeUrl, icon: 'video', color: '#16a34a' }); if (isPlanKind && c) { // 予定（未来）はタイムライン・商談タブと同じ単一真実（casePlanLinkList＝カレンダー予定のURLが正）。古い登録リンクは並べない casePlanLinkList(c, gcal).filter(l => l.url !== placeUrl).forEach(l => links.push({ label: t('calendar.link.joinKind', { kind: l.label }), url: l.url, icon: 'video', color: placeUrl ? '#2563eb' : '#16a34a' })); } else if (gcal && gcal.meetUrl && gcal.meetUrl !== placeUrl) { links.push({ label: t('calendar.link.joinKind', { kind: meetUrlLabel(gcal.meetUrl) }), url: gcal.meetUrl, icon: 'video', color: placeUrl ? '#2563eb' : '#16a34a' }); } if (e.doc && e.doc.videoUrl) links.push({ label: t('calendar.link.playRecording'), url: e.doc.videoUrl, icon: 'play', color: '#1d2129' }); if (e.doc && e.doc.url) links.push({ label: t('calendar.link.firefliesTranscript'), url: e.doc.url, icon: 'spark', color: '#ef5a3c' }); if (e.ff && e.ff.url) links.push({ label: t('calendar.link.firefliesTranscript'), url: e.ff.url, icon: 'spark', color: '#ef5a3c' }); if (!(isPlanKind && c)) (c && c.meetingLinks || []).filter(l => l && l.url !== placeUrl).forEach(l => links.push({ label: l.label || t('calendar.link.meetingLink'), url: l.url, icon: 'video', color: '#2563eb' })); // Meet も会議リンクも無い場合は取得元（ReadyCrew）へのリンクを出す if (!links.length && c && c.source === 'scrape' && c.sourceUrl) links.push({ label: t('calendar.link.openReadyCrew'), url: c.sourceUrl, icon: 'refresh', color: '#4a5af0' }); } const Row = ({ icon, children, top }) => (
{children}
); return (
ev.stopPropagation()} style={{ width: 420, maxWidth: '100%', background: '#fff', borderRadius: 14, boxShadow: '0 24px 60px rgba(20,22,40,.28)', overflow: 'hidden', animation: 'modalIn .16s ease' }}>
{/* タイトル */}
{e.status && } {/* 電話予定/訪問予定は一目で分かるよう色付き＋アイコンで強調（グレーの汎用バッジにしない） */} {isPhonePlan ? {t('cd.phonePlanned')} : (e.kind === 'next' || e.kind === 'appoint') && e.method === 'visit' ? {t('cd.visitPlanned')} : {eventKindLabel(e.kind, e.method) || t('calendar.label.event')}} {e.owner && {e.owner.short}} {/* サポート担当も表示（メインと見分けがつくよう控えめ・ツールチップで役割明示） */} {(e.subs || []).map(u => ( {u.short} ))} {c && c.rank && c.rank !== window.t("extra.common.notYet") && D.RANKS && D.RANKS[c.rank] && {t('calendar.rankBadge', { rank: D.RANKS[c.rank].label })}}
{e.title}
{e.customer.company}
{conflict &&
{t('calendar.conflict.popup')}
}
{/* 日時 */} {fmtDateFull(e.datetime)}（{wd(parseDT(e.datetime).getDay())}） {fmtTime(e.datetime)}{e.doc && e.doc.duration ? · {t('calendar.duration.minutes', { n: e.doc.duration })} : null} {/* 電話予定の案内（リンクの代わりに、やることを明示） */} {isPhonePlan && (
{t('cd.upcomingPhone')}
)} {/* 参加者（Google 予定は出欠ステータス付き） */}
{t('calendar.attendees.count', { n: attendees.length })} {gStats.length > 0 && {gStats.map(([k, n]) => t('calendar.attendees.statusCount', { label: GCAL_ST[k].label, n })).join(t('calendar.attendees.separator'))}}
{attendees.map((a, i) => { const isObj = a && typeof a === 'object'; const mu = isObj ? userByEmail(a.email) : null; // 社内メンバーに一致したら氏名＋本人カラーで const name = mu ? mu.name : (isObj ? (a.name || a.email) : String(a)); const av = mu ? { bg: mu.color, fg: '#fff', ch: (mu.short || mu.name).charAt(0) } : { bg: '#eef0fe', fg: '#4a5af0', ch: name.charAt(0) }; const st = isObj ? GCAL_ST[a.status] : null; const isOrganizer = gcal && isObj && gcal.organizer && (a.name === gcal.organizer || a.email === gcal.organizer); return (
{av.ch} {st && {st.icon}} {name} {isOrganizer && {t('calendar.attendees.organizer')}} {!isObj && e.owner && name.includes(e.owner.short) && {t('calendar.attendees.mainOwner')}}
); })}
{/* 参加可否（自分） */}
{t('calendar.label.rsvp')}
{RSVP_OPTS.map(([v, l, col]) => ( ))}
{c && Object.keys(rsvpMap).length > 0 && (
{Object.entries(rsvpMap).map(([uid, v]) => { const u = D.user(uid); const opt = RSVP_OPTS.find(o => o[0] === v); return u && opt ? (
{u.short} {opt[1]}
) : null; })}
)} {/* 担当者をGoogleカレンダーへ招待：既存の予定（自作 or ICS同期一致）があれば参加者を追記、無ければ新規作成 */} {c && (e.kind === 'next' || e.kind === 'appoint') && (
{t('cd.calInvite.membersLabel')}
 )} {/* カレンダー予定と案件登録リンクのURL食い違い警告（Zoom/Meet違い＝入れない事故防止） */} {urlWarn && (
{t('calendar.linkConflict', { gk: urlWarn.gcalKind, ck: urlWarn.caseKind })}
)} {/* 会議リンク */} {links.length > 0 && (
{t('calendar.label.links')}
{links.map((l, i) => (
{l.label} {/* リンクをコピー（お客様への案内に貼る用） */}
))}
)} {/* 商談準備（これからの商談のみ）：提案/見積/プロト の提出状況＋商談提案プレイブックへの動線 */} {c && e.datetime && e.datetime.slice(0, 10) >= today() && (
{t('calendar.label.prep')}
{[[t('cd.tab.proposal'), c.proposalStatus, 'proposal'], [t('cd.tab.quote'), c.quoteStatus, 'quote'], [t('cd.tab.prototype'), c.prototypeStatus, 'prototype']].map(([lbl, sv, tab]) => { const s = PROPOSAL_STATUSES[sv || 'none'] || PROPOSAL_STATUSES.none; return ; })}
)} {/* 備考 */} {c && (
{t('calendar.label.notes')}