小程序 时分秒

好记性不如烂笔头,何况记性还不好。

wxml

    <picker mode="multiSelector" value="{{dateTime}}" bindchange="changeDateTime" range="{{dateTimeArray}}">
        <view class='text-item flex inp-wrapper'>
            <text style="flex:1">期望维修日期</text>
            <view>
                <text class="aaa"> {{dateTimeArray[0][dateTime[0]]}}-{{dateTimeArray[1][dateTime[1]]}}-{{dateTimeArray[2][dateTime[2]]}} {{dateTimeArray[3][dateTime[3]]}}:{{dateTimeArray[4][dateTime[4]]}}:{{dateTimeArray[5][dateTime[5]]}}</text>
            </view>
        </view>
    </picker>

js

var dateTimePicker = require('../../utils/dateTimePicker');
data: {
        // 期望配送日期 带时分秒 -  上
        date: '2018-10-01',
        time: '12:00',
        dateTimeArray: null,
        dateTime: null,
        dateTimeArray1: null,
        dateTime1: null,
        startYear: 2000,
        endYear: 2050,
        // 期望配送日期 带时分秒 - 下
}

 

    onLoad: function (options) {
          // 获取完整的年月日 时分秒,以及默认显示的数组
        var obj = dateTimePicker.dateTimePicker(this.data.startYear, this.data.endYear);
        var obj1 = dateTimePicker.dateTimePicker(this.data.startYear, this.data.endYear);
        // 精确到分的处理,将数组的秒去掉
        var lastArray = obj1.dateTimeArray.pop();
        var lastTime = obj1.dateTime.pop();

        this.setData({
            dateTime: obj.dateTime,
            dateTimeArray: obj.dateTimeArray,
            dateTimeArray1: obj1.dateTimeArray,
            dateTime1: obj1.dateTime
        });
    },

 

changeDateTime(e) {
        this.setData({
            dateTime: e.detail.value
        });
    },

传参

qiWangBaoXiuRiQi: this.data.dateTimeArray[0][this.data.dateTime[0]] +"-"+ this.data.dateTimeArray[1][this.data.dateTime[1]] + "-" + this.data.dateTimeArray[2][this.data.dateTime[2]] +" " + this.data.dateTimeArray[3][this.data.dateTime[3]]+ ":" +this.data.dateTimeArray[4][this.data.dateTime[4]]+":"+this.data.dateTimeArray[5][this.data.dateTime[5]],

附带js( utils/dateTimePicker )

function withData(param){
    return param < 10 ? '0' + param : '' + param;
   }
   function getLoopArray(start,end){
    var start = start || 0;
    var end = end || 1;
    var array = [];
    for (var i = start; i <= end; i++) {
    array.push(withData(i));
    }
    return array;
   }
   function getMonthDay(year,month){
    var flag = year % 400 == 0 || (year % 4 == 0 && year % 100 != 0), array = null;
    
    switch (month) {
    case '01':
    case '03':
    case '05':
    case '07':
    case '08':
    case '10':
    case '12':
     array = getLoopArray(1, 31)
     break;
    case '04':
    case '06':
    case '09':
    case '11':
     array = getLoopArray(1, 30)
     break;
    case '02':
     array = flag ? getLoopArray(1, 29) : getLoopArray(1, 28)
     break;
    default:
     array = '月份格式不正确,请重新输入!'
    }
    return array;
   }
   function getNewDateArry(){
    // 当前时间的处理
    var newDate = new Date();
    var year = withData(newDate.getFullYear()),
     mont = withData(newDate.getMonth() + 1),
     date = withData(newDate.getDate()),
     hour = withData(newDate.getHours()),
     minu = withData(newDate.getMinutes()),
     seco = withData(newDate.getSeconds());
    
    return [year, mont, date, hour, minu, seco];
   }
   function dateTimePicker(startYear,endYear,date) {
    // 返回默认显示的数组和联动数组的声明
    var dateTime = [], dateTimeArray = [[],[],[],[],[],[]];
    var start = startYear || 1978;
    var end = endYear || 2100;
    // 默认开始显示数据
    var defaultDate = date ? [...date.split(' ')[0].split('-'), ...date.split(' ')[1].split(':')] : getNewDateArry();
    // 处理联动列表数据
    /*年月日 时分秒*/
    dateTimeArray[0] = getLoopArray(start,end);
    dateTimeArray[1] = getLoopArray(1, 12);
    dateTimeArray[2] = getMonthDay(defaultDate[0], defaultDate[1]);
    dateTimeArray[3] = getLoopArray(0, 23);
    dateTimeArray[4] = getLoopArray(0, 59);
    dateTimeArray[5] = getLoopArray(0, 59);
    
    dateTimeArray.forEach((current,index) => {
    dateTime.push(current.indexOf(defaultDate[index]));
    });
    
    return {
    dateTimeArray: dateTimeArray,
    dateTime: dateTime
    }
   }
   module.exports = {
    dateTimePicker: dateTimePicker,
    getMonthDay: getMonthDay
   }
View Code

 

posted @ 2022-03-29 17:52  野鹤亦闲云  阅读(152)  评论(0编辑  收藏  举报