<template>
    <div style="background:white;">

        <van-nav-bar :title="imei" left-text="返回" left-arrow @click-left="$router.back()" />

        <yd-cell-item arrow>
            <span slot="left">开始日期：</span>
            <span slot="right">
                <yd-datetime type="date" v-model="startDate" style="width:auto"></yd-datetime>
            </span>
        </yd-cell-item>
        <yd-cell-item arrow>
            <span slot="left">开始时间：</span>
            <span slot="right">
                <yd-datetime type="time" v-model="startTime" slot="right" style="width:auto"></yd-datetime>
            </span>
        </yd-cell-item>
        <yd-cell-item arrow>
            <span slot="left">结束日期：</span>
            <span slot="right">
                <yd-datetime  type="date" v-model="endDate"  style="width:auto"></yd-datetime>
            </span>
        </yd-cell-item>
        <yd-cell-item arrow>
            <span slot="left">结束时间：</span>
            <span slot="right" >
                <yd-datetime  type="time" v-model="endTime" style="width:auto"></yd-datetime>
            </span>
        </yd-cell-item>

        <div style="display:flex;justify-content:center;padding-bottom:30px">
            <yd-button  style="width:80%" size="large" color="#fff" bgcolor="#2196f3" shape="circle" @click.native="searchRoute">查询</yd-button>
        </div>
        

    </div>
</template>
 
<script type="text/babel">
import Vue from 'vue';
import {NavBar} from 'vant';

Vue.use(NavBar);

export default {
    created(){
        this.imei = this.$route.params.imei;

        let dateTime = new Date()
        this.startDate = dateTime.getFullYear() + '-' + (dateTime.getMonth() + 1) + '-' + dateTime.getDate();
        this.endDate = this.startDate;
        this.startTime = '00:00';
        this.endTime = '23:59';

        console.log(this.startDate, this.startTime, this.endDate, this.endTime);
    },
    data() {
        return {
            startDate: '',
            startTime: '00:00',
            endDate: '',
            endTime: '23:59',
            imei:''
        }
    },
    methods:{
        searchRoute(){
            let that = this;
            let startTime = this.startDate +' '+  this.startTime + ':00';
            let endTime = this.endDate  +' '+  this.endTime + ':59';
            
            this.$router.push({name:'yys_route_play',params:{imei:this.imei, startTime: startTime, endTime: endTime}});
    
        },
        dateTimeChange(e){
            console.log(e, 'change obj')
        }
    },
}
</script>

<style lang="css" scoped>
.select-butt{
    padding: 10px;
    margin: auto;
}
.date-value-style{
    width: auto;
}
/* .yd-cell-right .yd-cell-arrow{
    width: 100%;
} */
</style>