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

<template>
	<ChartCard margin="30rpx 0 0 0" title="企业和分支机构人数">
		<view class="org-person" @click="router.push('/pages/quality/numberEmployees/index')">
			<!-- <view class="org-person-row">
				<view class="org-person-row_lab">
					集团总数
				</view>
				<view class="org-person-row_num">9521</view>
			</view> -->
			<view class="u-flex">
				<view class="org-person-row">
					<view class="org-person-row_lab">企业质量管理人数</view>
					<view class="org-person-row_num">{{ qmsOrgData?.CompanyPersonNum || 0 }}</view>
				</view>
				<view class="org-person-row">
					<view class="org-person-row_lab">项目质量管理人数</view>
					<view class="org-person-row_num">{{ qmsOrgData?.ProjectPersonNum || 0 }}</view>
				</view>
			</view>
			<view class="u-flex">
				<view class="org-person-row">
					<view class="org-person-row_lab">分支机构质量管理人数</view>
					<view class="org-person-row_num">{{ qmsOrgData?.BranchPersonNum || 0 }}</view>
				</view>
				<!-- <view class="org-person-row">
					<view class="org-person-row_lab">特种设备质保体系</view>
					<view class="org-person-row_num">9521</view>
				</view> -->
			</view>
		</view>
	</ChartCard>
</template>

<script setup>
import ChartCard from '@/components/chartCard.vue';
import {router} from '@/utils'
defineProps({
	qmsOrgData: {
		type: Object,
		default: () => {}
	}
});
</script>

<style lang="scss">
.org-person {
	&-row {
		flex: 1;
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		padding: 10rpx 0;
		&_lab {
			// width: 200rpx;
			font-size: 24rpx;
			color: #999999;
			line-height: 1;
		}
		&_num {
			// width: calc(100% - 200rpx);
			font-size: 28rpx;
			color: #333333;
			margin-top: 6rpx;
		}
	}
}
</style>