|
4 | 4 | <yd-cell-group title="常规" class="demo-small-pitch">
|
5 | 5 | <yd-cell-item arrow>
|
6 | 6 | <span slot="left">Time:</span>
|
7 |
| - <yd-datetime type="time" v-model="datetime1" slot="right"></yd-datetime> |
| 7 | + <yd-datetime type="date" :value="datetime1" :init-emit="false" @input="submitAs" slot="right"></yd-datetime> |
8 | 8 | </yd-cell-item>
|
9 |
| - <yd-cell-item arrow> |
10 |
| - <span slot="left">Day:</span> |
11 |
| - <yd-datetime type="day" v-model="datetime2" slot="right"></yd-datetime> |
12 |
| - </yd-cell-item> |
13 |
| - <yd-cell-item arrow> |
14 |
| - <span slot="left">Month:</span> |
15 |
| - <yd-datetime type="month" v-model="datetime3" slot="right"></yd-datetime> |
16 |
| - </yd-cell-item> |
17 |
| - <yd-cell-item arrow> |
18 |
| - <span slot="left">Date:</span> |
19 |
| - <yd-datetime type="date" v-model="datetime4" slot="right"></yd-datetime> |
20 |
| - </yd-cell-item> |
21 |
| - <yd-cell-item arrow> |
22 |
| - <span slot="left">DateTime:</span> |
23 |
| - <yd-datetime type="datetime" v-model="datetime5" slot="right"></yd-datetime> |
24 |
| - </yd-cell-item> |
25 |
| - <yd-cell-item arrow> |
26 |
| - <span slot="left">自定义模板:</span> |
27 |
| - <yd-datetime type="date" :yearFormat="yearFormat" :monthFormat="monthFormat" :dayFormat="dayFormat" v-model="datetime6" slot="right"></yd-datetime> |
28 |
| - </yd-cell-item> |
29 |
| - </yd-cell-group> |
30 |
| - |
31 |
| - <yd-cell-group title="可选时间" class="demo-small-pitch"> |
32 |
| - <yd-cell-item arrow> |
33 |
| - <span slot="left">开始/结束年份:</span> |
34 |
| - <yd-datetime startYear="1990" endYear="2020" type="date" v-model="datetime7" slot="right"></yd-datetime> |
35 |
| - </yd-cell-item> |
36 |
| - <yd-cell-item arrow> |
37 |
| - <span slot="left">开始/结束小时:</span> |
38 |
| - <yd-datetime startHour="9" endHour="18" type="time" v-model="datetime8" slot="right"></yd-datetime> |
39 |
| - </yd-cell-item> |
40 |
| - </yd-cell-group> |
41 |
| - |
42 |
| - <yd-cell-group title="限制时间" class="demo-small-pitch"> |
43 |
| - <yd-cell-item arrow> |
44 |
| - <span slot="left">时间段范围:</span> |
45 |
| - <yd-datetime ref="datetime" startDate="2012-03-16 15:13" endDate="2019-10-21 22:21" v-model="datetime9" slot="right"></yd-datetime> |
46 |
| - </yd-cell-item> |
47 |
| - <p slot="bottom" class="demo-cell-bottom-tip">( 2012-03-16 15:13 ~ 2019-10-21 22:21 )</p> |
48 | 9 | </yd-cell-group>
|
49 | 10 |
|
50 |
| - <yd-button-group> |
51 |
| - <yd-button size="large" @click.native="open">手动打开</yd-button> |
52 |
| - </yd-button-group> |
53 | 11 | </yd-layout>
|
54 | 12 | </template>
|
55 | 13 |
|
56 | 14 | <script type="text/babel">
|
57 | 15 | export default {
|
58 | 16 | data() {
|
59 | 17 | return {
|
60 |
| - datetime1: '12:18', |
61 |
| - datetime2: '2018-03-29', |
62 |
| - datetime3: '2018-03-29', |
63 |
| - datetime4: '2018-03-29', |
64 |
| - datetime5: '2016-06-06 06:06', |
65 |
| - datetime6: '2017-05-11', |
66 |
| - datetime7: '', |
67 |
| - datetime8: '10:20', |
68 |
| - datetime9: '', |
69 |
| - yearFormat: '<span style="color:#F00;">{value}<i style="font-size: 12px;margin-left: 1px;">年</i></span>', |
70 |
| - monthFormat: '<span style="color:#0BB20C;">{value}<i style="font-size: 12px;margin-left: 1px;">月</i></span>', |
71 |
| - dayFormat: '<span style="color:#FFB400;">{value}<i style="font-size: 12px;margin-left: 1px;">日</i></span>' |
| 18 | + datetime1: '' |
72 | 19 | }
|
73 | 20 | },
|
74 | 21 | methods: {
|
75 |
| - open() { |
76 |
| - this.$refs.datetime.open(); |
| 22 | + submitAs(val) { |
| 23 | + console.log(val); |
| 24 | + this.$emit('submit-as', val); |
77 | 25 | }
|
78 | 26 | }
|
79 | 27 | }
|
|
0 commit comments