chore: update snapshot

Tencent · Dec 26, 2024 · 7407206 · 7407206
1 parent 1c77e29
commit 7407206
Show file tree

Hide file tree

Showing 7 changed files with 332 additions and 21 deletions.
diff --git a/src/_common b/src/_common
diff --git a/src/date-picker/DatePicker.tsx b/src/date-picker/DatePicker.tsx
@@ -173,23 +173,31 @@ export default defineComponent({
     }
 
     function processDate(date: Date) {
-      const val = (value.value || []) as DateMultipleValue;
-      const isSameDate = val?.some?.((val) => isSame(dayjs(val).toDate(), date));
+      let isSameDate: boolean;
+      const currentValue = (value.value || []) as DateMultipleValue;
+      const { dayjsLocale } = globalConfig.value;
+
       let currentDate: DateMultipleValue;
+      if (props.mode !== 'week')
+        isSameDate = currentValue.some((val) =>
+          isSame(parseToDayjs(val, formatRef.value.format).toDate(), date, props.mode, dayjsLocale),
+        );
+      else {
+        isSameDate = currentValue.some((val) => val === dayjs(date).locale(dayjsLocale).format(formatRef.value.format));
+      }
 
       if (!isSameDate) {
-        currentDate = val.concat(
+        currentDate = currentValue.concat(
           formatDate(date, { format: formatRef.value.format, targetFormat: formatRef.value.valueType }),
         );
       } else {
-        currentDate = val.filter(
+        currentDate = currentValue.filter(
           (val) =>
             formatDate(val, { format: formatRef.value.format, targetFormat: formatRef.value.valueType }) !==
             formatDate(date, { format: formatRef.value.format, targetFormat: formatRef.value.valueType }),
         );
       }
-
-      return currentDate.sort((a, b) => dayjs(a).valueOf() - dayjs(b).valueOf());
+      return currentDate;
     }
 
     function onTagRemoveClick(ctx: TagInputRemoveContext) {

diff --git a/src/date-picker/_example/multiple.vue b/src/date-picker/_example/multiple.vue
@@ -1,9 +1,14 @@
 <template>
   <t-space direction="vertical">
-    <t-date-picker multiple />
-    <t-date-picker mode="week" multiple />
-    <t-date-picker mode="year" multiple />
+    <t-date-picker v-model="value" multiple clearable />
+    <t-date-picker mode="week" multiple clearable />
+    <t-date-picker mode="quarter" multiple clearable />
+    <t-date-picker mode="year" multiple clearable />
   </t-space>
 </template>
 
-<script setup></script>
+<script setup>
+import { ref } from 'vue';
+
+const value = ref([]);
+</script>
diff --git a/src/date-picker/base/Table.tsx b/src/date-picker/base/Table.tsx
@@ -3,10 +3,11 @@ import dayjs from 'dayjs';
 import isoWeek from 'dayjs/plugin/isoWeek';
 import TDatePickerCell from './Cell';
 import { useConfig, usePrefixClass } from '../../hooks/useConfig';
-import type { TdDatePickerProps } from '../type';
 import { parseToDayjs } from '../../_common/js/date-picker/format';
 import isArray from 'lodash/isArray';
 
+import type { TdDatePickerProps, DateMultipleValue } from '../type';
+
 dayjs.extend(isoWeek);
 
 export default defineComponent({
@@ -19,6 +20,7 @@ export default defineComponent({
     value: [String, Number, Array, Date],
     format: String,
     firstDayOfWeek: Number,
+    multiple: Boolean,
     data: Array,
     time: String,
     onCellClick: Function,
@@ -47,25 +49,24 @@ export default defineComponent({
     const showThead = computed(() => props.mode === 'date' || props.mode === 'week');
 
     // 高亮周区间
-    const weekRowClass = (value: any, format: string, targetValue: Date) => {
+    const weekRowClass = (value: any, targetValue: Date) => {
       if (props.mode !== 'week' || !value) return {};
 
       if (isArray(value)) {
         if (!value.length) return {};
-        const [startObj, endObj] = value.map((v) => v && parseToDayjs(v, format));
+        const [startObj, endObj] = value.map((v) => v && parseToDayjs(v, props.format));
         const startYear = startObj && startObj.year();
         const startWeek = startObj?.locale?.(dayjsLocale)?.week?.();
         const endYear = endObj && endObj.year();
         const endWeek = endObj?.locale?.(dayjsLocale)?.week?.();
 
-        const targetObj = parseToDayjs(targetValue, format);
-        const targetYear = targetObj.isoWeekYear();
-        const targetWeek = targetObj.isoWeek();
+        const targetObj = parseToDayjs(targetValue, props.format);
+        const targetYear = targetObj.year();
+        const targetWeek = targetObj.week();
         const isActive =
           (targetYear === startYear && targetWeek === startWeek) || (targetYear === endYear && targetWeek === endWeek);
         const isRange =
-          (targetYear > startYear || (targetYear === startYear && targetWeek > startWeek)) &&
-          (targetYear < endYear || (targetYear === endYear && targetWeek < endWeek));
+          targetYear >= startYear && targetYear <= endYear && targetWeek > startWeek && targetWeek < endWeek;
         return {
           // 同年同周
           [`${COMPONENT_NAME.value}-${props.mode}-row--active`]: isActive,
@@ -74,9 +75,23 @@ export default defineComponent({
       }
 
       return {
-        [`${COMPONENT_NAME.value}-${props.mode}-row--active`]: true,
+        [`${COMPONENT_NAME.value}-${props.mode}-row--active`]:
+          parseToDayjs(value, props.format).locale(dayjsLocale).week() ===
+          parseToDayjs(targetValue, props.format).locale(dayjsLocale).week(),
+      };
+    };
+
+    const multipleWeekRowClass = (value: DateMultipleValue, targetValue: Date) => {
+      const targetDayjs = parseToDayjs(targetValue, props.format);
+      if (props.mode !== 'week' || (Array.isArray(value) && !value.length)) return {};
+      const isSomeYearWeek = value
+        .map?.((v) => parseToDayjs(v, props.format))
+        .some((item) => item.week() === targetDayjs.week() && item.year() === targetDayjs.year());
+      return {
+        [`${COMPONENT_NAME.value}__table-${props.mode}-row--active`]: isSomeYearWeek,
       };
     };
+    const activeRowCss = props.multiple ? multipleWeekRowClass : weekRowClass;
 
     return () => (
       <div class={COMPONENT_NAME.value} onMouseleave={(e: MouseEvent) => props.onCellMouseLeave?.({ e })}>
@@ -96,7 +111,7 @@ export default defineComponent({
                 key={i}
                 class={{
                   [`${COMPONENT_NAME.value}-${props.mode}-row`]: true,
-                  ...weekRowClass(props.value, props.format, row[0].value),
+                  ...activeRowCss(props.value, row[0].value),
                 }}
               >
                 {row.map((col: any, j: number) => (

diff --git a/src/date-picker/panel/PanelContent.tsx b/src/date-picker/panel/PanelContent.tsx
@@ -21,6 +21,7 @@ export default defineComponent({
     month: Number,
     tableData: Array,
     time: String,
+    multiple: Boolean,
     firstDayOfWeek: Number,
     partial: String,
     popupVisible: Boolean,
@@ -64,6 +65,7 @@ export default defineComponent({
             time={props.time}
             value={props.value}
             format={props.format}
+            multiple={props.multiple}
             firstDayOfWeek={props.firstDayOfWeek}
             onCellClick={(date: Date, { e }: { e: MouseEvent }) =>
               props.onCellClick?.(date, { e, partial: props.partial })
+1 −0		js/global-config/default-config.ts
+4 −1		js/utils/getPosition.ts