尝试向 OpenCart 中的订单页面添加 "preview" 功能

Question

免责声明：第一次使用 OpenCart，也是第一次使用 MVC 环境。

我正在尝试修改主订单屏幕，以便在查看订单列表时，我可以单击任何订单上的 "Preview" 按钮并查看该订单的详细信息订单（送货地址、订购的商品、送货方式、订单总成本等）出现在浮动在订单列表右侧的 div 中。基本上，为了省去必须进入每个订单然后返回主屏幕的麻烦。

在以前的环境 (osCommerce) 中，我能够通过让预览按钮执行一个 Javascript 函数来实现这一点，该函数获取给定的订单 ID 并通过 POST 将其发送到单独的PHP脚本根据该订单ID查询数据库，并在HTML块中返回相关订单信息，然后替换主订单上订单预览div之前的内容列表页。使用此功能，我能够快速点击挂单并查看订单内容、订单去向等，而不会丢失我在列表中的位置。

到目前为止（使用 vQMod 对核心文件进行所有更改），我已经在每个订单的 "View" 和 [=28= 旁边添加了 "Preview" button/link ] 纽扣。 link 本质上是 "onclick=getorderinfo('XXX')"，其中 getorderinfo 是我在该部分中定义的 javascript 函数，XXX 是列表该行中订单的订单 ID。我还修改了布局并在订单列表右侧创建了一个空的 div，我可以单击我的预览按钮并获取 div 以显示发送到 order_check.php 通过 POST。但除此之外，我完全不知道如何从数据库中检索订单详细信息并将其显示在那里。

我希望这只是调用正确的函数或 class 使用给定的订单 ID 并返回一组信息的问题，但它似乎比这更复杂。

有许多 OpenCart mod 被称为 "Order Preview,"，但其中 none 可以做我上面描述的任何事情。

任何对 OpenCart 有丰富经验的人，我所描述的听起来是不是真的可行？

Answer 1

您可以使用 ajax 来实现。

我用了jquery的load和bootstrap的modal，你可以自定义modal的位置和大小。这是 vqmod 文件：

<?xml version="1.0" encoding="UTF-8"?>
<modification>
    <id>Admin quick view orders</id>
    <version>1.0.0</version>
    <vqmver>2.4.0</vqmver>
    <author>digitcart.ir</author>
    <file name="admin/view/template/sale/order_list.tpl">
        <operation>
            <search position="iafter"><![CDATA[title="<?php echo $button_edit; ?>" class="btn btn-primary"><i class="fa fa-pencil"></i></a>]]></search>
            <add><![CDATA[
                <a href="<?php echo $order['view']; ?>" class="btn btn-info quick-view">quick view</a>
            ]]></add>
        </operation>
        <operation>
            <search position="before"><![CDATA[<?php echo $footer; ?>]]></search>
            <add><![CDATA[
                <script>        
                    $(document).delegate('.quick-view', 'click', function(e) {
                        e.preventDefault();
                        $('#modal-quick-view').remove();
                        var element = this;
                        var url = $(element).attr('href') + ' #content',
                        html  = '<div id="modal-quick-view" class="modal">';
                        html += '  <div class="modal-dialog modal-lg">';
                        html += '    <div class="modal-content">';
                        html += '      <div class="modal-header">';
                        html += '        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>';
                        html += '        <h4 class="modal-title">' + $(element).text() + '</h4>';
                        html += '      </div>';
                        html += '      <div class="modal-body"><?php echo $text_loading; ?></div>';
                        html += '    </div';
                        html += '  </div>';
                        html += '</div>';

                        $('body').append(html);
                        $('#modal-quick-view .modal-body').load(url);
                        $('#modal-quick-view').modal('show');
                        $('.modal-backdrop').remove();
                    });
                </script>
            ]]></add>
        </operation>
    </file>
</modification>

已在 opencart 2.3.0.2 上测试

尝试向 OpenCart 中的订单页面添加 "preview" 功能

Trying to add a "preview" feature to the Orders page in OpenCart

php

opencart