<import src="../../components/calendar/calendar.wxml"/>

<template is="calendar" data="{{ ...$wux.calendar.birthday }}"/>
<template is="calendar" data="{{ ...$wux.calendar.start }}"/>
<template is="calendar" data="{{ ...$wux.calendar.end }}"/>

<view class="page">
    <view class="page__hd">
        <view class="page__title">Calendar</view>
        <view class="page__desc">日历</view>
    </view>
    <view class="page__bd">
        <view class="weui-cells__title">默认设置</view>
        <view class="weui-cells weui-cells_after-title">
            <view class="weui-cell weui-cell_input">
                <view class="weui-cell__hd">
                    <view class="weui-label">生日</view>
                </view>
                <view class="weui-cell__bd">
                    <view class="weui-input" bindtap="openCalendar">{{ birthday || 'Your birth date' }}</view>
                </view>
            </view>
        </view>
        <view class="weui-cells__title">自定义日期格式</view>
        <view class="weui-cells weui-cells_after-title">
            <view class="weui-cell weui-cell_input">
                <view class="weui-cell__hd">
                    <view class="weui-label">出发日期</view>
                </view>
                <view class="weui-cell__bd">
                    <view class="weui-input" bindtap="openCalendar2">{{ start || 'Select date' }}</view>
                </view>
            </view>
        </view>
        <view class="weui-cells__title">可选多个值</view>
        <view class="weui-cells weui-cells_after-title">
            <view class="weui-cell weui-cell_input">
                <view class="weui-cell__hd">
                    <view class="weui-label">离开日期</view>
                </view>
                <view class="weui-cell__bd">
                    <view class="weui-input" bindtap="openCalendar3">{{ end || 'Select multiple dates' }}</view>
                </view>
            </view>
        </view>
    </view>
</view>