Blame view

test/routers/date.vue 3.15 KB
0f677893   梁灏   update DatePicker
1
2
  <template>
      <div style="margin: 50px">
c46f385a   梁灏   update DatePicker
3
4
5
          <br>
          <row>
              <i-col span="4">
2533a192   梁灏   update DatePicker
6
                  <!--<i-button @click="setDate">set date</i-button>-->
e1874103   梁灏   update DatePicker
7
8
9
10
11
12
13
14
                  <date-picker
                          style="width:200px"
                          placeholder="请选择日期"
                          :value.sync="value"
                          :options="options"
                          @on-change="change"
                          :format="format"
                          @on-open-change="change2"></date-picker>
c46f385a   梁灏   update DatePicker
15
16
17
18
19
20
21
22
              </i-col>
              <i-col span="4">
                  <date-picker type="year" style="width:200px" placeholder="请选择日期" :value.sync="value" :options="options"></date-picker>
              </i-col>
              <i-col span="4">
                  <date-picker type="month" style="width:200px" placeholder="请选择日期" :value.sync="value" :options="options"></date-picker>
              </i-col>
          </row>
0f677893   梁灏   update DatePicker
23
24
25
26
      </div>
  </template>
  <script>
      export default {
0f677893   梁灏   update DatePicker
27
          data () {
50637863   梁灏   update DatePicker
28
              return {
2533a192   梁灏   update DatePicker
29
30
  //                value: new Date(),
                  value: '',
50637863   梁灏   update DatePicker
31
32
                  options: {
                      disabledDate(time) {
13be4434   梁灏   update DatePicker
33
34
  //                        console.log(time)
  //                        return time.getFullYear() < 2016;
50637863   梁灏   update DatePicker
35
36
                          return time.getTime() < Date.now() - 8.64e7;
  //                        return time && time.valueOf() < Date.now();
2533a192   梁灏   update DatePicker
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
70
                      },
                      shortcuts: [
                          {
                              text: '今天',
                              value () {
                                  return new Date();
                              },
                              onClick () {
                                  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('点击了一周前');
  //                            }
                          }
                      ]
c46f385a   梁灏   update DatePicker
71
                  },
2533a192   梁灏   update DatePicker
72
                  format: 'yyyy-MM-dd'
50637863   梁灏   update DatePicker
73
              }
0f677893   梁灏   update DatePicker
74
75
          },
          computed: {},
c46f385a   梁灏   update DatePicker
76
77
          methods: {
              change (date) {
344131a7   梁灏   update DatePicker
78
                  console.log(date)
c46f385a   梁灏   update DatePicker
79
80
81
              },
              change2 (s) {
  //                console.log(s)
2533a192   梁灏   update DatePicker
82
83
84
              },
              setDate () {
                  this.value = '2016-12-24'
c46f385a   梁灏   update DatePicker
85
86
              }
          }
0f677893   梁灏   update DatePicker
87
88
      }
  </script>