Всплывающее модальное окно в magento 2

Я создал пользовательскую ссылку , используя всплывающее модальное . Мне нужно разместить эту ссылку на странице Моя учетная запись ->Мои заказы и рядом со ссылкой Изменить порядок. Пожалуйста, предоставьте мне решение для поиска ссылки рядом со ссылкой Изменить порядок. enter image description here

Sales_order_history.xml 

<?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" layout="1column" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <head>      
    </head>
    <body>
        <referenceBlock name="sales.order.history">
            <action method="setTemplate">
                <argument name="template" xsi:type="string">OX_SalesOrder::order/history.phtml</argument>
            </action>
        </referenceBlock>

    </body>
</page>

Переопределенный файл phtml

XXX\модуль\просмотр\интерфейс\шаблоны\заказ\история.phtml

<?php
/**
 * Copyright © Magento, Inc. All rights reserved.
 * See COPYING.txt for license details.
 */
// @codingStandardsIgnoreFile
?>
<?php $_orders = $block->getOrders(); ?>
<?= $block->getChildHtml('info') ?>
<?php if ($_orders && count($_orders)): ?>
    <div class="table-wrapper orders-history">
        <table class="data table table-order-items history" id="my-orders-table">
            <caption class="table-caption"><?= /* @escapeNotVerified */ __('Orders') ?></caption>
            <thead>
                <tr>
                    <th scope="col" class="col id"><?= /* @escapeNotVerified */ __('Order #') ?></th>
                    <th scope="col" class="col date"><?= /* @escapeNotVerified */ __('Date') ?></th>
                    <?= /* @noEscape */ $block->getChildHtml('extra.column.header') ?>
                    <th scope="col" class="col shipping"><?= /* @escapeNotVerified */ __('Ship To') ?></th>
                    <th scope="col" class="col total"><?= /* @escapeNotVerified */ __('Order Total') ?></th>
                    <th scope="col" class="col status"><?= /* @escapeNotVerified */ __('Status') ?></th>
                    <th scope="col" class="col actions"><?= /* @escapeNotVerified */ __('Action') ?></th>
                </tr>
            </thead>
            <tbody>
                <?php foreach ($_orders as $_order): ?>
                    <tr>
                        <td data-th="<?= $block->escapeHtml(__('Order #')) ?>" class="col id"><?= /* @escapeNotVerified */ $_order->getRealOrderId() ?></td>
                        <td data-th="<?= $block->escapeHtml(__('Date')) ?>" class="col date"><?= /* @escapeNotVerified */ $block->formatDate($_order->getCreatedAt()) ?></td>
                        <?php $extra = $block->getChildBlock('extra.container'); ?>
                        <?php if ($extra): ?>
                            <?php $extra->setOrder($_order); ?>
                            <?= /* @noEscape */ $extra->getChildHtml() ?>
                        <?php endif; ?>
                        <td data-th="<?= $block->escapeHtml(__('Ship To')) ?>" class="col shipping"><?= $_order->getShippingAddress() ? $block->escapeHtml($_order->getShippingAddress()->getName()) : '&nbsp;' ?></td>
                        <td data-th="<?= $block->escapeHtml(__('Order Total')) ?>" class="col total"><?= /* @escapeNotVerified */ $_order->formatPrice($_order->getGrandTotal()) ?></td>
                        <td data-th="<?= $block->escapeHtml(__('Status')) ?>" class="col status"><?= /* @escapeNotVerified */ $_order->getStatusLabel() ?></td>
                        <td data-th="<?= $block->escapeHtml(__('Actions')) ?>" class="col actions">
                            <a href="<?= /* @escapeNotVerified */ $block->getViewUrl($_order) ?>" class="action view">
                                <span><?= /* @escapeNotVerified */ __('View Order') ?></span>
                            </a>
                            <?php if ($this->helper('Magento\Sales\Helper\Reorder')->canReorder($_order->getEntityId())) : ?>
                                <a href="#" data-post='<?php
                                /* @escapeNotVerified */ echo
                                        $this->helper(\Magento\Framework\Data\Helper\PostHelper::class)
                                        ->getPostData($block->getReorderUrl($_order))
                                ?>' class="action order">
                                    <span><?= /* @escapeNotVerified */ __('Reorder') ?></span>
                                </a>
                            <?php endif ?>
                            <div>\\ My code
                                <a href="#" class="click-me">Cancel</a>
                            </div>

                            <div id="popup-modal" style="display:none;">
                                <textarea>
                                </textarea>
                            </div>
                            <script>
                                require(
                                        [
                                            'jquery',
                                            'Magento_Ui/js/modal/modal'
                                        ],
                                        function (
                                                $,
                                                modal
                                                ) {
                                            var options = {
                                                type: 'popup',
                                                responsive: true,
                                                //innerScroll: true,
                                                title: 'Reason for Cancelled the item',
                                                buttons: [{
                                                        text: $.mage.__('submit'),
                                                        class: '',
                                                        click: function () {
                                                            this.closeModal();
                                                        }
                                                    }]
                                            };

                                            var popup = modal(options, $('#popup-modal'));
                                            $(".click-me").on('click', function () {
                                                $("#popup-modal").modal("openModal");
                                            });

                                        }
                                );
                            </script>\\ upto this
                        </td>
                    </tr>
                <?php endforeach; ?>
            </tbody>
        </table>
    </div>
    <?php if ($block->getPagerHtml()): ?>
        <div class="order-products-toolbar toolbar bottom"><?= $block->getPagerHtml() ?></div>
    <?php endif ?>
<?php else: ?>
    <div class="message info empty"><span><?= /* @escapeNotVerified */ __('You have placed no orders.') ?></span></div>
        <?php endif ?>
Author: Jaisa, 2017-11-25
Source

1 answers

Переопределите vendor/magento/module-sales/view/frontend/templates/order/history.phtml этот файл в своем модуле и добавьте новую ссылку в новый файл шаблона переопределения. app/code/Vendor/Modulename/view/frontend/layout/sales_order_history.xml 

 <?xml version="1.0"?>
    <page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
        <body>
            <referenceBlock name="sales.order.history">
                <action method="setTemplate">
                    <argument name="template" xsi:type="string">Vendor_Modulename::order/history.phtml</argument>
                </action>
            </referenceBlock>
        </body>
</page>

Скопируйте vendor/magento/module-sales/view/frontend/templates/order/history.phtml содержимое этого файла в ваш файл temmplate app/code/Vendor/Modulename/view/frontend/templates/order/history.phtml

Добавьте всплывающую ссылку рядом с Измените порядок Ссылка

 1
Author: mansi, 2017-11-25 10:11:00