制作の背景
職業訓練のカリキュラムのグループ開発演習で作成したECサイトの管理ページです。
架空の顧客からショッピングサイトの開発を委託され、
商品の追加・修正・削除などができる管理者機能が欲しいという要件を基に
グループで内で相談し必要と考えられる機能を実装したものになります。
開発を担当した箇所
コーディング全般
機能紹介
○登録商品一覧機能
・現在ショッピングサイトに登録されている商品の一覧表示を行う画面です。
ページの上部には簡易検索機能があり条件を指定して商品の絞り込みを行うことが
可能です。
商品情報右端の「編集」・「削除」ボタンを押下することで
それぞれの商品情報の編集画面や削除確認画面に遷移します。
○検索機能
商品情報の簡易絞り込み検索機能です。
カテゴリ・並び替え条件を設定、もしくは検索バーに商品名を入力することで
絞り込み検索ができ一覧表示を変化させることが可能です。
どれか1つの条件のみを指定しての絞り込みや、 3つを組み合わせて絞り込み検索をすること も可能です。
○商品登録機能
商品の登録画面です。内容を入力し確認ボタンを押下すると確認画面に遷移し
入力内容が表示されます。
写真ファイルを設定した場合は確認画面に表示され
写真ファイルを設定しない場合はデフォルトの画像が設定されるようになっています。
登録を確定すると一覧に表示されます。
○商品情報修正機能
商品情報の修正画面です。内容を入力し確認ボタンを押下すると確認画面に遷移します。
また、赤線枠内の「現在の写真を削除する」にチェックをつけることで
元の写真ファイルが削除されデフォルトの写真が設定される仕様になっています。
○商品情報削除機能
商品の削除機能です。 メイン画面から各商品の削除ボタンを押下することで
確認画面に遷移します。 削除を確定するとメイン画面から表示が消え、デフォルト以外の写真ファイルが削除されます。
また削除した商品情報は別ページにて確認することができます。
○バリデーション
Bootstrapのバリデーション機能を利用。
空欄の箇所や価格入力欄に0以下の数値が入力された場合にメッセージが表示され
次の処理に進めません。
