📚
Nuxt.jsでWebアプリケーション開発メモ14
概要
ユーザーの編集画面を追加。
プロンプト14
# 命令14
ユーザー編集画面を追加してください。
- user.vueで各行のactionメニューから編集をクリックすると、そのユーザーの編集画面に遷移します。
- パスは`admin/user/update`か`admin/user/update/{pk}`のどちらかになるようにしてください。どちらのパスにするかは、設計的により良い方法という観点で選択してください。
- 編集画面のフォームはユーザー追加画面をベースに以下の点だけを変更してください。
- パスワード、パスワード確認入力ボックスは不要。
- api_customuserテーブルのis_active相当のチェックボックスを追加してください。ラベル名は`アクティブ`としてください。
- ボタンは`キャンセル`ボタンと`変更`ボタンにしてください。
- その他ページ構成はユーザー追加画面と同じにしてください。（一部私が手動修正している箇所もありますのでそれと同じにしてください。）
追加命令
- 追加画面と共通化できそうなデータ定義を共通化。
- ユーザー一覧画面で
アクティブ列を追加。 - Djangoの
is_staffの解釈を勘違いしていた。このアプリでは管理者はis_staffとis_superuserは常にTrueとするように変更。
画面
対応内容
- ユーザー編集画面を追加。
- パスは
admin/user/update/{pk}にした。
- パスは
- ユーザー追加画面や一覧画面で共通のデータ定義を切り出して
types/user.tsに定義するようにした。 - Django側でユーザー情報取得する際、
is_superuserの値を返していなかったので返すよう修正。 - Django側でユーザー追加、編集時に管理者であれば
is_staffとis_superuserは常にTrueとするように変更。
ソース差分
バックエンド
フロントエンド
Discussion