画面設計|監理団体[ 理事・職員 ]


{success} 監理団体[ 理事・職員 ]画面の画面設計を明記します。


基本情報

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

画面レイアウト図

基本設計時 理事・職員一覧、編集画面:

image

コーディング後:


項目名

理事・職員一覧

No. 項目名 タイプ 必須 アクション有無 備考
1 新規作成 button - - -
2 検索(入力式) 入力 - 氏名@LIKE検索
3 氏名 リンク - - -

表示・登録編集

No. 項目名 タイプ 必須 アクション有無 備考
1 氏名 表示 - - -
2 編集 button - 登録・編集時のみ表示
3 閉じる button - 登録・編集時のみ表示
4 氏名 入力 -
5 氏名(ふりがな) 入力 - ふりがな自動入力
6 氏名(ローマ字) 入力 - -
7 区分 セレクト - -
8 役職 入力 - - -
9 担当 チェック - - -
10 郵便番号 入力 数字のみ入力可能。住所自動入力(都道府県/市区町村)
11 理事・職員の住所 入力 - -
12 電話番号 入力 - 数字のみ入力可能
13 登録・更新 button - -
14 削除 button - 新規作成では表示されない
- 登録後、書類ページに戻る - - - 表示項目から削除

アクション

理事・職員一覧

No. 項目名 処理内容
- - -

表示・登録編集

No. 項目名 処理内容
1 編集 背景が反転してコンテンツが入力モードに切り替わる
2 閉じる 入力から表示モードに切り替わる
3 削除 編集を行っている理事・職員の情報を削除する
4 登録・更新 作成・編集しているユーザー情報を更新する

その他補足

警告文

No. 項目名 処理内容
1 未登録がある場合 一覧の箇所に「登録してください」の警告文を表示。1つでも登録されていたら非表示。