報酬支払証明書


{success} 報酬支払証明書 の基本設計及び、画面設計を明記します。/実施先毎/都度作成


基本情報

名称 定義 備考
ディレクトリ components/client/application vue.jsのディレクトリです。
component proof_payment.vue vue.jsのcomponennt名です。
route proof_payment

画面レイアウト図

設計時:

image


画面項目

{primary} 画面に表示する項目等の情報を記載します。

No. 項目名 タイプ 必須 備考
1 名称 select - 作成したデータをselectで切り替え。onchangeでrefresh|初期値:最新データ
2 新規作成 button - 押下でINPUTを全て空に|保存で新レコード作成
3 編集 button - 押下でINPUTをABLEに|保存で編集完了
4 印刷 button - 保存されているデータをPDF出力|_blank
5 名称 input - 登録されてたらデータ表示|未登録時、空。重複チェック
- 書類項目 - - 項目数が多いため本ページ最下部に設置します。前Phaseの転記です。
6 保存 button - チェックOKならrefresh|NGならrefresh後、error表示
7 削除 button - 本レコード削除|完了後refresh

画面アクション

{primary} 上記項目の備考で記載しきれないものや、特記事項があるものを記載します。主に画面の処理(フロント)を記載します。

対象No. 項目名 処理内容
- データ未登録時 登録されたデータが何もない場合、切り替え名称の初期値は空で、表示部分は何もなし。新規作成ボタン押下で表示。
2.3 編集・新規作成時 押下したボタン以外のボタンを非活性(新規作成or編集/印刷)。押下したボタンを戻るボタンに/戻るボタンで元に戻す。
2.3.6.7 FlashMessage アクション時、FlashMassage表示

処理

{primary} 本画面に関する処理を記載します。主にシステムの処理(バックエンド)を記載します。

No. 項目名 処理内容
1 名称リストの取得 作成済みデータの名称リスト+「報告対象期間:年度」を取得。
2 初期値取得(新規) 新規作成ボタン押下時、入力できない項目に現在の情報を反映する。
3 初期値取得(既存) 作成済みデータの取得。
4 保存(新規) 新レコード作成。
5 保存(既存) 作成済みデータの編集。尚、当時データのまま表示・保持する必要があるため、保持方法を考慮する必要あり
6 削除 レコードの論理削除。
7 データの保存期間 過去10年
8 PDF出力 現在開いているページの情報を決まったテンプレートでODF出力
9 技能実習生リスト取得 過去含め所属していた技能実習生リスト取得

アラート

{primary} 本画面にアラートの情報を記載します。

No. 条件 表示テキスト
- なし なし

書類項目

{primary} 割愛した書類項目の情報を記載します。

No. 項目名 タイプ サイズ 備考
1 月分 入力 2
2 から 入力 - カレンダー表示
3 日分 入力 - カレンダー表示
4 ①氏名(ローマ字) セレクト -
5 ②性別 ラジオ - 項目番号4に該当する「性別」の値を代入
6 ③生年月日 入力 - カレンダー表示。項目番号4に該当する「生年月日」の値を代入
7 ④国籍・地域 セレクト - 項目番号4に該当する「国籍・地域」の値を代入
8 ⑤在留カード番号 入力 - 項目番号4に該当する「在留カード番号」の値を代入
9 ①報酬総額 入力 7
10 ②現金支給額 入力 7
11 ③支給日 入力 - カレンダー表示
12 実習実施社の氏名又は名称 表示 - 現在、編集画面を開いている実習実施先名を表示
13 作成責任者 表示 - 現在、編集画面を開いている実習実施先の代表者役職、代表者氏名を表示
14 給与支給者(役職) セレクト -
15 給与支給者(氏名) 入力 50
16 戻る ボタン -
17 出力 ボタン - 出力モーダル表示