|  | @@ -0,0 +1,108 @@
 | 
	
		
			
				|  |  | +<template>
 | 
	
		
			
				|  |  | +	<div class="default-width">
 | 
	
		
			
				|  |  | +		<buttons :current="3" style="position: sticky;" class="mx-4"></buttons>
 | 
	
		
			
				|  |  | +		<div class="px-4">
 | 
	
		
			
				|  |  | +			<!-- 搜索框 -->
 | 
	
		
			
				|  |  | +			<div class="white-bgc py-5">
 | 
	
		
			
				|  |  | +				<headSearch v-model="content" placeholder="搜索公司关键字" @handleSearch="handleSearch"></headSearch>
 | 
	
		
			
				|  |  | +			</div>
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +			<!-- 参与招聘会企业列表 -->
 | 
	
		
			
				|  |  | +			<div class="mt-3">
 | 
	
		
			
				|  |  | +				<div class="content" v-if="list.length">
 | 
	
		
			
				|  |  | +					<v-card elevation="5" v-for="val in list" :key="val.id" class="cursor-pointer">
 | 
	
		
			
				|  |  | +						<div class="d-flex pa-4 pb-2">
 | 
	
		
			
				|  |  | +							<img :src="val.logoUrl" style="width: 80px; height: 80px; border-radius: 4px;" />
 | 
	
		
			
				|  |  | +							<div style="max-width: 455px;">
 | 
	
		
			
				|  |  | +								<h3 v-ellipse-tooltip class="enterprise-name ml-3">{{ formatName(val.name) }}</h3>
 | 
	
		
			
				|  |  | +								<p class="font-size-14 color-666 mt-1 mb-2 ml-3">{{ val.industryName }}</p>
 | 
	
		
			
				|  |  | +								<div class="flex-nowrap overflow-hidden pl-3" style="height: 35px;">
 | 
	
		
			
				|  |  | +									<v-hover v-slot="{ isHovering, props }" v-for="(job, index) in val.job" :key="index">
 | 
	
		
			
				|  |  | +										<v-chip v-bind="props" :class="isHovering ? 'elevation-5' : 'elevation-1'" class="mr-2 mb-4 display-inline-block" variant="flat" color="primary" size="small">{{ job.name }}</v-chip>
 | 
	
		
			
				|  |  | +									</v-hover>
 | 
	
		
			
				|  |  | +								</div>
 | 
	
		
			
				|  |  | +							</div>
 | 
	
		
			
				|  |  | +						</div>
 | 
	
		
			
				|  |  | +						<div class="card-bottom">{{ val.jobNum }}个在线职位招聘中</div>
 | 
	
		
			
				|  |  | +					</v-card>
 | 
	
		
			
				|  |  | +				</div>
 | 
	
		
			
				|  |  | +				<Empty v-else class="" message="暂无数据"></Empty>
 | 
	
		
			
				|  |  | +			</div>
 | 
	
		
			
				|  |  | +		</div>
 | 
	
		
			
				|  |  | +	</div>
 | 
	
		
			
				|  |  | +</template>
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +<script setup>
 | 
	
		
			
				|  |  | +defineOptions({ name: 'jobFairDetails' })
 | 
	
		
			
				|  |  | +import { ref } from 'vue'
 | 
	
		
			
				|  |  | +import { formatName } from '@/utils/getText'
 | 
	
		
			
				|  |  | +import buttons from '@/views/recruit/personal/components/buttons.vue'
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +const content = ref('')
 | 
	
		
			
				|  |  | +const list = ref([
 | 
	
		
			
				|  |  | +	{
 | 
	
		
			
				|  |  | +		name: '厦门嘉逸希尔顿格芮精选酒店厦门嘉逸希尔顿格芮精选酒店',
 | 
	
		
			
				|  |  | +		id: 1,
 | 
	
		
			
				|  |  | +		industryName: '全服务中档酒店/4星级',
 | 
	
		
			
				|  |  | +		jobNum: 5,
 | 
	
		
			
				|  |  | +		logoUrl: 'https://minio.menduner.com/dev/enterprise/1872204532362121217/img/3e1ae92796fd6bc6bbbb38333dbab5ac886887b01d5bec19a90e6134e6c34b21.jpeg',
 | 
	
		
			
				|  |  | +		job: [
 | 
	
		
			
				|  |  | +			{ name: 'Executive Chef 行政总厨' },
 | 
	
		
			
				|  |  | +			{ name: 'Sales Manager 销售经理' },
 | 
	
		
			
				|  |  | +			{ name: 'Trainee Chef Intern 实习厨师' }
 | 
	
		
			
				|  |  | +		]
 | 
	
		
			
				|  |  | +	},
 | 
	
		
			
				|  |  | +	{
 | 
	
		
			
				|  |  | +		name: '厦门嘉逸希尔顿格芮精选酒店',
 | 
	
		
			
				|  |  | +		id: 2,
 | 
	
		
			
				|  |  | +		industryName: '酒店集团',
 | 
	
		
			
				|  |  | +		jobNum: 5,
 | 
	
		
			
				|  |  | +		logoUrl: 'https://www.mendunerhr.com/images/1570688031889_149244186519015424_mini.jpg',
 | 
	
		
			
				|  |  | +		job: [
 | 
	
		
			
				|  |  | +			{ name: '行政总厨' },
 | 
	
		
			
				|  |  | +			{ name: '销售经理' },
 | 
	
		
			
				|  |  | +			{ name: '实习厨师' }
 | 
	
		
			
				|  |  | +		]
 | 
	
		
			
				|  |  | +	},
 | 
	
		
			
				|  |  | +	{
 | 
	
		
			
				|  |  | +		name: '厦门嘉逸希尔顿格芮精选酒店',
 | 
	
		
			
				|  |  | +		id: 2,
 | 
	
		
			
				|  |  | +		industryName: '酒店集团',
 | 
	
		
			
				|  |  | +		jobNum: 5,
 | 
	
		
			
				|  |  | +		logoUrl: 'https://www.mendunerhr.com/images/1721650339000_782425998783287296_mini.jpg',
 | 
	
		
			
				|  |  | +		job: [
 | 
	
		
			
				|  |  | +			{ name: '行政总厨' },
 | 
	
		
			
				|  |  | +			{ name: '销售经理' },
 | 
	
		
			
				|  |  | +			{ name: '实习厨师' }
 | 
	
		
			
				|  |  | +		]
 | 
	
		
			
				|  |  | +	},
 | 
	
		
			
				|  |  | +])
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +const handleSearch = (val) => {
 | 
	
		
			
				|  |  | +	console.log(val, 'handleSearch')
 | 
	
		
			
				|  |  | +}
 | 
	
		
			
				|  |  | +</script>
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +<style scoped lang="scss">
 | 
	
		
			
				|  |  | +.content {
 | 
	
		
			
				|  |  | +  display: grid;
 | 
	
		
			
				|  |  | +  grid-template-columns: repeat(2, 1fr);
 | 
	
		
			
				|  |  | +  gap: 12px;
 | 
	
		
			
				|  |  | +  min-height: auto;
 | 
	
		
			
				|  |  | +}
 | 
	
		
			
				|  |  | +.card-bottom {
 | 
	
		
			
				|  |  | +	height: 40px;
 | 
	
		
			
				|  |  | +	line-height: 40px;
 | 
	
		
			
				|  |  | +	color: #fff;
 | 
	
		
			
				|  |  | +	text-align: center;
 | 
	
		
			
				|  |  | +	font-size: 15px;
 | 
	
		
			
				|  |  | +	background: linear-gradient(to right, #12ebb0, #427daa);
 | 
	
		
			
				|  |  | +	&:hover {
 | 
	
		
			
				|  |  | +		font-size: 16px;
 | 
	
		
			
				|  |  | +		font-weight: 700;
 | 
	
		
			
				|  |  | +	}
 | 
	
		
			
				|  |  | +}
 | 
	
		
			
				|  |  | +.enterprise-name:hover {
 | 
	
		
			
				|  |  | +	color: var(--v-primary-base);
 | 
	
		
			
				|  |  | +}
 | 
	
		
			
				|  |  | +</style>
 |