!!! ページリンク
>>{23::gr07}{班ページトップへ}
!!! ものと操作の洗い出し
時間とお金の管理アプリにおけるものと操作について班員とあらかたまとめた。

!!! アプリのページ構造

* ログイン画面
* ホーム画面:
** 給料確認ウィンドウ
** カレンダースクロールボタン
** 予定追加ボタン
** 内容部分
* 予定追加（編集）ページ
*設定ページ

!!! 各画面のものと操作

!! ''''1. ホーム画面''''
図1((br))
<<{Screenshot 2023-04-28 at 15-34-56 プレゼンテーション.pptx.png}
*　ホーム画面
** 給料確認ウィンドウ
*** html:いいところに配置（右上くらい）
*** javascript:データベースから計算
** カレンダースクロールボタン
*** html:デザイン、ページ上部に固定
*** javascript:表示する日時との連動
** 予定追加ボタン
*** html:デザイン,ページ下部に固定
*** javascript:追加ページへの遷移	
** 内容部分
*** html:デザイン、時間に合わせた位置に表示する機能
*** javascript:タッチすると編集ページヘ遷移、データベース読み込み


!! ''''2.設定ページ''''
図2((br))
<<{Screenshot 2023-04-28 at 15-35-07 プレゼンテーション.pptx.png}
* 設定ページ
** html:デザイン、プロフィール記入、講義時間、時給設定
** javascript:データベースへ登録

!! ''''3. タイマー''''
* タイマーの入力ボタン（計測設定画面への誘導ボタン）：もの
** ボタンクリックでタイマーセット用画面に遷移する（ポップアップ表示）：操作
* （作動中）スタート/ストップボタン：もの
** セットされたタイマーをクリックするとカウントダウン/停止する
* タイマー：もの
** （作動中）設定した時間についてカウントダウン表示：操作
** （作動中）カウントダウン完了でタイマー停止：操作
* 時計：もの
** タイマーとは独立して表示：操作
* アラーム：もの
** カウントダウン完了時にアラーム音を鳴らす
* 計測時間設定ボタン（歯車アイコン）：もの
** ボタンを押したら計測設定画面を表示する：操作
* start，stopボタン：もの
** 動作の状態に応じてタイマーをstat又はstopする：操作
* resetボタン：もの
** タイマーを終了し計測記録画面を表示する：操作



!! ''''4. タイマーセット''''
* 背景：もの
** ポップアップ表示：操作
* プリセット（アプリ側が用意）：もの
** 選択した時間がセット時間に反映：操作
** 別の時間を選択する or 時間を編集したら上書き：操作
* カスタムプリセット（アカウントに紐づけられた履歴）：もの
** ログイン済みならカスタムプリセット内容を表示する：操作
* セット（周回，ユーザーが指定）：もの
*** 周回を行うかどうかの詳細設定を行う：操作
*** プルダウン式で値を入力：操作
*** アカウントにカスタムとしてセット内容を記録：操作
* 決定ボタン：もの
** ボタンを押すと設定をタイマー画面に反映しこのポップアップを閉じる：操作


!! ''''5. タイマー結果の記録用ポップアップ''''
* 計測時間：もの
** タイマーコンポーネントから実施時間のpropsを受け取って表示する：操作
* 計測内容（属性）の識別用カラータグのプリセット：もの
** プリセットのカラー（ラジオボタン形式）を選択する：操作
* コメント入力欄：もの
** 記録内容に関するコメントを入力する：操作
* 記録決定ボタン：もの
** dbに記録データを送信する＋元の画面に戻す：操作

!! ''''6. 記録管理（ダッシュボード）''''
* 背景：もの
** 表示する
* ユーザーの記録データ：もの
** タイムラインタブにて時系列に並べて一覧表示する：操作
** クリックで記録を編集する（→編集画面ポップアップ）
* 計測時間チャート：もの
** 過去の計測時間を視覚的に表示する：操作

!! ''''7. カレンダー''''
* 1ヶ月単位のカレンダー表示：もの
* 表示単位の移動ボタン（先月，来週，etc）：もの
** クリックで表示するものを移動させる：操作
* 日に対応する欄に過去に記録されたものを表示：もの
** クリックで過去の記録内容を表示する：操作




（作成途中）