menduner-uniapp/components/ResumeStatus/index.vue

<template>
	<slot name="header"></slot>
	<view class="content">
		<view v-for="(item,index) in items" :key="item.title" class="content-box">
			<view class="content-box-value">
				{{ item.value }}
			</view>
			<view class="content-box-title">
				{{ item.title }}
			</view>
		</view>
	</view>
	
</template>

<script setup>
import { reactive } from 'vue';
import { getRecommendCount } from '@/api/position.js'
const items = reactive([
	{
		value: 0,
		title: '已推荐',
		key: '0'
	},
	{
		value: 0,
		title: '已入职',
		key: '1'
	},
	{
		value: 0,
		title: '已结算',
		key: '2'
	}
])

async function recommendCount () {
	const { data } = await getRecommendCount()
	items.forEach(e => {
		e.value = data.find(e => e.key === e.key)?.value || 0
	})
}
recommendCount()
</script>

<style scoped lang="scss">
.content {
	display: flex;
	justify-content: space-around;
	padding: 36rpx 12rpx;
	&-box {
		font-size: 20rpx;
		color: #999;
		text-align: center;
		&-value {
			font-size: 1.8em;
			color: #000;
		}
	}
}
</style>