bmy/Vue_dbui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

first commit

Browse Source
This commit is contained in:
编码猿
2024-09-27 00:57:27 +08:00
commit 18df0f5e4b
2548 changed files with 253280 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

80
vue-ydui/example/routers/datetime.vue Normal file
View File

@@ -0,0 +1,80 @@
<template>
<yd-layout title="DateTime">
<yd-cell-group title="常规" class="demo-small-pitch">
<yd-cell-item arrow>
<span slot="left">Time：</span>
<yd-datetime type="time" v-model="datetime1" slot="right"></yd-datetime>
</yd-cell-item>
<yd-cell-item arrow>
<span slot="left">Day：</span>
<yd-datetime type="day" v-model="datetime2" slot="right"></yd-datetime>
</yd-cell-item>
<yd-cell-item arrow>
<span slot="left">Month：</span>
<yd-datetime type="month" v-model="datetime3" slot="right"></yd-datetime>
</yd-cell-item>
<yd-cell-item arrow>
<span slot="left">Date：</span>
<yd-datetime type="date" v-model="datetime4" slot="right"></yd-datetime>
</yd-cell-item>
<yd-cell-item arrow>
<span slot="left">DateTime：</span>
<yd-datetime type="datetime" v-model="datetime5" slot="right"></yd-datetime>
</yd-cell-item>
<yd-cell-item arrow>
<span slot="left">自定义模板：</span>
<yd-datetime type="date" :yearFormat="yearFormat" :monthFormat="monthFormat" :dayFormat="dayFormat" v-model="datetime6" slot="right"></yd-datetime>
</yd-cell-item>
</yd-cell-group>
<yd-cell-group title="可选时间" class="demo-small-pitch">
<yd-cell-item arrow>
<span slot="left">开始/结束年份：</span>
<yd-datetime startYear="1990" endYear="2020" type="date" v-model="datetime7" slot="right"></yd-datetime>
</yd-cell-item>
<yd-cell-item arrow>
<span slot="left">开始/结束小时：</span>
<yd-datetime startHour="9" endHour="18" type="time" v-model="datetime8" slot="right"></yd-datetime>
</yd-cell-item>
</yd-cell-group>
<yd-cell-group title="限制时间" class="demo-small-pitch">
<yd-cell-item arrow>
<span slot="left">时间段范围：</span>
<yd-datetime ref="datetime" startDate="2012-03-16 15:13" endDate="2019-10-21 22:21" v-model="datetime9" slot="right"></yd-datetime>
</yd-cell-item>
<p slot="bottom" class="demo-cell-bottom-tip">( 2012-03-16 15:13 ~ 2019-10-21 22:21 )</p>
</yd-cell-group>
<yd-button-group>
<yd-button size="large" @click.native="open">手动打开</yd-button>
</yd-button-group>
</yd-layout>
</template>
<script type="text/babel">
export default {
data() {
return {
datetime1: '12:18',
datetime2: '2018-03-29',
datetime3: '2018-03-29',
datetime4: '2018-03-29',
datetime5: '2016-06-06 06:06',
datetime6: '2017-05-11',
datetime7: '',
datetime8: '10:20',
datetime9: '',
yearFormat: '<span style="color:#F00;">{value}<i style="font-size: 12px;margin-left: 1px;">年</i></span>',
monthFormat: '<span style="color:#0BB20C;">{value}<i style="font-size: 12px;margin-left: 1px;">月</i></span>',
dayFormat: '<span style="color:#FFB400;">{value}<i style="font-size: 12px;margin-left: 1px;">日</i></span>'
}
},
methods: {
open() {
this.$refs.datetime.open();
}
}
}
</script>