menduner/src/views/recruit/personal/jobFair/index.vue

<template>
	<div class="default-width">
		<buttons :current="3" style="position: sticky;" class="mx-4 mb-3"></buttons>
		<div v-if="list.length > 0">
			<div class="px-3 content">
				<v-card elevation="5" v-for="val in list" :key="val.id">
					<img :src="val.headImg" alt="" style="object-fit: contain; width: 100%;">
					<div class="pa-3">
						<div class="color-666">活动时间：{{ timesTampChange(val.startTime, 'Y-M-D') }}至{{ timesTampChange(val.endTime, 'Y-M-D') }}</div>
						<div class="text-end">
							<v-btn color="primary" variant="outlined" @click.stop="handleJoin(val)">查看详情</v-btn>
						</div>
					</div>
				</v-card>
			</div>
		</div>
		<Empty v-else message="暂无开启的招聘会，去看看其他吧~" />
	</div>
</template>

<script setup>
defineOptions({ name: 'jobFair' })
import { ref } from 'vue'
import { timesTampChange } from '@/utils/date'
import { getJobFairList } from '@/api/recruit/personal/jobFair'
import buttons from '@/views/recruit/personal/components/buttons.vue'
import { useRouter } from 'vue-router'; const router = useRouter()

const list = ref([])

// 招聘会列表
const getList = async () => {
	const data = await getJobFairList()
	list.value = data || []
}
getList()

const handleJoin = (val) => {
	if (!val?.id) return
	const path = '/recruit/personal/jobFair/details/' + val.id
	router.push(path)

	// 面包屑储存
	// let text = val.title ? val.title.replace(/<[^>]+>/g, ' ') : '' // 去掉所有 HTML 标签
	// text = text ? text.replace(/\s+/g, ' ').trim() : '' // 去掉多余的空格
	// const list = JSON.stringify([
	// 	{ text: '招聘会' , path: '/recruit/personal/jobFair' },
	// 	{ text, path }
	// ])
	// 跳转
  // router.push({ path, query: { breadcrumbs: list } })
}
</script>

<style scoped lang="scss">
.content {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
  min-height: auto;
}
</style>