---
# System prepended metadata

title: 出退打刻管理システム 概要書

---

# 出退打刻管理システム 概要書



## ■概要書作成メンバー
* 石橋祐治
* 渡部蓮太朗



## ■使用ミドルウェア

- PHP 7.3.9
- MariaDB 10.4.6
- Laravel 5.8



## ■本システムの概要

本システムは、アルバイトの出退勤の打刻とシフトの管理を目的としたものである。
また、使用するアルバイトに向けたインフォメーション表示や、個人に対する情報表示の機能も備える。



## ■画面遷移図

![](https://i.imgur.com/RCIiBCp.jpg)



## 各機能説明
---



### ==■ログイン機能==

![](https://i.imgur.com/dLxNs4E.jpg)

* 従業員番号、パスワードをユーザーが入力し、ログインボタン押下時にユーザーの入力情報を元に打刻管理システムへログインする。
* ロールは管理者と一般ユーザーに分かれており、各ロールで使用できる機能が異なる。

<br><br><br>

---



### ==■出退勤登録機能==

![](https://i.imgur.com/QGM1HrC.png)

* 出退勤画面では現在の日付、時刻を確認できる。
* 時間の下側の枠には全従業員に向けてインフォメーションを表示する。
* ログインユーザーの出勤、退勤、休憩開始、休憩終了を打刻することができる。

<br><br>


  
#### *◆出勤時の挙動*

![](https://i.imgur.com/D1lPkiO.png)

* 「出勤」ボタン押下で出勤の打刻を行う。
* 出勤の打刻を行う際に当日の体調も事前に登録ができ管理者が把握ることが可能。
* 出勤が完了するとおみくじ式(ランダム)が発生。
引いた運勢によった一言付きで表示される。
* 出勤すると「出勤」表記が「退勤」表記に切り替わり、休憩開始が活性する。

![](https://i.imgur.com/oOaHEIf.png)

<br><br>

#### *◆休憩時間入力(開始/終了)の挙動*

![](https://i.imgur.com/vazBa8E.png)

* 出勤後に休憩開始ボタンが活性。退勤ボタンが非活性になる。
* 休憩開始ボタン押下で休憩開始を打刻することができる。
* 休憩を開始すると「休憩開始」が「休憩終了」表記に切り替わる。
* 休憩終了ボタン押下で休憩終了を打刻することができる。
* 休憩を終了すると「休憩終了」が「休憩開始」表記に切り替わる。

<br><br>

#### *◆退勤時間の登録*
![](https://i.imgur.com/laYFmCr.png)

* 退勤ボタン押下でログインユーザーの退勤時間を打刻することができる。
* ログインユーザーが退勤時に次回のシフトを表示する。
* 退勤が完了すると休憩ボタンが非活性となり、「退勤」が「出勤」表記に切り替わる。
    
![](https://i.imgur.com/bRiDqkW.jpg)

<br><br>

---
### ==■シフト一覧表示・登録・編集・削除機能==

**◆月ごとのシフト一覧を表示/検索(管理者はエクセル出力が可能)**

![](https://i.imgur.com/zo9WHwD.jpg)

* シフト一覧（月単位）は管理者、一般ユーザー共通機能。
* 月単位で検索が可能。
* カレンダー上にユーザー名表示。複数人いる場合はシフト入りしている人数が表示され、人数をクリックすると小ウィンドウでシフト入りメンバーを表示する。
* カレンダーの日付をクリックするとシフト一覧（日別）に遷移する。
* エクセル出力は管理者権限のみ出力が可能。

<br><br>

---

**◆日ごとのシフト一覧を表示(管理者権限)**

![](https://i.imgur.com/w7H5gAv.jpg)

* 管理者はシフトに入れるメンバーを追加、編集、削除ができる。
* 日別でシフト検索が可能。
* 管理者は打刻確定部分の編集と、シフト予定を調整することが可能。
* 予定の項目は一般ユーザーがシフト希望として提出し、それを参考に調整できる。
* シフトの調整はバーを作って行う。ドラッグで編集、×ボタンで削除。
* ページ更新を行うと最新の状態で表示される。

<br><br>

---

**◆日ごとのシフト一覧を表示(一般ユーザー権限)**
![](https://i.imgur.com/lftVB9o.jpg)

* 一般ユーザーはシフト希望のみ追加、編集、削除ができる。
* 日別でシフト検索が可能。
* シフトの調整は右上のセレクトボックスから追加しバーを作成。
* ドラッグで編集、×ボタンで削除。
* ページ更新を行うと最新の状態で表示される。

<br><br>

---

![](https://i.imgur.com/4dAGEHz.jpg)

* 作成したシフトは当日になると出退勤画面に表示される・
* 出勤状況は色で表示される。【白：未出勤 　緑：出勤済み 　黄：遅刻 　赤：欠勤 　青：休憩 　灰：退勤済み】
* 出勤時の体調も出勤後表示される。シフト予定時間がオレンジで表示される。

<br><br>

---
### ==■打刻一覧表示検索機能==

![](https://i.imgur.com/qZaxX1x.jpg)

* ユーザーが打刻したデータの月単位で参照/検索ができる。
* 管理者権限は全ユーザーの打刻データを参照可能。
* 項目は出勤、退勤、休憩開始、休憩終了、勤務時間、時間外の６項目。
* 時間外の算出方法は対象ユーザーシフトに対して打刻データが上回っていた場合、残業時間を表示する。
---
![](https://i.imgur.com/iWn5SR5.png)
* 管理者以外はログインユーザーのみ閲覧可能
* 機能は管理者と同じ。

<br><br>

---
### ==■月単位業務状況表示機能==

**現在の賃金計算結果表示**
![](https://i.imgur.com/p2BXXfo.png)
* 月初めから現在までの実働累計賃金を計算して表示{内訳は(時給*実働時間) + (残業分)}
* 管理者によって登録されたシフトから計算された1ヶ月の予想合計賃金を確認できる
---
![](https://i.imgur.com/Nibb0eA.png)

* 管理者以外はログインユーザーのみ閲覧可能
* 機能は管理者と同じ。

<br><br>

---
### ==■目標一覧表示・登録・編集・削除機能==

![](https://i.imgur.com/ee3yFu4.jpg)

* 時給アップを狙いたい人に向けて評価項目を提示。これを満たせれば時給が上がる。
* 管理者のみ目標の追加、編集、削除ができる。
* 項目は「初級/中級/上級」でランク付けができ、内容を記述することが可能。

<br><br>

---

![](https://i.imgur.com/WqTuyP8.jpg)

* 一般ユーザーは管理者が設定した目標は参照することができる。
* 追加、編集、削除はできない。

<br><br>

---
### ==■インフォメーション一覧表示・登録・編集・削除機能（管理者のみ）==

**◆メッセージ登録・編集・削除(全体宛て/個人宛て)**
![](https://i.imgur.com/jdv7Ael.png)

* 管理者のみ全体または個人に対してインフォメーションを作成することができる。
* 全体へのメッセージ表示は勤怠画面で表示される。
* 個人へのメッセージ表示は対象ユーザーがログイン時に勤怠画面のメールボタン押下で表示される。
* 登録してあるインフォメーションが全件表示される。
* 新規作成ボタンで編集途中のインフォメーションをリセットすることができる。
* 追加ボタン押下でインフォメーションを追加することができる。
* 追加する際に掲載期間、全体/個人宛の選択が可能。

<br><br>

---

![](https://i.imgur.com/COd8bzF.png)

* 対象インフォメーションの編集ボタン押下で編集が可能。
* その際に掲載期間、全体/個人、内容を編集できる。
* 対象インフォメーションの削除ボタン押下で削除が可能。

<br><br>

---

**◆インフォメーション表示(全体宛て)**

![](https://i.imgur.com/OlmwuyD.jpg)

* インフォメーションに登録した全体向けのインフォメーションを表示
* 表示期間中のものは全て表示される。

<br><br>

---

**◆インフォメーション表示(個人宛て)**

![](https://i.imgur.com/UPYiN6h.jpg)

* メールボタン押下でインフォメーションがある場合は表示する。
* 直近で設定されていて表示期間中のインフォメーションを表示。
* ログインユーザーのみ閲覧が可能

<br><br>

### ==■ユーザ一覧表示・登録・編集・削除機能（管理者のみ）==

---

![](https://i.imgur.com/QPXMlV6.jpg)

* 管理者のみユーザー画面を操作することが可能。
* 登録済みのユーザー一覧を表示する。
* 新規登録ボタン押下でユーザー作成ページに遷移する。
* ユーザー行の編集ボタン押下で編集ページに遷移する。
* ユーザー行の削除ボタン押下でユーザーを削除することができる。

![](https://i.imgur.com/dtUJgsv.jpg)

* ユーザー検索で絞り込むことも可能。

<br><br>

---

![](https://i.imgur.com/xcxTnGW.jpg)

* 新規作成の画面。
* 必要項目を入力し作成/更新ボタン押下で登録処理を行う。
* ボタン押下時に入力漏れがある場合はエラーメッセージを表示。
* 入力漏れがない場合は登録、更新処理を行い完了と同時にユーザー一覧画面に遷移する。
* 従業員番号は新規作成時に自動で採番される。

<br><br>

---

![](https://i.imgur.com/EosAhdL.jpg)

* 編集画面のみ従業員番号を表示。
* 必要項目を入力し作成/更新ボタン押下で更新処理を行う。
* ボタン押下時に入力漏れがある場合はエラーメッセージを表示。
* 入力漏れがない場合は登録、更新処理を行い完了と同時にユーザー一覧画面に遷移する。





