You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
66 lines
4.0 KiB
66 lines
4.0 KiB
<view class="calendar" wx:if="{{calendar}}"> |
|
<!-- 头部操作栏 --> |
|
<view class="timer flex-center"> |
|
<text class="back-now" bindtap="backToday">回到今天</text> |
|
<view class="t-box flex-center"> |
|
<picker mode="date" value="{{calendarDisplayTime}}" fields="month" start="1970-01" bindchange="bindDateChange"> |
|
<view class="p-time">{{calendarDisplayTime}}</view> |
|
</picker> |
|
<view class="year">{{calendar.curYear || "--"}}年</view> |
|
<view class="month">{{calendar.curMonth || "--"}}月</view> |
|
</view> |
|
</view> |
|
<!-- 星期栏 --> |
|
<view class="weeks b lr ac {{calendarConfig.theme}}_week-color"> |
|
<view class="week fs28" wx:for="{{calendar.weeksCh}}" wx:key="index" data-idx="{{index}}">{{item}}</view> |
|
</view> |
|
<!-- 日历面板主体 --> |
|
<view class="b lr wrap" bindtouchstart="calendarTouchstart" catchtouchmove="calendarTouchmove" |
|
catchtouchend="calendarTouchend"> |
|
<!-- 上月日期格子 --> |
|
<view class="grid b ac pc {{calendarConfig.theme}}_prev-month-date" wx:if="{{calendar.empytGrids}}" |
|
wx:for="{{calendar.empytGrids}}" wx:key="index" data-idx="{{index}}"> |
|
<view class="date-wrap b cc"> |
|
<view class="date"> |
|
{{item.day}} |
|
<view wx:if="{{calendarConfig.showLunar && item.lunar}}" class="date-desc date-desc-bottom"> |
|
{{item.lunar.Term || item.lunar.IDayCn}} |
|
</view> |
|
</view> |
|
</view> |
|
</view> |
|
<!-- 本月日期格子 --> |
|
<view wx:for="{{calendar.days}}" wx:key="index" data-idx="{{index}}" data-date="{{item}}" bindtap="tapDayItem" |
|
class="grid {{item.class ? item.class : ''}} b ac pc"> |
|
<view |
|
class="date-wrap b cc {{(item.week === 0 || item.week === 6) ? calendarConfig.theme + '_weekend-color' : ''}}"> |
|
<view |
|
class="date b ac pc {{item.class ? item.class : ''}} {{calendarConfig.chooseAreaMode ? 'date-area-mode' : ''}} {{calendar.todoLabelCircle && item.showTodoLabel && !item.choosed ? calendarConfig.theme + '_todo-circle todo-circle' : '' }} {{item.isToday ? calendarConfig.theme + '_today' : ''}} {{item.choosed ? calendarConfig.theme + '_choosed' : ''}} {{item.disable ? calendarConfig.theme + '_date-disable' : ''}}"> |
|
{{calendarConfig.markToday && item.isToday ? calendarConfig.markToday : item.day}} |
|
<view |
|
wx:if="{{(calendarConfig.showLunar && item.lunar && !item.showTodoLabel) || (item.showTodoLabel && calendar.todoLabelPos !== 'bottom')}}" |
|
class="date-desc {{calendarConfig.theme}}_date-desc date-desc-bottom {{(item.choosed || item.isToday) ? 'date-desc-bottom-always' : ''}} {{item.disable ? calendarConfig.theme + '_date-desc-disable' : ''}}"> |
|
{{item.lunar.Term || item.lunar.IDayCn}} |
|
</view> |
|
<view wx:if="{{item.showTodoLabel && !calendar.todoLabelCircle}}" |
|
class="{{item.todoText ? 'date-desc' : calendarConfig.theme + '_todo-dot todo-dot'}} {{calendarConfig.showLunar ? calendarConfig.theme + '_date-desc-lunar' : ''}} {{calendar.todoLabelPos === 'bottom' ? 'date-desc-bottom todo-dot-bottom' : 'date-desc-top todo-dot-top'}} {{calendar.showLabelAlways && item.choosed && calendar.todoLabelPos === 'bottom' ? 'date-desc-bottom-always todo-dot-bottom-always' : ''}} {{calendar.showLabelAlways && item.choosed && calendar.todoLabelPos === 'top' ? 'date-desc-top-always todo-dot-top-always' : ''}}" |
|
style="background-color: {{item.todoText ? '' : item.color || calendar.todoLabelColor}}; color: {{item.color}}"> |
|
{{item.todoText}} |
|
</view> |
|
</view> |
|
</view> |
|
</view> |
|
<!-- 下月日期格子 --> |
|
<view class="grid b ac pc {{calendarConfig.theme}}_next-month-date" wx:for="{{calendar.lastEmptyGrids}}" |
|
wx:key="index" data-idx="{{index}}"> |
|
<view class="date-wrap b cc"> |
|
<view class="date"> |
|
{{item.day}} |
|
<view wx:if="{{calendarConfig.showLunar && item.lunar}}" class="date-desc date-desc-bottom"> |
|
{{item.lunar.Term || item.lunar.IDayCn}} |
|
</view> |
|
</view> |
|
</view> |
|
</view> |
|
</view> |
|
</view> |