index.wxml 3.2 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647
  1. <wux-date-picker visible="{{ visible }}" controlled mode="datetime" value="{{ value1 }}" lang="{{ lang }}" data-index="1" data-mode="datetime" bind:confirm="onConfirm" bind:visibleChange="onVisibleChange" />
  2. <view class="page">
  3. <view class="page__hd">
  4. <view class="page__title">DatePicker</view>
  5. <view class="page__desc">日期选择器</view>
  6. </view>
  7. <view class="page__bd">
  8. <wux-segmented-control values="{{ ['zh_CN', 'zh_TW', 'en'] }}" bind:change="onChange" />
  9. <wux-cell-group title="Default">
  10. <wux-date-picker mode="datetime" value="{{ value1 }}" lang="{{ lang }}" data-index="1" data-mode="datetime" bind:confirm="onConfirm">
  11. <wux-cell title="Datetime" is-link extra="{{ displayValue1 }}"></wux-cell>
  12. </wux-date-picker>
  13. <wux-date-picker mode="date" value="{{ value2 }}" lang="{{ lang }}" data-index="2" data-mode="date" bind:confirm="onConfirm">
  14. <wux-cell title="Date" is-link extra="{{ displayValue2 }}"></wux-cell>
  15. </wux-date-picker>
  16. <wux-date-picker mode="year" value="{{ value3 }}" lang="{{ lang }}" data-index="3" data-mode="year" bind:confirm="onConfirm">
  17. <wux-cell title="Year" is-link extra="{{ displayValue3 }}"></wux-cell>
  18. </wux-date-picker>
  19. <wux-date-picker mode="month" value="{{ value4 }}" lang="{{ lang }}" data-index="4" data-mode="month" bind:confirm="onConfirm">
  20. <wux-cell title="Month" is-link extra="{{ displayValue4 }}"></wux-cell>
  21. </wux-date-picker>
  22. <wux-date-picker mode="time" value="{{ value5 }}" lang="{{ lang }}" data-index="5" data-mode="time" bind:confirm="onConfirm">
  23. <wux-cell title="Time" is-link extra="{{ displayValue5 }}"></wux-cell>
  24. </wux-date-picker>
  25. </wux-cell-group>
  26. <wux-cell-group title="Use12Hours">
  27. <wux-date-picker mode="datetime" value="{{ value6 }}" lang="{{ lang }}" use12Hours data-index="6" data-mode="datetime" bind:confirm="onConfirm">
  28. <wux-cell title="Datetime" is-link extra="{{ displayValue6 }}"></wux-cell>
  29. </wux-date-picker>
  30. <wux-date-picker mode="time" value="{{ value7 }}" lang="{{ lang }}" use12Hours data-index="7" data-mode="time" bind:confirm="onConfirm">
  31. <wux-cell title="Time" is-link extra="{{ displayValue7 }}"></wux-cell>
  32. </wux-date-picker>
  33. </wux-cell-group>
  34. <wux-cell-group title="MinuteStep">
  35. <wux-date-picker mode="datetime" value="{{ value8 }}" lang="{{ lang }}" minuteStep="10" data-index="8" data-mode="datetime" bind:confirm="onConfirm">
  36. <wux-cell title="Datetime" is-link extra="{{ displayValue8 }}"></wux-cell>
  37. </wux-date-picker>
  38. <wux-date-picker mode="time" value="{{ value9 }}" lang="{{ lang }}" minuteStep="10" data-index="9" data-mode="time" bind:confirm="onConfirm">
  39. <wux-cell title="Time" is-link extra="{{ displayValue9 }}"></wux-cell>
  40. </wux-date-picker>
  41. </wux-cell-group>
  42. <view class="button-sp-area">
  43. <wux-button block type="light" bind:click="onClick">Button click - {{ displayValue1 }}</wux-button>
  44. </view>
  45. </view>
  46. </view>