<wxs
  src="./index.wxs"
  module="_sjs" />

<view
  class="ant-picker {{ disabled ? 'ant-picker-disabled' : '' }} {{ className || '' }}"
  style="{{ style || '' }}"
  bind:tap="onOpen">
  <view class="ant-picker-value">
    <view
      wx:if="{{ formatValue }}"
      class="ant-picker-value-text">
      {{ formatValue }}
    </view>
    <block wx:else>
      <view
        wx:if="{{ placeholder }}"
        class="ant-picker-value-placeholder">
        {{ placeholder }}
      </view>
    </block>
  </view>
</view>
<ant-popup
  className="ant-picker-popup {{ popClassName || '' }}"
  style="{{ popStyle || '' }}"
  position="bottom"
  animationType="{{ animationType }}"
  destroyOnClose
  bind:close="onMaskDismiss"
  visible="{{ state.visible }}">
  <view class="ant-picker-header">
    <view
      class="ant-picker-header-item ant-picker-header-cancel"
      hover-class="ant-picker-header-item-hover"
      hover-start-time="20"
      hover-stay-time="50"
      bind:tap="onCancel">
      {{ cancelText }}
    </view>
    <view class="ant-picker-header-item ant-picker-header-title"></view>
    <view
      class="ant-picker-header-item ant-picker-header-confirm"
      hover-class="ant-picker-header-item-hover"
      hover-start-time="20"
      hover-stay-time="50"
      bind:tap="onOk">
      {{ okText }}
    </view>
  </view>
  <view class="ant-picker-content">
    <slot name="content-header" />
    <block wx:if="{{ columns }}">
      <picker-view
        class="ant-picker-picker-view"
        mask-style="{{ maskStyle || '' }}"
        mask-class="{{ maskClassName || '' }}"
        indicator-style="{{ indicatorStyle || '' }}"
        indicator-class="{{ indicatorClassName || '' }}"
        value="{{ selectedIndex }}"
        bind:change="onChange">
        <block
          wx:for="{{ columns }}"
          wx:for-index="dataIndex"
          wx:for-item="dataRoot">
          <picker-view-column
            wx:if="{{ dataIndex < options.length }}"
            class="ant-picker-picker-view-column">
            <block
              wx:for="{{ dataRoot }}"
              wx:for-index="index"
              wx:for-item="item">
              <view class="ant-picker-content-item">
                {{ _sjs.getPickerViewLabel(item) }}
              </view>
            </block>
          </picker-view-column>
        </block>
      </picker-view>
    </block>
    <block wx:else>
      <picker-view>
        <picker-view-column>
          <!-- display: inline -->
          <text style="color: #ccc">暂无数据</text>
        </picker-view-column>
      </picker-view>
    </block>
  </view>
</ant-popup>