f1den
29d10ce4cf
Каталог, карточка товара, корзина, оформление заказа и блог на WooCommerce. Стили разложены по слоям: токены из Figma, база, компоненты, страницы, брейкпоинты. Цвета, типографика, радиусы и отступы взяты из Variables и текстовых стилей макета, ниже по слоям хардкода нет. Иконки — Phosphor, вставляются инлайном как SVG, символами ничего не рисуется. Стили WooCommerce отключены, вёрстка своя, !important не используется.
109 lines
6.9 KiB
PHP
109 lines
6.9 KiB
PHP
<?php
|
||
/**
|
||
* Checkout form.
|
||
*
|
||
* @package VyatkaShop
|
||
*
|
||
* @var WC_Checkout $checkout Checkout object.
|
||
*/
|
||
|
||
defined( 'ABSPATH' ) || exit;
|
||
|
||
if ( ! $checkout->is_registration_enabled() && $checkout->is_registration_required() && ! is_user_logged_in() ) {
|
||
echo esc_html( apply_filters( 'woocommerce_checkout_must_be_logged_in_message', __( 'Для оформления заказа необходимо войти.', 'vyatka-shop' ) ) );
|
||
return;
|
||
}
|
||
|
||
$price_summary = vyatka_shop_cart_price_summary();
|
||
?>
|
||
<div class="container checkout-page">
|
||
<h1 class="page-heading"><?php esc_html_e( 'Оформление заказа', 'vyatka-shop' ); ?></h1>
|
||
|
||
<form name="checkout" method="post" class="checkout woocommerce-checkout" action="<?php echo esc_url( wc_get_checkout_url() ); ?>" enctype="multipart/form-data">
|
||
<div class="checkout-layout">
|
||
<div class="checkout-fields">
|
||
<label class="checkout-input">
|
||
<input type="text" name="billing_first_name" autocomplete="given-name" placeholder=" " required>
|
||
<span class="field-label"><?php esc_html_e( 'Имя', 'vyatka-shop' ); ?></span>
|
||
<span class="field-error" data-field-error aria-live="polite"></span>
|
||
</label>
|
||
<label class="checkout-input">
|
||
<input type="tel" name="billing_phone" autocomplete="tel" placeholder=" " required>
|
||
<span class="field-label"><?php esc_html_e( 'Телефон', 'vyatka-shop' ); ?></span>
|
||
<span class="field-error" data-field-error aria-live="polite"></span>
|
||
</label>
|
||
<label class="checkout-input">
|
||
<input type="email" name="billing_email" autocomplete="email" placeholder=" " required>
|
||
<span class="field-label"><?php esc_html_e( 'Email', 'vyatka-shop' ); ?></span>
|
||
<span class="field-error" data-field-error aria-live="polite"></span>
|
||
</label>
|
||
<input type="hidden" name="billing_country" value="RU">
|
||
|
||
<fieldset class="checkout-delivery">
|
||
<legend><?php esc_html_e( 'Получение заказа', 'vyatka-shop' ); ?></legend>
|
||
<div class="delivery-switch" role="group" aria-label="<?php esc_attr_e( 'Способ получения', 'vyatka-shop' ); ?>">
|
||
<label><input type="radio" name="delivery_type" value="pickup" checked><span><?php esc_html_e( 'Самовывоз', 'vyatka-shop' ); ?></span></label>
|
||
<label><input type="radio" name="delivery_type" value="delivery"><span><?php esc_html_e( 'Доставка', 'vyatka-shop' ); ?></span></label>
|
||
</div>
|
||
<div data-delivery-panel="pickup">
|
||
<label class="checkout-radio"><input type="radio" name="pickup_address" value="1" checked> <span><?php esc_html_e( 'Москва, ул.Тверская, 168', 'vyatka-shop' ); ?></span></label>
|
||
<label class="checkout-radio"><input type="radio" name="pickup_address" value="2"> <span><?php esc_html_e( 'Москва, Садовое кольцо, 152к4', 'vyatka-shop' ); ?></span></label>
|
||
<label class="checkout-radio"><input type="radio" name="pickup_address" value="3"> <span><?php esc_html_e( 'Киров, Октябрьский проспект, 290к3', 'vyatka-shop' ); ?></span></label>
|
||
<img class="checkout-map" src="<?php echo esc_url( get_template_directory_uri() . '/assets/images/checkout-map.jpg' ); ?>" alt="<?php esc_attr_e( 'Пункты получения на карте', 'vyatka-shop' ); ?>">
|
||
</div>
|
||
<div class="delivery-address-fields" data-delivery-panel="delivery" hidden>
|
||
<label class="checkout-input">
|
||
<input type="text" name="delivery_address" placeholder=" " autocomplete="street-address" data-delivery-required disabled>
|
||
<span class="field-label"><?php esc_html_e( 'Адрес доставки', 'vyatka-shop' ); ?></span>
|
||
<span class="field-error" data-field-error aria-live="polite"></span>
|
||
</label>
|
||
<label class="checkout-input">
|
||
<input type="text" name="delivery_unit" placeholder=" " disabled>
|
||
<span class="field-label"><?php esc_html_e( 'Квартира или офис', 'vyatka-shop' ); ?></span>
|
||
<span class="field-error" data-field-error aria-live="polite"></span>
|
||
</label>
|
||
</div>
|
||
</fieldset>
|
||
|
||
<fieldset class="checkout-payment-options">
|
||
<legend><?php esc_html_e( 'Способ оплаты', 'vyatka-shop' ); ?></legend>
|
||
<label class="checkout-radio"><input type="radio" name="payment_method" value="cod" checked> <span><?php esc_html_e( 'Онлайн оплата', 'vyatka-shop' ); ?></span></label>
|
||
<label class="checkout-radio"><input type="radio" name="payment_method" value="bacs"> <span><?php esc_html_e( 'Оплата при получении', 'vyatka-shop' ); ?></span></label>
|
||
</fieldset>
|
||
</div>
|
||
|
||
<aside class="order-card checkout-order-card" id="order_review">
|
||
<div class="checkout-order-products">
|
||
<?php foreach ( WC()->cart->get_cart() as $cart_item ) : ?>
|
||
<?php
|
||
$_product = $cart_item['data'];
|
||
if ( ! $_product || ! $_product->exists() ) {
|
||
continue;
|
||
}
|
||
?>
|
||
<div class="checkout-order-product">
|
||
<div class="checkout-order-thumb"><?php echo wp_kses_post( $_product->get_image( 'thumbnail' ) ); ?></div>
|
||
<div>
|
||
<strong><?php echo esc_html( $_product->get_name() ); ?></strong>
|
||
<span><?php echo wp_kses_post( WC()->cart->get_product_subtotal( $_product, $cart_item['quantity'] ) ); ?> <span class="multiply" aria-hidden="true"></span><?php echo esc_html( (string) $cart_item['quantity'] ); ?></span>
|
||
</div>
|
||
</div>
|
||
<?php endforeach; ?>
|
||
</div>
|
||
<div class="checkout-order-totals">
|
||
<div class="order-row"><span><?php esc_html_e( 'Товаров в корзине', 'vyatka-shop' ); ?></span><span><?php echo esc_html( (string) count( WC()->cart->get_cart() ) ); ?></span></div>
|
||
<div class="order-row"><span><?php esc_html_e( 'Сумма заказа', 'vyatka-shop' ); ?></span><strong><?php echo wp_kses_post( wc_price( $price_summary['regular_total'] ) ); ?></strong></div>
|
||
<div class="order-row"><span><?php esc_html_e( 'Скидка', 'vyatka-shop' ); ?></span><span>− <?php echo wp_kses_post( wc_price( $price_summary['discount_total'] ) ); ?></span></div>
|
||
<div class="order-row total"><span><?php esc_html_e( 'Итого', 'vyatka-shop' ); ?></span><strong><?php wc_cart_totals_order_total_html(); ?></strong></div>
|
||
</div>
|
||
<label class="checkout-consent">
|
||
<input type="checkbox" name="terms" value="1" required checked data-consent>
|
||
<span><?php esc_html_e( 'Даю согласие на обработку персональных данных', 'vyatka-shop' ); ?></span>
|
||
</label>
|
||
<?php wp_nonce_field( 'woocommerce-process_checkout', 'woocommerce-process-checkout-nonce' ); ?>
|
||
<button type="submit" class="button" name="woocommerce_checkout_place_order" id="place_order" data-consent-gated value="<?php esc_attr_e( 'Оформить заказ', 'vyatka-shop' ); ?>"><?php esc_html_e( 'Оформить заказ', 'vyatka-shop' ); ?></button>
|
||
</aside>
|
||
</div>
|
||
</form>
|
||
</div>
|