CNCEC_APP/pages/index/board/qms/educationCard.vue

<template>
	<ChartCard margin="30rpx 0 0 0" title="人员报验、培训及交底数">
		<view class="education u-flex">
			<view class="education-box">
				<view class="education-box-lab">人员报验数</view>
				<view class="education-box-num u-margin-top-20">800</view>
			</view>
			<view class="education-box">
				<view class="education-box-lab">培训人次</view>
				<view class="education-box-num u-margin-top-20">800</view>
			</view>
			<view class="education-box">
				<view class="education-box-lab">技术交底人次</view>
				<view class="education-box-num u-margin-top-20">800</view>
			</view>
		</view>
	</ChartCard>
</template>

<script setup>
import ChartCard from '@/components/chartCard.vue';
</script>

<style lang="scss" scoped>
.education {
	width: 100%;
	&-box {
		flex: 1;
		display: flex;
		flex-direction: column;
		align-items: center;
		&-lab {
			color: #999999;
			font-size: 24rpx;
		}
		&-num {
			color: #333333;
			font-size: 28rpx;
		}
	}
}
</style>