date-picker.blade.php
65 lines
| 1 | <div id="iawp-date-picker" class="iawp-date-picker" data-relative-range="<?php echo esc_attr($relative_range); ?>"> |
| 2 | <div class="iawp-date-inputs"> |
| 3 | <div class="iawp-input-container prev-month"> |
| 4 | <button class="iawp-fast-travel prev-month" data-month="<?php echo esc_attr($start_date->format('Y-m')); ?>"><span class="dashicons dashicons-calendar-alt"></span></button> |
| 5 | <input id="iawp-start-date" class="iawp-start-date iawp-active" type="text" |
| 6 | readonly value="<?php echo esc_attr(iawp()->date_i18n($user_format, $start_date)); ?>" |
| 7 | data-date="<?php echo esc_attr($start_date->format('Y-m-d')); ?>" |
| 8 | data-month="<?php echo esc_attr($start_date->format('Y-m')); ?>" /> |
| 9 | </div> |
| 10 | <span class="iawp-date-input-separator">-</span> |
| 11 | <div class="iawp-input-container current-month"> |
| 12 | <input id="iawp-end-date" class="iawp-end-date" type="text" |
| 13 | readonly value="<?php echo esc_attr(iawp()->date_i18n($user_format, $end_date)); ?>" |
| 14 | data-date="<?php echo esc_attr($end_date->format('Y-m-d')); ?>" |
| 15 | data-month="<?php echo esc_attr($end_date->format('Y-m')); ?>" /> |
| 16 | <button class="iawp-fast-travel current-month" data-month="<?php echo esc_attr($end_date->format('Y-m')); ?>"><span class="dashicons dashicons-calendar-alt"></span></button> |
| 17 | </div> |
| 18 | <div class="apply-buttons"> |
| 19 | <button id="apply-date" |
| 20 | class="iawp-button purple" |
| 21 | data-testid="apply-dates" |
| 22 | > |
| 23 | <?php esc_html_e('Apply', 'independent-analytics'); ?> |
| 24 | </button> |
| 25 | <button id="cancel-date" |
| 26 | class="iawp-button ghost-purple" |
| 27 | data-testid="close-calendar" |
| 28 | > |
| 29 | <?php esc_html_e('Cancel', 'independent-analytics'); ?> |
| 30 | </button> |
| 31 | </div> |
| 32 | </div> |
| 33 | <div id="iawp-calendars" class="iawp-calendars"><?php |
| 34 | foreach($months as $month) { |
| 35 | echo iawp_blade()->run('date-picker.calendar-month', [ |
| 36 | 'month' => $month, |
| 37 | 'start_date' => $start_date->format('Y-m-d'), |
| 38 | 'end_date' => $end_date->format('Y-m-d'), |
| 39 | 'user_format' => $user_format, |
| 40 | 'first_data' => $first_data |
| 41 | ]); |
| 42 | } ?> |
| 43 | </div> |
| 44 | <div class="relative-dates iawp-date-range-buttons"><?php |
| 45 | foreach ($date_ranges as $date_range): |
| 46 | $exact_start = $date_range->start()->setTimezone($timezone)->format('Y-m-d'); |
| 47 | $exact_end = $date_range->end()->setTimezone($timezone)->format('Y-m-d'); |
| 48 | $classes = $relative_range == $date_range->relative_range_id() ? 'iawp-button active' : 'iawp-button'; ?> |
| 49 | <button class="<?php echo esc_attr($classes); ?>" |
| 50 | data-dates-target="relativeRange" |
| 51 | data-action="dates#relativeRangeSelected" |
| 52 | data-relative-range-id="<?php echo esc_attr($date_range->relative_range_id()) ?>" |
| 53 | data-relative-range-label="<?php echo esc_attr($date_range->label()) ?>" |
| 54 | data-relative-range-start="<?php echo esc_attr($exact_start) ?>" |
| 55 | data-relative-range-end="<?php echo esc_attr($exact_end) ?>" |
| 56 | data-display-date-start="<?php echo (new \DateTime($exact_start))->format($user_format); ?>" |
| 57 | data-display-date-end="<?php echo (new \DateTime($exact_end))->format($user_format); ?>" |
| 58 | data-timestamp-start="<?php echo strtotime($exact_start); ?>" |
| 59 | data-timestamp-end="<?php echo strtotime($exact_end); ?>" |
| 60 | > |
| 61 | <?php echo esc_html($date_range->label()) ?> |
| 62 | </button> |
| 63 | <?php endforeach; ?> |
| 64 | </div> |
| 65 | </div> |