<template>
|
<div class="data-board-home-content-center-top">
|
<DataBoardCenterDataItem
|
:value="detail?.currentMonthSumBountyReleaseAmount"
|
label="当月发放额"
|
:image="DataBoardCenterIcon1"
|
></DataBoardCenterDataItem>
|
<DataBoardCenterDataItem
|
:value="detail?.currentMonthSumBountyUseAmount"
|
label="当月使用额"
|
:image="DataBoardCenterIcon2"
|
></DataBoardCenterDataItem>
|
<DataBoardCenterDataItem
|
:value="detail?.currentMonthInsurePeopleCount"
|
label="当月投保人数"
|
:precision="0"
|
:image="DataBoardCenterIcon3"
|
></DataBoardCenterDataItem>
|
</div>
|
</template>
|
|
<script setup lang="ts">
|
import DataBoardCenterIcon1 from '@/assets/dataBoard/data-board-center-icon1.png';
|
import DataBoardCenterIcon2 from '@/assets/dataBoard/data-board-center-icon2.png';
|
import DataBoardCenterIcon3 from '@/assets/dataBoard/data-board-center-icon3.png';
|
import DataBoardCenterDataItem from './DataBoardCenterDataItem.vue';
|
import { useGetDataBoardOverview } from '../hooks';
|
|
defineOptions({
|
name: 'DataBoardCenterDataContent',
|
});
|
|
const { detail } = useGetDataBoardOverview();
|
</script>
|
|
<style lang="scss" scoped>
|
@use '@/style/common.scss' as *;
|
|
.data-board-home-content-center-top {
|
display: grid;
|
margin-bottom: 6px;
|
padding: 0 20px;
|
grid-template-columns: repeat(3, 1fr);
|
grid-column-gap: 16px;
|
}
|
</style>
|
