menduner-uniapp/pagesA/recommendation/list.vue

<template>
	<view>
		<view
			class="list ss-m-x-15"
			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">
				薪酬：
				<span v-if="item.job?.payFrom && item.job?.payTo">{{ item.job?.payFrom + '-' + item.job?.payTo }}</span>
				<span v-else>面议</span>
			</view>
			<view class="list-company" style="border-radius: 0 0 12px 12px;">
				<text>{{ item.enterprise?.anotherName }}</text>
				<text>{{ item.enterprise?.anotherName && item.job?.name ? ' · ' : '' }}</text>
				<text>{{ item.job?.name }}</text>
			</view>
		</view>
	</view>
</template>

<script setup>
import { timesTampChange } from '@/utils/date'
const props = defineProps({
	items: {
		type: Array,
		default: () => []
	}
})
</script>

<style lang="scss" scoped>
.list {
	background: #fff;
	margin-top: 20rpx;
	border-radius: 12px;
	&-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>