mirror of
https://gitee.com/beecue/fastbee.git
synced 2025-12-17 16:36:03 +08:00
智慧宿舍系统小程序
This commit is contained in:
qianlile
@@ -0,0 +1,67 @@
|
||||
<view class="van-calendar">
|
||||
<header
|
||||
title="{{ title }}"
|
||||
showTitle="{{ showTitle }}"
|
||||
subtitle="{{ subtitle }}"
|
||||
showSubtitle="{{ showSubtitle }}"
|
||||
firstDayOfWeek="{{ firstDayOfWeek }}"
|
||||
>
|
||||
<slot name="title" slot="title"></slot>
|
||||
</header>
|
||||
|
||||
<scroll-view
|
||||
class="van-calendar__body"
|
||||
scroll-y
|
||||
scroll-into-view="{{ scrollIntoView }}"
|
||||
>
|
||||
<month
|
||||
wx:for="{{ computed.getMonths(minDate, maxDate) }}"
|
||||
wx:key="index"
|
||||
id="month{{ index }}"
|
||||
class="month"
|
||||
data-date="{{ item }}"
|
||||
date="{{ item }}"
|
||||
type="{{ type }}"
|
||||
color="{{ color }}"
|
||||
minDate="{{ minDate }}"
|
||||
maxDate="{{ maxDate }}"
|
||||
showMark="{{ showMark }}"
|
||||
formatter="{{ formatter }}"
|
||||
rowHeight="{{ rowHeight }}"
|
||||
currentDate="{{ currentDate }}"
|
||||
showSubtitle="{{ showSubtitle }}"
|
||||
allowSameDay="{{ allowSameDay }}"
|
||||
showMonthTitle="{{ index !== 0 || !showSubtitle }}"
|
||||
firstDayOfWeek="{{ firstDayOfWeek }}"
|
||||
bind:click="onClickDay"
|
||||
/>
|
||||
</scroll-view>
|
||||
|
||||
<view
|
||||
class="{{ utils.bem('calendar__footer', { safeAreaInsetBottom }) }}"
|
||||
>
|
||||
<slot name="footer"></slot>
|
||||
</view>
|
||||
|
||||
<view
|
||||
class="{{ utils.bem('calendar__footer', { safeAreaInsetBottom }) }}"
|
||||
>
|
||||
<van-button
|
||||
wx:if="{{ showConfirm }}"
|
||||
round
|
||||
block
|
||||
type="danger"
|
||||
color="{{ color }}"
|
||||
custom-class="van-calendar__confirm"
|
||||
disabled="{{ computed.getButtonDisabled(type, currentDate) }}"
|
||||
nativeType="text"
|
||||
bind:click="onConfirm"
|
||||
>
|
||||
{{
|
||||
computed.getButtonDisabled(type, currentDate)
|
||||
? confirmDisabledText
|
||||
: confirmText
|
||||
}}
|
||||
</van-button>
|
||||
</view>
|
||||
</view>
|
||||
@@ -0,0 +1,43 @@
|
||||
'use strict';
|
||||
var __spreadArray =
|
||||
(this && this.__spreadArray) ||
|
||||
function (to, from) {
|
||||
for (var i = 0, il = from.length, j = to.length; i < il; i++, j++)
|
||||
to[j] = from[i];
|
||||
return to;
|
||||
};
|
||||
Object.defineProperty(exports, '__esModule', { value: true });
|
||||
var component_1 = require('../../../common/component');
|
||||
component_1.VantComponent({
|
||||
props: {
|
||||
title: {
|
||||
type: String,
|
||||
value: '日期选择',
|
||||
},
|
||||
subtitle: String,
|
||||
showTitle: Boolean,
|
||||
showSubtitle: Boolean,
|
||||
firstDayOfWeek: {
|
||||
type: Number,
|
||||
observer: 'initWeekDay',
|
||||
},
|
||||
},
|
||||
data: {
|
||||
weekdays: [],
|
||||
},
|
||||
created: function () {
|
||||
this.initWeekDay();
|
||||
},
|
||||
methods: {
|
||||
initWeekDay: function () {
|
||||
var defaultWeeks = ['日', '一', '二', '三', '四', '五', '六'];
|
||||
var firstDayOfWeek = this.data.firstDayOfWeek || 0;
|
||||
this.setData({
|
||||
weekdays: __spreadArray(
|
||||
__spreadArray([], defaultWeeks.slice(firstDayOfWeek, 7)),
|
||||
defaultWeeks.slice(0, firstDayOfWeek)
|
||||
),
|
||||
});
|
||||
},
|
||||
},
|
||||
});
|
||||
@@ -0,0 +1,3 @@
|
||||
{
|
||||
"component": true
|
||||
}
|
||||
@@ -0,0 +1,16 @@
|
||||
<view class="van-calendar__header">
|
||||
<block wx:if="{{ showTitle }}">
|
||||
<view class="van-calendar__header-title"><slot name="title"></slot></view>
|
||||
<view class="van-calendar__header-title">{{ title }}</view>
|
||||
</block>
|
||||
|
||||
<view wx:if="{{ showSubtitle }}" class="van-calendar__header-subtitle">
|
||||
{{ subtitle }}
|
||||
</view>
|
||||
|
||||
<view class="van-calendar__weekdays">
|
||||
<view wx:for="{{ weekdays }}" wx:key="index" class="van-calendar__weekday">
|
||||
{{ item }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@@ -0,0 +1 @@
|
||||
@import '../../../common/index.wxss';.van-calendar__header{-webkit-flex-shrink:0;flex-shrink:0;box-shadow:0 2px 10px rgba(125,126,128,.16);box-shadow:var(--calendar-header-box-shadow,0 2px 10px rgba(125,126,128,.16))}.van-calendar__header-subtitle,.van-calendar__header-title{text-align:center;height:44px;height:var(--calendar-header-title-height,44px);font-weight:500;font-weight:var(--font-weight-bold,500);line-height:44px;line-height:var(--calendar-header-title-height,44px)}.van-calendar__header-title+.van-calendar__header-title,.van-calendar__header-title:empty{display:none}.van-calendar__header-title:empty+.van-calendar__header-title{display:block!important}.van-calendar__weekdays{display:-webkit-flex;display:flex}.van-calendar__weekday{-webkit-flex:1;flex:1;text-align:center;font-size:12px;font-size:var(--calendar-weekdays-font-size,12px);line-height:30px;line-height:var(--calendar-weekdays-height,30px)}
|
||||
@@ -0,0 +1,173 @@
|
||||
'use strict';
|
||||
Object.defineProperty(exports, '__esModule', { value: true });
|
||||
var component_1 = require('../../../common/component');
|
||||
var utils_1 = require('../../utils');
|
||||
component_1.VantComponent({
|
||||
props: {
|
||||
date: {
|
||||
type: null,
|
||||
observer: 'setDays',
|
||||
},
|
||||
type: {
|
||||
type: String,
|
||||
observer: 'setDays',
|
||||
},
|
||||
color: String,
|
||||
minDate: {
|
||||
type: null,
|
||||
observer: 'setDays',
|
||||
},
|
||||
maxDate: {
|
||||
type: null,
|
||||
observer: 'setDays',
|
||||
},
|
||||
showMark: Boolean,
|
||||
rowHeight: null,
|
||||
formatter: {
|
||||
type: null,
|
||||
observer: 'setDays',
|
||||
},
|
||||
currentDate: {
|
||||
type: null,
|
||||
observer: 'setDays',
|
||||
},
|
||||
firstDayOfWeek: {
|
||||
type: Number,
|
||||
observer: 'setDays',
|
||||
},
|
||||
allowSameDay: Boolean,
|
||||
showSubtitle: Boolean,
|
||||
showMonthTitle: Boolean,
|
||||
},
|
||||
data: {
|
||||
visible: true,
|
||||
days: [],
|
||||
},
|
||||
methods: {
|
||||
onClick: function (event) {
|
||||
var index = event.currentTarget.dataset.index;
|
||||
var item = this.data.days[index];
|
||||
if (item.type !== 'disabled') {
|
||||
this.$emit('click', item);
|
||||
}
|
||||
},
|
||||
setDays: function () {
|
||||
var days = [];
|
||||
var startDate = new Date(this.data.date);
|
||||
var year = startDate.getFullYear();
|
||||
var month = startDate.getMonth();
|
||||
var totalDay = utils_1.getMonthEndDay(
|
||||
startDate.getFullYear(),
|
||||
startDate.getMonth() + 1
|
||||
);
|
||||
for (var day = 1; day <= totalDay; day++) {
|
||||
var date = new Date(year, month, day);
|
||||
var type = this.getDayType(date);
|
||||
var config = {
|
||||
date: date,
|
||||
type: type,
|
||||
text: day,
|
||||
bottomInfo: this.getBottomInfo(type),
|
||||
};
|
||||
if (this.data.formatter) {
|
||||
config = this.data.formatter(config);
|
||||
}
|
||||
days.push(config);
|
||||
}
|
||||
this.setData({ days: days });
|
||||
},
|
||||
getMultipleDayType: function (day) {
|
||||
var currentDate = this.data.currentDate;
|
||||
if (!Array.isArray(currentDate)) {
|
||||
return '';
|
||||
}
|
||||
var isSelected = function (date) {
|
||||
return currentDate.some(function (item) {
|
||||
return utils_1.compareDay(item, date) === 0;
|
||||
});
|
||||
};
|
||||
if (isSelected(day)) {
|
||||
var prevDay = utils_1.getPrevDay(day);
|
||||
var nextDay = utils_1.getNextDay(day);
|
||||
var prevSelected = isSelected(prevDay);
|
||||
var nextSelected = isSelected(nextDay);
|
||||
if (prevSelected && nextSelected) {
|
||||
return 'multiple-middle';
|
||||
}
|
||||
if (prevSelected) {
|
||||
return 'end';
|
||||
}
|
||||
return nextSelected ? 'start' : 'multiple-selected';
|
||||
}
|
||||
return '';
|
||||
},
|
||||
getRangeDayType: function (day) {
|
||||
var _a = this.data,
|
||||
currentDate = _a.currentDate,
|
||||
allowSameDay = _a.allowSameDay;
|
||||
if (!Array.isArray(currentDate)) {
|
||||
return '';
|
||||
}
|
||||
var startDay = currentDate[0],
|
||||
endDay = currentDate[1];
|
||||
if (!startDay) {
|
||||
return '';
|
||||
}
|
||||
var compareToStart = utils_1.compareDay(day, startDay);
|
||||
if (!endDay) {
|
||||
return compareToStart === 0 ? 'start' : '';
|
||||
}
|
||||
var compareToEnd = utils_1.compareDay(day, endDay);
|
||||
if (compareToStart === 0 && compareToEnd === 0 && allowSameDay) {
|
||||
return 'start-end';
|
||||
}
|
||||
if (compareToStart === 0) {
|
||||
return 'start';
|
||||
}
|
||||
if (compareToEnd === 0) {
|
||||
return 'end';
|
||||
}
|
||||
if (compareToStart > 0 && compareToEnd < 0) {
|
||||
return 'middle';
|
||||
}
|
||||
return '';
|
||||
},
|
||||
getDayType: function (day) {
|
||||
var _a = this.data,
|
||||
type = _a.type,
|
||||
minDate = _a.minDate,
|
||||
maxDate = _a.maxDate,
|
||||
currentDate = _a.currentDate;
|
||||
if (
|
||||
utils_1.compareDay(day, minDate) < 0 ||
|
||||
utils_1.compareDay(day, maxDate) > 0
|
||||
) {
|
||||
return 'disabled';
|
||||
}
|
||||
if (type === 'single') {
|
||||
return utils_1.compareDay(day, currentDate) === 0 ? 'selected' : '';
|
||||
}
|
||||
if (type === 'multiple') {
|
||||
return this.getMultipleDayType(day);
|
||||
}
|
||||
/* istanbul ignore else */
|
||||
if (type === 'range') {
|
||||
return this.getRangeDayType(day);
|
||||
}
|
||||
return '';
|
||||
},
|
||||
getBottomInfo: function (type) {
|
||||
if (this.data.type === 'range') {
|
||||
if (type === 'start') {
|
||||
return '开始';
|
||||
}
|
||||
if (type === 'end') {
|
||||
return '结束';
|
||||
}
|
||||
if (type === 'start-end') {
|
||||
return '开始/结束';
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
});
|
||||
@@ -0,0 +1,3 @@
|
||||
{
|
||||
"component": true
|
||||
}
|
||||
@@ -0,0 +1,39 @@
|
||||
<wxs src="./index.wxs" module="computed"></wxs>
|
||||
<wxs src="../../../wxs/utils.wxs" module="utils" />
|
||||
|
||||
<view class="van-calendar__month" style="{{ computed.getMonthStyle(visible, date, rowHeight) }}">
|
||||
<view wx:if="{{ showMonthTitle }}" class="van-calendar__month-title">
|
||||
{{ computed.formatMonthTitle(date) }}
|
||||
</view>
|
||||
|
||||
<view wx:if="{{ visible }}" class="van-calendar__days">
|
||||
<view wx:if="{{ showMark }}" class="van-calendar__month-mark">
|
||||
{{ computed.getMark(date) }}
|
||||
</view>
|
||||
|
||||
<view
|
||||
wx:for="{{ days }}"
|
||||
wx:key="index"
|
||||
style="{{ computed.getDayStyle(item.type, index, date, rowHeight, color, firstDayOfWeek) }}"
|
||||
class="{{ utils.bem('calendar__day', [item.type]) }} {{ item.className }}"
|
||||
data-index="{{ index }}"
|
||||
bindtap="onClick"
|
||||
>
|
||||
<view wx:if="{{ item.type === 'selected' }}" class="van-calendar__selected-day" style="background: {{ color }}">
|
||||
<view wx:if="{{ item.topInfo }}" class="van-calendar__top-info">{{ item.topInfo }}</view>
|
||||
{{ item.text }}
|
||||
<view wx:if="{{ item.bottomInfo }}" class="van-calendar__bottom-info">
|
||||
{{ item.bottomInfo }}
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view wx:else>
|
||||
<view wx:if="{{ item.topInfo }}" class="van-calendar__top-info">{{ item.topInfo }}</view>
|
||||
{{ item.text }}
|
||||
<view wx:if="{{ item.bottomInfo }}" class="van-calendar__bottom-info">
|
||||
{{ item.bottomInfo }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@@ -0,0 +1,71 @@
|
||||
/* eslint-disable */
|
||||
var utils = require('../../utils.wxs');
|
||||
|
||||
function getMark(date) {
|
||||
return getDate(date).getMonth() + 1;
|
||||
}
|
||||
|
||||
var ROW_HEIGHT = 64;
|
||||
|
||||
function getDayStyle(type, index, date, rowHeight, color, firstDayOfWeek) {
|
||||
var style = [];
|
||||
var current = getDate(date).getDay() || 7;
|
||||
var offset = current < firstDayOfWeek ? (7 - firstDayOfWeek + current) :
|
||||
current === 7 && firstDayOfWeek === 0 ? 0 :
|
||||
(current - firstDayOfWeek);
|
||||
|
||||
if (index === 0) {
|
||||
style.push(['margin-left', (100 * offset) / 7 + '%']);
|
||||
}
|
||||
|
||||
if (rowHeight !== ROW_HEIGHT) {
|
||||
style.push(['height', rowHeight + 'px']);
|
||||
}
|
||||
|
||||
if (color) {
|
||||
if (
|
||||
type === 'start' ||
|
||||
type === 'end' ||
|
||||
type === 'start-end' ||
|
||||
type === 'multiple-selected' ||
|
||||
type === 'multiple-middle'
|
||||
) {
|
||||
style.push(['background', color]);
|
||||
} else if (type === 'middle') {
|
||||
style.push(['color', color]);
|
||||
}
|
||||
}
|
||||
|
||||
return style
|
||||
.map(function(item) {
|
||||
return item.join(':');
|
||||
})
|
||||
.join(';');
|
||||
}
|
||||
|
||||
function formatMonthTitle(date) {
|
||||
date = getDate(date);
|
||||
return date.getFullYear() + '年' + (date.getMonth() + 1) + '月';
|
||||
}
|
||||
|
||||
function getMonthStyle(visible, date, rowHeight) {
|
||||
if (!visible) {
|
||||
date = getDate(date);
|
||||
|
||||
var totalDay = utils.getMonthEndDay(
|
||||
date.getFullYear(),
|
||||
date.getMonth() + 1
|
||||
);
|
||||
var offset = getDate(date).getDay();
|
||||
var padding = Math.ceil((totalDay + offset) / 7) * rowHeight;
|
||||
|
||||
return 'padding-bottom:' + padding + 'px';
|
||||
}
|
||||
}
|
||||
|
||||
module.exports = {
|
||||
getMark: getMark,
|
||||
getDayStyle: getDayStyle,
|
||||
formatMonthTitle: formatMonthTitle,
|
||||
getMonthStyle: getMonthStyle
|
||||
};
|
||||
@@ -0,0 +1 @@
|
||||
@import '../../../common/index.wxss';.van-calendar{display:-webkit-flex;display:flex;-webkit-flex-direction:column;flex-direction:column;height:100%;background-color:#fff;background-color:var(--calendar-background-color,#fff)}.van-calendar__month-title{text-align:center;height:44px;height:var(--calendar-header-title-height,44px);font-weight:500;font-weight:var(--font-weight-bold,500);font-size:14px;font-size:var(--calendar-month-title-font-size,14px);line-height:44px;line-height:var(--calendar-header-title-height,44px)}.van-calendar__days{position:relative;display:-webkit-flex;display:flex;-webkit-flex-wrap:wrap;flex-wrap:wrap;-webkit-user-select:none;user-select:none}.van-calendar__month-mark{position:absolute;top:50%;left:50%;z-index:0;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);pointer-events:none;color:rgba(242,243,245,.8);color:var(--calendar-month-mark-color,rgba(242,243,245,.8));font-size:160px;font-size:var(--calendar-month-mark-font-size,160px)}.van-calendar__day,.van-calendar__selected-day{display:-webkit-flex;display:flex;-webkit-align-items:center;align-items:center;-webkit-justify-content:center;justify-content:center;text-align:center}.van-calendar__day{position:relative;width:14.285%;height:64px;height:var(--calendar-day-height,64px);font-size:16px;font-size:var(--calendar-day-font-size,16px)}.van-calendar__day--end,.van-calendar__day--multiple-middle,.van-calendar__day--multiple-selected,.van-calendar__day--start,.van-calendar__day--start-end{color:#fff;color:var(--calendar-range-edge-color,#fff);background-color:#ee0a24;background-color:var(--calendar-range-edge-background-color,#ee0a24)}.van-calendar__day--start{border-radius:4px 0 0 4px;border-radius:var(--border-radius-md,4px) 0 0 var(--border-radius-md,4px)}.van-calendar__day--end{border-radius:0 4px 4px 0;border-radius:0 var(--border-radius-md,4px) var(--border-radius-md,4px) 0}.van-calendar__day--multiple-selected,.van-calendar__day--start-end{border-radius:4px;border-radius:var(--border-radius-md,4px)}.van-calendar__day--middle{color:#ee0a24;color:var(--calendar-range-middle-color,#ee0a24)}.van-calendar__day--middle:after{position:absolute;top:0;right:0;bottom:0;left:0;background-color:currentColor;content:"";opacity:.1;opacity:var(--calendar-range-middle-background-opacity,.1)}.van-calendar__day--disabled{cursor:default;color:#c8c9cc;color:var(--calendar-day-disabled-color,#c8c9cc)}.van-calendar__bottom-info,.van-calendar__top-info{position:absolute;right:0;left:0;font-size:10px;font-size:var(--calendar-info-font-size,10px);line-height:14px;line-height:var(--calendar-info-line-height,14px)}@media (max-width:350px){.van-calendar__bottom-info,.van-calendar__top-info{font-size:9px}}.van-calendar__top-info{top:6px}.van-calendar__bottom-info{bottom:6px}.van-calendar__selected-day{width:54px;width:var(--calendar-selected-day-size,54px);height:54px;height:var(--calendar-selected-day-size,54px);color:#fff;color:var(--calendar-selected-day-color,#fff);background-color:#ee0a24;background-color:var(--calendar-selected-day-background-color,#ee0a24);border-radius:4px;border-radius:var(--border-radius-md,4px)}
|
||||
335
wechat/miniprogram/miniprogram_npm/@vant/weapp/calendar/index.js
Normal file
335
wechat/miniprogram/miniprogram_npm/@vant/weapp/calendar/index.js
Normal file
@@ -0,0 +1,335 @@
|
||||
'use strict';
|
||||
var __spreadArray =
|
||||
(this && this.__spreadArray) ||
|
||||
function (to, from) {
|
||||
for (var i = 0, il = from.length, j = to.length; i < il; i++, j++)
|
||||
to[j] = from[i];
|
||||
return to;
|
||||
};
|
||||
var __importDefault =
|
||||
(this && this.__importDefault) ||
|
||||
function (mod) {
|
||||
return mod && mod.__esModule ? mod : { default: mod };
|
||||
};
|
||||
Object.defineProperty(exports, '__esModule', { value: true });
|
||||
var component_1 = require('../common/component');
|
||||
var utils_1 = require('./utils');
|
||||
var toast_1 = __importDefault(require('../toast/toast'));
|
||||
var utils_2 = require('../common/utils');
|
||||
component_1.VantComponent({
|
||||
props: {
|
||||
title: {
|
||||
type: String,
|
||||
value: '日期选择',
|
||||
},
|
||||
color: String,
|
||||
show: {
|
||||
type: Boolean,
|
||||
observer: function (val) {
|
||||
if (val) {
|
||||
this.initRect();
|
||||
this.scrollIntoView();
|
||||
}
|
||||
},
|
||||
},
|
||||
formatter: null,
|
||||
confirmText: {
|
||||
type: String,
|
||||
value: '确定',
|
||||
},
|
||||
rangePrompt: String,
|
||||
showRangePrompt: {
|
||||
type: Boolean,
|
||||
value: true,
|
||||
},
|
||||
defaultDate: {
|
||||
type: null,
|
||||
observer: function (val) {
|
||||
this.setData({ currentDate: val });
|
||||
this.scrollIntoView();
|
||||
},
|
||||
},
|
||||
allowSameDay: Boolean,
|
||||
confirmDisabledText: String,
|
||||
type: {
|
||||
type: String,
|
||||
value: 'single',
|
||||
observer: 'reset',
|
||||
},
|
||||
minDate: {
|
||||
type: null,
|
||||
value: Date.now(),
|
||||
},
|
||||
maxDate: {
|
||||
type: null,
|
||||
value: new Date(
|
||||
new Date().getFullYear(),
|
||||
new Date().getMonth() + 6,
|
||||
new Date().getDate()
|
||||
).getTime(),
|
||||
},
|
||||
position: {
|
||||
type: String,
|
||||
value: 'bottom',
|
||||
},
|
||||
rowHeight: {
|
||||
type: null,
|
||||
value: utils_1.ROW_HEIGHT,
|
||||
},
|
||||
round: {
|
||||
type: Boolean,
|
||||
value: true,
|
||||
},
|
||||
poppable: {
|
||||
type: Boolean,
|
||||
value: true,
|
||||
},
|
||||
showMark: {
|
||||
type: Boolean,
|
||||
value: true,
|
||||
},
|
||||
showTitle: {
|
||||
type: Boolean,
|
||||
value: true,
|
||||
},
|
||||
showConfirm: {
|
||||
type: Boolean,
|
||||
value: true,
|
||||
},
|
||||
showSubtitle: {
|
||||
type: Boolean,
|
||||
value: true,
|
||||
},
|
||||
safeAreaInsetBottom: {
|
||||
type: Boolean,
|
||||
value: true,
|
||||
},
|
||||
closeOnClickOverlay: {
|
||||
type: Boolean,
|
||||
value: true,
|
||||
},
|
||||
maxRange: {
|
||||
type: null,
|
||||
value: null,
|
||||
},
|
||||
firstDayOfWeek: {
|
||||
type: Number,
|
||||
value: 0,
|
||||
},
|
||||
},
|
||||
data: {
|
||||
subtitle: '',
|
||||
currentDate: null,
|
||||
scrollIntoView: '',
|
||||
},
|
||||
created: function () {
|
||||
this.setData({
|
||||
currentDate: this.getInitialDate(),
|
||||
});
|
||||
},
|
||||
mounted: function () {
|
||||
if (this.data.show || !this.data.poppable) {
|
||||
this.initRect();
|
||||
this.scrollIntoView();
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
reset: function () {
|
||||
this.setData({ currentDate: this.getInitialDate() });
|
||||
this.scrollIntoView();
|
||||
},
|
||||
initRect: function () {
|
||||
var _this = this;
|
||||
if (this.contentObserver != null) {
|
||||
this.contentObserver.disconnect();
|
||||
}
|
||||
var contentObserver = this.createIntersectionObserver({
|
||||
thresholds: [0, 0.1, 0.9, 1],
|
||||
observeAll: true,
|
||||
});
|
||||
this.contentObserver = contentObserver;
|
||||
contentObserver.relativeTo('.van-calendar__body');
|
||||
contentObserver.observe('.month', function (res) {
|
||||
if (res.boundingClientRect.top <= res.relativeRect.top) {
|
||||
// @ts-ignore
|
||||
_this.setData({
|
||||
subtitle: utils_1.formatMonthTitle(res.dataset.date),
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
getInitialDate: function () {
|
||||
var _a = this.data,
|
||||
type = _a.type,
|
||||
defaultDate = _a.defaultDate,
|
||||
minDate = _a.minDate;
|
||||
if (type === 'range') {
|
||||
var _b = defaultDate || [],
|
||||
startDay = _b[0],
|
||||
endDay = _b[1];
|
||||
return [
|
||||
startDay || minDate,
|
||||
endDay || utils_1.getNextDay(new Date(minDate)).getTime(),
|
||||
];
|
||||
}
|
||||
if (type === 'multiple') {
|
||||
return defaultDate || [minDate];
|
||||
}
|
||||
return defaultDate || minDate;
|
||||
},
|
||||
scrollIntoView: function () {
|
||||
var _this = this;
|
||||
utils_2.requestAnimationFrame(function () {
|
||||
var _a = _this.data,
|
||||
currentDate = _a.currentDate,
|
||||
type = _a.type,
|
||||
show = _a.show,
|
||||
poppable = _a.poppable,
|
||||
minDate = _a.minDate,
|
||||
maxDate = _a.maxDate;
|
||||
// @ts-ignore
|
||||
var targetDate = type === 'single' ? currentDate : currentDate[0];
|
||||
var displayed = show || !poppable;
|
||||
if (!targetDate || !displayed) {
|
||||
return;
|
||||
}
|
||||
var months = utils_1.getMonths(minDate, maxDate);
|
||||
months.some(function (month, index) {
|
||||
if (utils_1.compareMonth(month, targetDate) === 0) {
|
||||
_this.setData({ scrollIntoView: 'month' + index });
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
});
|
||||
});
|
||||
},
|
||||
onOpen: function () {
|
||||
this.$emit('open');
|
||||
},
|
||||
onOpened: function () {
|
||||
this.$emit('opened');
|
||||
},
|
||||
onClose: function () {
|
||||
this.$emit('close');
|
||||
},
|
||||
onClosed: function () {
|
||||
this.$emit('closed');
|
||||
},
|
||||
onClickDay: function (event) {
|
||||
var date = event.detail.date;
|
||||
var _a = this.data,
|
||||
type = _a.type,
|
||||
currentDate = _a.currentDate,
|
||||
allowSameDay = _a.allowSameDay;
|
||||
if (type === 'range') {
|
||||
// @ts-ignore
|
||||
var startDay = currentDate[0],
|
||||
endDay = currentDate[1];
|
||||
if (startDay && !endDay) {
|
||||
var compareToStart = utils_1.compareDay(date, startDay);
|
||||
if (compareToStart === 1) {
|
||||
this.select([startDay, date], true);
|
||||
} else if (compareToStart === -1) {
|
||||
this.select([date, null]);
|
||||
} else if (allowSameDay) {
|
||||
this.select([date, date]);
|
||||
}
|
||||
} else {
|
||||
this.select([date, null]);
|
||||
}
|
||||
} else if (type === 'multiple') {
|
||||
var selectedIndex_1;
|
||||
// @ts-ignore
|
||||
var selected = currentDate.some(function (dateItem, index) {
|
||||
var equal = utils_1.compareDay(dateItem, date) === 0;
|
||||
if (equal) {
|
||||
selectedIndex_1 = index;
|
||||
}
|
||||
return equal;
|
||||
});
|
||||
if (selected) {
|
||||
// @ts-ignore
|
||||
var cancelDate = currentDate.splice(selectedIndex_1, 1);
|
||||
this.setData({ currentDate: currentDate });
|
||||
this.unselect(cancelDate);
|
||||
} else {
|
||||
// @ts-ignore
|
||||
this.select(__spreadArray(__spreadArray([], currentDate), [date]));
|
||||
}
|
||||
} else {
|
||||
this.select(date, true);
|
||||
}
|
||||
},
|
||||
unselect: function (dateArray) {
|
||||
var date = dateArray[0];
|
||||
if (date) {
|
||||
this.$emit('unselect', utils_1.copyDates(date));
|
||||
}
|
||||
},
|
||||
select: function (date, complete) {
|
||||
if (complete && this.data.type === 'range') {
|
||||
var valid = this.checkRange(date);
|
||||
if (!valid) {
|
||||
// auto selected to max range if showConfirm
|
||||
if (this.data.showConfirm) {
|
||||
this.emit([
|
||||
date[0],
|
||||
utils_1.getDayByOffset(date[0], this.data.maxRange - 1),
|
||||
]);
|
||||
} else {
|
||||
this.emit(date);
|
||||
}
|
||||
return;
|
||||
}
|
||||
}
|
||||
this.emit(date);
|
||||
if (complete && !this.data.showConfirm) {
|
||||
this.onConfirm();
|
||||
}
|
||||
},
|
||||
emit: function (date) {
|
||||
var getTime = function (date) {
|
||||
return date instanceof Date ? date.getTime() : date;
|
||||
};
|
||||
this.setData({
|
||||
currentDate: Array.isArray(date) ? date.map(getTime) : getTime(date),
|
||||
});
|
||||
this.$emit('select', utils_1.copyDates(date));
|
||||
},
|
||||
checkRange: function (date) {
|
||||
var _a = this.data,
|
||||
maxRange = _a.maxRange,
|
||||
rangePrompt = _a.rangePrompt,
|
||||
showRangePrompt = _a.showRangePrompt;
|
||||
if (maxRange && utils_1.calcDateNum(date) > maxRange) {
|
||||
if (showRangePrompt) {
|
||||
toast_1.default({
|
||||
duration: 0,
|
||||
context: this,
|
||||
message:
|
||||
rangePrompt ||
|
||||
'\u9009\u62E9\u5929\u6570\u4E0D\u80FD\u8D85\u8FC7 ' +
|
||||
maxRange +
|
||||
' \u5929',
|
||||
});
|
||||
}
|
||||
this.$emit('over-range');
|
||||
return false;
|
||||
}
|
||||
return true;
|
||||
},
|
||||
onConfirm: function () {
|
||||
var _this = this;
|
||||
if (
|
||||
this.data.type === 'range' &&
|
||||
!this.checkRange(this.data.currentDate)
|
||||
) {
|
||||
return;
|
||||
}
|
||||
wx.nextTick(function () {
|
||||
// @ts-ignore
|
||||
_this.$emit('confirm', utils_1.copyDates(_this.data.currentDate));
|
||||
});
|
||||
},
|
||||
},
|
||||
});
|
||||
@@ -0,0 +1,10 @@
|
||||
{
|
||||
"component": true,
|
||||
"usingComponents": {
|
||||
"header": "./components/header/index",
|
||||
"month": "./components/month/index",
|
||||
"van-button": "../button/index",
|
||||
"van-popup": "../popup/index",
|
||||
"van-toast": "../toast/index"
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,25 @@
|
||||
<wxs src="./index.wxs" module="computed" />
|
||||
<wxs src="../wxs/utils.wxs" module="utils" />
|
||||
|
||||
<import src="./calendar.wxml" />
|
||||
|
||||
<van-popup
|
||||
wx:if="{{ poppable }}"
|
||||
custom-class="van-calendar__popup--{{ position }}"
|
||||
close-icon-class="van-calendar__close-icon"
|
||||
show="{{ show }}"
|
||||
round="{{ round }}"
|
||||
position="{{ position }}"
|
||||
closeable="{{ showTitle || showSubtitle }}"
|
||||
close-on-click-overlay="{{ closeOnClickOverlay }}"
|
||||
bind:enter="onOpen"
|
||||
bind:close="onClose"
|
||||
bind:after-enter="onOpened"
|
||||
bind:after-leave="onClosed"
|
||||
>
|
||||
<include src="calendar.wxml" />
|
||||
</van-popup>
|
||||
|
||||
<include wx:else src="calendar.wxml" />
|
||||
|
||||
<van-toast id="van-toast" />
|
||||
@@ -0,0 +1,37 @@
|
||||
/* eslint-disable */
|
||||
var utils = require('./utils.wxs');
|
||||
|
||||
function getMonths(minDate, maxDate) {
|
||||
var months = [];
|
||||
var cursor = getDate(minDate);
|
||||
|
||||
cursor.setDate(1);
|
||||
|
||||
do {
|
||||
months.push(cursor.getTime());
|
||||
cursor.setMonth(cursor.getMonth() + 1);
|
||||
} while (utils.compareMonth(cursor, getDate(maxDate)) !== 1);
|
||||
|
||||
return months;
|
||||
}
|
||||
|
||||
function getButtonDisabled(type, currentDate) {
|
||||
if (currentDate == null) {
|
||||
return true;
|
||||
}
|
||||
|
||||
if (type === 'range') {
|
||||
return !currentDate[0] || !currentDate[1];
|
||||
}
|
||||
|
||||
if (type === 'multiple') {
|
||||
return !currentDate.length;
|
||||
}
|
||||
|
||||
return !currentDate;
|
||||
}
|
||||
|
||||
module.exports = {
|
||||
getMonths: getMonths,
|
||||
getButtonDisabled: getButtonDisabled
|
||||
};
|
||||
@@ -0,0 +1 @@
|
||||
@import '../common/index.wxss';.van-calendar{display:-webkit-flex;display:flex;-webkit-flex-direction:column;flex-direction:column;height:100%;height:var(--calendar-height,100%);background-color:#fff;background-color:var(--calendar-background-color,#fff)}.van-calendar__close-icon{top:11px}.van-calendar__popup--bottom,.van-calendar__popup--top{height:80%;height:var(--calendar-popup-height,80%)}.van-calendar__popup--left,.van-calendar__popup--right{height:100%}.van-calendar__body{-webkit-flex:1;flex:1;overflow:auto;-webkit-overflow-scrolling:touch}.van-calendar__footer{-webkit-flex-shrink:0;flex-shrink:0;padding:0 16px;padding:0 var(--padding-md,16px)}.van-calendar__footer--safe-area-inset-bottom{padding-bottom:env(safe-area-inset-bottom)}.van-calendar__footer+.van-calendar__footer,.van-calendar__footer:empty{display:none}.van-calendar__footer:empty+.van-calendar__footer{display:block!important}.van-calendar__confirm{height:36px!important;height:var(--calendar-confirm-button-height,36px)!important;margin:7px 0!important;margin:var(--calendar-confirm-button-margin,7px 0)!important;line-height:34px!important;line-height:var(--calendar-confirm-button-line-height,34px)!important}
|
||||
@@ -0,0 +1,91 @@
|
||||
'use strict';
|
||||
Object.defineProperty(exports, '__esModule', { value: true });
|
||||
exports.getMonths = exports.getMonthEndDay = exports.copyDates = exports.calcDateNum = exports.getNextDay = exports.getPrevDay = exports.getDayByOffset = exports.compareDay = exports.compareMonth = exports.formatMonthTitle = exports.ROW_HEIGHT = void 0;
|
||||
exports.ROW_HEIGHT = 64;
|
||||
function formatMonthTitle(date) {
|
||||
if (!(date instanceof Date)) {
|
||||
date = new Date(date);
|
||||
}
|
||||
return date.getFullYear() + '\u5E74' + (date.getMonth() + 1) + '\u6708';
|
||||
}
|
||||
exports.formatMonthTitle = formatMonthTitle;
|
||||
function compareMonth(date1, date2) {
|
||||
if (!(date1 instanceof Date)) {
|
||||
date1 = new Date(date1);
|
||||
}
|
||||
if (!(date2 instanceof Date)) {
|
||||
date2 = new Date(date2);
|
||||
}
|
||||
var year1 = date1.getFullYear();
|
||||
var year2 = date2.getFullYear();
|
||||
var month1 = date1.getMonth();
|
||||
var month2 = date2.getMonth();
|
||||
if (year1 === year2) {
|
||||
return month1 === month2 ? 0 : month1 > month2 ? 1 : -1;
|
||||
}
|
||||
return year1 > year2 ? 1 : -1;
|
||||
}
|
||||
exports.compareMonth = compareMonth;
|
||||
function compareDay(day1, day2) {
|
||||
if (!(day1 instanceof Date)) {
|
||||
day1 = new Date(day1);
|
||||
}
|
||||
if (!(day2 instanceof Date)) {
|
||||
day2 = new Date(day2);
|
||||
}
|
||||
var compareMonthResult = compareMonth(day1, day2);
|
||||
if (compareMonthResult === 0) {
|
||||
var date1 = day1.getDate();
|
||||
var date2 = day2.getDate();
|
||||
return date1 === date2 ? 0 : date1 > date2 ? 1 : -1;
|
||||
}
|
||||
return compareMonthResult;
|
||||
}
|
||||
exports.compareDay = compareDay;
|
||||
function getDayByOffset(date, offset) {
|
||||
date = new Date(date);
|
||||
date.setDate(date.getDate() + offset);
|
||||
return date;
|
||||
}
|
||||
exports.getDayByOffset = getDayByOffset;
|
||||
function getPrevDay(date) {
|
||||
return getDayByOffset(date, -1);
|
||||
}
|
||||
exports.getPrevDay = getPrevDay;
|
||||
function getNextDay(date) {
|
||||
return getDayByOffset(date, 1);
|
||||
}
|
||||
exports.getNextDay = getNextDay;
|
||||
function calcDateNum(date) {
|
||||
var day1 = new Date(date[0]).getTime();
|
||||
var day2 = new Date(date[1]).getTime();
|
||||
return (day2 - day1) / (1000 * 60 * 60 * 24) + 1;
|
||||
}
|
||||
exports.calcDateNum = calcDateNum;
|
||||
function copyDates(dates) {
|
||||
if (Array.isArray(dates)) {
|
||||
return dates.map(function (date) {
|
||||
if (date === null) {
|
||||
return date;
|
||||
}
|
||||
return new Date(date);
|
||||
});
|
||||
}
|
||||
return new Date(dates);
|
||||
}
|
||||
exports.copyDates = copyDates;
|
||||
function getMonthEndDay(year, month) {
|
||||
return 32 - new Date(year, month - 1, 32).getDate();
|
||||
}
|
||||
exports.getMonthEndDay = getMonthEndDay;
|
||||
function getMonths(minDate, maxDate) {
|
||||
var months = [];
|
||||
var cursor = new Date(minDate);
|
||||
cursor.setDate(1);
|
||||
do {
|
||||
months.push(cursor.getTime());
|
||||
cursor.setMonth(cursor.getMonth() + 1);
|
||||
} while (compareMonth(cursor, maxDate) !== 1);
|
||||
return months;
|
||||
}
|
||||
exports.getMonths = getMonths;
|
||||
@@ -0,0 +1,25 @@
|
||||
/* eslint-disable */
|
||||
function getMonthEndDay(year, month) {
|
||||
return 32 - getDate(year, month - 1, 32).getDate();
|
||||
}
|
||||
|
||||
function compareMonth(date1, date2) {
|
||||
date1 = getDate(date1);
|
||||
date2 = getDate(date2);
|
||||
|
||||
var year1 = date1.getFullYear();
|
||||
var year2 = date2.getFullYear();
|
||||
var month1 = date1.getMonth();
|
||||
var month2 = date2.getMonth();
|
||||
|
||||
if (year1 === year2) {
|
||||
return month1 === month2 ? 0 : month1 > month2 ? 1 : -1;
|
||||
}
|
||||
|
||||
return year1 > year2 ? 1 : -1;
|
||||
}
|
||||
|
||||
module.exports = {
|
||||
getMonthEndDay: getMonthEndDay,
|
||||
compareMonth: compareMonth
|
||||
};
|
||||
Reference in New Issue
Block a user