54 lines
1.4 KiB
Vue

<route lang="json5" type="page">
{
layout: 'default',
style: {
navigationStyle: 'custom'
}
}
</route>
<template>
<view class="h-[calc(100vh-50px)] flex flex-col">
<TopNavigation :title="titleTab[curIndex]"></TopNavigation>
<scroll-view class="flex-1 box-border" scroll-y>
<AttendanceClockIn v-show="curIndex === 0"></AttendanceClockIn>
<AttendanceStatistics v-show="curIndex === 1"></AttendanceStatistics>
<AttendanceSet v-show="curIndex === 2"></AttendanceSet>
</scroll-view>
</view>
<CustomTabBar :list="list" :default-index="0" @change="change"></CustomTabBar>
</template>
<script lang="ts" setup>
import AttendanceClockIn from './AttendanceClockIn.vue'
import AttendanceStatistics from './AttendanceStatistics.vue'
import AttendanceSet from './AttendanceSet.vue'
import { TabBarItem } from '@/typings'
const pages = [AttendanceClockIn, AttendanceStatistics, AttendanceSet]
const titleTab = ['考勤打卡', '考勤统计', '设置']
const list = ref<Array<TabBarItem>>([
{
title: '打卡',
icon: 'home'
},
{
title: '统计',
icon: 'notification'
},
{
title: '设置',
icon: 'setting'
}
])
const curIndex = ref(0)
const change = (data: { value: number }) => {
curIndex.value = data.value
}
</script>
<style lang="scss" scoped>
page {
background-color: #f6f8fc;
}
</style>