<template>
    <div class="vistiorReg">
        <van-tabs
            v-model="active"
            line-width="100px"
            title-active-color="black"
        >
            <van-tab>
                <template #title class="tit">
                    登记预约
                </template>
                <div>
                    <appoint />
                </div>
            </van-tab>
            <van-tab>
                <template #title class="tit">
                    历史登记
                </template>
                <div style="overflow:auto">
                    <vistor />
                </div>
            </van-tab>
        </van-tabs>
    </div>
</template>
<script>
import appoint from "./components/appointment.vue";
import vistor from "./components/visitorRegister.vue";
export default {
    components: {
        appoint,
        vistor
    },
    data() {
        return {
            active: 0
        };
    }
};
</script>
<style lang="scss">
.vistiorReg {
    // background: rgba(245, 245, 245, 1);
    .van-tabs__line {
        background-color: rgb(0, 47, 167) !important;
    }
    .van-tabs__wrap {
        padding-top: 2vw;
        background: white !important;
    }

    .van-tabs__nav {
        justify-content: space-around !important;
        background: white !important;
    }
}
</style>
