EC-CUBE3系で管理画面にナビゲーションを追加する

EC-CUBE3系になって、俺の考えた最強のフレームワークから、一般的なフレームワークに大きく構造が変わったEC-CUBEですが、
そのため、カスタマイズするのが大変になった感があります。
ここでは、カスタマイズのサンプルとして、管理画面にナビゲーションを追加してみます。

ここにソースがあります。
開発が楽なように、Dockerで動くようにしています。
コンテナは俺の考えた最強の(ry でもいいのですが、一応公式（？）っぽいのがあったのでそれを使っています。

EC-CUBE3の管理画面のナビゲーションはこんな感じです。今回はここにメニューを追加します。

• EC-CUBE3のナビゲーションメニューは、src/Eccube/Resource/config/nav.yml.distに設定がありますので、
  まずはここにメニューを追加します。
  イメージとしては、

  ----設定
        |----追加した設定項目
                |----設定画面その１

  のようにしたいので、設定項目の下に以下のような設定を追記します。

       - id: powerfull
         name: 俺の考えた最強の設定
         has_child: true
         child:
           - id: powerfull_settings
             name: 最強の設定画面
             url: admin_setting_powerfull_powerful_powerfull_settings

  • ここで注意なのが、どうもEC-CUBE3の仕組み上、3階層までしかメニューを持てないようです。
    まず、親となる追加する設定項目に、has_child: trueとし、子供を持たせます。
    子供の要素には、名前と、urlに識別名を入れます。ここは何でもいいのですが、ほかのに合わせておくと良いです。
    後でこの識別名とルーティング（URLパス）を対応付けさせることによって、実際のリンクとして機能させます。

• 次に先ほど述べたルーティングに追加していきます。管理ページのルーティングはsrc/Eccube/ControllerProvider/AdminControllerProvider.phpにありますので、以下のように追加します。

         // powerfull/powerfull_settings
         $c->match('/setting/powerfull/powerfull_settings','\Eccube\Controller\Admin\Setting\Powerfull\PowerfullController::index')->bind('admin_setting_powerfull_powerful_powerfull_settings');

  何となく意味は分かると思いますが、match()の第一引数でセットしたURLにアクセスすると、第二引数のコントローラクラスのindexメソッドを呼び出すぜ。という組み合わせ（？）をbindで先ほどの識別子と対応させています。
• さて、適当にコントローラクラスを指定してしまったので、作成します。
  今回は簡単に画面表示だけするものを作ります。
  src/Eccube/Controller/Admin/Setting/Powerfull/PowerfullController.phpをサクッとこんな感じで。

  namespace Eccube\Controller\Admin\Setting\Powerfull;
  
  use Eccube\Application;
  use Eccube\Controller\AbstractController;
  use Eccube\Event\EccubeEvents;
  use Eccube\Event\EventArgs;
  use Symfony\Component\HttpFoundation\Request;
  
  class PowerfullController extends AbstractController
  {
      public function index(Application $app, Request $request)
      {
          return $app->render('Setting/Powerfull/powerfull_settings.twig');
      }
  }

  indexメソッドはテンプレートファイルを指定してビューを呼び出すだけです。
• では最後に、テンプレートファイルを作成しましょう。
  src/Eccube/Resource/template/admin/Setting/Powerfull/powerfull_settings.twig

  {% extends 'default_frame.twig' %}
  
  {% set menus = ['setting', 'powerfull', 'powerfull_settings_index'] %}
  
  {% block title %}俺の考えた最強の設定{% endblock %}
  {% block sub_title %}俺の考えた最強の設定画面{% endblock %}
  
  
  {% block main %}
  
      <div class="row" id="aside_wrap">
          俺の考えた最強の設定画面跡地
      </div>
  
  {% endblock %}

  すると、こんな感じでナビゲーションに追加されます。
  

このページの参照回数は、680です。