HJ統合管理画面運用マニュアル

最終更新: 2026-04-01 バージョン: v1.0 URL: https://hj-admin.kousuke-ito-316.workers.dev

1. システム概要

1.1 本システムの目的

HJ統合管理画面は、HJグループの 音楽本部 と マーケティング本部 の業務データを一元管理するWebアプリケーションである。両部署のAirtableベースをAPI経由で統合し、案件管理・支払管理・CRM・月次集計を横断的に閲覧・操作できる。

1.2 システム構成

ブラウザ（@hj-co.com ユーザー）
    │
    ▼
Cloudflare Workers（hj-admin）
    ├── Google OAuth 2.0 認証（@hj-co.com 限定）
    ├── 静的アセット配信
    └── API → Airtable REST API
              ├── 音楽本部 Base（appgZaClARo4AFKMH）
              └── マーケティング本部 Base（appKzZcriGKe77M1o）

Google Apps Script（自動処理）
    ├── 月次予算×案件リンク自動化（毎朝 6:00 JST）
    ├── 配賦整合性チェック（毎朝 7:00 JST）
    ├── アラート通知（日次）→ Slack Webhook
    └── Misoca API連携（請求書同期）

Slack
    ├── /intake コマンド（音楽本部: 相談受付登録）
    └── アラート通知チャンネル（マーケ本部）

1.3 対象ユーザー

役割	主な利用機能
営業担当者（音楽本部）	案件登録・ステータス更新・相談受付確認
営業担当者（マーケ本部）	案件登録・CRM管理・アプローチ履歴
経理担当者	支払管理・入金管理・請求書・月次集計
マネージャー・経営者	両部署横断ダッシュボード
システム管理者	Workers Secrets・GAS設定・障害対応

2. ログイン・認証

2.1 ログイン手順

ブラウザで https://hj-admin.kousuke-ito-316.workers.dev にアクセスする
未認証の場合、自動的にGoogleログイン画面にリダイレクトされる
@hj-co.com のGoogleアカウントでログインする
認証成功後、管理画面トップ（音楽本部ダッシュボード）が表示される

2.2 認証仕様

認証方式: Google OAuth 2.0（OpenID Connect）
許可ドメイン: @hj-co.com のみ（それ以外のGoogleアカウントは403エラー）
セッション有効期間: 8時間（自動ログアウト）
セッション管理: HttpOnly Secure Cookie（mp_session）

2.3 ログアウト

サイドバー最下部の「ログアウト」をクリックする。Cookieが削除され、ログイン画面にリダイレクトされる。

2.4 注意事項

ブラウザを閉じてもセッションは維持される（8時間以内なら再ログイン不要）
個人のGmailアカウント（@gmail.com）ではログインできない
複数タブでの同時利用は可能

3. 画面構成

3.1 レイアウト

画面は左サイドバー＋メインコンテンツの2カラム構成。

サイドバー: 部署別のナビゲーションメニュー、ログインユーザー名表示
メインコンテンツ: 選択中のページの内容

モバイル端末（768px以下）では、サイドバーが上部に移動する縦積みレイアウトに切り替わる。

3.2 音楽本部メニュー

メニュー	対応Airtableテーブル	説明
ダッシュボード	案件 / 支払明細 / 月次集計	案件数・未払い件数・月次サマリー
案件一覧	案件	全案件の一覧表示・新規登録
相談受付	相談受付	Slackフォームからの受付一覧
稼働イベント	稼働イベント	アーティスト稼働予定・実績
支払い候補	支払い候補	支払対象候補のリスト
支払明細	支払明細	確定した支払の明細
月次集計	月次集計	月次締め処理の状況
アーティスト	アーティスト	アーティストマスタ
取引先	取引先	取引先企業マスタ
メンバー	メンバー	社内メンバーマスタ

3.3 マーケティング本部メニュー

メニュー	対応Airtableテーブル	説明
ダッシュボード	案件 / 支払管理 / 月次予算	案件数・未払い件数・予算状況
案件一覧	案件	全案件の一覧（キャッシュフロー管理込み）
クライアント	クライアント	顧客企業マスタ（CRM）
代理店	代理店	代理店企業マスタ
担当者	担当者	クライアント/代理店の窓口担当者
入金管理	入金管理	売上側の入金予定・実績
支払管理	支払管理	原価側の支払予定・実績
請求書	請求書	売上/支払請求書のメタデータ
月次予算	月次予算	営業部員別・月別の目標vs実績
アプローチ履歴	アプローチ履歴	顧客へのアタック記録

3.4 ステータスバッジの色分け

テーブル内のステータス表示は以下の色で区別される。

色	対象ステータス
緑（badge-done）	完了 / 支払済み / 締め済み / 入金済
青（badge-active）	確定 / 稼働中 / 同期済み
黄（badge-pending）	上記以外（相談受領 / 調整中 / 未処理 / 確定待ち等）

4. 営業担当者向けガイド

4.1 音楽本部の営業担当者

案件の新規登録

サイドバーから「案件一覧」を選択する
右上の「+ 新規登録」ボタンをクリックする
モーダルフォームに以下を入力する
案件名（必須）: 案件の名称
案件ステータス: 相談受領 / 調整中 / 確定 / 完了 / 取消
実施日: イベント等の実施日
「登録」をクリックする

案件コード（PRJ-YYYYMMDD-NNN）は自動採番される。

相談受付の確認

Slackの /intake コマンドで登録された相談は「相談受付」メニューで確認できる。表示されるフィールドは以下の通り。

intake_code: 受付コード
相談元: 相談の発信者/部署
案件種別: 相談内容の分類
受付ステータス: 新規 / 確認中 / 案件化 / 見送り
案件化希望: 案件化を希望するかどうか

稼働イベントの確認

「稼働イベント」メニューで、アーティストの稼働予定・実績を確認できる。Google Calendar連携のステータス（未同期 / 同期済み / 再同期待ち / 取消済み / エラー）も表示される。

4.2 マーケティング本部の営業担当者

案件管理

「案件一覧」から案件の一覧を確認できる。表示フィールドは以下の通り。

project_code: 案件コード（PRJ-YYYYMM-NNN）
案件名: 案件名称
案件ステータス: 進捗状況
実施日: 実施予定日
消費税率: 10% / 8% / 非課税

案件の詳細（確度スコア、見込み売上/原価、クライアント情報等）はAirtableのインターフェースで直接編集する。

CRM操作

クライアント管理

「クライアント」メニューで顧客企業の一覧を確認する。表示フィールドは以下の通り。

client_code: 顧客コード（CLT-NNNN）
企業名: クライアント企業名
顧客ステータス: 新規ターゲット / アプローチ中 / アクティブ / 休眠
流入経路(大): 社内トス / 営業代行 / 自力 / その他

担当者管理

「担当者」メニューで、クライアント/代理店の窓口担当者を確認する。

アプローチ履歴

「アプローチ履歴」メニューで、顧客へのアタック記録を確認する。表示フィールドは以下の通り。

approach_code: アプローチコード
アタック日: 実施日
手段: 電話 / メール / 訪問 / Web面談 / 交流会 / その他
結果: 次回アポ獲得 / 検討中 / 見送り / 不在

5. 経理担当者向けガイド

5.1 音楽本部の経理業務

支払い候補の確認

「支払い候補」メニューで、支払対象候補を確認する。

candidate_code: 候補コード
支払先: 支払先名称
候補金額: 候補金額
候補ステータス: 未生成 / 候補 / 確定対象外 / 確定
費目: 費目分類

候補ステータスが「確定」になったレコードが支払明細に反映される。

支払明細の確認

「支払明細」メニューで、確定した支払の明細を確認する。

payment_code: 支払コード
支払先: 支払先名称
支払金額: 確定支払金額
支払ステータス: 未処理 / 支払待ち / 支払済み
支払予定日: 支払予定日

月次集計

「月次集計」メニューで、月次締め処理の状況を確認する。

monthly_close_code: 月次集計コード
対象月: 集計対象月
締めステータス: 集計前 / 確認中 / 締め済み
支払合計: 月間支払合計額
売上合計: 月間売上合計額

5.2 マーケティング本部の経理業務

入金管理

「入金管理」メニューで、売上側の入金予定・実績を管理する。

receipt_code: 入金コード（RCP-NNNN）
見込み入金額: 見込み金額
確定入金額: 確定金額
入金予定日: 入金予定日
入金ステータス: 未請求 / 請求済 / 入金待ち / 入金済 / 遅延

入金遅延（入金予定日を過ぎて未入金）の場合、Slackアラートが自動通知される。

支払管理

「支払管理」メニューで、原価側の支払予定・実績を管理する。支払管理テーブルが支払日・ステータスの正本（Single Source of Truth）である。

payment_code: 支払コード（PMT-NNNN）
支払金額: 支払金額
支払予定日: 支払予定日
支払ステータス: 確定待ち / 支払承認待ち / 支払手配済 / 支払済 / 遅延

支払期日の3営業日前にSlackリマインダーが自動通知される。

請求書管理

「請求書」メニューで、売上/支払の請求書メタデータを管理する。

invoice_code: 請求書コード（INV-NNNN）
種別: 売上請求書（自社発行）/ 支払請求書（受領）
請求書番号: Misoca等の請求書番号
発行日: 発行日
税込金額: 税込金額

売上請求書のステータス: 未発行 / 発行依頼中 / 発行済 / 送付済 支払請求書のステータス: 未受領 / 受領済 / 経理承認待ち / 承認済

未発行・未受領の請求書がある場合、Slackアラートが自動通知される。

月次予算

「月次予算」メニューで、営業部員別・月別の目標vs実績を確認する。

budget_code: 予算コード（BDG-YYYYMM-MBR）
対象月: 対象月（YYYY-MM）
目標売上: 月次目標売上
目標粗利: 月次目標粗利

実績売上・実績粗利・予算達成率はAirtableのRollup/Formulaフィールドで自動計算される。GAS Automationが毎朝6:00に案件リンクを自動更新し、Rollup集計を最新化する。

6. マネージャー・経営者向けガイド

6.1 ダッシュボードの見方

各部署のダッシュボードでは以下の3つの数値カードが表示される。

カード	説明
案件数	Airtable上の案件レコード総数
未払い件数	支払ステータスが「支払済み」「支払済」以外のレコード数
月次集計	登録されている月次集計/月次予算のレコード数

ダッシュボード下部には「最近の月次集計」テーブルが表示され、対象月・売上合計・支払合計・締めステータスを一覧で確認できる。

6.2 部署横断での確認

サイドバーで音楽本部とマーケティング本部を切り替えることで、両部署のデータを横断的に確認できる。部署切り替えは即時反映される。

6.3 注意事項

ダッシュボードの数値はAirtable APIからリアルタイムで取得される（キャッシュなし）
表示件数の上限は各テーブル100件（Airtable APIのmaxRecordsパラメータ）
金額は日本円（¥記号付き）で表示される

7. Slack連携

7.1 音楽本部: /intake コマンド

概要: Slackのスラッシュコマンド /intake でフォームを起動し、相談受付をAirtableに自動登録する。

手順:

Slackの該当チャンネルで /intake と入力して送信する
フォームが表示される（相談元・案件種別・案件化希望などを入力）
送信すると、Google Apps Script（Webhook）経由でAirtableの「相談受付」テーブルにレコードが作成される
受付コード（intake_code）が自動採番される
管理画面の「相談受付」メニューで確認できる

利点: 営業担当者がSlack上から離れることなく案件の種を登録でき、管理画面への手動入力が不要になる。

7.2 マーケティング本部: アラート通知

GAS（Google Apps Script）が日次で以下のアラートをSlack Webhookで通知する。

アラート種別	条件	通知タイミング
入金遅延	入金予定日を過ぎて「入金済」以外	日次
支払期日リマインダー	支払予定日の3営業日前、「支払済」以外	日次
未発行請求書	売上請求書で「未発行」ステータス	日次
未受領請求書	支払請求書で「未受領」ステータス	日次
配賦整合性エラー	案件商材明細の配賦額合計と案件確定金額が不一致	毎朝 7:00

通知例（入金遅延）:

:rotating_light: 入金遅延アラート (3件)
チェック日: 2026年4月1日

> RCP-0012 | ¥1,500,000 | 予定日: 2026-03-25 | ステータス: 入金待ち
> RCP-0015 | ¥800,000 | 予定日: 2026-03-28 | ステータス: 請求済
> RCP-0018 | ¥2,200,000 | 予定日: 2026-03-31 | ステータス: 入金待ち

8. システム管理者向けガイド

8.1 Cloudflare Workers の設定

Workers Secrets（wrangler secret で管理）

以下のシークレットが Cloudflare Workers に設定されている必要がある。

シークレット名	説明	設定方法
`GOOGLE_CLIENT_ID`	Google OAuth 2.0 クライアントID	`wrangler secret put GOOGLE_CLIENT_ID`
`GOOGLE_CLIENT_SECRET`	Google OAuth 2.0 クライアントシークレット	`wrangler secret put GOOGLE_CLIENT_SECRET`
`AIRTABLE_API_KEY`	Airtable Personal Access Token（音楽本部用）	`wrangler secret put AIRTABLE_API_KEY`
`MARKETING_API_KEY`	Airtable Personal Access Token（マーケ本部用、未設定時は`AIRTABLE_API_KEY`にフォールバック）	`wrangler secret put MARKETING_API_KEY`

wrangler.toml の環境変数（vars）

変数名	値	説明
`MUSIC_PM_BASE_ID`	`appgZaClARo4AFKMH`	音楽本部のAirtable Base ID
`MARKETING_BASE_ID`	`appKzZcriGKe77M1o`	マーケティング本部のAirtable Base ID
`ALLOWED_DOMAIN`	`hj-co.com`	ログイン許可ドメイン

デプロイ手順

cd ~/Projects/music-pm/admin-console
wrangler deploy

デプロイ先: https://hj-admin.kousuke-ito-316.workers.dev

8.2 Google Apps Script の設定

マーケティング本部の自動処理はGAS（Google Apps Script）で実行される。

Script Properties（GASエディタ > プロジェクト設定 > スクリプトプロパティ）

プロパティ名	説明
`AIRTABLE_API_KEY`	Airtable Personal Access Token
`AIRTABLE_BASE_ID`	対象AirtableのBase ID
`SLACK_WEBHOOK_URL`	Slack Incoming Webhook URL（アラート通知先）
`MISOCA_API_KEY`	Misoca API Key（請求書連携用、任意）
`BOOTSTRAP_TARGET_ENV`	`sandbox` または `production`

GASトリガー設定

関数名	トリガー	説明
`runAllAlerts`	日次（時間主導型）	全アラート一括実行
月次予算リンク自動化	日次毎朝 6:00 JST	案件×月次予算のリンク更新
配賦整合性チェック	日次毎朝 7:00 JST	案件商材明細の配賦額検証

個別アラートの手動実行

GASエディタから以下の関数を個別に実行できる。

runOverdueReceiptAlert() -- 入金遅延アラートのみ
runPaymentReminderAlert() -- 支払リマインダーのみ
runUnissuedInvoiceAlert() -- 未発行請求書アラートのみ
runUnreceivedInvoiceAlert() -- 未受領請求書アラートのみ

8.3 Google OAuth の設定

Google Cloud Console で OAuth 2.0 クライアントを設定する。

アプリケーションの種類: ウェブアプリケーション
承認済みリダイレクトURI: https://hj-admin.kousuke-ito-316.workers.dev/auth/callback
承認済みJavaScriptオリジン: https://hj-admin.kousuke-ito-316.workers.dev

Hosted Domain（hd）パラメータで hj-co.com に制限しているが、サーバー側でもメールドメインを再検証している。

8.4 Airtable API の制限事項

レート制限: 5リクエスト/秒（Base単位）
1回のレスポンス上限: 100レコード（ページネーション未実装のため、100件を超えるテーブルでは全件表示されない）
API Key: Personal Access Token を使用。有効期限切れに注意すること

9. トラブルシューティング

9.1 ログインできない

症状	原因	対処
Googleログイン画面が表示されない	Workers未デプロイまたはダウン	`wrangler deploy` を実行する
「GOOGLE_CLIENT_ID not configured」と表示される	Workers Secretが未設定	`wrangler secret put GOOGLE_CLIENT_ID` で設定する
「このアプリは @hj-co.com アカウントのみ利用可能です」	許可外ドメインのアカウントでログイン	`@hj-co.com` アカウントに切り替える
ログイン後すぐにログイン画面に戻される	セッションCookieの問題	ブラウザのCookieをクリアして再試行

9.2 データが表示されない

症状	原因	対処
「データの取得に失敗しました」	セッション期限切れまたはAirtable API障害	ページをリロードする。改善しない場合はログアウト→再ログイン
「取得エラー」	Airtable APIキーの失効またはBase IDの不一致	Workers SecretsのAPIキーを確認・再設定する
テーブルに「データなし」と表示される	該当テーブルにレコードがない、またはテーブル名の不一致	Airtableで直接テーブルを確認する
100件しか表示されない	API側の`maxRecords`制限	仕様上の上限。フィルタリングはAirtableインターフェースを使用する

9.3 Slackアラートが届かない

症状	原因	対処
アラートが一切届かない	GASトリガー未設定またはWebhook URL誤り	GASエディタでトリガーを確認する。Script Propertiesの`SLACK_WEBHOOK_URL`を確認する
特定のアラートだけ届かない	対象レコードが0件	Airtableで該当テーブルのフィルタ条件を確認する
「アラート通知処理エラー」が通知される	GAS実行時の例外	Airtableの実行ログテーブルでエラー詳細を確認する

9.4 /intake コマンドが動かない

症状	原因	対処
コマンドが見つからない	Slack Appの設定不備	Slack App管理画面でスラッシュコマンドの登録を確認する
フォーム送信後にエラー	GAS Web Appの URL変更またはデプロイ未反映	GASで新しいデプロイを作成し、SlackのRequest URLを更新する
Airtableにレコードが登録されない	APIキーの失効	GASのScript Propertiesを確認する

10. 用語集

用語	説明
Base	Airtableにおけるデータベースの単位。音楽本部とマーケ本部でそれぞれ別のBaseを使用
Workers Secrets	Cloudflare Workersに安全に保存される環境変数（APIキー等）
Script Properties	Google Apps Scriptに保存される設定値
SoT（Single Source of Truth）	データの正本。同じ情報が複数箇所にある場合、どちらが正とするかの定義
Rollup	Airtableのフィールド型。リンク先テーブルの値を集計する
Formula	Airtableのフィールド型。計算式で値を自動算出する
GAS	Google Apps Script の略称
配賦	1つの案件の売上/原価を商材別に按分すること
確度スコア	マーケ本部の案件で使用する受注確度の定量評価（予算/決裁権/タイミング/競合の4項目）
intake	音楽本部の「相談受付」。Slackのスラッシュコマンドまたは管理画面から登録する

HJ統合管理画面 運用マニュアル

目次