diff --git a/examples/views/date-picker/DatePickerTest.vue b/examples/views/date-picker/DatePickerTest.vue index 63b8a75f..cf9e9e6d 100644 --- a/examples/views/date-picker/DatePickerTest.vue +++ b/examples/views/date-picker/DatePickerTest.vue @@ -1,6 +1,14 @@ @@ -8,4 +16,11 @@ import { ref } from 'vue' const val1 = ref('') +const val2 = ref('') +const val3 = ref('') +const val4 = ref('') +const val5 = ref('') +const val6 = ref('') +const val7 = ref('') +const val8 = ref('') diff --git a/package.json b/package.json index 8c6db3e2..aa5fcfd8 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "vxe-pc-ui", - "version": "4.3.57", + "version": "4.3.58", "description": "A vue based PC component library", "scripts": { "update": "npm install --legacy-peer-deps", diff --git a/packages/date-picker/src/date-picker.ts b/packages/date-picker/src/date-picker.ts index 2cba7fd3..983b9f13 100644 --- a/packages/date-picker/src/date-picker.ts +++ b/packages/date-picker/src/date-picker.ts @@ -738,15 +738,19 @@ export default defineComponent({ } if (XEUtils.isValidDate(dValue)) { dLabel = XEUtils.toDateString(dValue, dateLabelFormat, { firstDay: firstDayOfWeek }) - // 由于年份和第几周是冲突的行为,所以需要特殊处理,判断是否跨年 + // 周选择器,由于年份和第几周是冲突的行为,所以需要特殊处理,判断是否跨年,例如 + // '2024-12-31' 'yyyy-MM-dd W' >> '2024-12-31 1' + // '2025-01-01' 'yyyy-MM-dd W' >> '2025-01-01 1' if (dateLabelFormat && type === 'week') { - const firstWeekDate = XEUtils.getWhatWeek(dValue, 0, firstDayOfWeek, firstDayOfWeek) - if (firstWeekDate.getFullYear() < dValue.getFullYear()) { + const weekNum = XEUtils.getYearWeek(dValue, firstDayOfWeek) + const weekDate = XEUtils.getWhatWeek(dValue, 0, weekNum === 1 ? ((6 + firstDayOfWeek) % 7) as VxeDatePickerPropTypes.StartDay : firstDayOfWeek, firstDayOfWeek) + const weekFullYear = weekDate.getFullYear() + if (weekFullYear !== dValue.getFullYear()) { const yyIndex = dateLabelFormat.indexOf('yyyy') if (yyIndex > -1) { const yyNum = Number(dLabel.substring(yyIndex, yyIndex + 4)) if (yyNum && !isNaN(yyNum)) { - dLabel = dLabel.replace(`${yyNum}`, `${yyNum - 1}`) + dLabel = dLabel.replace(`${yyNum}`, `${weekFullYear}`) } } } @@ -786,7 +790,10 @@ export default defineComponent({ } const dateCheckMonth = (date: Date) => { - const month = XEUtils.getWhatMonth(date, 0, 'first') + const firstDayOfWeek = computeFirstDayOfWeek.value + const weekNum = XEUtils.getYearWeek(date, firstDayOfWeek) + const weekStartDate = XEUtils.getWhatWeek(date, 0, firstDayOfWeek, firstDayOfWeek) + const month = XEUtils.getWhatMonth(weekNum === 1 ? XEUtils.getWhatDay(weekStartDate, 6) : date, 0, 'first') if (!XEUtils.isEqual(month, reactData.selectMonth)) { reactData.selectMonth = month } @@ -930,7 +937,11 @@ export default defineComponent({ // 日期 const dateMonthHandle = (date: Date, offsetMonth: number) => { - reactData.selectMonth = XEUtils.getWhatMonth(date, offsetMonth, 'first') + const firstDayOfWeek = computeFirstDayOfWeek.value + const weekNum = XEUtils.getYearWeek(date, firstDayOfWeek) + const weekStartDate = XEUtils.getWhatWeek(date, 0, firstDayOfWeek, firstDayOfWeek) + const month = XEUtils.getWhatMonth(weekNum === 1 ? XEUtils.getWhatDay(weekStartDate, 6) : date, offsetMonth, 'first') + reactData.selectMonth = month } const dateNowHandle = () => { diff --git a/packages/input/src/input.ts b/packages/input/src/input.ts index 9178d645..34212047 100644 --- a/packages/input/src/input.ts +++ b/packages/input/src/input.ts @@ -918,15 +918,19 @@ export default defineComponent({ } if (XEUtils.isValidDate(dValue)) { dLabel = XEUtils.toDateString(dValue, dateLabelFormat, { firstDay: firstDayOfWeek }) - // 由于年份和第几周是冲突的行为,所以需要特殊处理,判断是否跨年 + // 周选择器,由于年份和第几周是冲突的行为,所以需要特殊处理,判断是否跨年,例如 + // '2024-12-31' 'yyyy-MM-dd W' >> '2024-12-31 1' + // '2025-01-01' 'yyyy-MM-dd W' >> '2025-01-01 1' if (dateLabelFormat && type === 'week') { - const firstWeekDate = XEUtils.getWhatWeek(dValue, 0, firstDayOfWeek, firstDayOfWeek) - if (firstWeekDate.getFullYear() < dValue.getFullYear()) { + const weekNum = XEUtils.getYearWeek(dValue, firstDayOfWeek) + const weekDate = XEUtils.getWhatWeek(dValue, 0, weekNum === 1 ? ((6 + firstDayOfWeek) % 7) as VxeInputPropTypes.StartDay : firstDayOfWeek, firstDayOfWeek) + const weekFullYear = weekDate.getFullYear() + if (weekFullYear !== dValue.getFullYear()) { const yyIndex = dateLabelFormat.indexOf('yyyy') if (yyIndex > -1) { const yyNum = Number(dLabel.substring(yyIndex, yyIndex + 4)) if (yyNum && !isNaN(yyNum)) { - dLabel = dLabel.replace(`${yyNum}`, `${yyNum - 1}`) + dLabel = dLabel.replace(`${yyNum}`, `${weekFullYear}`) } } } @@ -983,7 +987,10 @@ export default defineComponent({ } const dateCheckMonth = (date: Date) => { - const month = XEUtils.getWhatMonth(date, 0, 'first') + const firstDayOfWeek = computeFirstDayOfWeek.value + const weekNum = XEUtils.getYearWeek(date, firstDayOfWeek) + const weekStartDate = XEUtils.getWhatWeek(date, 0, firstDayOfWeek, firstDayOfWeek) + const month = XEUtils.getWhatMonth(weekNum === 1 ? XEUtils.getWhatDay(weekStartDate, 6) : date, 0, 'first') if (!XEUtils.isEqual(month, reactData.selectMonth)) { reactData.selectMonth = month } @@ -1270,7 +1277,11 @@ export default defineComponent({ // 日期 const dateMonthHandle = (date: Date, offsetMonth: number) => { - reactData.selectMonth = XEUtils.getWhatMonth(date, offsetMonth, 'first') + const firstDayOfWeek = computeFirstDayOfWeek.value + const weekNum = XEUtils.getYearWeek(date, firstDayOfWeek) + const weekStartDate = XEUtils.getWhatWeek(date, 0, firstDayOfWeek, firstDayOfWeek) + const month = XEUtils.getWhatMonth(weekNum === 1 ? XEUtils.getWhatDay(weekStartDate, 6) : date, offsetMonth, 'first') + reactData.selectMonth = month } const dateNowHandle = () => {