ソースを参照

fix(components): Ts类型调整 (#1666)

lkjh3214 3 年 前
コミット
5ee5ebd700

+ 1 - 1
src/packages/__VUE/backtop/index.taro.vue

@@ -65,7 +65,7 @@ export default create({
       };
       };
     });
     });
 
 
-    const scroll = (e) => {
+    const scroll = (e: any) => {
       state.scrollTop = 2;
       state.scrollTop = 2;
       state.backTop = e.detail.scrollTop >= props.distance;
       state.backTop = e.detail.scrollTop >= props.distance;
     };
     };

+ 1 - 2
src/packages/__VUE/calendaritem/index.taro.vue

@@ -612,7 +612,7 @@ export default create({
       let containerHeight = lastItem.cssHeight + lastItem.cssScrollHeight;
       let containerHeight = lastItem.cssHeight + lastItem.cssScrollHeight;
 
 
       state.containerHeight = `${containerHeight}px`;
       state.containerHeight = `${containerHeight}px`;
-      state.scrollTop = state.monthsData[state.currentIndex].cssScrollHeight;
+      state.scrollTop = Math.ceil(state.monthsData[state.currentIndex].cssScrollHeight);
       state.avgHeight = Math.floor(containerHeight / (monthsNum + 1));
       state.avgHeight = Math.floor(containerHeight / (monthsNum + 1));
 
 
       if (months?.value) {
       if (months?.value) {
@@ -646,7 +646,6 @@ export default create({
           //     selectorQuery
           //     selectorQuery
           //       .select('.nut-calendar-content')
           //       .select('.nut-calendar-content')
           //       .scrollOffset((res) => {
           //       .scrollOffset((res) => {
-          //         console.log(res);
           //         if (props.toDateAnimation) {
           //         if (props.toDateAnimation) {
           //           let scrollTop = res.scrollTop;
           //           let scrollTop = res.scrollTop;
           //           let distance = state.monthsData[index].cssScrollHeight - scrollTop;
           //           let distance = state.monthsData[index].cssScrollHeight - scrollTop;

+ 60 - 32
src/packages/__VUE/calendaritem/index.vue

@@ -65,7 +65,7 @@
   </view>
   </view>
 </template>
 </template>
 <script lang="ts">
 <script lang="ts">
-import { reactive, ref, watch, toRefs, computed } from 'vue';
+import { reactive, ref, watch, toRefs, computed, PropType } from 'vue';
 import { createComponent } from '@/packages/utils/create';
 import { createComponent } from '@/packages/utils/create';
 const { create, translate } = createComponent('calendar-item');
 const { create, translate } = createComponent('calendar-item');
 import Utils from '@/packages/utils/date';
 import Utils from '@/packages/utils/date';
@@ -73,20 +73,30 @@ import requestAniFrame from '@/packages/utils/raf';
 import { useExpose } from '@/packages/utils/useExpose/index';
 import { useExpose } from '@/packages/utils/useExpose/index';
 
 
 type InputDate = string | string[];
 type InputDate = string | string[];
+type StringArr = string[];
+interface TouchParam {
+  startY: number;
+  endY: number;
+  startTime: number;
+  endTime: number;
+  lastY: number;
+  lastTime: number;
+}
+
 interface CalendarState {
 interface CalendarState {
   yearMonthTitle: string;
   yearMonthTitle: string;
-  currDate: any;
+  currDate: string | string[];
   propStartDate: string;
   propStartDate: string;
   propEndDate: string;
   propEndDate: string;
   currentIndex: number;
   currentIndex: number;
   unLoadPrev: boolean;
   unLoadPrev: boolean;
-  touchParams: any;
+  touchParams: TouchParam;
   transformY: number;
   transformY: number;
   translateY: number;
   translateY: number;
   scrollDistance: number;
   scrollDistance: number;
   defaultData: InputDate;
   defaultData: InputDate;
-  chooseData: any;
-  monthsData: any[];
+  chooseData: (string | string[])[];
+  monthsData: MonthInfo[];
   dayPrefix: string;
   dayPrefix: string;
   startData: InputDate;
   startData: InputDate;
   endData: InputDate;
   endData: InputDate;
@@ -94,7 +104,7 @@ interface CalendarState {
   timer: number;
   timer: number;
   avgHeight: number;
   avgHeight: number;
   monthsNum: number;
   monthsNum: number;
-  defaultRange: any[];
+  defaultRange: number[];
 }
 }
 interface Day {
 interface Day {
   day: string | number;
   day: string | number;
@@ -105,8 +115,17 @@ interface MonthInfo {
   curData: string[] | string;
   curData: string[] | string;
   title: string;
   title: string;
   monthData: Day[];
   monthData: Day[];
-  cssHeight?: number;
-  cssScrollHeight?: number;
+  cssHeight: number;
+  cssScrollHeight: number;
+}
+interface Dateprop {
+  year: string;
+  month: string;
+}
+interface DateInfo {
+  year: string;
+  month: string;
+  day: string;
 }
 }
 
 
 export default create({
 export default create({
@@ -156,8 +175,8 @@ export default create({
       default: ''
       default: ''
     },
     },
     defaultValue: {
     defaultValue: {
-      type: [String, Array],
-      default: null
+      type: [String, Array] as PropType<string>,
+      default: ''
     },
     },
     startDate: {
     startDate: {
       type: String,
       type: String,
@@ -235,7 +254,7 @@ export default create({
     };
     };
     const isMultiple = (currDate: string) => {
     const isMultiple = (currDate: string) => {
       if (state.currDate.length > 0) {
       if (state.currDate.length > 0) {
-        return state.currDate.some((item: any) => {
+        return (state.currDate as StringArr).some((item: string) => {
           return Utils.isEqual(item, currDate);
           return Utils.isEqual(item, currDate);
         });
         });
       } else {
       } else {
@@ -300,8 +319,8 @@ export default create({
         days[4] = Utils.getWhatDay(+days[0], +days[1], +days[2]);
         days[4] = Utils.getWhatDay(+days[0], +days[1], +days[2]);
         if (type == 'multiple') {
         if (type == 'multiple') {
           if (state.currDate.length > 0) {
           if (state.currDate.length > 0) {
-            let hasIndex: any = '';
-            state.currDate.forEach((item: any, index: number) => {
+            let hasIndex: number = NaN;
+            (state.currDate as StringArr).forEach((item: string, index: number) => {
               if (item == days[3]) {
               if (item == days[3]) {
                 hasIndex = index;
                 hasIndex = index;
               }
               }
@@ -309,11 +328,11 @@ export default create({
             if (isFirst) {
             if (isFirst) {
               state.chooseData.push([...days]);
               state.chooseData.push([...days]);
             } else {
             } else {
-              if (hasIndex !== '') {
-                state.currDate.splice(hasIndex, 1);
+              if (hasIndex !== NaN) {
+                (state.currDate as StringArr).splice(hasIndex, 1);
                 state.chooseData.splice(hasIndex, 1);
                 state.chooseData.splice(hasIndex, 1);
               } else {
               } else {
-                state.currDate.push(days[3]);
+                (state.currDate as StringArr).push(days[3]);
                 state.chooseData.push([...days]);
                 state.chooseData.push([...days]);
               }
               }
             }
             }
@@ -371,11 +390,11 @@ export default create({
           month = month == 12 ? 1 : ++month;
           month = month == 12 ? 1 : ++month;
           break;
           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: Dateprop) => {
       // 修复:当某个月的1号是周日时,月份下方会空出来一行
       // 修复:当某个月的1号是周日时,月份下方会空出来一行
       let { year, month } = dateInfo;
       let { year, month } = dateInfo;
       if (type == 'prev' && days >= 7) {
       if (type == 'prev' && days >= 7) {
@@ -391,7 +410,7 @@ export default create({
       });
       });
     };
     };
     // 获取上一个月的最后一周天数,填充当月空白
     // 获取上一个月的最后一周天数,填充当月空白
-    const getPreDaysStatus = (days: number, type: string, dateInfo: any, preCurrMonthDays: number) => {
+    const getPreDaysStatus = (days: number, type: string, dateInfo: Dateprop, preCurrMonthDays: number) => {
       // 修复:当某个月的1号是周日时,月份下方会空出来一行
       // 修复:当某个月的1号是周日时,月份下方会空出来一行
       let { year, month } = dateInfo;
       let { year, month } = dateInfo;
       if (type == 'prev' && days >= 7) {
       if (type == 'prev' && days >= 7) {
@@ -408,18 +427,18 @@ export default create({
       return months.slice(preCurrMonthDays - days);
       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]);
       const preMonthDays = Utils.getMonthPreDay(+curData[0], +curData[1]);
 
 
-      let preMonth = curData[1] - 1;
-      let preYear = curData[0];
+      let preMonth = Number(curData[1]) - 1;
+      let preYear = Number(curData[0]);
       if (preMonth <= 0) {
       if (preMonth <= 0) {
         preMonth = 12;
         preMonth = 12;
         preYear += 1;
         preYear += 1;
       }
       }
       //当月天数与上个月天数
       //当月天数与上个月天数
-      const currMonthDays = Utils.getMonthDays(curData[0], curData[1]);
+      const currMonthDays = Utils.getMonthDays(String(curData[0]), String(curData[1]));
       const preCurrMonthDays = Utils.getMonthDays(preYear + '', preMonth + '');
       const preCurrMonthDays = Utils.getMonthDays(preYear + '', preMonth + '');
 
 
       const title = {
       const title = {
@@ -430,17 +449,24 @@ export default create({
         curData: curData,
         curData: curData,
         title: translate('monthTitle', title.year, title.month),
         title: translate('monthTitle', title.year, title.month),
         monthData: [
         monthData: [
-          ...(getPreDaysStatus(preMonthDays, 'prev', { month: preMonth, year: preYear }, preCurrMonthDays) as Day[]),
+          ...(getPreDaysStatus(
+            preMonthDays,
+            'prev',
+            { month: preMonth + '', year: preYear + '' },
+            preCurrMonthDays
+          ) as Day[]),
           ...(getDaysStatus(currMonthDays, 'curr', title) as Day[])
           ...(getDaysStatus(currMonthDays, 'curr', title) as Day[])
-        ]
+        ],
+        cssHeight: 0,
+        cssScrollHeight: 0
       };
       };
       monthInfo.cssHeight = 39 + (monthInfo.monthData.length > 35 ? 384 : 320);
       monthInfo.cssHeight = 39 + (monthInfo.monthData.length > 35 ? 384 : 320);
       let cssScrollHeight = 0;
       let cssScrollHeight = 0;
 
 
       if (state.monthsData.length > 0) {
       if (state.monthsData.length > 0) {
         cssScrollHeight =
         cssScrollHeight =
-          state.monthsData[state.monthsData.length - 1].cssScrollHeight +
-          state.monthsData[state.monthsData.length - 1].cssHeight;
+          (state.monthsData[state.monthsData.length - 1] as MonthInfo).cssScrollHeight +
+          (state.monthsData[state.monthsData.length - 1] as MonthInfo).cssHeight;
       }
       }
       monthInfo.cssScrollHeight = cssScrollHeight;
       monthInfo.cssScrollHeight = cssScrollHeight;
       if (type == 'next') {
       if (type == 'next') {
@@ -576,7 +602,7 @@ export default create({
           chooseDay({ day: state.defaultData[2], type: 'curr' }, state.monthsData[state.currentIndex], true);
           chooseDay({ day: state.defaultData[2], type: 'curr' }, state.monthsData[state.currentIndex], true);
           chooseDay({ day: state.defaultData[5], type: 'curr' }, state.monthsData[lastCurrent], true);
           chooseDay({ day: state.defaultData[5], type: 'curr' }, state.monthsData[lastCurrent], true);
         } else if (props.type == 'multiple') {
         } else if (props.type == 'multiple') {
-          [...state.currDate].forEach((item: any) => {
+          [...state.currDate].forEach((item: string) => {
             let dateArr = splitDate(item);
             let dateArr = splitDate(item);
             let current = state.currentIndex;
             let current = state.currentIndex;
             state.monthsData.forEach((item, index) => {
             state.monthsData.forEach((item, index) => {
@@ -680,16 +706,18 @@ 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()));
       return Utils.isEqual(date, Utils.date2Str(new Date()));
     };
     };
     // 滚动处理事件
     // 滚动处理事件
-    const mothsViewScroll = (e: any) => {
+    const mothsViewScroll = (e: Event) => {
       if (state.monthsData.length <= 1) {
       if (state.monthsData.length <= 1) {
         return;
         return;
       }
       }
-      const currentScrollTop = e.target.scrollTop;
+      const currentScrollTop = (e.target as Element).scrollTop;
       let current = Math.floor(currentScrollTop / state.avgHeight);
       let current = Math.floor(currentScrollTop / state.avgHeight);
       if (current == 0) {
       if (current == 0) {
         if (currentScrollTop >= state.monthsData[current + 1].cssScrollHeight) {
         if (currentScrollTop >= state.monthsData[current + 1].cssScrollHeight) {

+ 2 - 4
src/packages/__VUE/popover/index.vue

@@ -107,7 +107,6 @@ export default create({
     });
     });
 
 
     const createPopperInstance = () => {
     const createPopperInstance = () => {
-      // console.log(reference.value, popoverRef.value);
       if (reference.value && popoverRef.value) {
       if (reference.value && popoverRef.value) {
         return createPopper(reference.value, popoverRef.value.popupRef, {
         return createPopper(reference.value, popoverRef.value.popupRef, {
           placement: props.location,
           placement: props.location,
@@ -139,7 +138,6 @@ export default create({
         if (!showPopup.value) return;
         if (!showPopup.value) return;
         if (!popper) {
         if (!popper) {
           popper = createPopperInstance();
           popper = createPopperInstance();
-          // console.log(popper);
         } else {
         } else {
           popper.setOptions({
           popper.setOptions({
             placement: props.location
             placement: props.location
@@ -148,9 +146,9 @@ export default create({
       });
       });
     };
     };
 
 
-    const clickAway = (event: any) => {
+    const clickAway = (event: Event) => {
       const element = reference.value;
       const element = reference.value;
-      if (element && !element.contains(event.target as Node)) {
+      if (element && !element.contains(event.target)) {
         closePopover();
         closePopover();
       }
       }
     };
     };

+ 6 - 8
src/packages/__VUE/range/index.taro.vue

@@ -216,8 +216,8 @@ export default create({
     const markClassName = (mark: any) => {
     const markClassName = (mark: any) => {
       const classPrefix = 'nut-range-mark';
       const classPrefix = 'nut-range-mark';
       const { modelValue, max, min } = props;
       const { modelValue, max, min } = props;
-      let lowerBound: any = Number(min);
-      let upperBound: any = Number(max);
+      let lowerBound: number = Number(min);
+      let upperBound: number | number[] = Number(max);
       if (props.range) {
       if (props.range) {
         const [left, right] = modelValue as any;
         const [left, right] = modelValue as any;
         lowerBound = left;
         lowerBound = left;
@@ -231,7 +231,7 @@ export default create({
         [`${classPrefix}-text-active`]: isActive
         [`${classPrefix}-text-active`]: isActive
       };
       };
     };
     };
-    const marksStyle = (mark: any) => {
+    const marksStyle = (mark: number) => {
       const { max, min, vertical } = props;
       const { max, min, vertical } = props;
       let style: any = {
       let style: any = {
         left: `${((mark - Number(min)) / scope.value) * 100}%`
         left: `${((mark - Number(min)) / scope.value) * 100}%`
@@ -243,10 +243,10 @@ export default create({
       }
       }
       return style;
       return style;
     };
     };
-    const tickStyle = (mark: any) => {
+    const tickStyle = (mark: number) => {
       const { modelValue, max, min } = props;
       const { modelValue, max, min } = props;
-      let lowerBound: any = Number(min);
-      let upperBound: any = Number(max);
+      let lowerBound: number = Number(min);
+      let upperBound: number = Number(max);
       if (props.range) {
       if (props.range) {
         const [left, right] = modelValue as any;
         const [left, right] = modelValue as any;
         lowerBound = left;
         lowerBound = left;
@@ -300,8 +300,6 @@ export default create({
       const rect = await useTaroRect(root, Taro);
       const rect = await useTaroRect(root, Taro);
       let delta = (event as any).touches[0].clientX - rect.left;
       let delta = (event as any).touches[0].clientX - rect.left;
       let total = rect.width;
       let total = rect.width;
-      console.log(delta);
-      console.log(total);
       if (props.vertical) {
       if (props.vertical) {
         delta = (event as any).touches[0].clientY - rect.top;
         delta = (event as any).touches[0].clientY - rect.top;
         total = rect.height;
         total = rect.height;

+ 11 - 11
src/packages/__VUE/range/index.vue

@@ -211,13 +211,13 @@ export default create({
         };
         };
       }
       }
     });
     });
-    const markClassName = (mark: any) => {
+    const markClassName = (mark: number) => {
       const classPrefix = 'nut-range-mark';
       const classPrefix = 'nut-range-mark';
       const { modelValue, max, min } = props;
       const { modelValue, max, min } = props;
-      let lowerBound: any = Number(min);
-      let upperBound: any = Number(max);
+      let lowerBound: number = Number(min);
+      let upperBound: number | number[] = Number(max);
       if (props.range) {
       if (props.range) {
-        const [left, right] = modelValue as any;
+        const [left, right] = modelValue as number[];
         lowerBound = left;
         lowerBound = left;
         upperBound = right;
         upperBound = right;
       } else {
       } else {
@@ -229,9 +229,9 @@ export default create({
         [`${classPrefix}-text-active`]: isActive
         [`${classPrefix}-text-active`]: isActive
       };
       };
     };
     };
-    const marksStyle = (mark: any) => {
+    const marksStyle = (mark: number) => {
       const { max, min, vertical } = props;
       const { max, min, vertical } = props;
-      let style: any = {
+      let style: CSSProperties = {
         left: `${((mark - Number(min)) / scope.value) * 100}%`
         left: `${((mark - Number(min)) / scope.value) * 100}%`
       };
       };
       if (vertical) {
       if (vertical) {
@@ -241,17 +241,17 @@ export default create({
       }
       }
       return style;
       return style;
     };
     };
-    const tickStyle = (mark: any) => {
+    const tickStyle = (mark: number) => {
       const { modelValue, max, min } = props;
       const { modelValue, max, min } = props;
-      let lowerBound: any = Number(min);
-      let upperBound: any = Number(max);
+      let lowerBound: number = Number(min);
+      let upperBound: number = Number(max);
       if (props.range) {
       if (props.range) {
-        const [left, right] = modelValue as any;
+        const [left, right] = modelValue as number[];
         lowerBound = left;
         lowerBound = left;
         upperBound = right;
         upperBound = right;
       }
       }
       let isActive = mark <= upperBound && mark >= lowerBound;
       let isActive = mark <= upperBound && mark >= lowerBound;
-      let style: any = {
+      let style: CSSProperties = {
         background: !isActive ? props.inactiveColor : props.activeColor
         background: !isActive ? props.inactiveColor : props.activeColor
       };
       };
 
 

+ 0 - 3
src/packages/__VUE/watermark/index.vue

@@ -110,7 +110,6 @@ export default create({
     const init = () => {
     const init = () => {
       const canvas = document.createElement('canvas');
       const canvas = document.createElement('canvas');
       const ratio = window.devicePixelRatio;
       const ratio = window.devicePixelRatio;
-      // console.log(ratio);
       const ctx = canvas.getContext('2d');
       const ctx = canvas.getContext('2d');
       const canvasWidth = `${(gapX + width) * ratio}px`;
       const canvasWidth = `${(gapX + width) * ratio}px`;
       const canvasHeight = `${(gapY + height) * ratio}px`;
       const canvasHeight = `${(gapY + height) * ratio}px`;
@@ -138,7 +137,6 @@ export default create({
             );
             );
             ctx.restore();
             ctx.restore();
             state.base64Url = canvas.toDataURL();
             state.base64Url = canvas.toDataURL();
-            // console.log(state.base64Url);
           };
           };
         } else if (content) {
         } else if (content) {
           ctx.textBaseline = 'middle';
           ctx.textBaseline = 'middle';
@@ -154,7 +152,6 @@ export default create({
           ctx.fillText(content, 0, 0);
           ctx.fillText(content, 0, 0);
           ctx.restore();
           ctx.restore();
           state.base64Url = canvas.toDataURL();
           state.base64Url = canvas.toDataURL();
-          // console.log(state.base64Url);
         }
         }
       } else {
       } else {
         throw new Error('当前环境不支持Canvas');
         throw new Error('当前环境不支持Canvas');