Magento2 管理画面themeの作成

Magentoめも

Magento2 管理画面themeの作成 †

管理画面側のテンプレートを触りたい場合はthemeを作成するとできるようです。
作成したthemeをmodule側に設定し、コントローラーをオーバーライドしてやればテンプレートから受け取った値をゴニョゴニョすることもできそうです。

設定ファイルの作成 †

app/design/adminhtml/VendorName/ThemeName/ の構成になります。
VendorName = Yassujp
ThemeName = blank とします。

app/design/adminhtml/Yassujp/blank/theme.xml

<theme xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:Config/etc/theme.xsd">
    <title>Yassujp Blank</title>
    <parent>Magento/backend</parent>
</theme>

app/design/adminhtml/Yassujp/blank/registration.php

<?php
\Magento\Framework\Component\ComponentRegistrar::register(
    \Magento\Framework\Component\ComponentRegistrar::THEME,
    'adminhtml/Yassujp/blank',
    __DIR__
);

module側に定義追加 †

app/code/Yassujp/HelloWorld/etc/module.xml

<?xml version="1.0"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="../../../../../lib/internal/Magento/Framework/Module/etc/module.xsd">
    <module name="Yassujp_HelloWorld" setup_version="1.0.1">
        <sequence>
            <module name="Magento_Theme"/>
        </sequence>
    </module>
</config>

app/code/Yassujp/HelloWorld/etc/di.xml

<?xml version="1.0"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:ObjectManager/etc/config.xsd">
    <type name="Magento\Theme\Model\View\Design">
        <arguments>
            <argument name="themes" xsi:type="array">
                <item name="adminhtml" xsi:type="string">Yassujp/blank</item>
            </argument>
        </arguments>
    </type>
</config>

これで準備がようやく完了です。

コマンドラインにて以下を実行します。

$ php bin/magento setup:upgrade

変更したいテンプレートをコピー †

今回は管理画面でSALES - Orders - View で確認できる注文詳細の左下 Order Total の Notes for this Order 部分に Price のテキストフィールドを追加してみます。

該当するテンプレートは以下のパスになります。
vendor\magento\module-sales\view\adminhtml\templates\order\view\history.phtml

コピー先のパスは以下になります。
app\design\adminhtml\Yassujp\blank\Magento_Sales\templates\order\view\history.phtml

あとはこのテンプレートに追加するだけです。
Statusの下に以下のように記述してみました。

            <div class="admin__field">
                <label for="history_price" class="admin__field-label">
                    <?php echo __('Price') ?>
                </label>
                <div class="admin__field-control">
                    <input name="history[price]"
                           type="text"
                           id="history_price"
                           class="admin__control-text"
                           value="" />
                </div>
            </div>

コントローラーをオーバーライドする †

追加したフォームから受け取った値を保存してみます。

app/code/Yassujp/HelloWorld/etc/module.xml

<?xml version="1.0"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:Module/etc/module.xsd">
    <module name="Yassujp_HelloWorld" schema_version="1.0.0" setup_version="1.0.0">
        <sequence>
            <module name="Magento_Theme"/>
            <module name="Magento_Sales"/>
        </sequence>
    </module>
</config>

app/code/Yassujp/HelloWorld/etc/di.xml

<?xml version="1.0"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:ObjectManager/etc/config.xsd">
    <type name="Magento\Theme\Model\View\Design">
        <arguments>
            <argument name="themes" xsi:type="array">
                <item name="adminhtml" xsi:type="string">Yassujp/blank</item>
            </argument>
        </arguments>
    </type>
    <preference for="Magento\Sales\Controller\Adminhtml\Order\AddComment" type="Yassujp\HelloWorld\Controller\Adminhtml\Order\AddComment" />
</config>

vendor\magento\module-sales\Controller\Adminhtml\Order\AddComment.php を以下のパスにコピーしてnamespaceなどを修正します。
app\code\Yassujp\HelloWorld\Controller\Adminhtml\Order\AddComment.php

<?php
namespace Yassujp\HelloWorld\Controller\Adminhtml\Order;

class AddComment extends \Magento\Sales\Controller\Adminhtml\Order\AddComment
{
    public function execute()
    {
        $order = $this->_initOrder();
        if ($order) {
            try {
                $data = $this->getRequest()->getPost('history');
                if (empty($data['comment']) && $data['status'] == $order->getDataByKey('status')) {
                    throw new \Magento\Framework\Exception\LocalizedException(__('Please enter a comment.'));
                }

                $notify = isset($data['is_customer_notified']) ? $data['is_customer_notified'] : false;
                $visible = isset($data['is_visible_on_front']) ? $data['is_visible_on_front'] : false;

                $history = $order->addStatusHistoryComment($data['comment'].$data['price'], $data['status']);
                $history->setIsVisibleOnFront($visible);
                $history->setIsCustomerNotified($notify);
                $history->save();

                $comment = trim(strip_tags($data['comment']));

                $order->save();
                /** @var OrderCommentSender $orderCommentSender */
                $orderCommentSender = $this->_objectManager
                   ->create('Magento\Sales\Model\Order\Email\Sender\OrderCommentSender');

                $orderCommentSender->send($order, $notify, $comment);

                return $this->resultPageFactory->create();
            } catch (\Magento\Framework\Exception\LocalizedException $e) {
                $response = ['error' => true, 'message' => $e->getMessage()];
            } catch (\Exception $e) {
                $response = ['error' => true, 'message' => __('We cannot add order history.')];
            }
            if (is_array($response)) {
                $resultJson = $this->resultJsonFactory->create();
                $resultJson->setData($response);
                return $resultJson;
            }
        }
        return $this->resultRedirectFactory->create()->setPath('sales/*/');
    }
}

コマンドラインにて以下を実行します。

$ php bin/magento setup:upgrade

これで入力された金額がコメントの後ろに追加されて保存されていることが確認できます。