<template>
    <div id="mainPage">
        <bottomTab :curTab="thisTab"></bottomTab>

        <mu-paper :z-depth="1">
            <mu-time-picker :no-display="!display" :view-type="viewType" :time.sync="time" :format="type" :landscape="landscape"></mu-time-picker>
        </mu-paper>

        <div @click="turnSport">
            <Hand :state="state"></Hand>
        </div>
        <div>

        </div>

    </div>
</template>

<script>
    import axios from 'axios';
    import bottomTab from '../components/bottomTab'
    import Hand from '@/components/Hand.vue'
    let qs = require('qs');
    import Global from '../Global.js'
    export default {
        data() {
            return {
                thisTab: 'SPORT',
                state:true,
                time: undefined,
                landscape: false,
                display: true,
                type: 'ampm',
                viewType: 'clock',
                lists: []
            }
        },
        mounted() {
        },
        methods: {
            turnSport(){
                console.log(123);
                this.state = false
            }
        },
        components: {
            bottomTab,Hand
        }
    }
</script>

<style scoped>
    #mainPage {
        width: 100%;
        height: 100%;
        overflow: hidden;
        display: block;
        margin: 0 auto;
        background: #000;
        overflow-y: scroll;
        color: red;
    }
</style>
