menduner-uniapp/pagesB/inviteRecord/list.vue

<template>
	<view>
		<view
			class="list"
			v-for="item in items"
			:key="item.id"
		>
			<view class="list-top">
				<text class="list-top-person">牛人：{{ item.sendPerson?.name }}</text>
				<text class="list-top-time">{{ timesTampChange(item.createTime) }}</text>
			</view>
			<view class="list-remuneration">
				薪酬：
				{{ item.job?.payFrom }}
				{{ item.job?.payFrom && item.job?.payTo ? ' - ' : '' }}
				{{ item.job?.payTo }}
			</view>
			<view class="list-company">
				<text>{{ formatName(item.enterprise?.anotherName || item.enterprise?.name) }}</text>
				<text>{{ (item.enterprise?.anotherName || item.enterprise?.name) && item.job?.name ? ' · ' : '' }}</text>
				<text>{{ formatName(item.job?.name) }}</text>
			</view>
		</view>
	</view>
</template>

<script setup>
import { timesTampChange } from '@/utils/date'
import { formatName } from '@/utils/getText'

const props = defineProps({
	items: {
		type: Array,
		default: () => []
	}
})
</script>

<style lang="scss" scoped>
.list {
	background: #FFF;
	margin-top: 20rpx;
	&-top {
		padding: 20rpx;
		display: flex;
		justify-content: space-between;
		align-items: center;
		&-person {
			font-size: .9em;
			color: #333;
		}
		&-time {
			font-size: .75em;
			color: #999;
		}
	}
	&-company {
		padding: 30rpx 20rpx;
		font-size: 28rpx;
		color: #666;
		background: linear-gradient(90deg, #f5fcfc 0, #fcfbfa 100%);
	}
	&-remuneration {
		padding: 20rpx;
		font-size: 28rpx;
		color: #666;
	}
	
}
</style>