初始化项目, 添加TDesign等包
This commit is contained in:
zhengw
@@ -0,0 +1 @@
|
||||
<wxs src="../common/utils.wxs" module="_"/><template name="calendar-header"><view class="{{tClass}} {{classPrefix}} {{switchMode !== 'none' ? classPrefix + '__with-action' : ''}}" id="{{tId}}"><view class="{{classPrefix}}__action" wx:if="{{switchMode !== 'none'}}"><view wx:if="{{switchMode === 'year-month'}}" class="{{_.cls(classPrefix + '__icon', [['disabled', preYearBtnDisable]])}}" data-disabled="{{preYearBtnDisable}}" data-type="pre-year" bindtap="handleSwitchModeChange"><t-icon name="chevron-left-double"/></view><view class="{{_.cls(classPrefix + '__icon', [['disabled', prevMonthBtnDisable]])}}" data-disabled="{{prevMonthBtnDisable}}" data-type="pre-month" bindtap="handleSwitchModeChange"><t-icon name="chevron-left"/></view></view><view class="{{classPrefix}}__title">{{ title }}</view><view class="{{classPrefix}}__action" wx:if="{{switchMode !== 'none'}}"><view class="{{_.cls(classPrefix + '__icon', [['disabled', nextMonthBtnDisable]])}}" data-disabled="{{nextMonthBtnDisable}}" data-type="next-month" bindtap="handleSwitchModeChange"><t-icon name="chevron-right"/></view><view wx:if="{{switchMode === 'year-month'}}" class="{{_.cls(classPrefix + '__icon', [['disabled', nextYearBtnDisable]])}}" data-disabled="{{nextYearBtnDisable}}" data-type="next-year" bindtap="handleSwitchModeChange"><t-icon name="chevron-right-double"/></view></view></view></template>
|
||||
64
miniprogram/miniprogram_npm/tdesign-miniprogram/calendar/calendar.d.ts
vendored
Normal file
64
miniprogram/miniprogram_npm/tdesign-miniprogram/calendar/calendar.d.ts
vendored
Normal file
@@ -0,0 +1,64 @@
|
||||
/// <reference types="miniprogram-api-typings" />
|
||||
import { SuperComponent } from '../common/src/index';
|
||||
import { TdCalendarProps } from './type';
|
||||
export interface CalendarProps extends TdCalendarProps {
|
||||
}
|
||||
export default class Calendar extends SuperComponent {
|
||||
behaviors: string[];
|
||||
externalClasses: string[];
|
||||
options: WechatMiniprogram.Component.ComponentOptions;
|
||||
properties: TdCalendarProps;
|
||||
data: {
|
||||
prefix: string;
|
||||
classPrefix: string;
|
||||
months: any[];
|
||||
scrollIntoView: string;
|
||||
innerConfirmBtn: {};
|
||||
realLocalText: {};
|
||||
currentMonth: {};
|
||||
actionButtons: {
|
||||
preYearBtnDisable: boolean;
|
||||
prevMonthBtnDisable: boolean;
|
||||
nextMonthBtnDisable: boolean;
|
||||
nextYearBtnDisable: boolean;
|
||||
};
|
||||
};
|
||||
controlledProps: {
|
||||
key: string;
|
||||
event: string;
|
||||
}[];
|
||||
lifetimes: {
|
||||
created(): void;
|
||||
ready(): void;
|
||||
};
|
||||
observers: {
|
||||
type(v: any): void;
|
||||
allowSameDay(v: any): void;
|
||||
confirmBtn(v: any): void;
|
||||
'firstDayOfWeek,minDate,maxDate'(firstDayOfWeek: any, minDate: any, maxDate: any): void;
|
||||
value(v: any): void;
|
||||
visible(v: any): void;
|
||||
format(v: any): void;
|
||||
};
|
||||
methods: {
|
||||
initialValue(): void;
|
||||
scrollIntoView(): void;
|
||||
getCurrentYearAndMonth(v: Date): {
|
||||
year: number;
|
||||
month: number;
|
||||
};
|
||||
updateActionButton(value: Date): void;
|
||||
updateCurrentMonth(newValue?: any): void;
|
||||
calcCurrentMonth(newValue?: any): void;
|
||||
calcMonths(): void;
|
||||
close(trigger: any): void;
|
||||
onVisibleChange(): void;
|
||||
handleClose(): void;
|
||||
handleSelect(e: any): void;
|
||||
onTplButtonTap(): void;
|
||||
toTime(val: any): any;
|
||||
onScroll(e: any): void;
|
||||
getCurrentDate(): any;
|
||||
handleSwitchModeChange(e: any): void;
|
||||
};
|
||||
}
|
||||
File diff suppressed because one or more lines are too long
@@ -0,0 +1 @@
|
||||
{"component":true,"styleIsolation":"apply-shared","usingComponents":{"t-popup":"../popup/popup","t-button":"../button/button","t-icon":"../icon/icon"}}
|
||||
@@ -0,0 +1 @@
|
||||
<wxs src="./calendar.wxs" module="_this"/><wxs src="../common/utils.wxs" module="_"/><t-popup wx:if="{{usePopup}}" class="class" visible="{{visible}}" usingCustomNavbar="{{usingCustomNavbar}}" bind:visible-change="onVisibleChange" placement="bottom"><include src="./template.wxml"/></t-popup><block wx:else><include src="./template.wxml"/></block>
|
||||
@@ -0,0 +1,44 @@
|
||||
function getDateLabel(monthItem, dateItem) {
|
||||
var weekdayText = ['日', '一', '二', '三', '四', '五', '六'];
|
||||
var weekday = (monthItem.weekdayOfFirstDay + dateItem.day - 1) % 7;
|
||||
var label = monthItem.month + 1 + '月' + dateItem.day + '日, 星期' + weekdayText[weekday];
|
||||
if (dateItem.type === 'start') {
|
||||
label = '开始日期：' + label;
|
||||
}
|
||||
if (dateItem.type === 'end') {
|
||||
label = '结束日期：' + label;
|
||||
}
|
||||
if (isDateSelected(dateItem)) {
|
||||
label = '已选中, ' + label;
|
||||
}
|
||||
if (dateItem.prefix) {
|
||||
label += ', ' + dateItem.prefix;
|
||||
}
|
||||
if (dateItem.suffix) {
|
||||
label += ', ' + dateItem.suffix;
|
||||
}
|
||||
return label;
|
||||
}
|
||||
|
||||
function isDateSelected(dateItem) {
|
||||
return ['start', 'end', 'selected', 'centre'].indexOf(dateItem.type) >= 0;
|
||||
}
|
||||
|
||||
function getMonthTitle(year, month, pattern = '') {
|
||||
// prettier-ignore
|
||||
var REGEXP = getRegExp('\{year\}|\{month\}', 'g');
|
||||
|
||||
return pattern.replace(REGEXP, function (match) {
|
||||
var replacements = {
|
||||
'{year}': year,
|
||||
'{month}': month < 10 ? '0' + month : month,
|
||||
};
|
||||
return replacements[match] || match;
|
||||
});
|
||||
}
|
||||
|
||||
module.exports = {
|
||||
getDateLabel: getDateLabel,
|
||||
isDateSelected: isDateSelected,
|
||||
getMonthTitle: getMonthTitle,
|
||||
};
|
||||
@@ -0,0 +1,39 @@
|
||||
@import '../common/style/index.wxss';.t-calendar{width:inherit;position:relative;z-index:9999;background:var(--td-calendar-bg-color,var(--td-bg-color-container,var(--td-font-white-1,#fff)));overflow-x:hidden;}
|
||||
.t-calendar--popup{border-top-left-radius:var(--td-calendar-radius,24rpx);border-top-right-radius:var(--td-calendar-radius,24rpx);}
|
||||
.t-calendar__title{display:flex;align-items:center;justify-content:center;font-size:var(--td-calendar-title-font-size,18px);font-weight:600;color:var(--td-calendar-title-color,var(--td-text-color-primary,var(--td-font-gray-1,rgba(0,0,0,.9))));height:52rpx;padding:32rpx;}
|
||||
.t-calendar__title:focus{outline:0;}
|
||||
.t-calendar__close-btn{position:absolute;top:32rpx;right:32rpx;margin:-24rpx;padding:24rpx;color:var(--td-calendar-title-color,var(--td-text-color-primary,var(--td-font-gray-1,rgba(0,0,0,.9))));}
|
||||
.t-calendar__days{display:grid;grid-template-columns:repeat(7,1fr);grid-column-gap:8rpx;padding:0 32rpx;text-align:center;line-height:92rpx;}
|
||||
.t-calendar__days-item{height:92rpx;font-size:28rpx;color:var(--td-calendar-days-color,var(--td-text-color-secondary,var(--td-font-gray-2,rgba(0,0,0,.6))));}
|
||||
.t-calendar__content{min-height:400rpx;display:flex;flex-direction:column;}
|
||||
.t-calendar__month{font-size:28rpx;color:var(--td-calendar-title-color,var(--td-text-color-primary,var(--td-font-gray-1,rgba(0,0,0,.9))));font-weight:600;padding:32rpx 0 0;}
|
||||
.t-calendar__months{height:712rpx;padding:0 32rpx 32rpx;box-sizing:border-box;}
|
||||
.t-calendar__months::-webkit-scrollbar{display:none;}
|
||||
.t-calendar__dates{flex:1;display:grid;grid-template-columns:repeat(7,1fr);grid-column-gap:8rpx;}
|
||||
.t-calendar__dates-item{position:relative;display:flex;align-items:center;justify-content:center;font-size:32rpx;border-radius:var(--td-calendar-selected-border-radius,var(--td-radius-default,12rpx));height:120rpx;line-height:48rpx;font-weight:600;margin-top:16rpx;color:var(--td-calendar-title-color,var(--td-text-color-primary,var(--td-font-gray-1,rgba(0,0,0,.9))));cursor:pointer;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;}
|
||||
.t-calendar__dates-item-prefix,.t-calendar__dates-item-suffix{position:absolute;font-size:20rpx;line-height:32rpx;width:100%;text-align:center;font-weight:400;}
|
||||
.t-calendar__dates-item-prefix{top:8rpx;}
|
||||
.t-calendar__dates-item-suffix{bottom:8rpx;color:var(--td-calendar-item-suffix-color,var(--td-text-color-placeholder,var(--td-font-gray-3,rgba(0,0,0,.4))));}
|
||||
.t-calendar__dates-item-suffix--end,.t-calendar__dates-item-suffix--selected,.t-calendar__dates-item-suffix--start{color:var(--td-calendar-selected-color,var(--td-text-color-anti,var(--td-font-white-1,#fff)));}
|
||||
.t-calendar__dates-item-suffix--disabled{color:var(--td-calendar-item-disabled-color,var(--td-text-color-disabled,var(--td-font-gray-4,rgba(0,0,0,.26))));}
|
||||
.t-calendar__dates-item--end,.t-calendar__dates-item--selected,.t-calendar__dates-item--start,.t-calendar__dates-item--start-end{background:var(--td-calendar-active-color,var(--td-brand-color,var(--td-primary-color-7,#0052d9)));color:var(--td-calendar-selected-color,var(--td-text-color-anti,var(--td-font-white-1,#fff)));border-radius:var(--td-calendar-selected-border-radius,var(--td-radius-default,12rpx));}
|
||||
.t-calendar__dates-item--start{border-radius:var(--td-calendar-selected-border-radius,var(--td-radius-default,12rpx)) 0 0 var(--td-calendar-selected-border-radius,var(--td-radius-default,12rpx));}
|
||||
.t-calendar__dates-item--end{border-radius:0 var(--td-calendar-selected-border-radius,var(--td-radius-default,12rpx)) var(--td-calendar-selected-border-radius,var(--td-radius-default,12rpx)) 0;}
|
||||
.t-calendar__dates-item--start+.t-calendar__dates-item--end::before{content:'';display:block;position:absolute;top:0;width:8rpx;height:100%;background:var(--td-calendar-active-color,var(--td-brand-color,var(--td-primary-color-7,#0052d9)));}
|
||||
.t-calendar__dates-item--start+.t-calendar__dates-item--end:before{left:-8rpx;}
|
||||
.t-calendar__dates-item--centre{border-radius:0;background-color:var(--td-calendar-item-centre-color,var(--td-brand-color-light,var(--td-primary-color-1,#f2f3ff)));}
|
||||
.t-calendar__dates-item--centre::after,.t-calendar__dates-item--centre::before{content:'';display:block;position:absolute;top:0;width:8rpx;height:100%;background-color:var(--td-calendar-item-centre-color,var(--td-brand-color-light,var(--td-primary-color-1,#f2f3ff)));}
|
||||
.t-calendar__dates-item--centre:before{left:-8rpx;}
|
||||
.t-calendar__dates-item--centre:after{right:-8rpx;}
|
||||
.t-calendar__dates-item--disabled{color:var(--td-calendar-item-disabled-color,var(--td-text-color-disabled,var(--td-font-gray-4,rgba(0,0,0,.26))));cursor:default;}
|
||||
.t-calendar__footer{padding:32rpx;}
|
||||
.t-calendar-switch-mode--none>.t-calendar__months{height:60vh;}
|
||||
.t-calendar-header{display:flex;justify-content:space-between;align-items:center;line-height:44rpx;}
|
||||
.t-calendar-header__with-action{padding:0rpx 32rpx 16rpx 32rpx;box-sizing:border-box;position:relative;}
|
||||
.t-calendar-header__with-action::after{content:'';display:block;position:absolute;top:unset;bottom:0;left:unset;right:unset;background-color:var(--td-border-color,var(--td-gray-color-3,#e7e7e7));}
|
||||
.t-calendar-header__with-action::after{height:1px;left:0;right:0;transform:scaleY(.5);}
|
||||
.t-calendar-header__with-action .t-calendar-header__title{flex:1;text-align:center;font-size:28rpx;font-weight:600;}
|
||||
.t-calendar-header__action{display:flex;font-size:40rpx;color:var(--td-calendar-switch-mode-icon-color,var(--td-text-color-secondary,var(--td-font-gray-2,rgba(0,0,0,.6))));}
|
||||
.t-calendar-header__icon{padding:16rpx;}
|
||||
.t-calendar-header__icon--disabled{color:var(--td-calendar-switch-mode-icon-disabled-color,var(--td-text-color-disabled,var(--td-font-gray-4,rgba(0,0,0,.26))));}
|
||||
.t-calendar-header__title{text-align:left;}
|
||||
2
miniprogram/miniprogram_npm/tdesign-miniprogram/calendar/index.d.ts
vendored
Normal file
2
miniprogram/miniprogram_npm/tdesign-miniprogram/calendar/index.d.ts
vendored
Normal file
@@ -0,0 +1,2 @@
|
||||
export * from './type';
|
||||
export * from './calendar';
|
||||
@@ -0,0 +1 @@
|
||||
export*from"./type";export*from"./calendar";
|
||||
3
miniprogram/miniprogram_npm/tdesign-miniprogram/calendar/props.d.ts
vendored
Normal file
3
miniprogram/miniprogram_npm/tdesign-miniprogram/calendar/props.d.ts
vendored
Normal file
@@ -0,0 +1,3 @@
|
||||
import { TdCalendarProps } from './type';
|
||||
declare const props: TdCalendarProps;
|
||||
export default props;
|
||||
@@ -0,0 +1 @@
|
||||
const props={allowSameDay:{type:Boolean,value:!1},autoClose:{type:Boolean,value:!0},confirmBtn:{type:null,value:""},firstDayOfWeek:{type:Number,value:0},format:{type:null},localeText:{type:Object},maxDate:{type:Number},minDate:{type:Number},readonly:{type:Boolean},switchMode:{type:String,value:"none"},title:{type:String},type:{type:String,value:"single"},usePopup:{type:Boolean,value:!0},usingCustomNavbar:{type:Boolean,value:!1},value:{type:null,value:null},defaultValue:{type:null},visible:{type:Boolean,value:!1}};export default props;
|
||||
@@ -0,0 +1 @@
|
||||
<wxs src="./calendar.wxs" module="_this"/><wxs src="../common/utils.wxs" module="_"/><import src="../common/template/button.wxml"/><import src="./calendar-header.wxml"/><view class="{{_.cls(classPrefix, [['popup', usePopup]])}} {{classPrefix}}-switch-mode--{{switchMode}} class {{prefix}}-class" style="{{_._style([style, customStyle])}}"><view class="{{classPrefix}}__title" tabindex="0"><slot name="title"/><text wx:if="{{title || realLocalText.title}}">{{ title || realLocalText.title }}</text></view><t-icon wx:if="{{usePopup}}" name="close" class="{{classPrefix}}__close-btn" size="48rpx" aria-role="button" aria-label="关闭" bind:tap="handleClose"/><template wx:if="{{switchMode !== 'none'}}" is="calendar-header" data="{{ classPrefix: classPrefix + '-header', switchMode, ...actionButtons, title: _this.getMonthTitle(currentMonth[0].year, realLocalText.months[currentMonth[0].month], realLocalText.monthTitle)}}"/><view aria-hidden class="{{classPrefix}}__days"><view wx:for="{{days}}" wx:key="index" class="{{classPrefix}}__days-item">{{ item }}</view></view><scroll-view class="{{classPrefix}}__months" scroll-into-view="{{scrollIntoView}}" scroll-y enhanced show-scrollbar="{{false}}" bindscroll="onScroll"><block wx:for="{{ switchMode === 'none' ? months : currentMonth}}" wx:key="index"><template wx:if="{{switchMode === 'none'}}" is="calendar-header" data="{{tClass: classPrefix + '__month', classPrefix: classPrefix + '-header', tId: 'year_' + item.year + '_month_' + item.month, switchMode, ...actionButtons, title: _this.getMonthTitle(item.year, realLocalText.months[item.month], realLocalText.monthTitle) }}"/><view class="{{classPrefix}}__dates"><view wx:for="{{(item.weekdayOfFirstDay - firstDayOfWeek + 7) % 7}}" wx:key="index"/><block wx:for="{{item.months}}" wx:for-index="dateIndex" wx:for-item="dateItem" wx:key="dateIndex"><view class="{{classPrefix}}__dates-item {{dateItem.className}} {{classPrefix}}__dates-item--{{dateItem.type}}" data-year="{{item.year}}" data-month="{{item.month}}" data-date="{{dateItem}}" aria-role="button" aria-label="{{_this.getDateLabel(item, dateItem)}}" aria-disabled="{{dateItem.type === 'disabled'}}" bind:tap="handleSelect"><view wx:if="{{dateItem.prefix}}" class="{{classPrefix}}__dates-item-prefix">{{ dateItem.prefix }}</view>{{ dateItem.day }}<view wx:if="{{dateItem.suffix}}" class="{{classPrefix}}__dates-item-suffix {{classPrefix}}__dates-item-suffix--{{dateItem.type}}">{{ dateItem.suffix }}</view></view></block></view></block></scroll-view><view wx:if="{{innerConfirmBtn != null && usePopup}}" class="{{classPrefix}}__footer"><slot wx:if="{{innerConfirmBtn === 'slot'}}" name="confirm-btn"/><block wx:elif="{{innerConfirmBtn}}"><template is="button" data="{{ block: true, theme: 'primary', rootClass: 't-calendar__confirm-btn', content: realLocalText.confirm, ...innerConfirmBtn }}"/></block></view></view>
|
||||
88
miniprogram/miniprogram_npm/tdesign-miniprogram/calendar/type.d.ts
vendored
Normal file
88
miniprogram/miniprogram_npm/tdesign-miniprogram/calendar/type.d.ts
vendored
Normal file
@@ -0,0 +1,88 @@
|
||||
import { ButtonProps } from '../button/index';
|
||||
export interface TdCalendarProps {
|
||||
allowSameDay?: {
|
||||
type: BooleanConstructor;
|
||||
value?: boolean;
|
||||
};
|
||||
autoClose?: {
|
||||
type: BooleanConstructor;
|
||||
value?: boolean;
|
||||
};
|
||||
confirmBtn?: {
|
||||
type: null;
|
||||
value?: string | ButtonProps | null;
|
||||
};
|
||||
firstDayOfWeek?: {
|
||||
type: NumberConstructor;
|
||||
value?: number;
|
||||
};
|
||||
format?: {
|
||||
type: undefined;
|
||||
value?: CalendarFormatType;
|
||||
};
|
||||
localeText?: {
|
||||
type: ObjectConstructor;
|
||||
value?: CalendarLocaleText;
|
||||
};
|
||||
maxDate?: {
|
||||
type: NumberConstructor;
|
||||
value?: number;
|
||||
};
|
||||
minDate?: {
|
||||
type: NumberConstructor;
|
||||
value?: number;
|
||||
};
|
||||
readonly?: {
|
||||
type: BooleanConstructor;
|
||||
value?: boolean;
|
||||
};
|
||||
switchMode?: {
|
||||
type: StringConstructor;
|
||||
value?: 'none' | 'month' | 'year-month';
|
||||
};
|
||||
title?: {
|
||||
type: StringConstructor;
|
||||
value?: string;
|
||||
};
|
||||
type?: {
|
||||
type: StringConstructor;
|
||||
value?: 'single' | 'multiple' | 'range';
|
||||
};
|
||||
usePopup?: {
|
||||
type: BooleanConstructor;
|
||||
value?: boolean;
|
||||
};
|
||||
usingCustomNavbar?: {
|
||||
type: BooleanConstructor;
|
||||
value?: boolean;
|
||||
};
|
||||
value?: {
|
||||
type: null;
|
||||
value?: number | number[];
|
||||
};
|
||||
defaultValue?: {
|
||||
type: null;
|
||||
value?: number | number[];
|
||||
};
|
||||
visible?: {
|
||||
type: BooleanConstructor;
|
||||
value?: boolean;
|
||||
};
|
||||
}
|
||||
export declare type CalendarFormatType = (day: TDate) => TDate;
|
||||
export declare type TDateType = 'selected' | 'disabled' | 'start' | 'centre' | 'end' | '';
|
||||
export interface TDate {
|
||||
date: Date;
|
||||
day: number;
|
||||
type: TDateType;
|
||||
className?: string;
|
||||
prefix?: string;
|
||||
suffix?: string;
|
||||
}
|
||||
export interface CalendarLocaleText {
|
||||
title?: string;
|
||||
weekdays?: string[];
|
||||
monthTitle?: string;
|
||||
months?: string[];
|
||||
confirm?: string;
|
||||
}
|
||||
@@ -0,0 +1 @@
|
||||
export{};
|
||||
6
miniprogram/miniprogram_npm/tdesign-miniprogram/calendar/utils.d.ts
vendored
Normal file
6
miniprogram/miniprogram_npm/tdesign-miniprogram/calendar/utils.d.ts
vendored
Normal file
@@ -0,0 +1,6 @@
|
||||
export declare function getMonthByOffset(date: Date, offset: number): Date;
|
||||
export declare function getYearByOffset(date: Date, offset: number): Date;
|
||||
export declare const getPrevMonth: (date: Date) => Date;
|
||||
export declare const getNextMonth: (date: Date) => Date;
|
||||
export declare const getPrevYear: (date: Date) => Date;
|
||||
export declare const getNextYear: (date: Date) => Date;
|
||||
@@ -0,0 +1 @@
|
||||
export function getMonthByOffset(t,e){const n=new Date(t);return n.setMonth(n.getMonth()+e),n}export function getYearByOffset(t,e){const n=new Date(t);return n.setFullYear(n.getFullYear()+e),n}export const getPrevMonth=t=>getMonthByOffset(t,-1);export const getNextMonth=t=>getMonthByOffset(t,1);export const getPrevYear=t=>getYearByOffset(t,-1);export const getNextYear=t=>getYearByOffset(t,1);
|
||||
Reference in New Issue
Block a user