2016-08-22 41 views
8

na stronie internetowej WordPress działa woocommerce, użytkownik może zalogować się w jego (domyślnie) Obszar osobisty i wyświetlać informacje, takie jak:woocommerce zamówienie klienta szczegółowo w BS modalne

  • Zamówienia historii
  • Pobierz
  • Adresy
  • Edytuj informacje
  • Wyloguj

Na karcie orders, tabela prezentuje domyślnie pokazuje listę wszystkich zleceń, z View przycisk, który przekierowuje do pełnej stronie szczegółów tej kolejności.

Co próbuję zrobić, to pokazać ten widok tabeli w oknie modalnym.

nie mam żadnych problemów w pokazujący modal z adresem URL docelowej załadowanego w nim. Prawdziwy problem polega na tym, że docelowy adres URL jest adresem całej strony, która wygląda tak, jak w przypadku i nie jest tym, czego chcę.

Myślę, że jest jakiś skrót pozwalający załadować tylko ten stół, czy może jakaś funkcja woocommerce, taka jak load_order_content_by_id($id)?

Czy ktoś może wskazać mi właściwy kierunek?

Dzięki

=== SOLVED ===

Dzięki Raunak Gupta za wskazanie mi właściwej funkcji. zastąpić szablon orders.php dodał modalne okno html i edytowane :

'view' => array(
    'url' => 'javascript:;', 
    'data' => [ 
     'order-number' => $order->get_order_number() 
    ], 
    'name' => __('View', 'woocommerce') 
), 

i na tym samym pliku:

foreach ($actions as $key => $action) { 
    echo '<a href="' . esc_url($action['url']) . '" class="button ' . sanitize_html_class($key) . '"'; 
    if(isset($action['data']) && is_array($action['data'])){ 
     foreach($action['data'] AS $data_attr=>$data_value){ 
      echo 'data-' . sanitize_html_class($data_attr) .'="' .esc_html($data_value) . '" '; 
     } 
    } 
    echo '>' . esc_html($action['name']) . '</a>'; 
} 

Trochę JS

$('.woocommerce-MyAccount-orders .button.view').on('click', function(e){ 
    e.preventDefault(); 
    var data = {}; 
    data.action = 'modal_order'; 
    data.order_number = $(this).data('order-number'); 

    $.get(ajax_script.ajax_url, data, function(response) { 
     $('#modalOrderDetail').modal('show').find('.modal-body').html(response); 
    }); 
}); 

i zahaczony wordpress przez function.php

function modal_order() { 
    if(is_user_logged_in()) { 
     $order_number = $_GET['order_number']; 
     woocommerce_order_details_table($order_number); 
    } 
} 

add_action('wp_ajax_modal_order', 'modal_order'); 
add_action('wp_ajax_nopriv_modal_order', 'modal_order'); 
+0

Nie wiem woocommerce, ale twoje pytanie wydaje się bardzo niejasne. Spróbuj dodać więcej szczegółów (być może [https://jsfiddle.net/](https://jsfiddle.net/)) i możesz uzyskać więcej odpowiedzi. –

+0

Zrobiłabym skrzypce, gdyby tylko można było załadować w nim wordpress :) Spróbuję wyjaśnić mój post – Yuri

+0

Jeśli ktoś czuje potrzebę downwingu, przynajmniej dodaj wyjaśnienie dla niego – Yuri

Odpowiedz

4

woocommerce_order_details_table($order_id)

Ta funkcja woocommerce zwraca pełne szczegóły zamówienia w formularzu HTML przez $order_id

+0

Nice :) I ja przypuszczam szablon, którego używa - 'order/order-details.php' można zastąpić motywem, jeśli struktura nie jest potrzebna. +1 –

+1

Tak, możesz przesłonić 'order/order-details.php',' order/order-details-item.php' oraz 'order/order-details-customer.php' files zgodnie z twoimi potrzebami. –

+0

Część z przesłonięcia oryginalnego szablonu, jakie zmienne globalne należy uwzględnić, aby z niego skorzystać? – Yuri

2

Nie ma jednofunkcyjny, że jestem świadomy, że można uzyskać wszystkie szczegóły zamówienia, które trzeba za jednym razem jednak można nazwać WC_Order klasę, aby uzyskać to, czego potrzebujesz. Wykonywanie niektórych metod połączeń podobnych do tych zapewni Ci potrzebne informacje. Najprawdopodobniej będziesz musiał dzwonić więcej niż tylko metoda get_items() w zależności od potrzebnych informacji. Ogólnie zwracają obiekty o podobnej strukturze do obiektów pocztowych.

$order = new WC_Order($post->ID); 
$_order = $order->get_items(); 

Zajrzyj tutaj w sekcji "Metody dziedziczone", aby znaleźć metody, które możesz potrzebować, aby uzyskać dostęp do wszystkich potrzebnych informacji.https://docs.woocommerce.com/wc-apidocs/class-WC_Order.html

4

Oto kompletny kod do wyświetlania curent zamówień klientów w modalnego okna. Jest oparty na klasycznym zapytania, aby uzyskać bieżące zlecenia użytkownika i na szablonie my-account/orders.php(lekko dostosowany) ...

<?php 

if(is_user_logged_in()): 

    // The query 
    $args = array(
     // WC orders post type 
     'post_type' => 'shop_order', 
     'numberposts' => -1, 
     // for current user id 
     'meta_key' => '_customer_user', 
     'meta_value' => get_current_user_id(), 
     // get orders statuses 
     'post_status' => array_keys(wc_get_order_statuses()), 
    ); 

    // Get all customer orders 
    $customer_orders = get_posts($args); 
    $count_ord = 0; 
    if (!empty($customer_orders)) 
     foreach ($customer_orders as $custo_order) 
      $count_ord++; 

    if ($count_ord > 0) 
     $has_orders = true; 
    else 
     $has_orders = false; 

    // the template my-account/orders.php ?> 

    <?php do_action('woocommerce_before_account_orders', $has_orders); ?> 

    <?php if ($has_orders) : ?> 

    <table class="woocommerce-MyAccount-orders shop_table shop_table_responsive my_account_orders account-orders-table"> 
     <thead> 
      <tr> 
       <?php foreach (wc_get_account_orders_columns() as $column_id => $column_name) : ?> 
        <th class="<?php echo esc_attr($column_id); ?>"><span class="nobr"><?php echo esc_html($column_name); ?></span></th> 
       <?php endforeach; ?> 
      </tr> 
     </thead> 

     <tbody> 
      <?php foreach ($customer_orders as $customer_order) : 
       $order  = wc_get_order($customer_order); 
       $item_count = $order->get_item_count(); 
       ?> 
       <tr class="order"> 
        <?php foreach (wc_get_account_orders_columns() as $column_id => $column_name) : ?> 
         <td class="<?php echo esc_attr($column_id); ?>" data-title="<?php echo esc_attr($column_name); ?>"> 
          <?php if (has_action('woocommerce_my_account_my_orders_column_' . $column_id)) : ?> 
           <?php do_action('woocommerce_my_account_my_orders_column_' . $column_id, $order); ?> 

          <?php elseif ('order-number' === $column_id) : ?> 
           <a href="<?php echo esc_url($order->get_view_order_url()); ?>"> 
            <?php echo _x('#', 'hash before order number', 'woocommerce') . $order->get_order_number(); ?> 
           </a> 

          <?php elseif ('order-date' === $column_id) : ?> 
           <time datetime="<?php echo date('Y-m-d', strtotime($order->order_date)); ?>" title="<?php echo esc_attr(strtotime($order->order_date)); ?>"><?php echo date_i18n(get_option('date_format'), strtotime($order->order_date)); ?></time> 

          <?php elseif ('order-status' === $column_id) : ?> 
           <?php echo wc_get_order_status_name($order->get_status()); ?> 

          <?php elseif ('order-total' === $column_id) : ?> 
           <?php echo sprintf(_n('%s for %s item', '%s for %s items', $item_count, 'woocommerce'), $order->get_formatted_order_total(), $item_count); ?> 

          <?php elseif ('order-actions' === $column_id) : ?> 
           <?php 
            $actions = array(
             'pay' => array(
              'url' => $order->get_checkout_payment_url(), 
              'name' => __('Pay', 'woocommerce') 
             ), 
             'view' => array(
              'url' => $order->get_view_order_url(), 
              'name' => __('View', 'woocommerce') 
             ), 
             'cancel' => array(
              'url' => $order->get_cancel_order_url(wc_get_page_permalink('myaccount')), 
              'name' => __('Cancel', 'woocommerce') 
             ) 
            ); 

            if (! $order->needs_payment()) { 
             unset($actions['pay']); 
            } 

            if (! in_array($order->get_status(), apply_filters('woocommerce_valid_order_statuses_for_cancel', array('pending', 'failed'), $order))) { 
             unset($actions['cancel']); 
            } 

            if ($actions = apply_filters('woocommerce_my_account_my_orders_actions', $actions, $order)) { 
             foreach ($actions as $key => $action) { 
              echo '<a href="' . esc_url($action['url']) . '" class="button ' . sanitize_html_class($key) . '">' . esc_html($action['name']) . '</a>'; 
             } 
            } 
           ?> 
          <?php endif; ?> 
         </td> 
        <?php endforeach; ?> 
       </tr> 
      <?php endforeach; ?> 
     </tbody> 
    </table> 

    <?php do_action('woocommerce_before_account_orders_pagination'); ?> 

    <?php if (1 < $customer_orders->max_num_pages) : ?> 
     <div class="woocommerce-Pagination"> 
      <?php if (1 !== $current_page) : ?> 
       <a class="woocommerce-Button woocommerce-Button--previous button" href="<?php echo esc_url(wc_get_endpoint_url('orders', $current_page - 1)); ?>"><?php _e('Previous', 'woocommerce'); ?></a> 
      <?php endif; ?> 

      <?php if ($current_page !== intval($customer_orders->max_num_pages)) : ?> 
       <a class="woocommerce-Button woocommerce-Button--next button" href="<?php echo esc_url(wc_get_endpoint_url('orders', $current_page + 1)); ?>"><?php _e('Next', 'woocommerce'); ?></a> 
      <?php endif; ?> 
     </div> 
    <?php endif; ?> 

<?php else : ?> 
    <div class="woocommerce-Message woocommerce-Message--info woocommerce-info"> 
     <a class="woocommerce-Button button" href="<?php echo esc_url(apply_filters('woocommerce_return_to_shop_redirect', wc_get_page_permalink('shop'))); ?>"> 
      <?php _e('Go Shop', 'woocommerce') ?> 
     </a> 
<?php endif; ?> 
     <?php _e('No order has been made yet.', 'woocommerce'); ?> 
    </div> 

<?php do_action('woocommerce_after_account_orders', $has_orders); ?> 

<?php endif; ?> 

Trzeba będzie dodać istniejących reguł CSS do modalnego okna i/lub dostosowane że css zasady.

Ten kod jest przetestowany i w pełni funkcjonalny.

+0

Dziękuję za odpowiedź, ale z 'woocommerce_order_details_table ($ order_id)' Byłem w stanie uzyskać pożądany wynik z kilkoma liniami kodu. – Yuri

+0

@Yuri Ponieważ nie wspomniałeś o tym naprawdę, mam nad tym pracować, to jest szablon woocommerce dla bieżących zamówień klientów, z paginacją i wszystkim, tak jak "moje konto" => "zamówienia" (ale bez nawigacji, menu i wszystko, czego nie chcesz) ... Jest to kompletne rozwiązanie dla zakrętów (alternatywa). – LoicTheAztec

+0

Po prostu chciałem, aby tabela pojedynczego zamówienia była wyświetlana w oknie modalnym, a nie na pełnej liście zamówień. – Yuri