1 /* JS代码部分 */
2
3 const date = new Date()
4 const years = []
5 const months = []
6 const days = []
7 const hours = []
8 const minutes = []
9 var thisMon = date.getMonth();
10 var thisDay = date.getDate();
11
12 for (let i = 2017; i <= date.getFullYear() + 1; i++) {
13 years.push(i)
14 }
15
16 for (let i = date.getMonth(); i <= 11; i++) {
17 var k = i;
18 if (0 <= i && i < 9) {
19 k = "0" + (i + 1);
20 } else {
21 k = (i + 1);
22 }
23 months.push(k)
24 }
25 if (0 <= thisMon && thisMon < 9) {
26 thisMon = "0" + (thisMon + 1);
27 } else {
28 thisMon = (thisMon + 1);
29 }
30 if (0 <= thisDay && thisDay < 10) {
31 thisDay = "0" + thisDay;
32 }
33
34 var totalDay = mGetDate(date.getFullYear(), thisMon);
35 for (let i = 1; i <= 31; i++) {
36 var k = i;
37 if (0 <= i && i < 10) {
38 k = "0" + i
39 }
40 days.push(k)
41 }
42
43 for (let i = 0; i <= 23; i++) {
44 var k = i;
45 if (0 <= i && i < 10) {
46 k = "0" + i
47 }
48 hours.push(k)
49 }
50 for (let i = 0; i <= 59; i++) {
51 var k = i;
52 if (0 <= i && i < 10) {
53 k = "0" + i
54 }
55 minutes.push(k)
56 }
57 function mGetDate(year, month) {
58 var d = new Date(year, month, 0);
59 return d.getDate();
60 }
61 Page({
62 data: {
63 years: years,
64 year: date.getFullYear(),
65 months: months,
66 month: thisMon,
67 days: days,
68 day: thisDay,
69 value: [1, thisMon - 1, thisDay - 1, 0, 0],
70 hours: hours,
71 hour: "00",
72 minutes: minutes,
73 minute: "00",
74 },
75 bindChange: function (e) {
76 const val = e.detail.value
77 this.setData({
78 year: this.data.years[val[0]],
79 month: this.data.months[val[1]],
80 day: this.data.days[val[2]],
81 hour: this.data.hours[val[3]],
82 minute: this.data.minutes[val[4]],
83 })
84 var totalDay = mGetDate(this.data.year, this.data.month);
85 var changeDate = [];
86 for (let i = 1; i <= totalDay; i++) {
87 var k = i;
88 if (0 <= i && i < 10) {
89 k = "0" + i
90 }
91 changeDate.push(k)
92 }
93 this.setData({
94 days: changeDate
95 })
96 },
97
98 })
/* css代码部分 */
.time-title{
float:left;
width:20%;
text-align:center;
color:#45BCE8;
}
.picker-text{
text-align:center;
}
/*mask*/
.time_screens {
width: 100%;
position: fixed;
bottom: 0;
left: 0;
z-index: 1000;
opacity: 0.5;
overflow: hidden;
}
/* html代码部分 */
<view class="time_screens">
<view style="text-align:center;color:#45BCE8">{{year}}-{{month}}-{{day}}
<label style="float:left;margin-left:30px;">取消</label>
<label style="float:right;margin-right:30px;">确定</label>
</view>
<view style="border-top:1px solid #45BCE8;height:25px;font-size:14px;">
</view>
<picker-view indicator-style="height: 50px;" style="width: 100%; height: 300px;" value="{{value}}" bindchange="bindChange">
<picker-view-column class="picker-text">
<view wx:for="{{years}}" style="line-height: 50px">{{item}}年</view>
</picker-view-column>
<picker-view-column class="picker-text">
<view wx:for="{{months}}" style="line-height: 50px">{{item}}月</view>
</picker-view-column>
<picker-view-column class="picker-text">
<view wx:for="{{days}}" style="line-height: 50px">{{item}}日</view>
</picker-view-column>
</picker-view>
</view>
/* Json */
{
"navigationBarTitleText": "XXXX"
}
