<?php $setting_status = woodplus_wc_api::get_app_setting('category_banners_status'); ?>
<div class="item p-18 br-bottom">
   <span class="title"><?php esc_html_e('بنر اصلی','woodmartplus'); ?></span>
   <p class="des"><?php esc_html_e('فعال کردن بنر اصلی','woodmartplus') ?></p>
   <div class="btn-select">
      <input type="checkbox" class="switch" name="<?php echo woodplus_wc_api::generate_option_app('[category_banners_status][status]'); ?>"  <?php echo isset( $setting_status['status'] ) && !empty( $setting_status['status'] ) ? 'checked' : '' ?> >
   </div>
</div>


<div class="item p-top-18 offer_section order_tracking_steps_condition">
    <span class="title"><?php esc_html_e('دسته بندی ها','woodmartplus') ?></span>
    <p class="des"><?php esc_html_e('دسته بندی ها در زیر اسلایدر نمایش داده میشوند ، مشابه تصویر.','woodmartplus'); ?></p>
    <div data-repeater-list="<?php echo woodplus_wc_api::generate_option_app('[category_banners]'); ?>" >
        <?php foreach( woodplus_wc_api::get_app_setting('category_banners',[
            'defualt_slider' => [
                'cat_banners_image_id',
                'category_banners',
                'cat_banners_title',
                'color',
            ]
        ]) as $banner ): 
        
        ?>
            <section class="repeater-sections-slider-images app_slider_section add-suggestions m-t-18 opened" style="overflow: unset;" data-repeater-item >
                <div class="br-radius-8 opened">

                    <div class="suggestion-title">
                        <span class="suggestion-menu">
                            <img src="<?php echo WOODPLUS_ASSET ?>admin/img/dashboard/menu.svg" alt="">
                            <p><?php esc_html_e('بنر','woodmartplus'); ?></p>
                        </span>
                        <span class="arrow-icon"><img src="<?php echo WOODPLUS_ASSET ?>admin/img/dashboard/arrow-down2.svg" alt=""></span>
                    </div>

                    <div class="suggestion-content">

                        <div class="upload-loding">
                            <?php $img_id = isset( $banner['cat_banners_image_id'] ) && !empty( $banner['cat_banners_image_id'] ) ? $banner['cat_banners_image_id'] : '';
                                    $image = '';
                                    if( $img_id )
                                    {
                                        $img_src = wp_get_attachment_image_src($img_id,'medium');
                                        if( isset( $img_src[0] ) )
                                        {
                                            $image = $img_src[0];
                                        }
                                    }
                            
                            ?>
                            <?php if( $image ): ?>
                                <div class="upload-loding-img upload_image">
                                    <img class="img-responsive" src="<?php echo esc_url( $image ); ?>" alt="slider">
                                </div>
                                <div class="upload-loding-btns">
                                    <span class="blue-btn upload-btn upload-image-button"><?php esc_html_e('ویرایش','woodmartplus') ?></span>
                                    <span class="delete-btn remove-image-button">
                                        <img src="<?php echo WOODPLUS_ASSET ?>admin/img/dashboard/trash.svg" alt="">
                                    </span>
                                </div>
                                <input type="hidden" name="cat_banners_image_id" id="" class="upload_image_id" value="<?php echo esc_attr( $img_id ); ?>" / >
                            <?php else: ?>
                                <div class="upload-loding-img upload_image">
                                </div>
                                <div class="upload-loding-btns">
                                    <span class="blue-btn upload-btn upload-image-button"><?php esc_html_e('آپلود','woodmartplus') ?></span>
                                    <span class="delete-btn remove-image-button" style="display: none;">
                                        <img src="<?php echo WOODPLUS_ASSET ?>admin/img/dashboard/trash.svg" alt="trash">
                                    </span>
                                </div>
                                <input type="hidden" name="cat_banners_image_id" id="" class="upload_image_id" value="" / >
                            <?php endif; ?>
                        </div>

                        <div class="suggestion-inputs">
                            <div>
                                <label><?php esc_html_e('عنوان بنر', 'woodapp-api') ?></label>
                                <input type="text" name="cat_banners_title" class="woodapp-wc-api-form-control" value="<?php echo isset($banner['cat_banners_title']) ? $banner['cat_banners_title'] : ''; ?>" />
                            </div>
                            <div style="margin-top: 20px;">
                                <span class="title"><?php esc_html_e('رنگ بنر', 'woodmartplus'); ?></span>
                                <div class="chose-color">
                                    <div class="color-palet"><input class="color_picke" type="text" name="color" value="<?php echo isset( $banner['color'] ) && !empty( $banner['color'] ) ? esc_attr( $banner['color'] ) :'' ?>"></div>
                                    <div class="color-icon">
                                        <img src="<?php echo WOODPLUS_ASSET ?>admin/img/dashboard/brush.svg" alt="brush">
                                    </div>
                                </div>
                            </div>
                            <div>
                                <p><?php esc_html_e('انتخاب دسته بندی', 'woodmartplus'); ?></p>
                                <?php $selected = isset( $banner['cat_banners_cat_id'] ) && !empty( $banner['cat_banners_cat_id'] ) ? $banner['cat_banners_cat_id'] : ''; ?>
                                <select class="js-example-basic-multiple choose_type_show_app_slider" name="[cat_banners_cat_id]" dir="rtl">
                                    <option value="" ><?php esc_html_e('انتخاب دسته بندی','woodmartplus') ?></option>
                                    <?php foreach (woodapp_wc_api_get_all_woo_cat() as $key => $value): ?>
                                        <option value="<?php echo esc_attr($key) ?>" <?php echo  $key == $selected  ? 'selected' : '' ?> ><?php echo esc_html($value); ?></option>
                                    <?php endforeach; ?>
                                </select>
                            </div>
                        </div>
                    </div>

                    <div class="suggestion-btns">
                        <input class="delete-btn" data-repeater-delete type="button" value="<?php esc_html_e('حذف بنر','woodmartplus') ?>" >
                    </div>
                </div>
            </section>
        <?php endforeach; ?>
    </div>
    <input class="add-btn blue-btn m-t-18 add_product_slider" style="display:inline-block" data-repeater-create type="button" value="<?php esc_html_e('افزودن مرحله','woodmartplus') ?>" >
</div>