calendar.wxml 2.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748
  1. <!--components/calendar/calendar.wxml-->
  2. <view class="calendar">
  3. <view class="title flex">
  4. <view class="flex" style="width:700rpx;">
  5. <!-- <picker value="{{selectDay.year+'-'+selectDay.month}}" bindchange="editMonth" mode="date" fields="month" class="year-month">{{selectDay.year}}.{{selectDay.month>9?selectDay.month:"0"+selectDay.month}}</picker> -->
  6. <view class="icon" bindtap="lastMonth" >
  7. <!-- <view class="iconfont icon-playfill"></view> -->
  8. <view>
  9. <image src="/images/showMore.png" style="transform:rotate(180deg);"></image>
  10. </view>
  11. 上月
  12. </view>
  13. <view style="font-size:36rpx">{{curMonth}} <text style="font-size:28rpx">{{selectDay.year}}</text></view>
  14. <view class="icon" bindtap="nextMonth">
  15. <!-- <view class="iconfont icon-playfill"></view> -->
  16. 下月
  17. <view>
  18. <image src="/images/showMore.png"></image>
  19. </view>
  20. </view>
  21. </view>
  22. <!-- <view catchtap="openChange" class="flex open">
  23. <view>{{open?"收起":"展开"}}</view>
  24. <view style="margin-left:6rpx;font-size:20rpx" class="iconfont icon-{{open?'fold':'unfold'}}"></view>
  25. </view> -->
  26. </view>
  27. <!-- 日历头部 -->
  28. <view class="flex-around calendar-week">
  29. <view class="view">日</view>
  30. <view class="view">一</view>
  31. <view class="view">二</view>
  32. <view class="view">三</view>
  33. <view class="view">四</view>
  34. <view class="view">五</view>
  35. <view class="view">六</view>
  36. </view>
  37. <!-- 日历主体 -->
  38. <view class="flex-start flex-wrap calendar-main" style="height:{{dateList.length/7*82}}rpx">
  39. <view wx:for="{{dateList}}" wx:key="dateList" class="day">
  40. <view class="bg {{(item.year === selectDay.year && item.month === selectDay.month) ? (item.day === selectDay.day?'select':''): 'other-month'}}" catchtap="selectChange" data-day="{{item.day}}" data-year="{{item.year}}" data-month="{{item.month}}" data-date-string="{{item.dateString}}">
  41. {{item.day}}
  42. </view>
  43. <view class="spot" wx:if="{{item.spot}}"></view>
  44. </view>
  45. </view>
  46. </view>