0f677893
梁灏
update DatePicker
|
1
|
<template>
|
3cf7cfd1
梁灏
update DatePicker
|
2
|
<div style="margin: 50px">
|
c46f385a
梁灏
update DatePicker
|
3
4
|
<br>
<row>
|
336b4f46
梁灏
fixed #132
|
5
|
<i-col span="8">
|
2533a192
梁灏
update DatePicker
|
6
|
<!--<i-button @click="setDate">set date</i-button>-->
|
e1874103
梁灏
update DatePicker
|
7
8
9
10
11
12
13
|
<date-picker
style="width:200px"
placeholder="请选择日期"
:value.sync="value"
:options="options"
@on-change="change"
:format="format"
|
e1874103
梁灏
update DatePicker
|
14
|
@on-open-change="change2"></date-picker>
|
c46f385a
梁灏
update DatePicker
|
15
|
</i-col>
|
336b4f46
梁灏
fixed #132
|
16
|
<i-col span="8">
|
3cf7cfd1
梁灏
update DatePicker
|
17
18
19
20
21
22
23
|
<date-picker
type="daterange"
style="width:200px"
placeholder="请选择日期"
:value.sync="value2"
align="right"
:options="options2"></date-picker>
|
c46f385a
梁灏
update DatePicker
|
24
25
|
</i-col>
</row>
|
0f677893
梁灏
update DatePicker
|
26
27
28
29
|
</div>
</template>
<script>
export default {
|
0f677893
梁灏
update DatePicker
|
30
|
data () {
|
50637863
梁灏
update DatePicker
|
31
|
return {
|
2533a192
梁灏
update DatePicker
|
32
|
// value: new Date(),
|
e55f00ff
梁灏
update DatePicker
|
33
|
value: '2016-12-25',
|
3cf7cfd1
梁灏
update DatePicker
|
34
|
value2: ['2016-12-17', '2017-01-05'],
|
e0cd7f90
梁灏
fixed #134
|
35
|
options2: {
|
3cf7cfd1
梁灏
update DatePicker
|
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
|
shortcuts: [
{
text: '今天',
value () {
// return new Date();
return '1/2/19'
},
onClick (picker) {
console.log('点击了今天');
}
},
{
text: '昨天',
value () {
const date = new Date();
date.setTime(date.getTime() - 3600 * 1000 * 24);
return date;
},
onClick () {
console.log('点击了昨天');
}
},
{
text: '最近三个月',
value () {
const date = new Date();
date.setTime(date.getTime() - 3600 * 1000 * 24 * 7);
return date;
},
onClick () {
console.log('点击了一周前');
}
}
]
|
e0cd7f90
梁灏
fixed #134
|
70
|
},
|
50637863
梁灏
update DatePicker
|
71
72
|
options: {
disabledDate(time) {
|
13be4434
梁灏
update DatePicker
|
73
74
|
// console.log(time)
// return time.getFullYear() < 2016;
|
50637863
梁灏
update DatePicker
|
75
76
|
return time.getTime() < Date.now() - 8.64e7;
// return time && time.valueOf() < Date.now();
|
2533a192
梁灏
update DatePicker
|
77
78
79
80
81
|
},
shortcuts: [
{
text: '今天',
value () {
|
e55f00ff
梁灏
update DatePicker
|
82
83
|
// return new Date();
return '1/2/19'
|
2533a192
梁灏
update DatePicker
|
84
|
},
|
e55f00ff
梁灏
update DatePicker
|
85
|
onClick (picker) {
|
2533a192
梁灏
update DatePicker
|
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
|
console.log('点击了今天');
}
},
{
text: '昨天',
value () {
const date = new Date();
date.setTime(date.getTime() - 3600 * 1000 * 24);
return date;
},
onClick () {
console.log('点击了昨天');
}
},
{
|
6e572d44
梁灏
fixed #133
|
101
|
text: '最近三个月',
|
2533a192
梁灏
update DatePicker
|
102
103
104
105
106
|
value () {
const date = new Date();
date.setTime(date.getTime() - 3600 * 1000 * 24 * 7);
return date;
},
|
e55f00ff
梁灏
update DatePicker
|
107
108
109
|
onClick () {
console.log('点击了一周前');
}
|
2533a192
梁灏
update DatePicker
|
110
111
|
}
]
|
c46f385a
梁灏
update DatePicker
|
112
|
},
|
2533a192
梁灏
update DatePicker
|
113
|
format: 'yyyy-MM-dd'
|
50637863
梁灏
update DatePicker
|
114
|
}
|
0f677893
梁灏
update DatePicker
|
115
116
|
},
computed: {},
|
c46f385a
梁灏
update DatePicker
|
117
118
|
methods: {
change (date) {
|
344131a7
梁灏
update DatePicker
|
119
|
console.log(date)
|
c46f385a
梁灏
update DatePicker
|
120
121
122
|
},
change2 (s) {
// console.log(s)
|
2533a192
梁灏
update DatePicker
|
123
124
125
|
},
setDate () {
this.value = '2016-12-24'
|
c46f385a
梁灏
update DatePicker
|
126
127
|
}
}
|
0f677893
梁灏
update DatePicker
|
128
129
|
}
</script>
|