时间选择器vue模板

在vue框架中如下:
https://mp.weixin.qq.com/s/tUwrH69ZenyF8YLOK-I_aA
在mako框架中,iview的时间选择器无法使用,只能选择element。

<%inherit file="/base.html"/>

<%block name="content">
<div id="app">
<el-date-picker v-model="pick_time" type="date" placeholder="选择日期"></el-date-picker>
<el-date-picker v-model="pick_time" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期"></el-date-picker>
<el-date-picker v-model="pick_time" type="datetime" placeholder="选择日期时间"></el-date-picker>
<el-date-picker v-model="pick_time" type="datetimerange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期"></el-date-picker>
</div>
</%block>
<script>
    Vue.use(iview);
    new Vue({
        el: '#app',
        data() {
            return {
                pick_time: '',
            }
        },
        methods: {
            p(s) {
                return s < 10 ? '0' + s : s
            },
            // 解析时间,返回年月日时分秒
            parse_time(time) {
                if (Object.prototype.toString.call(time) === '[object Date]') {
                    let time_array = []
                    const d = new Date(time)
                    const resDate = d.getFullYear() + '-' + this.p((d.getMonth() + 1)) + '-' + this.p(d.getDate())
                    const resTime = this.p(d.getHours()) + ':' + this.p(d.getMinutes()) + ':' + this.p(d.getSeconds())
                    let now_time = resDate + ' ' + resTime
                    time_array.push(now_time)
                    return time_array
                } else if (Object.prototype.toString.call(time) === '[object Array]') {
                    let time_array = []
                    for (let each of time) {
                        const d = new Date(each)
                        const resDate = d.getFullYear() + '-' + this.p((d.getMonth() + 1)) + '-' + this.p(d.getDate())
                        const resTime = this.p(d.getHours()) + ':' + this.p(d.getMinutes()) + ':' + this.p(d.getSeconds())
                        let now_time = resDate + ' ' + resTime
                        time_array.push(now_time)
                    }
                    return time_array
                } else {
                    return time
                }
            },
            // 解析时间,返回年月日
            parse_time_(time) {
                if (Object.prototype.toString.call(time) === '[object Date]') {
                    let time_array = []
                    const d = new Date(time)
                    const resDate = d.getFullYear() + '-' + this.p((d.getMonth() + 1)) + '-' + this.p(d.getDate())
                    let now_time = resDate
                    time_array.push(now_time)
                    return time_array
                } else if (Object.prototype.toString.call(time) === '[object Array]') {
                    let time_array = []
                    for (let each of time) {
                        const d = new Date(each)
                        const resDate = d.getFullYear() + '-' + this.p((d.getMonth() + 1)) + '-' + this.p(d.getDate())
                        let now_time = resDate
                        time_array.push(now_time)
                    }
                    return time_array
                } else {
                    return time
                }
            },
        },
        mounted() {

        }
    })
</script>
<style></style>
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容