<?php

use Bookingor\Helper\HelperControl;
use Bookingor\Frontend\Controller\Service\ServiceControlFront;
// Exit if accessed directly
if (!defined('ABSPATH')) {
    exit();
} ?>
<div id="bookingor-service" class="bookingor-col-12 bookingor-col-sm-12 bookingor-col-md-12 bookingor-col-lg-12 bookingor-col-xl-8 main bookingor-flex j-width flex-column bookingor-g-0">
    <div class="card-body">
        <div class="main-services bookingor-pd-all">
            <div class="main_top d-m bookingor-d-flex align-items-center justify-content-between pd-l-r  gap-3">
                <div class="to-searchs">
                    <div id="the-services-search">
                        <div class="bookingor-searchbar-show-now">
                            <input type="text" class="form-control bookingor-searchbar-2" autocomplete="off" id="searchService-4" placeholder="Search  <?php echo esc_attr(get_option('bookingor_settings_service_name')); ?>" />
                        </div>
                        <div class="bookingor-front-search-show pad-all-l flw-set bookingor-d-none">
                            <div id="sugg-show-all-service" class="search-show-all">
                                <div class="search-serv">
                                    <div class="sug-1">
                                        <?php
                                        if (is_array(ServiceControlFront::$f_service_all) || is_object(ServiceControlFront::$f_service_all)) {
                                            foreach (ServiceControlFront::$f_service_all as $key => $value) { ?>
                                                <div class="bookingor-search-all-service s-label widget-location" data-get-category-id="<?php echo esc_attr($value->category_get_id); ?>" data-get-service-id="<?php echo esc_attr($value->service_id); ?>" data-get-service-name="<?php echo esc_attr($value->service_name); ?>"><?php echo esc_html($value->service_name); ?></div>
                                        <?php }
                                        }
                                        ?>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="left bookingor-flex align-items-center justify-content-end">
                    <div class="btn-group">
                        <div class="left bookingor-flex align-items-center dropdown bookingor-btn dropdown-toggle" id="dropdownMenuClickableInside" data-bs-toggle="dropdown" data-bs-auto-close="outside" aria-expanded="false" role="button">Price</div>
                        <div class="price-abs-menu dropdown-menu dropdown-menu-end" aria-labelledby="dropdownMenuClickableInside">
                            <div id="slider-range"></div>
                            <div class="price-inputs bookingor-flex align-items-center justify-content-between">
                                <div>
                                    <label><?php esc_html_e('min', 'bookingor'); ?></label>
                                    <span><?php echo esc_html(get_option('bookingor_settings_currency_symbol')); ?></span><input type="number" min="0" class="form-control" id="minPrice" />
                                </div>
                                <div>
                                    <label><?php esc_html_e('max', 'bookingor'); ?></label>
                                    <span><?php echo esc_html(get_option('bookingor_settings_currency_symbol')); ?></span><input type="number" min="0" class="form-control" id="maxPrice" />
                                </div>
                            </div>
                            <div id="applyBtn"><?php esc_html_e('apply', 'bookingor'); ?></div>
                        </div>
                    </div>
                    <div class="view_icons bookingor-flex align-items-center">
                        <img id="gridView" src="<?php echo esc_attr(plugin_dir_url(dirname(dirname(__FILE__))) . '../assets/images/design-svg/grid-view.svg'); ?> " alt="" />
                        <img id="listView" src="<?php echo esc_attr(plugin_dir_url(dirname(dirname(__FILE__))) . '../assets/images/design-svg/list-view.svg'); ?>" alt="" />
                    </div>
                </div>
            </div>
            <div class="select service-selecting">
                <div class="bookingor-flex gap-5 bookingor-heading-top">
                    <div class="full-head-1 bookingor-service-heading"><?php echo esc_html(get_option('bookingor_settings_service_name')); ?></div>
                    <div id="serviceWarning" class="align-items-center justify-content-center">
                        <span class="select_warning align-items-center bookingor-d-none justify-content-center"><?php esc_html_e('Select a ', 'bookingor'); ?><?php echo esc_html(get_option('bookingor_settings_service_name')); ?></span>
                        <span class="blank_wraing bookingor-d-none"><?php esc_html_e('No ', 'bookingor'); ?><?php echo esc_html(get_option('bookingor_settings_service_name')); ?><?php esc_html_e('Try another', 'bookingor'); ?></span>
                    </div>
                </div>
                <div id="selectService-4" class="select-list-1">
                    <ul class="main-carousel all-services-shw row">
                        <?php
                        if (ServiceControlFront::check_wc_id_empty_db()) { ?>
                            <div class="bookingor-alert-woocommerce">
                                <div>
                                    <?php esc_html_e('Connect WooCommerce to Bookingor Services', 'bookingor') ?>
                                </div>
                                <a href="https://youtu.be/20S6_k1g_gA" class="bookingor-btn" target="_blank">
                                    <?php esc_html_e('checkout video', 'bookingor'); ?>
                                </a>
                            </div>
                            <?php } else {
                            foreach (ServiceControlFront::bp_front_services_view() as $key =>  $data) {  ?>
                                <li data-get-location-id="<?php echo esc_attr($data['location_get_id']); ?>" data-get-category-id="<?php echo esc_attr($data['category_get_id']); ?>" <?php echo esc_attr(isset($data['subcategories']) ? 'data-subcategory-id="' . $data['subcategories'] . '"' : ''); ?> data-repeat-status="<?php echo esc_attr($data['recurring_status']); ?>" data-repeat-type="<?php echo esc_attr($data['recurring_type']); ?>" data-service-id="<?php echo esc_attr($data['service_id']); ?>" data-get-service-price="<?php echo esc_attr($data['service_cost']); ?>" data-get-duration="<?php echo esc_attr($data['service_duration']); ?>" class="full-service-2 bookingor-full-services-4 get_all_data select_list services-grid-view service-list-view">
                                    <div class="list-f-srvs">
                                        <div class="f-service-image <?php echo esc_attr(get_option('bookingor_settings_service_images_icons')); ?>">
                                            <img class="serv-icon" src="<?php echo esc_attr($data['service_icon'] ? wp_get_attachment_url($data['service_icon']) : $this->f_image_default); ?>" alt="" />
                                            <div class="grid-view-time-du">
                                                <div class="service-duration">
                                                    <div class="bookingor-d-flex gap-1">
                                                        <div class="bookingor-d-flex"><svg xmlns="http://www.w3.org/2000/svg" class="bookingor-icon-duration" viewBox="0 0 24 24" fill="currentColor">
                                                                <path d="M12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22ZM12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20ZM13 12H17V14H11V7H13V12Z"></path>
                                                            </svg></div>
                                                        <div class="bookingor-f-14"><?php echo esc_html(HelperControl::convert_duration($data['service_duration'])); ?></div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="service-card-contents">
                                            <div class="service-heading-1"><?php echo esc_html($data['name']); ?></div>
                                            <div class="service-price-grid">
                                                <div class="<?php echo esc_attr(get_option('bookingor_currency_position_change')); ?> bookingor-flex">
                                                    <div class="<?php echo esc_attr(get_option('bookingor_currency_position_change')); ?>">
                                                        <?php echo esc_html($data['currency_symbol']); ?>
                                                    </div>
                                                    <div><?php echo esc_html(HelperControl::priceDecimal($data['price'])); ?></div>
                                                </div>
                                            </div>
                                            <div class="bookingor-f-content"><?php echo esc_html($data['service_description']); ?>
                                            </div>
                                        </div>
                                        <div class="price-duration-no-grid">
                                            <div class="service-price">
                                                <div class="<?php echo esc_attr(get_option('bookingor_currency_position_change')); ?> bookingor-flex">
                                                    <div class="<?php echo esc_attr(get_option('bookingor_currency_position_change')); ?>">
                                                        <?php echo esc_html($data['currency_symbol']); ?>
                                                    </div>
                                                    <div><?php echo esc_html(HelperControl::priceDecimal($data['price'])); ?></div>
                                                </div>
                                            </div>
                                            <div class="service-duration">
                                                <div class="bookingor-d-flex gap-1">
                                                    <div class="bookingor-d-flex"><svg xmlns="http://www.w3.org/2000/svg" class="bookingor-icon-duration" viewBox="0 0 24 24" fill="currentColor">
                                                            <path d="M12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22ZM12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20ZM13 12H17V14H11V7H13V12Z"></path>
                                                        </svg></div>
                                                    <div class="bookingor-f-14"><?php echo esc_html(HelperControl::convert_duration($data['service_duration'])); ?></div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </li>
                        <?php }
                        } ?>
                    </ul>
                </div>
            </div>
        </div>
    </div>
    <div class="mb-3 bookingor-progress">
        <div class="bookingor-progress-bar-move bookingor-progress-bar"></div>
    </div>
    <div class="main_footer d-m bookingor-d-flex align-items-center justify-content-between main_botm" id="bookingor-back-cate">
        <div class="bookingor-flex justify-content-start">
            <button type="button" id="back-category" class="bookingor-d-none bookingor-btn_back bookingor-button"><?php echo esc_html(get_option('bookingor_settings_back_button_text')); ?></button>
        </div>
        <div class="bookingor-flex justify-content-end">
            <button type="button" id="ctBtn-4" class="btn_orange bookingor-button bookingor-cont-btn"><?php echo esc_html(get_option('bookingor_settings_continue_button_text')); ?></button>
        </div>
    </div>
</div>
</div>