html部分
<view class="calendar custom-class">
<view class="month">
<picker bindchange="bindPickerChange" value="{
{showYear+'-'+showMonth}}" fields='month' mode="date" end="{
{currentTime}}">
<text class="title">{
{
showYear}}年 {
{
showMonth}}月</text>
</picker>
<view class="icon_arrows disflex">
<image src="../../../images/icon_arrows_left.png" bindtap="getLastMonth" class="icon_arrows_left icon_arrows_tip">
</image>
<image src="../../../images/icon_arrows_left.png" class="icon_arrows_right icon_arrows_tip" bindtap="getNextMonth"
wx:if='{
{currentYear > showYear || (currentYear === showYear && currentMonth > showMonth)}}'></image>
<image src="../../../images/icon_arrows_right@2x.png" class="icon_arrows_tip" wx:else></image>
</view>
</view>
<view class="mt-32 week_list">
<text wx:for="{
{week}}" class="c-9f9f9f">{
{
item}}</text>
</view>
<view class="day_list">
<text wx:for="{
{dateList}}"
class="date_item {
{(item.timestamp === endTimestamp || item.timestamp === startTimestamp)?'selectDate_item':''}} {
{(item.timestamp < endTimestamp && item.timestamp >= startTimestamp) ? 'selectDateBg' : ''}} c-6b6b6b"
bindtap="selectDate" data-date="{
{item.label}}"><text class="selectDate"
wx:if='{
{item.timestamp === endTimestamp || item.timestamp === startTimestamp}}'></text>{
{
item.label}}<text
class="circular {
{item.status === '0' ? 'circular_normal':''}}" wx:if='{
{item.status}}'></text></text>
</view>
</view>
js
// components/shopLists/index.js
Component({
externalClasses: ['custom-class'],
properties: {
type: {
type: String,
value: 'single', //single表示单选,range表示选择日期区间
},
monthTranslate: {
//日历上的红蓝点
type: Object,
value: {
}
}
},
data: {
week: ['日', '一', '二', '三', '四', '五', '六'],
dateList: [],
showYear: '', //页面上展示的年
showMonth: '', //页面上展示的月
showDay: '', //页面上展示的日
startSelectYear: '', //开始选中的年
startSelectMonth: '', //开始选中的月
startSelectDay: 0, //开始选中的日
currentYear: '', //当前年
currentMonth: '', //当前月
currentTime: '2021-01', //当前年月日
startTimestamp: '', //开始的时间戳
endTimestamp: '', //结束的时间戳
},
lifetimes: {
ready() {
const now = new Date();
const startTimestamp = Date.parse(new Date(now.getFullYear(), now.getMonth(), now.