Feature / UI 13

FW 管理側 公開側

ステータスチップ

未対応、対応中、完了、保留などの状態を色付きラベルで表示します。

ステータスチップは、一覧、詳細、カード、履歴の中で、今どの状態にあるかを短いラベルと色で示すUIです。Roundtableでは、状態名、色、並び順、誰が変更できるか、状態ごとの次の操作をそろえてから実装範囲を決めます。

案件や問い合わせの一覧で未対応、対応中、完了、保留のステータスチップを表示している業務画面例

この機能でできること

未対応、対応中、完了、保留、差し戻し、承認待ち、期限切れなどの状態を、文字だけでなく色付きのチップとして表示できます。一覧の中で優先して見るべき行を見つけやすくし、詳細画面や公開ページでも利用者に現在状況を分かりやすく伝えます。

状態を見せるだけでなく、次に何をする画面かを決めるための目印です。 チップの色と文言を統一すると、発注者、実装者、AIに指示する人が「どの状態ならどの操作を出すか」を同じ前提で話せます。

よくある利用場面

対応状況の一覧表示 問い合わせ、タスク、申請、予約、請求などで、未対応や対応中の行をすぐに見つけます。
進行状態の共有 顧客側の公開ページに、受付済み、確認中、完了などの状態を出して問い合わせを減らします。
操作可否の判断 完了後は編集不可、保留中は通知しない、承認待ちは承認ボタンを出すなど、状態に応じた操作を分けます。

プロンプト例

状態名だけでなく、色、表示場所、変更できる人、状態ごとの操作をまとめて伝えると、見た目だけのチップではなく業務判断に使える状態表示になります。

プロンプト 問い合わせ一覧にステータスチップを追加してください。状態は未対応、対応中、完了、保留の4種類で、未対応は赤、対応中は青、完了は緑、保留は黄で表示してください。一覧、詳細、公開側の問い合わせ履歴で同じ文言にし、管理側では担当者だけが状態を変更できるようにしてください。完了の行では返信ボタンを非表示にしてください。

この機能を使うときのポイント

状態の種類未対応、対応中、完了、保留など、業務上の判断に必要な数だけに絞ります。
色の意味赤は注意、青は進行中、緑は完了、黄は保留のように、画面全体で意味をそろえます。
表示場所一覧、詳細、カード、履歴、公開ページのどこに出すかを決めます。
変更権限誰が変更できるか、顧客に見せてよい状態か、内部だけの状態かを分けます。

この機能を実装するときのコツ

状態は文字列を画面ごとに直接書かず、選択肢や定数として管理します。表示側では状態値からラベルと色を引けるようにし、一覧、詳細、公開ページで同じ定義を使います。状態によってボタン表示や保存可否が変わる場合は、見た目の出し分けだけでなく、保存処理側でも同じ条件を確認します。