Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

fix：ts类型修改 #1914

Merged
merged 4 commits into from
Dec 12, 2022
Merged

fix：ts类型修改 #1914

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
d2ffd0a
fix: backtop add ts interface
Dec 12, 2022
4641ac5
fix: ts类型修改
Dec 12, 2022
459b31e
feat: 添加*.d.ts文件
Dec 12, 2022
f4bcda0
Merge branch 'v4' into V4
szg2008 Dec 12, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 0 additions & 1 deletion src/packages/__VUE/backtop/index.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -51,7 +51,6 @@ export default create({
startTime: 0,
keepAlive: false
});
let scrollEl: Window | HTMLElement = window;
const classes = computed(() => {
const prefixCls = componentName;
return {
Expand Down
44 changes: 27 additions & 17 deletions src/packages/__VUE/calendar/demo.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -160,12 +160,10 @@
:title="translate('please')"
>
<template v-slot:day="date">
<span>{{ date.date.day <= 9 ? '0' + date.date.day : date.date.day }}</span>
<span>{{ renderDate(date) }}</span>
</template>
<template v-slot:bottomInfo="date">
<span class="info">{{
date.date ? (date.date.day <= 10 ? '' : date.date.day <= 20 ? translate('mid') : '') : ''
}}</span>
<span class="info">{{ renderBottomDate(date) }}</span>
</template>
</nut-calendar>
</div>
Expand Down Expand Up @@ -200,6 +198,7 @@ import { reactive, toRefs, ref } from 'vue';
import { createComponent } from '@/packages/utils/create';
import Utils from '@/packages/utils/date';
import { useTranslate } from '@/sites/assets/util/useTranslate';
import { CalendarRef, Day } from '../calendaritem/type';

const { createDemo, translate } = createComponent('calendar');
const initTranslate = () =>
Expand Down Expand Up @@ -253,18 +252,11 @@ const initTranslate = () =>
selected: 'selected:'
}
});
interface TestCalendarState {
interface TestCalendarState extends TestCalendarStateVisible {
isVisible: boolean;
date: string;
dateWeek: string;
isVisible1: boolean;
isVisible2: boolean;
isVisible3: boolean;
isVisible4: boolean;
isVisible5: boolean;
isVisible6: boolean;
isVisible7: boolean;
isVisible8: boolean;

date1: string[];
date2: string;
date3: string;
Expand All @@ -274,11 +266,21 @@ interface TestCalendarState {
date7: string[];
date8: string;
}
interface TestCalendarStateVisible {
isVisible1: boolean;
isVisible2: boolean;
isVisible3: boolean;
isVisible4: boolean;
isVisible5: boolean;
isVisible6: boolean;
isVisible7: boolean;
isVisible8: boolean;
}
export default createDemo({
props: {},
setup() {
initTranslate();
const calendarRef = ref(null);
const calendarRef = ref<null | CalendarRef>(null);
const state: TestCalendarState = reactive({
isVisible: false,
date: '2022-02-01',
Expand All @@ -300,11 +302,11 @@ export default createDemo({
isVisible7: false,
isVisible8: false
});
const openSwitch = (param: string) => {
const openSwitch = (param: keyof TestCalendarStateVisible) => {
state[`${param}`] = true;
};

const closeSwitch = (param: string) => {
const closeSwitch = (param: keyof TestCalendarStateVisible) => {
state[`${param}`] = false;
};

Expand Down Expand Up @@ -366,6 +368,12 @@ export default createDemo({
calendarRef.value.scrollToDate('2022-04-01');
}
};
const renderDate = (date: { date: Day }) => {
return date.date.day <= 9 ? '0' + date.date.day : date.date.day;
};
const renderBottomDate = (date: { date: Day }) => {
return date.date ? (date.date.day <= 10 ? '' : date.date.day <= 20 ? translate('mid') : '') : '';
};
return {
...toRefs(state),
openSwitch,
Expand All @@ -384,7 +392,9 @@ export default createDemo({
goDate,
calendarRef,
select,
translate
translate,
renderDate,
renderBottomDate
};
}
});
Expand Down
3 changes: 2 additions & 1 deletion src/packages/__VUE/calendar/index.taro.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -90,6 +90,7 @@ import Popup from '../popup/index.taro.vue';
import Utils from '@/packages/utils/date';
import { useExpose } from '@/packages/utils/useExpose/index';
import Taro from '@tarojs/taro';
import { CalendarRef } from '../calendaritem/type';

export default create({
components: {
Expand Down Expand Up @@ -182,7 +183,7 @@ export default create({
});
let show = ref(props.visible);
// element refs
const calendarRef = ref<null | HTMLElement>(null);
const calendarRef = ref<null | CalendarRef>(null);
const scrollToDate = (date: string) => {
calendarRef.value?.scrollToDate(date);
};
Expand Down
6 changes: 3 additions & 3 deletions src/packages/__VUE/calendar/index.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -86,15 +86,15 @@
</nut-calendar-item>
</template>
<script lang="ts">
import { PropType, ref, computed } from 'vue';
import { ref, computed } from 'vue';
import { createComponent } from '@/packages/utils/create';
const { create } = createComponent('calendar');
import CalendarItem from '../calendaritem/index.vue';
import Popup from '../popup/index.vue';
import Utils from '@/packages/utils/date';
import { useExpose } from '@/packages/utils/useExpose/index';
import { CalendarRef } from '../calendaritem/type';

type InputDate = string | string[];
export default create({
components: {
[CalendarItem.name]: CalendarItem,
Expand Down Expand Up @@ -181,7 +181,7 @@ export default create({
return slots.bottomInfo;
});
// element refs
const calendarRef = ref<null | HTMLElement>(null);
const calendarRef = ref<null | CalendarRef>(null);
const scrollToDate = (date: string) => {
calendarRef.value?.scrollToDate(date);
};
Expand Down
91 changes: 36 additions & 55 deletions src/packages/__VUE/calendaritem/index.taro.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -75,8 +75,9 @@ import Taro from '@tarojs/taro';
import Utils from '@/packages/utils/date';
import { useExpose } from '@/packages/utils/useExpose/index';
import requestAniFrame from '@/packages/utils/raf';
import { MonthInfo, Day } from './type';
import { MonthInfo, Day, DateInfo } from './type';
import NutScrollView from '../scrollView/index.taro.vue';
import { isArray } from '@/packages/utils/util';
const TARO_ENV = Taro.getEnv();

export default create({
Expand Down Expand Up @@ -130,7 +131,8 @@ export default create({
},
defaultValue: {
type: [String, Array],
default: null
default: null,
valid: (value: string | string[]) => value
},
startDate: {
type: String,
Expand Down Expand Up @@ -166,7 +168,7 @@ export default create({
return slots.bottomInfo;
});
// state
const state: import('./type').CalendarState = reactive({
const state: import('./type').CalendarTaroState = reactive({
yearMonthTitle: '',
defaultRange: [0, 1],
compConthsDatas: [],
Expand Down Expand Up @@ -212,8 +214,8 @@ export default create({
return Utils.isEqual(state.currDate[1], currDate);
};
const isMultiple = (currDate: string) => {
if (state.currDate.length > 0) {
return state.currDate.some((item: any) => {
if (isArray(state.currDate) && state.currDate.length > 0) {
return state.currDate.some((item: string) => {
return Utils.isEqual(item, currDate);
});
} else {
Expand Down Expand Up @@ -277,17 +279,17 @@ export default create({
days[3] = `${days[0]}-${days[1]}-${days[2]}`;
days[4] = Utils.getWhatDay(+days[0], +days[1], +days[2]);
if (type == 'multiple') {
if (state.currDate.length > 0) {
let hasIndex: any = '';
state.currDate.forEach((item: any, index: number) => {
if (isArray(state.currDate) && state.currDate.length > 0) {
let hasIndex = NaN;
state.currDate.forEach((item: string, index: number) => {
if (item == days[3]) {
hasIndex = index;
}
});
if (isFirst) {
state.chooseData.push([...days]);
} else {
if (hasIndex !== '') {
if (!isNaN(hasIndex)) {
state.currDate.splice(hasIndex, 1);
state.chooseData.splice(hasIndex, 1);
} else {
Expand Down Expand Up @@ -350,11 +352,11 @@ export default create({
month = month == 12 ? 1 : ++month;
break;
}
return [year, Utils.getNumTwoBit(month), Utils.getMonthDays(String(year), String(month))];
return [year + '', Utils.getNumTwoBit(month), Utils.getMonthDays(String(year), String(month)) + ''];
};

// 获取日期状态
const getDaysStatus = (days: number, type: string, dateInfo: any) => {
const getDaysStatus = (days: number, type: string, dateInfo: { year: string; month: string }) => {
// 修复：当某个月的1号是周日时，月份下方会空出来一行
let { year, month } = dateInfo;
if (type == 'prev' && days >= 7) {
Expand All @@ -370,7 +372,13 @@ export default create({
});
};
// 获取上一个月的最后一周天数，填充当月空白
const getPreDaysStatus = (days: number, type: string, dateInfo: any, preCurrMonthDays: number) => {
const getPreDaysStatus = (
days: number,
type: string,
dateInfo: { year: number; month: number },
preCurrMonthDays: number
) => {
// 新增：自定义周起始日}, preCurrMonthDays: number) => {
// 新增：自定义周起始日
days = days - props.firstDayOfWeek;
// 修复：当某个月的1号是周日时，月份下方会空出来一行
Expand All @@ -389,12 +397,12 @@ export default create({
return months.slice(preCurrMonthDays - days);
};
// 获取月数据
const getMonth = (curData: any[], type: string) => {
const getMonth = (curData: string[], type: string) => {
// 一号为周几
const preMonthDays = Utils.getMonthPreDay(+curData[0], +curData[1]);

let preMonth = curData[1] - 1;
let preYear = curData[0];
let preMonth = +curData[1] - 1;
let preYear = +curData[0];
if (preMonth <= 0) {
preMonth = 12;
preYear += 1;
Expand All @@ -413,7 +421,9 @@ export default create({
monthData: [
...(getPreDaysStatus(preMonthDays, 'prev', { month: preMonth, year: preYear }, preCurrMonthDays) as Day[]),
...(getDaysStatus(currMonthDays, 'curr', title) as Day[])
]
],
cssHeight: 0,
cssScrollHeight: 0
};
let titleHeight, itemHeight;
if (TARO_ENV === Taro.ENV_TYPE.WEB) {
Expand Down Expand Up @@ -472,7 +482,8 @@ export default create({

// 根据是否存在默认时间，初始化当前日期,
if (props.defaultValue || (Array.isArray(props.defaultValue) && props.defaultValue.length > 0)) {
state.currDate = props.type != 'one' ? [...props.defaultValue] : props.defaultValue;
state.currDate =
props.type != 'one' ? ([...props.defaultValue] as string[]) : (props.defaultValue as string | string[]);
}
// 判断时间范围内存在多少个月
const startDate = {
Expand Down Expand Up @@ -513,6 +524,7 @@ export default create({
} else if (props.type == 'multiple' && Array.isArray(state.currDate)) {
if (state.currDate.length > 0) {
let defaultArr: string[] = [];
// eslint-disable-next-line @typescript-eslint/no-explicit-any
let obj: any = {};
state.currDate.forEach((item: string) => {
if (
Expand Down Expand Up @@ -565,7 +577,7 @@ export default create({
chooseDay({ day: state.defaultData[2], type: 'curr' }, state.monthsData[state.currentIndex], true);
chooseDay({ day: state.defaultData[5], type: 'curr' }, state.monthsData[lastCurrent], true);
} else if (props.type == 'multiple') {
[...state.currDate].forEach((item: any) => {
[...state.currDate].forEach((item: string) => {
let dateArr = splitDate(item);
let current = state.currentIndex;
state.monthsData.forEach((item, index) => {
Expand Down Expand Up @@ -656,7 +668,7 @@ export default create({
scrollToDate
});
const setDefaultRange = (monthsNum: number, current: number) => {
let rangeArr: any[] = [];
let rangeArr: number[] = [];
if (monthsNum >= 3) {
if (current > 0 && current < monthsNum) {
rangeArr = [current - 1, current + 3];
Expand Down Expand Up @@ -700,11 +712,14 @@ export default create({
}
};
// 是否有是当前日期
const isCurrDay = (dateInfo: any) => {
const date = `${dateInfo.year}-${dateInfo.month}-${dateInfo.day < 10 ? '0' + dateInfo.day : dateInfo.day}`;
const isCurrDay = (dateInfo: DateInfo) => {
const date = `${dateInfo.year}-${dateInfo.month}-${
Number(dateInfo.day) < 10 ? '0' + dateInfo.day : dateInfo.day
}`;
return Utils.isEqual(date, Utils.date2Str(new Date()));
};

// eslint-disable-next-line @typescript-eslint/no-explicit-any
const mothsViewScroll = (e: any) => {
if (state.monthsData.length <= 1) {
return;
Expand All @@ -723,39 +738,6 @@ export default create({
current -= 1;
}
}
// else {
// if (!viewHeight.value || viewHeight.value < 0) {
// if (TARO_ENV === Taro.ENV_TYPE.ALIPAY) {
// if (months.value) {
// viewHeight.value = months.value.clientHeight;
// }
// } else {
// Taro.createSelectorQuery()
// .select('.nut-calendar-content')
// .boundingClientRect((res) => {
// viewHeight.value = res.height;
// })
// .exec();
// }
// }
// const viewPosition = Math.round(currentScrollTop + viewHeight.value);
// if (
// viewPosition < state.monthsData[current].cssScrollHeight + state.monthsData[current].cssHeight &&
// currentScrollTop < state.monthsData[current].cssScrollHeight
// ) {
// current -= 1;
// }
// if (
// current + 1 <= state.monthsNum &&
// viewPosition >= state.monthsData[current + 1].cssScrollHeight + state.monthsData[current + 1].cssHeight
// ) {
// current += 1;
// }
// if (current >= 1 && currentScrollTop < state.monthsData[current - 1].cssScrollHeight) {
// current -= 1;
// }
// }

if (state.currentIndex !== current) {
state.currentIndex = current;
setDefaultRange(state.monthsNum, current);
Expand All @@ -781,7 +763,6 @@ export default create({
}
scale = Number((screenWidth / 750).toFixed(toFixed));
scalePx.value = scale;
let transfromNum = Taro.pxTransform(64);
initData();
}
});
Expand Down
8 changes: 8 additions & 0 deletions src/packages/__VUE/calendaritem/type.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -33,6 +33,11 @@ export interface CalendarState {
monthsNum: number;
defaultRange: number[];
}
export interface CalendarTaroState extends CalendarState {
compConthsDatas: MonthInfo[];
scrollTop: number;
containerHeight: string;
}
export interface Day {
day: string | number;
type: string;
Expand Down Expand Up @@ -62,3 +67,6 @@ export interface MonthInfo {
cssHeight: number;
cssScrollHeight: number;
}
export interface CalendarRef extends HTMLElement {
scrollToDate: (date: string) => void;
}
Loading