✨ feat(日期录入控件逻辑调整):

-/*
- * @Date: 2022-09-19 16:54:23
- * @LastEditors: hookehuyr hookehuyr@gmail.com
- * @LastEditTime: 2022-09-19 16:54:59
- * @FilePath: /swx/src/components/time-picker-data/dateTimePicker.js
- * @Description: 文件描述
- */
 var getDaysInOneMonth = function (year, month) {
   let _month = parseInt(month, 10);
   let d = new Date(year, _month, 0);
   return d.getDate();
 }
 var dateDate = function (date) {
-  let year = date.getFullYear();
-  let month = date.getMonth() + 1;
-  let day = date.getDate();
-  let hours = date.getHours();
-  let minutes = date.getMinutes();
+  let year = date && date.getFullYear();
+  let month = date && date.getMonth() + 1;
+  let day = date && date.getDate();
+  let hours = date && date.getHours();
+  let minutes = date && date.getMinutes();
   return {
     year, month, day, hours, minutes
   }
@@ -23,24 +16,17 @@ var dateDate = function (date) {
 var dateTimePicker = function (startyear, endyear) {
   // 获取date time  年份，月份，天数，小时，分钟推后30分
   const years = [];
+  const months = [];
+  const hours = [];
+  const minutes = [];
   for (let i = startyear; i <= endyear; i++) {
     years.push({
       name: i + '年',
       id: i
     });
   }
-  return function (_year, _month, _day, _hour, _minute) {
-    const months = [];
-    const days = [];
-    const hours = [];
-    const minutes = [];
-    _year = parseInt(_year);
-    _month = parseInt(_month);
-    _day = parseInt(_day);
-    _hour = parseInt(_hour);
-    _minute = parseInt(_minute);
   //获取月份
-    for (let i = _month; i <= 12; i++) {
+  for (let i = 1; i <= 12; i++) {
     if (i < 10) {
       i = "0" + i;
     }
@@ -49,18 +35,8 @@ var dateTimePicker = function (startyear, endyear) {
       id: i
     });
   }
-    //获取日期
-    for (let i = _day; i <= getDaysInOneMonth(_year, _month); i++) {
-      if (i < 10) {
-        i = "0" + i;
-      }
-      days.push({
-        name: i + '日',
-        id: i
-      });
-    }
   //获取小时
-    for (let i = _hour; i < 24; i++) {
+  for (let i = 0; i < 24; i++) {
     if (i < 10) {
       i = "0" + i;
     }
@@ -70,7 +46,7 @@ var dateTimePicker = function (startyear, endyear) {
     });
   }
   //获取分钟
-    for (let i = _minute; i < 60; i++) {
+  for (let i = 0; i < 60; i++) {
     if (i < 10) {
       i = "0" + i;
     }
@@ -79,6 +55,20 @@ var dateTimePicker = function (startyear, endyear) {
       id: i
     });
   }
+  return function (_year, _month) {
+    const days = [];
+    _year = parseInt(_year);
+    _month = parseInt(_month);
+    //获取日期
+    for (let i = 1; i <= getDaysInOneMonth(_year, _month); i++) {
+      if (i < 10) {
+        i = "0" + i;
+      }
+      days.push({
+        name: i + '日',
+        id: i
+      });
+    }
     return [years, months, days, hours, minutes];
   }
 }

@@ -35,6 +35,9 @@ export default {
       hour: 0,
       minute: 0,
       datePicker: "",
+      defaultIndex: [0, 0, 0, 0, 0],
+      startIndex: [0, 0, 0, 0, 0],
+      endIndex: [0, 0, 0, 0, 0],
     };
   },
   computed: {
@@ -47,6 +50,9 @@ export default {
     timeDate() {
       this.initData();
     },
+    defaultTime () {
+      this.initData();
+    }
   },
   created() {
     this.initData();
@@ -59,28 +65,43 @@ export default {
         startTime.getFullYear(),
         endTime.getFullYear()
       );
-      this.setDateData(this.startTime);
+      this.setDateData(this.defaultTime);
+      this.getKeyIndex(this.startTime, "startIndex");
+      // 截止时间索引
+      this.getKeyIndex(this.endTime, "endIndex");
+      // 默认索引
+      this.getKeyIndex(this.defaultTime, "defaultIndex");
+      this.timeIndex = this.defaultIndex;
       // 初始时间
       this.initTime();
-      // 初始索引
+    },
+    getKeyIndex(time, key) {
+      let Arr = dateDate(time);
+      let _index = this.getIndex(Arr);
+      this[key] = _index;
+    },
+    getIndex(arr) {
+      let timeIndex = [];
+      let indexKey = ["year", "month", "day", "hours", "minutes"];
+      this.activityArray.forEach((element, index) => {
+        let _index = element.findIndex(
+          (item) => parseInt(item.id) === parseInt(arr[indexKey[index]])
+        );
+        timeIndex[index] = _index >= 0 ? _index : 0;
+      });
+      return timeIndex;
     },
     initTime() {
-      this.year = this.activityArray[0][0].id;
-      this.month = this.activityArray[1][0].id;
-      this.day = this.activityArray[2][0].id;
-      this.hour = this.activityArray[3][0].id;
-      this.minute = this.activityArray[4][0].id;
+      let _index = this.timeIndex;
+      this.year = this.activityArray[0][_index[0]].id;
+      this.month = this.activityArray[1].length && this.activityArray[1][_index[1]].id;
+      this.day = this.activityArray[2].length && this.activityArray[2][_index[2]].id;
+      this.hour = this.activityArray[3].length && this.activityArray[3][_index[3]].id;
+      this.minute = this.activityArray[4].length && this.activityArray[4][_index[4]].id;
     },
     setDateData(_date) {
       let _data = dateDate(_date);
-      this.activityArray = this.datePicker(
-        _data.year,
-        _data.month,
-        _data.day,
-        _data.hours,
-        _data.minutes
-      );
-      // console.log(this.activityArray);
+      this.activityArray = this.datePicker(_data.year, _data.month);
     },
     bindMultiPickerChange(e) {
       console.log("picker发送选择改变，携带值为", e.detail.value);
@@ -96,109 +117,111 @@ export default {
       console.log("修改的列为", e.detail.column, "，值为", e.detail.value);
       let _data = JSON.parse(JSON.stringify(this.activityArray)),
         timeIndex = JSON.parse(JSON.stringify(this.timeIndex)),
+        { startIndex, endIndex } = this,
         { column, value } = e.detail,
         _value = _data[column][value].id,
-        _year = this.startTime.getFullYear(),
-        _endYear = this.endTime.getFullYear(),
-        _month = parseInt(this.startTime.getMonth() + 1),
-        _day = parseInt(this.startTime.getDay()),
-        _minute = parseInt(this.startTime.getMinutes());
+        _start = dateDate(this.startTime),
+        _end = dateDate(this.endTime);
       switch (e.detail.column) {
         case 0:
-          this.year = _value;
-          if (value === 0) {
-            //选择第一年 注意初始时间
+          if (_value <= _start.year) {
+            timeIndex = startIndex;
+            this.year = _start.year;
             this.setDateData(this.startTime);
-          } else if (value === _data[0].length - 1) {
-            // 选择最后一年设置截止时间
+          } else if (_value >= _end.year) {
+            this.year = _end.year;
+            timeIndex = [endIndex[0], 0, 0, 0, 0];
             this.setDateData(this.endTime);
           } else {
-            this.activityArray = this.datePicker(_value, 1, 1, 0, 0);
-          }
+            this.year = _value;
             timeIndex = [value, 0, 0, 0, 0];
+            this.activityArray = this.datePicker(_value, 1);
+          }
+          timeIndex = this.timeIndex = JSON.parse(JSON.stringify(timeIndex));
           this.timeIndex = timeIndex;
           break;
         case 1:
-          // 月份选择器 当年份为第一年和最后一年的时候需要注意
-          this.month = _value;
-          this.timeIndex = JSON.parse(
-            JSON.stringify([timeIndex[0], value, 0, 0, 0])
-          );
-          if (this.year == _year && value === 0) {
+          if (this.year == _start.year && value <= startIndex[1]) {
+            timeIndex = startIndex;
+            this.month = _start.month;
             this.setDateData(this.startTime);
-          } else if (this.year == _endYear && value === 0) {
+          } else if (this.year == _end.year && value >= endIndex[1]) {
+            timeIndex = endIndex;
+            this.month = _end.month;
             this.setDateData(this.endTime);
           } else {
-            _data[2] = this.datePicker(this.year, this.month, 1, 0, 0)[2];
-            _data[3] = this.datePicker(this.year, this.month, 1, 0, 0)[3];
-            _data[4] = this.datePicker(this.year, this.month, 1, 0, 0)[4];
+            this.month = _value;
+            _data[2] = this.datePicker(this.year, this.month)[2];
+            timeIndex = [timeIndex[0], value, 0, 0, 0];
             this.activityArray = _data;
           }
+          this.timeIndex = JSON.parse(JSON.stringify(timeIndex));
           break;
         case 2:
-          this.day = _value;
-          this.timeIndex = JSON.parse(
-            JSON.stringify([timeIndex[0], timeIndex[1], value, 0, 0])
-          );
-          if (this.year == _year && this.month == _month && value === 0) {
-            this.setDateData(this.startTime);
+          if (
+            this.year == _start.year &&
+            this.month == _start.month &&
+            value <= startIndex[2]
+          ) {
+            this.day = _start.day;
+            timeIndex = startIndex;
           } else if (
-            this.year == _endYear &&
-            this.month == _month &&
-            value === 0
+            this.year == _end.year &&
+            this.month == _end.month &&
+            value >= endIndex[2]
           ) {
-            this.setDateData(this.endTime);
+            this.day = _end.day;
+            timeIndex = endIndex;
           } else {
-            _data[3] = this.datePicker(
-              this.year,
-              this.month,
-              this.day,
-              0,
-              0
-            )[3];
-            _data[4] = this.datePicker(
-              this.year,
-              this.month,
-              this.day,
-              0,
-              0
-            )[4];
-            this.activityArray = _data;
+            this.day = _value;
+            timeIndex = [timeIndex[0], timeIndex[1], value, 0, 0];
           }
+          this.timeIndex = JSON.parse(JSON.stringify(timeIndex));
           break;
         case 3:
-          this.hour = _value;
-          timeIndex[3] = value;
-          timeIndex[4] = 0;
-          this.timeIndex = timeIndex;
           if (
-            this.year == _year &&
-            this.month == _month &&
-            this.day == _day &&
-            value === 0
+            this.year == _start.year &&
+            this.month == _start.month &&
+            this.day == _start.day &&
+            value <= startIndex[3]
           ) {
-            this.setDateData(this.startTime);
+            this.hour = _start.hours;
+            timeIndex = startIndex;
           } else if (
-            this.year == _endYear &&
-            this.month == _month &&
-            this.day == _day &&
-            value === 0
+            this.year == _end.year &&
+            this.month == _end.month &&
+            this.day == _end.day &&
+            value >= endIndex[3]
           ) {
-            this.setDateData(this.endTime);
+            this.hour = _end.hours;
+            timeIndex = endIndex;
           } else {
-            _data[4] = this.datePicker(
-              this.year,
-              this.month,
-              this.day,
-              this.hour,
-              0
-            )[4];
-            this.activityArray = _data;
+            this.hour = _value;
+            timeIndex[3] = value;
+            timeIndex[4] = 0;
           }
+          this.timeIndex = JSON.parse(JSON.stringify(timeIndex));
           break;
         case 4:
           timeIndex[4] = value;
-          this.timeIndex = timeIndex;
+          if (
+            this.year == _start.year &&
+            this.month == _start.month &&
+            this.day == _start.day &&
+            this.hour == _start.hours &&
+            value <= startIndex[4]
+          ) {
+            timeIndex = startIndex;
+          } else if (
+            this.year == _end.year &&
+            this.month == _end.month &&
+            this.day == _end.day &&
+            this.hour == _end.hours &&
+            value >= endIndex[4]
+          ) {
+            timeIndex = endIndex;
+          }
+          this.timeIndex = JSON.parse(JSON.stringify(timeIndex));
           break;
       }
     },