КОНТРОЛЫ/date_time_field.md


Исходный код

Twig код

{% if is_12_hour_format(value) %}
  {% set max_length = 18 %}
{% else %}
  {% set input_class = input_class|default('') ~ ' military date_field_with-time' %}
  {% set max_length = 16 %}
{% endif %}

{% set control_class_name = control_class_name is defined ? control_class_name : 'js-control-date-time' %}

{% if type == 'range' %}
  <div class="date_field_with-time_range js-date-time-range-control {{ class_name }}">
    {% set value_splitted = value|split(' - ') %}
    {% if value_splitted|length == 1 %}
      {% set value_splitted = value_splitted[0]|split('-') %}
    {% endif %}

    {% if not readonly %}
      <span class="date_field_wrapper--calendar date_time_field_wrapper--calendar-with-time ">
        <svg class="svg-card-calendar-dims"><use xlink:href="#card-calendar"></use></svg>
      </span>
    {% endif %}

    <span class = "date_field_with-time_range-box">
      {% set control_class_name = control_class_name is defined ? control_class_name : 'js-control-date-time' %}
      {% include 'interface/controls/date_time_field.twig' with {
        class_name: 'date_field_with-time_range-box_first',
        type: 'single',
        readonly: true,
        input_class: 'date_field_with-time_range-input_first js-control-autosized_input',
        control_class_name: 'js-control-date-time-in-range',
        name: name.from,
        value: value_splitted[0],
        comfort_zone: 1,
      } %}

      <span class="date_field_with-time_range-hyphen js-filter-date-time-hyphen hidden">-</span>

      {% include 'interface/controls/date_time_field.twig' with {
        class_name: 'date_field_with-time_range-box_second',
        type: 'single',
        readonly: true,
        input_class: 'date_field_with-time_range-input_second js-control-autosized_input',
        control_class_name: 'js-control-date-time-in-range',
        name: name.to,
        placeholder: '',
        value: value_splitted[1],
        comfort_zone: 1,
      } %}

    </span>
  </div>
{% else %}
  {% include "interface/controls/date_field.twig" with {
    type: type,
    value: value,
    name: name,
    placeholder: placeholder,
    input_class: input_class,
    readonly: readonly,
    disabled: disabled,
    control_class_name: control_class_name,
    max_length: max_length,
    comfort_zone: comfort_zone,
  } %}
{% endif %}

Ссылка на вики репозиторий