アカウント管理一覧＿基本設計
{success} アカウント管理一覧画面の
一覧部分の基本的事項を明記します。
概要
KIZUNAを運営する本システムにログインできるアカウントの一覧画面です。
新規作成・確認・編集を 1 ページで行います。
尚、本ページでは左メニューとなる一覧部分のみ明記します。
基本情報
| 名称 | 定義 | 備考 |
|---|---|---|
| ディレクトリ | components/views/account | vue.js のディレクトリです。 |
| component | account-list | vue.js の componennt 名です。 ファイル名はAccountList |
| route | /account | route 名です。 |
画面レイアウト図
設計時：
画面項目
{primary} 画面に表示する項目等の情報を記載します。
| No. | 項目名 | タイプ | 必須 | 備考 |
|---|---|---|---|---|
| 1 | 新規作成ボタン | button | - | 新規作成フォームをコンテンツ部分に表示 |
| 2 | 検索 | search | - | 名前/ログインID 空白区切り で LIKE 検索 |
| 3 | 一覧 | button | - | 名前/ログインID を一覧表示 ｜ 押下でコンテンツ部分に詳細表示 |
画面アクション
{primary} 上記項目の備考で記載しきれないものや、特記事項があるものを記載します。主に画面の処理（フロント）を記載します。
| 対象 No. | 項目名 | 処理内容 |
|---|---|---|
| 新規作成 | 1 | 新規作成ボタンを押下で、空のフォーム表示 |
| 検索 | 2.3 | onchange で API 実行/一覧に該当するアカウントを表示/空白に更新で全表示 |
| 一覧 | 3 | 押下で情報取得 API 実行 → 詳細をコンテンツ部分に表示 / 50 件ごとに取得 / 無限スクロール |
処理
{primary} 本画面に関する処理を記載します。主にシステムの処理（バックエンド）を記載します。
| No. | 項目名 | 処理内容 |
|---|---|---|
| 1 | アカウント一覧取得 | アカウント一覧＿API |