Как добавить в карточку товара Woo простой календарь?

Question

[eratnikstudio]

Все плагины что находил - это системы бронирования. Я же хочу добавить простой календарь - пользователь выбирает дату (одну) и эта дата попадает в заказ. Всё! Больше ни чего.

Comments

[Refguser]

Так в карточку товара или в заказ? В чём смысл календаря/даты? Какова его задача?

Answer 1

[eratnikstudio]

Сам решил. Пользуйтесь кому надо

// Добавление поля выбора даты на страницу товара
function add_datepicker_to_product_page() {
    global $product;
    
    // Проверяем, является ли текущая страница товаром
    if ( ! is_product() ) {
        return;
    }
    
    // Получаем текущую выбранную дату (если есть)
    $selected_date = WC()->session->get( 'selected_date' );
    
    // Выводим HTML-элемент с календарем выбора даты
    echo 'Select date<input type="text" id="date_field" name="date_field" placeholder="Select the check-in date" value="' . esc_attr( $selected_date ) . '" required>';
    
    // Загружаем необходимые скрипты и стили
    wp_enqueue_script( 'jquery-ui-datepicker' );
    wp_enqueue_style( 'jquery-ui-css', 'https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css' );
    
    // Инициализируем выбор даты через JavaScript
    echo '<script>
        jQuery(document).ready(function($){
            $("#date_field").datepicker({
                dateFormat: "yy-mm-dd",
                onSelect: function(dateText) {
                    // При выборе даты сохраняем ее в сессию
                    $.ajax({
                        url: wc_add_to_cart_params.ajax_url,
                        method: "POST",
                        data: {
                            action: "save_selected_date",
                            selected_date: dateText
                        },
                        success: function(response) {
                            console.log("Выбранная дата сохранена");
                            $( document.body ).trigger( "update_checkout" );
                        }
                    });
                }
            });
        });
        </script>';
}
add_action( 'woocommerce_before_add_to_cart_button', 'add_datepicker_to_product_page' );

// Сохранение выбранной даты при добавлении товара в корзину
add_action( 'woocommerce_add_cart_item_data', 'save_selected_date', 10, 3 );
function save_selected_date( $cart_item_data, $product_id, $variation_id ) {
    if ( ! empty( $_POST['date_field'] ) ) {
        $cart_item_data['selected_date'] = sanitize_text_field( $_POST['date_field'] );
    }
    return $cart_item_data;
}

// Отображение выбранной даты в корзине
add_filter( 'woocommerce_cart_item_name', 'display_selected_date_in_cart', 10, 3 );
function display_selected_date_in_cart( $product_name, $cart_item, $cart_item_key ) {
    if ( isset( $cart_item['selected_date'] ) ) {
        $product_name .= '<br><small>' . __('Check-in date') . ': ' . $cart_item['selected_date'] . '</small>';
    }
    return $product_name;
}

// Отображение выбранной даты на странице оформления заказа
add_action( 'woocommerce_review_order_before_payment', 'display_selected_date_on_checkout' );
function display_selected_date_on_checkout() {
    $cart = WC()->cart;
    
    if ( ! $cart->is_empty() ) {
        foreach ( $cart->get_cart() as $cart_item ) {
            if ( isset( $cart_item['selected_date'] ) ) {
                echo '<div>' . __('Check-in date') . ': ' . $cart_item['selected_date'] . '</div>';
            }
        }
    }
}