Добавить выбор времени в зависимости от выбранного метода доставки WooCommerce

Question

Необходимо реализовать следующую задачу: на странице checkout есть методы доставки, если выбран определенный метод доставки(только 1) то должен появляться выпадающий список со временем доставки. Какое время выбрал пользователь соответственно должно отображаться в деталях заказа в админке вукомерса. Подскажите, пожалуйста, как такое можно реализовать, я новичок в вукомерсе и даже не знаю куда смотреть.. P.S. Если кто-то делал что-то подобное, буду так же благодарна за примеры кода :)

UPD: Исходя из кода темы которая мне досталась написала следующее:

В файле woocommerce/checkout/form-shipping.php следующий код:

<div id="delivery_times" class="form-group d-none">
   <label class="text-bold" for="select_time">Delivery time: </label>
      <select id="select_time" class="form-control mb-1">
         <option value="" selected>Select time</option>
         <?php
            $delivery_times = get_field('delivery_times', 'options');
            $count = 0;
            foreach ($delivery_times as $delivery_time):
              echo '<option value="'.$delivery_time['range_time'].'" data-pickup="'.$count.'">'.$delivery_time['range_time'].'</option>';
              $count++;
            endforeach;
          ?>
       </select>
</div>

Есть общий файл theme-checkout.js, в нем дописала следующее:

$("#shipping_speed").change(function(){
    var delivery_time = $(this).children("option:selected").data("type");

    if(delivery_time == "tomorrow"){
       $("#delivery_times").removeClass("d-none");
    }else{
       $("#delivery_times").addClass("d-none");
       $("#select_time option[value='']").prop('selected',true);
    }
});

И теперь мне необходимо сохранять выбранные данные и выводить их как-то в детали заказа для администратора, но реализацию чего-то подобного в моей теме я так и не нашла. Подскажите, пожалуйста, как можно передать эти данные в детали заказа?

Answer 1

Можно сделать следующее :

1.Шаблон выбора доставки находится в woocommerce/cart/cart-shipping.php

В выборе доставки

<?php foreach ( $available_methods as $method ) : ?>

    <!-- вставить код -->
    
 <?php if ($method->id == 'selected_shipping') : ?>
    
            <div class="select-date-time"></div>
            <?php woocommerce_form_field( 'billing_shipping_date_time', array( 'label'     => __('Время доставки'),'placeholder'   => '','required'  => false,'clear'     => true,'type' => 'select','options'     => array('9:00' => __('9:00'),'10:00' => __('10:00')),), ''); ?>
           </div>
    
    <?php endif; ?>

   <!-- вставить код -->

<?php endforeach; ?>

Куда нибудь в js шаблона вставить следующий код для показа/скрытия блока

<script>
jQuery( function( $ ) {
    $( document ).on( 'change', 'select.shipping_method, input[name^=shipping_method]', function() {

        if ( $( this ).val() == 'selected_shipping') {
            
            $('.select-date-time').show();
            
        } else {
            
            $('.select-date-time').hide();
        }
    });
});
</script>

Также в functions.php вставить код для сохранения значения поля и отображения в админке в подробностях заказа

add_action( 'woocommerce_checkout_update_order_meta', 'shipping_date_time_update_order_meta' );

functionshipping_date_time_update_order_meta( $order_id ) {
    if ( ! empty( $_POST['billing_shipping_date_time'] ) ) {
        update_post_meta( $order_id, 'billing_shipping_date_time', sanitize_text_field( $_POST['billing_shipping_date_time'] ) );
    }
}


add_action( 'woocommerce_admin_order_data_after_shipping_address', 'custom_field_display_admin_order_meta', 10, 1 );

function custom_field_display_admin_order_meta($order){
    if(get_post_meta( $order->id, 'billing_shipping_date_time', true )){echo '<p><strong>'.__('Время доставки *').':</strong> ' . get_post_meta( $order->id, 'billing_shipping_date_time', true ) . '</p>';}
}

"selected_shipping" - это айди вашего метода доставки

БЛОГ НА HUSL

Добавить выбор времени в зависимости от выбранного метода доставки WooCommerce

Ответы (1 шт):