56 lines
1.7 KiB
Vue
56 lines
1.7 KiB
Vue
<template>
|
|
<a-row :gutter="16">
|
|
<a-col :lg="5" :md="8" :sm="24">
|
|
<a-card :bordered="false" :hoverable="true">
|
|
<a-statistic :value="0" class="text-center" title="已完成的项目" />
|
|
</a-card>
|
|
</a-col>
|
|
<a-col :lg="5" :md="8" :sm="24">
|
|
<a-card :bordered="false" :hoverable="true">
|
|
<a-statistic :value="c" class="text-center" title="正在进行的项目" />
|
|
</a-card>
|
|
</a-col>
|
|
<a-col :lg="5" :md="8" :sm="24">
|
|
<a-card :bordered="false" :hoverable="true">
|
|
<a-statistic :value="0" class="text-center" title="还未开始的项目" />
|
|
</a-card>
|
|
</a-col>
|
|
<a-col :lg="9" :md="24">
|
|
<a-card :bordered="false" :hoverable="true">
|
|
<a-row>
|
|
<a-col :span="12">
|
|
<a-statistic :value="8893" class="text-center" title="用户总量" />
|
|
</a-col>
|
|
<a-col :span="12">
|
|
<a-statistic :value="1255" :value-style="{ color: '#3f8600' }" class="text-center">
|
|
<template #title>
|
|
<a-dropdown>
|
|
<span>
|
|
当月活跃用户
|
|
<a-icon type="down" />
|
|
</span>
|
|
<a-menu slot="overlay">
|
|
<a-menu-item>当月活跃用户</a-menu-item>
|
|
<a-menu-item>当年活跃用户</a-menu-item>
|
|
</a-menu>
|
|
</a-dropdown>
|
|
</template>
|
|
<template #prefix>
|
|
<a-icon :style="{ fontSize: '13px' }" type="arrow-up" />
|
|
</template>
|
|
</a-statistic>
|
|
</a-col>
|
|
</a-row>
|
|
</a-card>
|
|
</a-col>
|
|
</a-row>
|
|
</template>
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
c: 6,
|
|
};
|
|
},
|
|
};
|
|
</script> |