43 lines
911 B
Plaintext
43 lines
911 B
Plaintext
<template>
|
|
<div class="mt-4">
|
|
<a-row :gutter="24">
|
|
<a-col :span="24">
|
|
<a-card
|
|
:bordered="false"
|
|
:tab-list="tabList"
|
|
:active-tab-key="activeKey"
|
|
@tab-change="(key) => onTabChange(key, 'key')"
|
|
>
|
|
<template v-if="activeKey === '1'">
|
|
<FluxTrend />
|
|
</template>
|
|
<template v-if="activeKey === '2'">
|
|
<VisitAmount />
|
|
</template>
|
|
</a-card>
|
|
</a-col>
|
|
</a-row>
|
|
</div>
|
|
</template>
|
|
<script lang="ts" setup>
|
|
import { ref } from 'vue';
|
|
import FluxTrend from './FluxTrend.vue';
|
|
import VisitAmount from './VisitAmount.vue';
|
|
|
|
const activeKey = ref('1');
|
|
const tabList = [
|
|
{
|
|
key: '1',
|
|
tab: '流量趋势',
|
|
},
|
|
{
|
|
key: '2',
|
|
tab: '访问量',
|
|
},
|
|
];
|
|
|
|
function onTabChange(value: string) {
|
|
activeKey.value = value;
|
|
}
|
|
</script>
|