.c-datepicker(
@click="open"
)
.c-datepicker__icon.c-datepicker__hovericon(
v-if="!disabled && (date != '' || daterange != '')"
@click="resetDate"
:class="className"
)
c-icon(name="x-circle")
.c-datepicker__icon(:class="className")
c-icon(name="calendar")
c-input(
v-if="type == 'daterange' || type == 'monthrange'"
:value="daterange"
:placeholder="placeholder"
:disabled="disabled"
width="normal"
:size="size"
readonly
@focusin.native="open"
@focusout.native="onBlur"
)
c-input(
v-else-if="type == 'date' || type == 'month'"
v-model="showDate"
:size="size"
width="normal"
:placeholder="placeholder"
:disabled="disabled"
@change="dateChange"
@focusin.native="open"
@focusout.native="onBlur"
@keydown.native="onKeyDown"
)
.c-datepicker__panel(
ref="datepickerPanel"
:class="{'withSidebar': (optionList.length > 0 || hasSidebarSlot) && isOpen == true, 'withBorder': isOpen == true }")
.c-datepicker__sidebar(v-if="(hasSidebarSlot || optionList.length > 0 )&& isOpen")
slot(name="dateSideBar"
:datepicker="datepicker")
ul
template(v-for="option in optionList")
li.optionbtn(@click="optionClick(option)")
a {{option.text}}
c-calendar(
ref="calendar"
v-if="type == 'date' || type == 'month'"
:type="type"
:pattern="datePattern"
:value="date"
:show="isOpen"
:size="size"
:minDate="minDate"
:maxDate="maxDate"
@update="setDate"
)
.c-datepicker__body(
v-if="type == 'daterange'"
)
c-daterange(
:value="date"
:size="size"
:show="isOpen"
:minDate="minDate"
:maxDate="maxDate"
:pattern="datePattern"
@change="setDateRange"
)
.c-datepicker__body(
v-if="type == 'monthrange'"
)
c-daterange(
:value="date"
:size="size"
:show="isOpen"
type="month"
:minDate="minDate"
:maxDate="maxDate"
:pattern="datePattern"
@change="setDateRange"
)