Chapter 08

プロフィール画面を実装

たつきち
たつきち
2022.07.29に更新

この章に対応するコミット

デモアプリは日本語と英語に対応するためすべての文字列リテラルを翻訳しているので、コミットの内容は本文の解説と若干異なります。

プロフィール画面を実装

現状、管理者がアプリ内の全ユーザーの情報を読み書きするためのCRUDは完成していますが、これとは別に、ユーザーが自分自身のユーザー情報を読み書きするための画面も必要です。

次はこれを実装していきます。

と言っても、ユーザーのCRUDに画面を少し付け足すだけで、特に難しいことはありません👍

コントローラ

/**
 * @Route("/profile", name="profile_show", methods={"GET"})
 */
public function profileShow()
{
    return [
        'user' => $this->getUser(),
    ];
}
/**
 * @Route("/profile/edit", name="profile_edit", methods={"GET", "POST"})
 */
public function profileEdit(Request $request)
{
    $form = $this->createForm(UserEditType::class, $user = $this->getUser());
    $form->handleRequest($request);

    if ($form->isSubmitted() && $form->isValid()) {
        $this->em->persist($user);
        $this->em->flush();

        $this->addFlash('success', 'ユーザー情報の編集が完了しました。');

        return $this->redirectToRouteOrReturn('user_profile_show');
    }

    return $this->render('user/profile_edit.html.twig', [
        'user' => $user,
        'form' => $form->createView(),
    ];
}
/**
 * @Route("/profile/change_password", name="profile_change_password", methods={"GET", "POST"})
 */
public function profileChangePassword(Request $request)
{
    $user = $this->getUser();

    $form = $this->createForm(UserChangePasswordType::class);
    $form->handleRequest($request);

    if ($form->isSubmitted() && $form->isValid()) {
        $user->plainPassword = $form->get('newPassword')->getData();

        $this->em->persist($user);
        $this->em->flush();

        $this->addFlash('success', 'パスワードの変更が完了しました。');

        return $this->redirectToRouteOrReturn('user_profile_show');
    }

    return $this->render('user/profile_change_password.html.twig', [
        'user' => $user,
        'form' => $form->createView(),
    ];
}

ビュー

例によって全文記載は避けますので実際のファイルを見てみてください🙏

ついでに、プロフィール画面への動線として、グローバルナビの右上にドロップダウンを追加しています。

ドロップダウンには、ログアウトリンクや switch_user (デモアプリでは 代理ログイン と表現しています)から抜けるためのリンクも設置しています。(もちろんこれは代理ログイン中にしか表示されません)

これで、無事に下図のようにプロフィール画面にアクセスできるようになりました🙌