@xtdev/xt-miniprogram-ui 1.2.41 → 1.2.42

package/libs/xt-date-picker-loop/index.js

@@ -4,15 +4,17 @@
  * @Description: 日期组件-js逻辑
  * @LastEditors: Mr.Hu
  */
+let LASTMONTH = null; // 用于储存上一次选中的月份
 // 获取当前月份的天数
 const getDaysInMonth = (year, month) => {
   const daysInMonth = new Date(year, month, 0).getDate();
   return daysInMonth;
-}
+};
 // 深拷贝
 const deepClone = (val) => {
-  if (!val) return null;
-  const isObject = (obj) => Object.prototype.toString.call(obj) === '[object object]';
+  if (!val) {return null;}
+  const isObject = (obj) =>
+    Object.prototype.toString.call(obj) === "[object object]";
   let newResult = Array.isArray(val) ? [] : {};
   for (const key in val) {
     if (Object.prototype.hasOwnProperty.call(val, key)) {
@@ -20,12 +22,12 @@ const deepClone = (val) => {
     }
   }
   return newResult;
-}
+};
 // 获取默认时间
 const getDefaultDate = () => {
   const now = new Date();
-  return `${now.getFullYear()}-${now.getMonth()+1}-${now.getDate()}`;
-}
+  return `${now.getFullYear()}-${now.getMonth() + 1}-${now.getDate()}`;
+};
 // 查找数组中第二个出现的元素下标
 const findSecondIndexOf = (arr, predicate) => {
   const firstIndex = arr.findIndex(predicate);
@@ -34,8 +36,8 @@ const findSecondIndexOf = (arr, predicate) => {
   }
   // 从第一个匹配项的下一个位置继续查找
   return arr.slice(firstIndex + 1).findIndex(predicate);
-}
- 
+};
+
 Component({
   behaviors: [],
   properties: {
@@ -47,92 +49,101 @@ Component({
     // 弹窗标题
     title: {
       type: String,
-      value: '日期筛选'
+      value: "日期筛选",
     },
     // 日期选择器模式 date 年月日选择 dateRange 时间范围选择 yearMonth 年月
     type: {
       type: String,
-      value: 'dateRange',
+      value: "dateRange",
       observer: function (value) {
-        this.setData({filtType: value})
-      }
+        this.setData({ filtType: value });
+      },
     },
     // 最小可选日期
     minDate: {
       type: String,
-      value: '1990-1-1'
+      value: "1990-1-1",
     },
     // 最大可选日期
     maxDate: {
       type: String,
-      value: ''
+      value: "",
     },
     // 当前时间
     currentDate: {
       type: String,
-      value: ''
+      value: "",
     },
     // 展示切换按钮
     showChangeTab: {
       type: Boolean,
-      value: false
+      value: false,
     },
     // 确认按钮文字
     confirmButtonText: {
       type: String,
-      value: '确认'
+      value: "确认",
     },
     // 取消按钮文字
     cancelButtonText: {
       type: String,
-      value: '重置'
-    }
+      value: "重置",
+    },
   },
   data: {
     years: [], // 年份数组
     months: [], // 月份数组
     days: [], // 天份数组
     dateArr: [9999, 1, 1], // 下拉数组下标
-    dateValue: '', // 选中的日期值
-    dateStr: '', // 选中的日期显示字符
+    dateValue: "", // 选中的日期值
+    dateStr: "", // 选中的日期显示字符
     startDateArr: [], // 开始日期数组下标
-    startDateValue: '', // 开始日期选中值
-    startDateStr: '', // 开始日期字符
+    startDateValue: "", // 开始日期选中值
+    startDateStr: "", // 开始日期字符
     endDateArr: [], // 结束日期数组下标
-    endDateValue: '', // 结束日期选中值
-    endDateStr: '', // 结束日期字符
-    defaultDate: '', // 默认日期（组件接收的|当前时间）
-    checkedType: 'start', // 当前选择的日期类型
+    endDateValue: "", // 结束日期选中值
+    endDateStr: "", // 结束日期字符
+    defaultDate: "", // 默认日期（组件接收的|当前时间）
+    checkedType: "start", // 当前选择的日期类型
     clickedEnd: false, // 点击结束时间
-    filtType: 'dateRange', // 选择器模式
+    filtType: "dateRange", // 选择器模式
     typeEnums: {
-      date: '按日筛选',
-      dateRange: '按月筛选',
+      date: "按日筛选",
+      dateRange: "按月筛选",
     },
-    indicatorSyle: 'font-size: 40rpx;font-weight: 800;height: 60px'
+    indicatorSyle: "font-size: 40rpx;font-weight: 800;height: 60px",
   },
   lifetimes: {
-    created() {
-    },
+    created() {},
     async attached() {
       await this.initPickerArr();
       this.setDefaultDate();
-      await this.handelDays('', true);
-    }
+      await this.handelDays("", true);
+    },
   },
   methods: {
     // 初始化日期数组
     initPickerArr(curSelDate, dateValue) {
-      const { minYear, maxYear, minMonth,
-        maxMonth, minDay, maxDay,
-        selYearColum, selMonthColum, selDayColum } = this.getMinAndMaxDate(curSelDate, dateValue);
-      return new Promise(resolve => {
-        if (selDayColum){
+      const {
+        minYear,
+        maxYear,
+        minMonth,
+        maxMonth,
+        minDay,
+        maxDay,
+        selYearColum,
+        selMonthColum,
+        selDayColum,
+      } = this.getMinAndMaxDate(curSelDate, dateValue);
+      return new Promise((resolve) => {
+        if (selDayColum) {
           resolve();
           return;
         }
-        const years = [], months = [], days = [];
-        
+        const years = [],
+          months = [],
+          days = [];
+
         for (let i = minYear; i <= maxYear; i++) {
           years.push(i);
         }
@@ -144,37 +155,55 @@ Component({
         }
         if (curSelDate) {
           this.setData({
-            months
-          })
-        } else if (curSelDate && selMonthColum) {
+            months,
+          });
+        } else if (selMonthColum) {
           this.setData({
-            days
-          })
+            days,
+          });
         } else {
           this.setData({
             years,
             months,
-            days
-          })
+            days,
+          });
         }
         resolve();
-      })
+      });
     },
     // 获取最小最大年月日, 当前所选择的列
     getMinAndMaxDate(curSelDate, dateValue) {
-      let { data: { minDate, maxDate, currentDate, dateArr } } = this;
+      let {
+        data: { minDate, maxDate, currentDate, dateArr },
+      } = this;
       currentDate = currentDate || getDefaultDate();
-      let minYear, maxYear, minMonth, maxMonth, minDay, maxDay = 31; 
-      const selYearColum = dateValue && dateArr ? dateValue[0] !== dateArr[0] : false; // 选择的是年份列
-      const selMonthColum = dateValue && dateArr ? dateValue[1] !== dateArr[1] : false; // 选择的是月份列
-      const selDayColum = dateValue && dateArr ? dateValue[2] !== dateArr[2] : false; // 选择的是日份列
-      const curDateArr = this.transformToArr(curSelDate ? curSelDate : currentDate); //当前日期数组
-      const curYear = curDateArr[0], curMonth= curDateArr[1], curDay = curDateArr[2];
+      let minYear,
+        maxYear,
+        minMonth,
+        maxMonth,
+        minDay,
+        maxDay = 31;
+      const selYearColum =
+        dateValue && dateArr ? dateValue[0] !== dateArr[0] : false; // 选择的是年份列
+      const selMonthColum =
+        dateValue && dateArr ? dateValue[1] !== dateArr[1] : false; // 选择的是月份列
+      const selDayColum =
+        dateValue && dateArr ? dateValue[2] !== dateArr[2] : false; // 选择的是日份列
+      const curDateArr = this.transformToArr(
+        curSelDate ? curSelDate : currentDate
+      );
+      // 当前日期数组
+      const curYear = curDateArr[0],
+        curMonth = curDateArr[1],
+        curDay = curDateArr[2];
       if (minDate && minDate.length) {
         const minDateArr = this.transformToArr(minDate);
         minYear = Number(minDateArr[0]);
-        minMonth = (curYear && curYear == minDateArr[0]) ? minDateArr[1] : 1;
-        minDay = (curYear && curYear == minDateArr[0] && curMonth == minDateArr[1]) ? minDateArr[2] : 1;
+        minMonth = curYear && curYear == minDateArr[0] ? minDateArr[1] : 1;
+        minDay =
+          curYear && curYear == minDateArr[0] && curMonth == minDateArr[1]
+            ? minDateArr[2]
+            : 1;
       } else {
         minYear = 1990;
         minMonth = 1;
@@ -183,45 +212,82 @@ Component({
       if (maxDate && maxDate.length) {
         const maxDateArr = this.transformToArr(maxDate);
         maxYear = maxDateArr[0];
-        maxMonth = (curYear && curYear == maxDateArr[0]) ? maxDateArr[1] : 12;
-        maxDay = (curYear && curYear == maxDateArr[0] && curMonth == maxDateArr[1]) ? maxDateArr[2] : 31;
+        maxMonth = curYear && curYear == maxDateArr[0] ? maxDateArr[1] : 12;
+        maxDay =
+          curYear && curYear == maxDateArr[0] && curMonth == maxDateArr[1]
+            ? maxDateArr[2]
+            : 31;
       } else {
         maxYear = new Date().getFullYear();
         maxMonth = 12;
-        maxDay = getDaysInMonth(curYear, curMonth);;
+        maxDay = getDaysInMonth(curYear, curMonth);
       }
-      return { minYear, maxYear, minMonth, maxMonth, minDay, maxDay, curYear, curMonth, curDay, selYearColum, selMonthColum, selDayColum };
+      return {
+        minYear,
+        maxYear,
+        minMonth,
+        maxMonth,
+        minDay,
+        maxDay,
+        curYear,
+        curMonth,
+        curDay,
+        selYearColum,
+        selMonthColum,
+        selDayColum,
+      };
     },
     // 处理传入日期格式
     transformToArr(dateStr) {
-      if (!dateStr) return null;
-      const dateArr = dateStr.split('-');
-      if (!dateArr.length) return null;
+      if (!dateStr) {return null;}
+      const dateArr = dateStr.split("-");
+      if (!dateArr.length) {return null;}
       return dateArr;
     },
     // 设置默认年月日
     setDefaultDate() {
       const now = new Date();
-      let { data: { dateValue, currentDate, dateStr, dateArr, defaultDate, minDate } } = this;
+      let {
+        data: {
+          dateValue,
+          currentDate,
+          dateStr,
+          dateArr,
+          defaultDate,
+          minDate,
+        },
+      } = this;
       currentDate = currentDate || getDefaultDate();
-      let curDateArr = this.transformToArr(currentDate); //当前日期数组
+      let curDateArr = this.transformToArr(currentDate); // 当前日期数组
       const curYear = curDateArr[0];
-      const curMonth= curDateArr[1];
+      const curMonth = curDateArr[1];
       const curDay = curDateArr[2];
       const minDateArr = this.transformToArr(minDate); // 最小可选日期数组
       const defaultYear = minDateArr ? minDateArr[0] : 1990;
-      const defaultMonth = (minDateArr && curYear == minDateArr[0]) ? minDateArr[1] : 1;
-      const defaultDay = (minDateArr && curYear == minDateArr[0] && curMonth == minDateArr[1]) ? minDateArr[2] : 1;
+      const defaultMonth =
+        minDateArr && curYear == minDateArr[0] ? minDateArr[1] : 1;
+      const defaultDay =
+        minDateArr && curYear == minDateArr[0] && curMonth == minDateArr[1]
+          ? minDateArr[2]
+          : 1;
       if (curDateArr && curDateArr.length) {
         // 如果有设置当前日期，则数组下标选中当前日期
         dateStr = `${curYear}年${curMonth}月${curDay}日`;
-        dateArr = [curYear - defaultYear,  curMonth - defaultMonth, curDateArr[2] - defaultDay];
+        dateArr = [
+          curYear - defaultYear,
+          curMonth - defaultMonth,
+          curDateArr[2] - defaultDay,
+        ];
         dateValue = `${curYear}-${curMonth}-${curDay}`;
       } else {
         // 如果有设置当前日期，则数组下标默认选中当前
-        dateStr = `${now.getFullYear()}年${now.getMonth() + 1}月${now.getDate()}日`
-        dateArr = [now.getFullYear() - 1990, now.getMonth(), now.getDate() - 1 ];
-        dateValue = `${now.getFullYear()}-${now.getMonth() + 1}-${now.getDate()}`
+        dateStr = `${now.getFullYear()}年${
+          now.getMonth() + 1
+        }月${now.getDate()}日`;
+        dateArr = [now.getFullYear() - 1990, now.getMonth(), now.getDate() - 1];
+        dateValue = `${now.getFullYear()}-${
+          now.getMonth() + 1
+        }-${now.getDate()}`;
       }
       // 储存当前传入的原始值
       defaultDate = JSON.parse(JSON.stringify(dateValue));
@@ -232,122 +298,130 @@ Component({
         defaultDate,
         startDateArr: dateArr,
         startDateStr: dateStr,
-        startDateValue: dateValue
+        startDateValue: dateValue,
       });
     },
     // 处理当前月的天数
     handelDays(value, isInitDate = false) {
-      return new Promise(resolve => {
-        let { data: { days, dateArr, years, months, minDate, maxDate } } = this;
+      return new Promise((resolve) => {
+        let {
+          data: { days, dateArr, years, months, minDate, maxDate, dateValue },
+        } = this;
         // 如果没有默认值
         if (!value) {
           const { minYear } = this.getMinAndMaxDate();
-          let { data: { currentDate } } = this;
+          let {
+            data: { currentDate },
+          } = this;
           currentDate = currentDate || getDefaultDate();
-          value = this.transformToArr(currentDate); //当前日期数组
-          value = [value[0] - minYear, value[1] - 1, value[2] - 1]
+          value = this.transformToArr(currentDate); // 当前日期数组
+          value = [value[0] - minYear, value[1] - 1, value[2] - 1];
         }
         const selYear = years[value?.[0]],
           selMonth = months[value?.[1]],
-          selDay = days.length > value?.[2] + 1 ? value?.[2] + 1 : days.length;
-        let { minYear, minMonth, maxMonth, minDay, maxDay, selYearColum, selMonthColum, selDayColum } = this.getMinAndMaxDate(`${selYear}-${selMonth}-${selDay}`, value);
+          selDay = days[value?.[2]];
+        let {
+          minYear,
+          minMonth,
+          maxMonth,
+          minDay,
+          maxDay,
+          selYearColum,
+          selMonthColum,
+          selDayColum,
+        } = this.getMinAndMaxDate(`${selYear}-${selMonth}-${selDay}`, value);
         // 获取当前日期数组，当前选中日期值
-        let newDaysArr = days, newDateArr = value;
-        // 如果所选天数组下标大于当月天数, 并且当前是切换月份
-        if (value && value[2] >= maxDay && selMonthColum){
-          newDateArr = [newDateArr[0], value[1], maxDay - 1]
-        }
+        let newDaysArr = days,
+          newDateArr = value;
         /** 处理月数组下拉列表 **/
         // 1.后面插入：如果当前选中的是月份，并且是接近最大月，并且当前月份后面没有重复月份，处理月份下拉数组
-        const isMonthLastColum = selMonth >= maxMonth - 6 && (selMonthColum || selYearColum);
-        if (isMonthLastColum  || (selMonth >= maxMonth - 6 && isInitDate)) {
+        const isMonthLastColum =
+          selMonth >= maxMonth - 3 && (selMonthColum || selYearColum);
+        if (isMonthLastColum || (selMonth >= maxMonth - 3 && isInitDate)) {
           for (let i = minMonth; i <= maxMonth; i++) {
             months.push(i);
           }
           this.setData({
             months,
-          })
+          });
         }
         // 2.前面插入：如果当前选中的是月份，并且是接近最小月，并且当前月份前面没有重复月份，处理月份下拉数组
-        const isMonthFirstColum = selMonth == minMonth && newDateArr[1] < maxMonth && selMonthColum; // 当前选中的第一月
-        if (isMonthFirstColum || (selMonth == minMonth && isInitDate)) {
+        const isMonthFirstColum =
+          selMonth <= maxMonth - 3 && newDateArr[1] < maxMonth && selMonthColum; // 当前选中的第一月
+        if (isMonthFirstColum || (selMonth <= maxMonth - 3 && isInitDate)) {
           for (let i = maxMonth; i >= minMonth; i--) {
             months.unshift(i);
           }
-          newDateArr = [
-            newDateArr[0],
-            newDateArr[1] + maxMonth,
-            newDateArr[2]
-          ];
+          newDateArr = [newDateArr[0], newDateArr[1] + maxMonth, newDateArr[2]];
           this.setData({
-            months
-          })
+            months,
+          });
         }
-        // console.log('newDateArr:', newDateArr);
-        // console.log('newMonths:', months);
         /** 处理天数下拉列表 **/
-        const firstIndex = findSecondIndexOf(newDaysArr, el => el == 1 );
-        debugger;
-        // 1.选择最后一天，再切换月，处理天数下拉数组，且处理2月闰月bug
-        if (selMonthColum && (selDay >= maxDay - 1 || [28, 29].includes(selDay))) {
-          console.log(111);
-          // 如果当前有多余数据，则进行删除
-          if (newDaysArr.length > 58) {
-            newDaysArr = newDaysArr.slice(firstIndex + 1, newDaysArr.length)
+        const firstIndex = findSecondIndexOf(newDaysArr, (el) => el == 1);
+        // 2.切换月份，更新天数组列表
+        if (selMonthColum || selYear) {
+          const newArray = [];
+          for (let j = 1; j <= 2; j++) {
+            for (let i = minDay; i <= maxDay; i++) {
+              newArray.push(i);
+            }
           }
-          const apendDays = [];
-          for (let i = minDay; i <= maxDay; i++) {
-            apendDays.push(i);
+          newDaysArr = newArray;
+          const beforeMonth = LASTMONTH;
+          const prevSelDateParams = this.getMinAndMaxDate(`${selYear}-${beforeMonth}-${selDay}`);
+          // 如果选中的是当月第一天，处理当前选中的下标逻辑
+          if (selDay == 1) {
+            // 获取切换之前的月数
+            const valueDay = maxDay - prevSelDateParams.maxDay;
+            newDateArr = [newDateArr[0], newDateArr[1], newDateArr[2] + valueDay];
+          }
+          // 如果选中的是当月最后一天，处理当前选中的下标逻辑
+          if (selDay == prevSelDateParams.maxDay) {
+            // 获取当前月天数
+            const curSelDateParams = this.getMinAndMaxDate(`${selYear}-${selMonth}-${selDay}`);
+            newDateArr = [newDateArr[0], newDateArr[1], curSelDateParams.maxDay - 1];
           }
-          newDaysArr = apendDays.concat(newDaysArr);
-          newDateArr = [
-            newDateArr[0],
-            newDateArr[1],
-            maxDay - 1
-          ];
         }
-        // 2.如果当前选中的是天数，并且是接近最大天数，并且当前天数后面没有重复天数，处理天数下拉数组
-        const isDayLastColum = selDayColum  && selDay >= newDaysArr.length - 6;
+        // 天数列表上拉循环选择--后面插入
+        // 1.如果当前选中的是天数，并且是接近最大天数，并且当前天数后面没有重复天数，处理天数下拉数组
+        const isDayLastColum = selDayColum && selDay >= maxDay - 3;
         // 获取上一个月的天数
-        debugger;
-        const { maxDay: nextMonthMaxDay } = this.getMinAndMaxDate(`${selYear}-${selMonth + 1}-${selDay}`);
-        if (isDayLastColum || (isInitDate && selDay >= newDaysArr.length - 6)) {
-          console.log(222);
-          if (newDaysArr.length > 58) {
+        if (isDayLastColum || (isInitDate && selDay >= maxDay - 3)) {
+          // 如果当前选中的不是天数组最后三条数据，重新组装
+          if (newDaysArr.length > 58 && value[2] <= newDaysArr.length - 3) {
             newDaysArr = newDaysArr.slice(firstIndex + 1, newDaysArr.length);
           }
-          for (let i = minDay; i <= nextMonthMaxDay; i++) {
+          for (let i = minDay; i <= maxDay; i++) {
             newDaysArr.push(i);
           }
+          this.setData({
+            days: newDaysArr,
+          });
         }
         // 天数列表上拉循环选择--前面插入
-        // 1.当前选中天数列表，选中的是最小天数，并且设置的天数小于最大天数
-        const isDayFirstColum = selDay == minDay && newDateArr[2] < maxDay && selDayColum; // 当前选中的第一日
-        const { maxDay: prevMonthMaxDay } = this.getMinAndMaxDate(`${selYear}-${selMonth - 1}-${selDay}`);
+        // 1.当前选中天数列表，选中的接近最小天数，并且设置的天数小于最大天数
+        const isDayFirstColum =
+          selDay <= minDay + 3 && newDateArr[2] < maxDay && selDayColum; // 当前选中的第一日
         // 2. 当前初始日期前面设置添加循环选择
-        if (isDayFirstColum || (isInitDate && selDay == minDay)) {
-          for (let i = prevMonthMaxDay; i >= minDay; i--) {
+        if (isDayFirstColum || (isInitDate && selDay <= minDay + 3)) {
+          for (let i = maxDay; i >= minDay; i--) {
             newDaysArr.unshift(i);
           }
           this.setData({
-            days: newDaysArr
+            days: newDaysArr,
           });
-          let valueDay = Number(newDateArr[2] + prevMonthMaxDay);
-          newDateArr = [
-            newDateArr[0],
-            newDateArr[1],
-            valueDay
-          ];
+          let valueDay = Number(newDateArr[2] + maxDay);
+          newDateArr = [newDateArr[0], newDateArr[1], valueDay];
         }
+        LASTMONTH = selMonth;// 储存当前选中的月份，为上次选中的月份
         // 天数选择下拉循环选择
-        console.log('newDateArr:', newDateArr);
-        console.log('newDaysArr:', newDaysArr);
         // 解决回弹动画延时问题
         if ((isMonthFirstColum || isDayFirstColum) && !this.data.isRset) {
           setTimeout(() => {
             this.setData({
               days: newDaysArr,
-              dateArr: newDateArr
+              dateArr: newDateArr,
             });
             resolve();
           }, 1500);
@@ -355,71 +429,83 @@ Component({
           this.setData({
             days: newDaysArr,
             dateArr: newDateArr,
-            isRset: false
-          })
+            isRset: false,
+          });
           resolve();
         }
       });
     },
     // 滑动下拉列表
     async bindChange(e) {
-      console.log('bindChange:', e);
       const value = e?.detail?.value;
-      // const { data: { years: year, months: month, days: day } } = this;
-      // // 渲染下拉列表
-      // await this.initPickerArr(`${year[value[0]]}-${month[value[1]]}-${day[value[2]]}`, value);
       // 处理每月可选天数
       await this.handelDays(value);
-      let { data: {
-        years, months, days,
-        dateValue, dateStr, dateArr,
-        filtType, checkedType,
-        startDateArr, endDateArr,
-        startDateValue, endDateValue,
-        startDateStr, endDateStr
-      } } = this;
-      dateStr = `${years[dateArr[0]]}年${months[dateArr[1]]}月${days[dateArr[2]]}日`;
-      dateValue = `${years[dateArr[0]]}-${months[dateArr[1]]}-${days[dateArr[2]]}`;
-      if (filtType === 'yearMonth') {
+      let {
+        data: {
+          years,
+          months,
+          days,
+          dateValue,
+          dateStr,
+          dateArr,
+          filtType,
+          checkedType,
+          startDateArr,
+          endDateArr,
+          startDateValue,
+          endDateValue,
+          startDateStr,
+          endDateStr,
+        },
+      } = this;
+      dateStr = `${years[dateArr[0]]}年${months[dateArr[1]]}月${
+        days[dateArr[2]]
+      }日`;
+      dateValue = `${years[dateArr[0]]}-${months[dateArr[1]]}-${
+        days[dateArr[2]]
+      }`;
+      if (filtType === "yearMonth") {
         dateStr = `${years[dateArr[0]]}年${months[dateArr[1]]}月`;
         dateValue = `${years[dateArr[0]]}-${months[dateArr[1]]}`;
         // 如果是按年月筛选
         this.setData({
           dateStr,
-          dateValue
+          dateValue,
         });
-      } else if (filtType === 'date') {
+      } else if (filtType === "date") {
         // 如果是按年月日筛选
         this.setData({
           dateStr,
-          dateValue
+          dateValue,
+        });
+      } else if (checkedType === "start") {
+        this.setData({
+          startDateArr: dateArr,
+          startDateStr: dateStr,
+          startDateValue: dateValue,
         });
-      } else if (checkedType === 'start') {
-          this.setData({
-            startDateArr: dateArr,
-            startDateStr: dateStr,
-            startDateValue: dateValue,
-          })
       } else {
         this.setData({
           endDateArr: dateArr,
           endDateStr: dateStr,
           endDateValue: dateValue,
-        })
+        });
       }
     },
     // 更改筛选类型
     changeFiltType() {
-      const { data: { filtType, dateValue, dateStr, dateArr } } = this;
+      const {
+        data: { filtType, dateValue, dateStr, dateArr },
+      } = this;
       this.setData({
-        filtType: filtType === 'date' ? 'dateRange' : 'date',
-      })
-      if (filtType === 'date') {
-        this.setData({ 
+        filtType: filtType === "date" ? "dateRange" : "date",
+      });
+      if (filtType === "date") {
+        this.setData({
           startDateValue: dateValue,
           startDateStr: dateStr,
-          startDateArr: dateArr
-         });
+          startDateArr: dateArr,
+        });
         return;
       }
       this.onReset();
@@ -427,76 +513,94 @@ Component({
     // 切换日期类型
     switchDateType(e) {
       const checkedType = e.currentTarget.dataset.type;
-      const { data: { clickedEnd } } = this;
+      const {
+        data: { clickedEnd },
+      } = this;
       this.setData({
         checkedType,
-        clickedEnd: checkedType === 'end' ? true : clickedEnd
+        clickedEnd: checkedType === "end" ? true : clickedEnd,
       });
       this.showCheckedPicker();
     },
     // 反显选中的日期下拉值
     showCheckedPicker() {
-      let { data: { 
-        startDateValue, endDateValue, checkedType,
-        startDateArr, endDateArr, dateArr,
-        startDateStr, endDateStr
-       } } = this;
-       // 如果当前切换到结束时间选项
-      if (checkedType === 'end') {
+      let {
+        data: {
+          startDateValue,
+          endDateValue,
+          checkedType,
+          startDateArr,
+          endDateArr,
+          dateArr,
+          startDateStr,
+          endDateStr,
+        },
+      } = this;
+      // 如果当前切换到结束时间选项
+      if (checkedType === "end") {
         if (!endDateValue) {
           // 如果当前没有选结束时间
           endDateValue = startDateValue;
           endDateArr = startDateArr;
           endDateStr = startDateStr;
         } else {
-          dateArr = [endDateArr[0],  endDateArr[1], endDateArr[2]]
+          dateArr = [endDateArr[0], endDateArr[1], endDateArr[2]];
         }
       }
-      if (checkedType === 'start') {
-        dateArr = [startDateArr[0],  startDateArr[1], startDateArr[2]]
+      if (checkedType === "start") {
+        dateArr = [startDateArr[0], startDateArr[1], startDateArr[2]];
       }
       this.setData({
         endDateStr,
         endDateValue,
         endDateArr,
-        dateArr
-      })
+        dateArr,
+      });
     },
     // 重置时间
     async onReset() {
-      this.setData({isRset: true});
+      this.setData({ isRset: true });
       this.bindChange();
     },
+    // 关闭选择器
+    async onClose() {
+      this.onReset();
+      this.setData({ show: false });
+    },
     // 确认选择时间
     onConfirm() {
-      const { data: { filtType, dateValue, startDateValue, endDateValue } } = this;
-      let checkedDate;
-      if (filtType === 'date') {
+      const {
+        data: { filtType, dateValue, dateStr, startDateValue, endDateValue },
+      } = this;
+      let pickerDate;
+      if (filtType === "date") {
         // 如果按年月日筛选
-        checkedDate = `${dateValue} 00:00:00`;
-      } else if (filtType === 'yearMonth') {
+        pickerDate = `${dateValue} 00:00:00`;
+      } else if (filtType === "yearMonth") {
         // 如果按年月筛选
-        checkedDate = dateValue;
+        pickerDate = dateValue;
       } else {
         if (!endDateValue) {
           wx.showToast({
-            title: '请选择结束时间',
-            icon: 'none'
-          })
+            title: "请选择结束时间",
+            icon: "none",
+          });
           return;
         }
         if (new Date(startDateValue) > new Date(endDateValue)) {
           wx.showToast({
-            title: '开始时间不能大于结束时间',
-            icon: 'none'
-          })
+            title: "开始时间不能大于结束时间",
+            icon: "none",
+          });
           return;
         }
-        checkedDate = [`${startDateValue} 00:00:00`, `${endDateValue} 23:59:59`];
+        pickerDate = [`${startDateValue} 00:00:00`, `${endDateValue} 23:59:59`];
       }
-      console.log('checkedDate:', checkedDate);
-      this.setData({show: false});
-      this.triggerEvent('getDateValue', checkedDate)
+      this.setData({ show: false });
+      this.triggerEvent("getDateValue", {
+        pickerDate,
+        pickerDateText: dateStr,
+      });
     },
   },
 });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@xtdev/xt-miniprogram-ui",
-  "version": "1.2.41",
+  "version": "1.2.42",
   "description": "",
   "miniprogram": "libs",
   "publishConfig": {