嘗試在OpenCart的訂單頁面中添加「預覽」功能

Question

免責聲明：第一次使用OpenCart，第一次使用MVC環境。

我試圖修改主訂單屏幕，以便在查看訂單列表時，我可以單擊任何訂單上的「預覽」按鈕並查看該訂單的詳細信息（運送地址，訂購商品，運輸方式，訂單總成本等）顯示在訂單清單右側的div中。基本上，爲了節省自己不得不進入每個訂單然後返回到主屏幕的麻煩。

在之前的環境（osCommerce）中，我可以通過讓預覽按鈕執行一個JavaScript函數來獲取它，並將它通過POST發送給一個單獨的PHP腳本，該腳本基於該訂單ID並在HTML塊中返回了相關的訂單信息，然後在主訂單列表頁面上替換了訂單預覽div的先前內容。使用此功能，我能夠快速點擊待處理訂單，查看訂購的內容，發生的情況等，而不會在列表中丟失我的位置。

到目前爲止（對於核心文件的所有更改都使用vQMod），我已經添加了每個訂單的「查看」和「編輯」按鈕旁邊的「預覽」按鈕/鏈接。該鏈接基本上是「onclick = getorderinfo（'XXX'）」，其中getorderinfo是我在該部分中定義的JavaScript函數，而XXX是列表中該行的訂單的訂單ID。我也修改了佈局並在訂單列表的右側創建了一個空div，並且我可以單擊我的預覽按鈕並獲取div以顯示通過POST發送到order_check.php的訂單ID。但除此之外，就如何從數據庫中檢索訂單詳情並將其顯示在那裏，我完全喪失了信心。

我希望這只是一個用給定的訂單ID調用正確的函數或類並返回一組信息的問題，但似乎更多地涉及這方面的內容。

有很多被稱爲「訂單預覽」的OpenCart模塊，但它們都不會像我上面描述的那樣做任何事情。

對於有很多OpenCart經驗的人來說，聽起來像我所描述的甚至可能嗎？

Answer 1

您可以使用ajax來實現此目的。

我用jquery的load和bootstrap的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